Tips for Text
- J01a - (5:23)
- Font formatting is more important than most people think it is.
- Some studies have shown that people communicate more with their gestures and facial expressions than they do with spoken words.
- This is somewhat analogous to readers and font styles: the font-style itself communicates a mood, an attitude, a context for the message.
- There is a limited range of fonts that can be used due to the installed font base, as you will learn.
- Use those options wisely and your message will be better understood.
- Make sure that viewers can easily read your text.
- Avoid patterned backgrounds behind text.
- Be sure that text contrasts with the background.
- There is some controversy about dark backgrounds and light text.
- Large text, exotic fonts, etc., often look better when displayed as part of an image file.
- Using an image allows you to use any font you want because the text is embedded in the image, it is not reliant on the viewer's installed fonts.
- Note that this is also generally true about Flash as well.
- The banner on this page uses the font Zapfino, which is not very common.
- I put that text into an image file that uses the same background color as the footer.
- I used it because I wanted the course to have a feeling of stylishness without needing to use stylish fonts elsewhere on the page, allowing me to use a "normal" font, in this case Times New Roman for the rest of the text on the page.
- Be sure to put the word(s) that are in the image into the alt attribute of the img tag. It will help the visually impaired using readers, allow search engines find it, and will be displayed if the image does not load.
- HTML text is often better than text in images or Flash because html text will flow to fit the size of the container it is in.
- Text links ought to clearly convey that they are in fact links.
- This is my pet peeve becasue I have often witnessed students not recognizing links.
- Using CSS it is easy to remove the underscore that links will have by default.
- Removing underlining eliminates the most common association made about underlined text on the web: that it is a link.
- The links I am using are both underscored and a brighter color green than surrounding text.
- If you remove the underscore please make sure that the viewers can easily detect that there is a link.
- Font styles and color are inherited, meaning they will be used by nested tags
- Use the body tag to define a default color for all text on the page and to set the default font-size to 100%.