Chapter Text

<b> is a appearance tag, which marks text as bold like this:

Bold text

Find out more here

<big> is a appearance tag, which is not supported by HTML5 but makes text one size larger than the default like this:

Bigger text (slightly)

Specific function on AO3:

The difference in size is marginal

Find out more here

<cite> is a appearance tag, which is a way of formatting the name of a thing referenced (basically makes it italic) like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum.

Find out more here

<code> is a appearance tag, which shows the text in a way that looks like fixed-width screen code text, i.e. in a typewriter-like font like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum.

Find out more here

<del> is a appearance tag, which is used alongside the “ins” tag to strike out text to demonstrate that it’s been deleted like this:

text that has been deleted

The following attributes are possible within this tag:

cite (specifies a url to a document that explains the reason why the text was deleted/changed) - not permitted in ao3
datetime (specifies the date and time of when the text was deleted/changed (yyyy-mm-ddthh:mm:sstzd format)) - not permitted in ao3

Find out more here

<em> is a appearance tag, which formats emphasis in the surrounded text - i.e. italics by default like this:

Emphasised text

Find out more here

<h1> is a appearance tag, which is the largest of the headings like this:

Heading 1

Specific function on AO3:

Centre-aligned on AO3

Find out more here

<h2> is a appearance tag, which is the 2nd largest of the headings like this:

Heading 2

Find out more here

<h3> is a appearance tag, which is the 3rd largest of the headings like this:

Heading 3

Specific function on AO3:

AO3 formats with a grey double-underline that stretches the width of the page

Find out more here

<h4> is a appearance tag, which is the 4th largest of the headings like this:

Heading 4

Find out more here

<h5> is a appearance tag, which is the 5th largest of the headings like this:

Heading 5

Find out more here

<h6> is a appearance tag, which is the smallest of the headings like this:

Heading 6

Specific function on AO3:

AO3 formats with a single, white underline that stretches the width of the page

Find out more here

<hr> is a appearance tag, which denotes a change of topic in the document by creating a horizontal line like this:

Specific function on AO3:

don’t expect this to come through from e.g. Google Docs - AO3 will ignore it!

Find out more here

<i> is a appearance tag, which formats the text as italic like this:

Italicised text

Find out more here

<ins> is a appearance tag, which highlights the text that has been marked as deleted by “del” like this:

text that has been inserted

The following attributes are possible within this tag:

cite (specifies a url to a document that explains the reason why the text was deleted/changed) - not permitted in ao3
datetime (specifies the date and time of when the text was deleted/changed (yyyy-mm-ddthh:mm:sstzd format)) - not permitted in ao3

Specific function on AO3:

underlines where other platforms italicise

Find out more here

<kbd> is a appearance tag, which shows the text in a way that looks like fixed-width screen code text, i.e. in a typewriter-like font like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum. Aenean lacinia massa non velit tincidunt finibus. Donec gravida lobortis turpis, sed interdum ante eleifend at.

Specific function on AO3:

adds an extra line break on AO3, it would appear

Find out more here

<pre> is a appearance tag, which shows the text in a way that looks like fixed-width screen code text, i.e. in a typewriter-like font like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum. Aenean lacinia massa non velit tincidunt finibus. Donec gravida lobortis turpis, sed interdum ante eleifend at.

Specific function on AO3:

adds an extra line break on AO3, it would appear

Find out more here

<q> is a appearance tag, which marks up the text as a short quotation (i.e. surrounded by curly double quotes; when nested, alternates between double and single quote marks) like this:

A short quantity of quoted text…

The following attribute is possible within this tag:

cite (specifies a url to a document that explains the reason why the text was deleted/changed. only visible to screenreaders) - works for ao3

Find out more here

<s> is a appearance tag, which Shows the text as being no longer correct (usually with a straight horizontal line struck through it) like this:

Text that has been struck through

Find out more here

<samp> is a appearance tag, which shows the text in a way that looks like fixed-width screen code text, i.e. in a typewriter-like font like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum. Aenean lacinia massa non velit tincidunt finibus. Donec gravida lobortis turpis, sed interdum ante eleifend at.

Find out more here

<small> is a appearance tag, which shows the text as one size smaller than the default like this:

Smaller text (slightly)

Specific function on AO3:

the difference in size is marginal

Find out more here

<strike> is a appearance tag, which is not supported by HTML5 but strikes the text through with a straight, horizontal line like this:

Text that has been struck through

Find out more here

<strong> is a appearance tag, which highlights surrounded text as important (generally defaults to bold) like this:

Strong text

Find out more here

<sub> is a appearance tag, which subscript-offsets the text vertically half a line lower than the default; some platforms also shrink the text like this:

_{Subscript text} vs normal text

Specific function on AO3:

the difference in position and size is marginal

Find out more here

<sup> is a appearance tag, which superscript-offsets the text vertically half a line higher than the default; some platforms also shrink the text like this:

^{Superscript text} vs normal text

Specific function on AO3:

the difference in position and size is marginal

Find out more here

<tt> is a appearance tag, which not supported by HTML5 but shows the text in a way that looks like fixed-width screen code text, i.e. in a typewriter-like font like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum. Aenean lacinia massa non velit tincidunt finibus. Donec gravida lobortis turpis, sed interdum ante eleifend at.

Find out more here

<u> is a appearance tag, which formats the text as underlined like this:

Underlined text

Specific function on AO3:

don’t expect this to come through from e.g. Google Docs - AO3 will ignore it!

Find out more here

<var> is a appearance tag, which not supported by HTML5 but shows the text as highlighted, italic by default like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum. Aenean lacinia massa non velit tincidunt finibus. Donec gravida lobortis turpis, sed interdum ante eleifend at.

Find out more here

Chapter Text

<a> is a functionality tag, which creates a link to the address specified by the “href” element like this:

This is a link to Google

The following attributes are possible within this tag:

download (specifies that the target will be downloaded when a user clicks on the hyperlink) - not permitted in ao3
href (specifies the url of the page the link goes to) - works for ao3
hreflang (specifies the language of the linked document) - not permitted in ao3
media (specifies what media/device the linked document is optimized for) - not permitted in ao3
ping (specifies a space-separated list of urls to which, when the link is followed, post requests with the body ping will be sent by the browser (in the background). typically used for tracking.) - not permitted in ao3
referrerpolicy (specifies which referrer information to send with the link) - not permitted in ao3
rel (specifies the relationship between the current document and the linked document (ao3 automatically makes every link "nofollow")) - works for ao3
target (specifies where to open the linked document) - not permitted in ao3
type (specifies the media type of the linked document) - not permitted in ao3

Find out more here

<abbr> is a functionality tag, which highlights the text it surrounds and provides hover-over text (note: does not work on touchscreen devices) like this:

just like this!

The following attribute is possible within this tag:

title (specifies the text for the hover-over) - works for ao3

Find out more here

<acronym> is a functionality tag, which is not supported by HTML5 but highlights the text it surrounds and provides hover-over text like this:

just like this!

The following attribute is possible within this tag:

title (specifies the text for the hover-over) - works for ao3

Find out more here

<dfn> is a functionality tag, which is a way of formatting the definition of a thing referenced like this:

just like this!

The following attribute is possible within this tag:

title (specifies the text for the hover-over) - works for ao3

Specific function on AO3:

works on AO3 but only the hover-over (which presents as a question mark before showing the title text)

Find out more here

<img> is a functionality tag, which inserts an image into the document like this:

The following attributes are possible within this tag:

alt (specifies an alternate text for an image) - works for ao3
crossorigin (allow images from third-party sites that allow cross-origin access to be used with canvas) - not permitted in ao3
height (specifies the height of an image) - works for ao3
ismap (specifies an image as a server-side image map) - not permitted in ao3
loading (specifies whether a browser should load an image immediately or to defer loading of images until some conditions are met) - not permitted in ao3
longdesc (specifies a url to a detailed description of an image) - not permitted in ao3
referrerpolicy (specifies which referrer information to use when fetching an image) - not permitted in ao3
sizes (specifies image sizes for different page layouts) - not permitted in ao3
src (specifies the path to the image) - works for ao3
srcset (specifies a list of image files to use in different situations) - not permitted in ao3
usemap (specifies an image as a client-side image map) - not permitted in ao3
width (specifies the width of an image) - works for ao3

Find out more here

Chapter Text

<address> is a layout tag, which provides contact information for the owner of a document, usually formatted in italics like this:

Find out more here

<blockquote> is a layout tag, which shunts the text over to the right slightly like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum. Aenean lacinia massa non velit tincidunt finibus. Donec gravida lobortis turpis, sed interdum ante eleifend at. Quisque in mi ut sem consectetur volutpat id eu ante. Suspendisse at venenatis metus, sit amet hendrerit nunc. Nullam id dictum nisi, pulvinar interdum ex. Vivamus fermentum nisi vitae lobortis pulvinar.

The following attribute is possible within this tag:

cite (specifies the url of the quotation; only visible to screen readers) - works for ao3

Specific function on AO3:

AO3 adds a vertical line running along the left-hand edge

Find out more here

<br> is a layout tag, which creates a line break rather than a paragraph break like this:

These lines
are separated
by line breaks

as opposed to this new line after a paragraph break

Find out more here

<center> is a layout tag, which moves the text to be centre-aligned (UK/ European users, please note spelling!) like this:

Find out more here

<dd> is a layout tag, which defines a description in a “description list” defined by the “dl” tag where terms and descriptions are staggered like this:

Coffee

Black hot drink [dd text]

Milk

White cold drink [dd text]

Find out more here

<div> is a layout tag, which a division within a css-defined document (a way of separating its formatting, for one thing); can be any number of lines like this:

The following attributes are possible within this tag:

accesskey (specifies a shortcut key to activate/focus an element) - not permitted in ao3
dir (specifies the text direction for the content in an element) - works for ao3
hidden (specifies that an element is not yet, or is no longer, relevant) - not permitted in ao3
id (specifies a unique id for an element) - not permitted in ao3
lang (specifies the language of the element's content) - not permitted in ao3
style (specifies an inline css style for an element) - not permitted in ao3
title (specifies extra information about an element, usually accessible as hover-over text like "alt" in the img tag) - works for ao3
translate (specifies whether the content of an element should be translated or not) - not permitted in ao3

Find out more here

<dl> is a layout tag, which formats text in a “description list” where terms and descriptions are staggered like this:

Coffee

Black hot drink

Milk

White cold drink

Find out more here

<dt> is a layout tag, which defines a term in a “description list” where terms and descriptions are staggered like this:

Coffee [dt text]

Black hot drink

Milk [dt text]

White cold drink

Specific function on AO3:

turns up bold on AO3

Find out more here

<li> is a layout tag, which creates the relevant bullet for an ordered (“ol”) list - i.e. numbers in ascending order, one more than the previous one within the ol set, or an unordered (“ul”) list - i.e. uniform blobs like this:

Find out more here

<ol> is a layout tag, which creates a numbered list, in which “li” tags are numbered paragraphs like this:

1. numbered item
2. another numbered item
3. and so on

The following attributes are possible within this tag:

reversed (specifies that the list order should be reversed (9,8,7...)) - not permitted in ao3
start (specifies the start value of an ordered list) - works for ao3
type (specifies the kind of marker to use in the list (1, a, a, i, or i) ) - permitted but does not work on ao3

Find out more here

<p> is a layout tag, which creates a new paragraph like this:

This text is in a new paragraph.

This text is in a new, right-aligned paragraph

The following attribute is possible within this tag:

align (tells the paragraph how to be aligned on the page (default left-aligned; specify right or center)) - works for ao3

Find out more here

<span> is a layout tag, which an inline container within a css-defined document (a way of separating its formatting, for one thing); usually used for a single line like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin iaculis massa nec libero laoreet dictum. Aenean lacinia massa non velit tincidunt finibus. Donec gravida lobortis turpis, sed interdum ante eleifend at.

The following attributes are possible within this tag:

accesskey (specifies a shortcut key to activate/focus an element) - not permitted in ao3
dir (specifies the text direction for the content in an element) - works for ao3
hidden (specifies that an element is not yet, or is no longer, relevant) - not permitted in ao3
id (specifies a unique id for an element) - not permitted in ao3
lang (specifies the language of the element's content) - not permitted in ao3
style (specifies an inline css style for an element) - not permitted in ao3
title (specifies extra information about an element, usually accessible as hover-over text like "alt" in the img tag) - works for ao3
translate (specifies whether the content of an element should be translated or not) - not permitted in ao3

Find out more here

<ul> is a layout tag, which creates an unordered list, in which “li” tags are bullet-pointed paragraphs with no numbers like this:

• item
• another item
• and so on

Find out more here

Chapter Text

Main Reference Table

This will try to demonstrate as many of the different aspects of table coding in one place as possible; further down there’ll be the usual links to W3Schools and mention of which attributes work in AO3 (and don’t). AO3 does not produce visible borders or cell fills in tables in the standard workskin, so it may be a little difficult to keep track of what’s doing what where!

The code for the table looks like this:

<table> <caption>Table Caption</caption> <thead> <tr> <th>Column 1 Table Heading</th> <th>Column 2 Table Heading</th> <th>Column 3 Table Heading</th> <th>Column 4 Table Heading</th> </tr> </thead> <tbody> <tr> <td>C1 data cell</td> <td>C2 data cell</td> <td>C3 data cell</td> <td>C4 data cell</td> </tr> <tr> <td>C1.2 data cell</td> <td>C2.2 data cell</td> <td>C3.2 data cell</td> <td>C4.2 data cell</td> </tr> <tr> <td colspan="4" align="center">A cell that spans all columns of the table</td> </tr> <tr> <td colspan="2">A cell that spans 2 columns</td> <td colspan="2">A cell that spans 2 columns</td> </tr> </tbody> <tfoot> <tr> <td><b>C1 table footer</b></td> <td><b>C2 table footer</b></td> <td><b>C3 table footer</b></td> <td><b>C4 table footer</b></td> </tfoot> </table>

Code references

<caption> is a table tag, which creates a caption for a table - text that turns up along the top of the table spanning all columns

Find out more here

<col> is a table tag, which sets the colour of the background of table columns

The following attribute is possible within this tag:

span (specifies the number of columns a element should span) - works for ao3

Specific function on AO3:

permitted on AO3 but doesn't work in day-to-day coding there, presumably because it requires CSS attributes, which you can't set outside of a work skin

Find out more here

<colgroup> is a table tag, which sets the colour of the background of table columns

The following attribute is possible within this tag:

span (specifies the number of columns a element should span) - works for ao3

Specific function on AO3:

permitted on AO3 but doesn't work in day-to-day coding there, presumably because it requires CSS attributes, which you can't set outside of a work skin

Find out more here

<table> is a table tag, which makes a container that will typically contain more than one column and more than one row; defaults to having a line around each cell

The following attributes are possible within this tag:

width (sets the width of the table relative to the screen width (%)) - permitted but does not work on ao3
dir (specifies the text direction for the content in an element) - works for ao3
border (sets the weight of the visible border around and within the table) - permitted but does not work on ao3

Find out more here

<tbody> is a table tag, which defines the internal “body” of a table

Find out more here

<td> is a table tag, which defines an internal cell of a row of a table

The following attributes are possible within this tag:

colspan (specifies the number of columns a cell should span) - works for ao3
headers (specifies one or more header cells a cell is related to) - not permitted in ao3
rowspan (sets the number of rows a cell should span) - permitted but does not work on ao3
width (sets the width by percentage of the overall table) - works for ao3

Find out more here

<tfoot> is a table tag, which defines the internal “footer” of a table

Find out more here

<th> is a table tag, which defines an internal cell of the header of a table

The following attributes are possible within this tag:

abbr (specifies an abbreviated version of the content in a header cell) - works for ao3
colspan (specifies the number of columns a header cell should span) - works for ao3
headers (specifies one or more header cells a cell is related to) - not permitted in ao3
rowspan (specifies the number of rows a header cell should span) - permitted but does not work on ao3
scope (specifies whether a header cell is a header for a column, row, or group of columns or rows) - works for ao3

Find out more here

<thead> is a table tag, which defines the internal “header” of a table

Find out more here

<tr> is a table tag, which defines an internal row of a table

Find out more here

Chapter Text

The global attributes are attributes that can be used with all HTML elements

The following are possible on AO3:

accesskey (specifies a shortcut key to activate/focus an element) - not permitted in ao3
class (specifies one or more classnames for an element (refers to a class in a style sheet)) - permitted but does not work on ao3 (presumably only works in work-skin setups)
contenteditable (specifies whether the content of an element is editable or not) - not permitted in ao3
data-* (used to store custom data private to the page or application) - not permitted in ao3
dir (specifies the text direction for the content in an element) - works for ao3
draggable (specifies whether an element is draggable or not) - not permitted in ao3
hidden (specifies that an element is not yet, or is no longer, relevant) - not permitted in ao3
id (specifies a unique id for an element) - not permitted in ao3
lang (specifies the language of the element's content) - not permitted in ao3
spellcheck (specifies whether the element is to have its spelling and grammar checked or not) - not permitted in ao3
style (specifies an inline css style for an element) - not permitted in ao3
tabindex (specifies the tabbing order of an element) - not permitted in ao3
title (specifies extra information about an element) - works for ao3
translate (specifies whether the content of an element should be translated or not) - not permitted in ao3

Find out more here

the dir attribute (ltr|rtl|auto) specifies the text direction for the content in an element

This text flows left-to-right [ltr]

This text flows right-to-left [rtl]

Find out more here

the title attribute ([text]) specifies extra information about an element

Hover over this text on a non-mobile device browser (or read it with a screenreader)

Find out more here

Chapter Text

You may be thinking: Why do I need to learn the HTML for this site when I can just write/ paste/ edit things straight into the Rich Text Editor? and that’s a very valid position. My counters to that are:

1. If you want formatting or functionality in Notes or comments fields, you’re going to have to use HTML, sadly.
2. The Rich Text Editor will sometimes lie to you, as I have learned to my cost.

So this section is going to include what the Rich Text Editor strips out and adds in, ways to get around this, some things that can go wrong with the Notes fields, how to get around those, and some fun with special characters and emoji.

Contents

The Rich Text Editor doesn’t tell the whole story

Stuff that doesn’t (always) paste

Underlining

Paragraph alignment

Blockquote

Horizontal rule

Line breaks

Extra things that get added in

1. Use MS Word as an intermediary step

2. Use a Global Replace on the HTML

The Rich Text Editor is lying to you

Notes fields and Comments

Character limits

Emoji and other symbols I can’t find on my keyboard

Insert emoji into AO3 notes/ comment text

Insert special characters into AO3 notes/ comment text

The Rich Text Editor doesn’t tell the whole story

You can copy-and-paste text from your rich text formatted document (MS Word, Google Docs, etc.) into the Rich Text Editor for the main body of the post, and it’ll take care of most of the formatting that you need, without having to italicise every single emphasis by hand in the HTML, which is incredibly handy. However, there are some things that it will either add in or ignore that you’re well-advised to fix directly in the HTML.

I’ll talk, first of all, about how the Rich Text Editor changes things and tips on how to manually flag and fix them individually, then I’ll tell you my patented ways to fix things en masse.

Back to Contents

Stuff that doesn’t (always) paste

Underlining

This will disappear entirely if pasted from Google Docs (MS Word is fine) and anything underlined in your original will be plain text. Tip: bold carries across, so you can embolden your words you want underlined and then scan through, find them, and make them underlined instead.

Paragraph alignment

Again, when pasting from Google Docs (MS Word is fine), whether it’s central, right, or justified, this will disappear entirely when you paste it in, and everything will be left-aligned by default. Tip: add a curly bracket { or something else that you haven’t used for anything else (I used to like adding µ as a marker, for example) that isn’t implicated in HTML as code to paragraphs with unusual alignment so you can find them more easily and fic them, either in the Rich Text Editor or HTML.

Blockquote

As above - this will disappear when pasting from any other platform, and you will need to mark it up in some fashion with something that doesn’t disappear.

Horizontal rule

The horizontal line that you can insert into Google Docs or MS Word will not carry over. I’ve not experimented with any other word processor, but I’m willing to bet that it’s the same. Tip: use ____ so you can find and replace it as appropriate.

Line breaks

Sometimes it carries them over, other times not so much! MS Word and Google Docs (and the AO3 Rich Text Editor if you’re writing by the seat of your pants) will insert line breaks (rather than paragraph breaks) if you press Shift+Enter (or Return, if you’re feeling old-school). These will mostly carry over into the Rich Text Editor if you’re not doing anything else to the text. However, if you go back in after publishing to edit in Rich Text mode, and especially if you’ve got anything else like a blockquote or list, the line breaks may get converted into paragraph breaks.

Back to Contents

Extra things that get added in

As far as I know, this is a uniquely Google Docs problem, because MS Word doesn’t seem to do this, but, when pasting in from GD, the AO3 editor will add in all sorts of fun stuff like <span> coding and the precise size of the font you’re using. Since all that is mostly invisible to the reader, it shouldn’t be a problem, but it will do things like add a space in between your formatted text and e.g. the punctuation that comes straight after it. It will also (occasionally) mess up your paragraphs.

There are two ways to get around this:

1. Use MS Word as an intermediary step

Copy your Google Docs text into Word. Then copy the Word text into the AO3 Rich Text Editor. Don’t skip the middle step! 😀

I’ve literally only just discovered this in the throes of testing stuff for this chapter, so I’m still exploring any downsides. So far the only one I’ve found is that it’ll turn any paragraph that starts with 1. from MS Word into the beginning of an ordered list (<ol><li> etc.), even if it’s plain text in Word.

(Obviously, if you don’t have MS Word in the first place, that’s quite a major downside in and of itself!)

2. Use a Global Replace on the HTML

This is how I’ve been doing it up until now, and it’s got some advantages over the method above in that you can add in means to change the manual flags you’ve put in to re-insert the missing elements.

1. Mark up your lines, underlinings, etc. – anything that might disappear. Consider putting flags in like (u)underlined words(/u).
2. Paste your Google Docs text into the AO3 Rich Text editor.
3. Switch to the HTML view of the editor. Copy and paste the entire mess of HTML into an external editor (Google Docs or MS Word or even Notepad).
4. Global replace the e.g. <span style="font-weight: 400;"> stuff that the editor has inserted with nothing, and likewise the </span> tags that close them.
5. Global replace the e.g. (u) and (/u) flags with <u> and </u> tags and so on.
6. Once done, copy the resultant code back into the HTML editor.
7. Check via the Rich Text Editor that it’s looking like you want it to.

(I have created a macro on Word that will do a lot of this stuff for me with one button click, which feels a little silly now I know that I could have circumvented a lot of this in an easier step, but is still going to be useful for the <hr> and <blockquote> tags, etc.!)

Back to Contents

The Rich Text Editor is lying to you

If you want to be absolutely sure that what you want is what the readers are going to see, click on preview before posting and check through. The RT editor only shows an approximation (for example – it doesn’t show the vertical line alongside the <blockquote> that will go in later, and the <h1>, <h2>, etc. headings look completely different in the editor than they do in the published version). If something isn’t quite right, this is the time to edit it, before the publishing process has a chance to add extra fun little paragraph breaks, etc.

Notes fields and Comments

Back to Contents

Character limits

Love writing long End Notes or comments? Great! So do I! Only problem is that the character count is also lying to you, especially if you put any HTML in there.

Part of the problem is AO3’s habit of adding in extras behind the scenes. If you have any kind of link, it will automatically add in ref="nofollow" as an attribute. The more links, the more extra gubbins. And, even after you’ve sorted all that out, the End Notes will still often say that you’ve taken up too much space, even while telling you that there are 50-odd characters left.

Luckily, it won’t just cut off anything that doesn’t fit, but will halt the process and tell you to fix it (using a slightly perturbing shade of pink to do so).

My only real advice is the same I’d give any writer here: what can you cut so that the “minimum viable product” of what you want to say remains? How much fat can you trim before you start slicing into muscle? Think about this as a tweet (or an old-school SMS when we had character limits and you had to pay for them; remember then?!) – what will still retain the core of your message within the limits?

(The other way around this is to cheat and put stuff at the bottom of the work, obviously.)

Back to Contents

Emoji and other symbols I can’t find on my keyboard

Everything can be coded for in HTML on a standard English language keyboard. Seriously. And nowadays, AO3 is more set up for emoji than it used to be, so you don’t necessarily need it for that.

Insert emoji into AO3 notes/ comment text

There are two ways to do this:

1. Use the native emoji inserter on your machine
2. Use the HTML-code for the emoji

Wait, what native emoji inserter?!

On Windows, you insert emoji by pressing the windows key and full stop together then searching through/ picking from the list that comes up. 🤯

On a Mac, press Command + Control + Space together and do likewise.

We’ll cover HTML codes for symbols in the next part:

Back to Contents

Insert special characters into AO3 notes/ comment text

If you’re both old, and an early adopter of tech, like me, you may remember having to use ASCII codes to get special characters by e.g. holding down the Alt key on a PC and entering the relevant code using your numeric keypad (and yes, I still know a lot of them off by heart…). That still works, but increasing numbers of laptops (like this one I’m using right now) don’t have numeric keypads. Also a good 85% of you have no idea what I’m talking about, I’d guess! Anyway, you can use HTML entities or alphanumeric codes to enter the symbols and characters you want.

Take the copyright © symbol. I’ve just typed (c) into my Google Doc and it’s automatically converted that for me. I could then just copy-and-paste that into a notes/ comments field, but I’m a stubborn nerd, so I’m far more likely to directly type in © which is the entity, or © which is the code (though I’m far more likely to remember the former, to be honest! Similarly, if I want curved quote marks and apostrophes rather than straight ones, I use “ for “, ” for ”, and ’ for ’

Some good resources include the W3Schools Guide to HTML Entities, this nicely categorised page of entities and codes; and the Wikipedia article, which has every single one in one place but is consequently a little unwieldy.

If you’re looking for emoji references, the relevant W3Schools Guide is here, and the full list of emoji codes here. Likewise a nicely categorised list here.

Back to Contents