Text formatting
Only use text formatting when necessary to emphasize specific information.
Copy and paste
You can easily copy and paste text into web editors from Word documents, other sites, PDFs, etc. but sometimes extra " " can be automatically added to the code. This can result in unexpected line breaks and formatting errors. It's best to copy and paste text into a blank notepad before you copy and paste into your webpage, or you can clean up the formatting afterwards where you have access to the html code.
Bold & italics
Use bold and italic formatting sparingly. They are used to emphasize text, but if too much is emphasized, the user can't figure out what's really important.
- Use <em> or <i> to emphasize words or phrases within paragraph text, making the text italic. This is preferable to bold in most cases.
- <strong> or <b> can be used to show that a word or phrase has strong importance.
- Never use bold and italic together on the same text.
- Published titles should be italicized using <cite>, instead of <em>. It looks the same on the screen, but it is read differently to visually-impaired users who are using screenreaders, and it means something different to search engines.
- Use italics for titles of City documents, or compositions like books, movies and songs. Do not use quotation marks around such titles.
- Do not use italics or quotation marks around names of newspapers, magazines, reference books, catalogues or the Bible.
Other text formatting
- Underlined text is reserved for links. Never underline non-link text on web pages or on documents available online.
- Use <sup> for superscript, such as "©Copyright" and <sub> for subscript, such as "H2O."
- Avoid using strikethrough (strikethrough) as it's confusing to readers.
- Limit text in ALL CAPS, unless it's an acronym.
- Don't manually change the font size of text. It is already set to the correct size for any particular element (h1, paragraph, etc.).
- Spacing text in strange ways makes it impossible for a screenreader to read. Example: writing "W E L C O M E" by putting spaces between the letters. However, you could achieve the same effect with CSS if you really need to.