Monday, June 20, 2011

Week 3 posts - readability vs. legibility, or what i learned on my field trip

The difference between readability and legibility is, honestly a little on the facile side... MiriamWebster would tell you they're pretty much the same thing. In the chapter, the distinction seems to be whether you're talking about large or small blocks of text. Using a font w/ serifs is OK - apparently - in large blocks of text (though you should think about sans serifs), but shouldn't be used in small blocks, for 'legibility' reasons...

The one point they make is that sans serif looks sand serif make cleaner looking characters for short bursts of text.

Readibility (not legibility now, be careful...) is enhanced by selecting a correct font size (no bigger than 14-18 point for a good sized block of text, no smaller than 8-10). Also, you should be mindful of the length of your lines of text..shorter lines are easier to read than lines that span across the whole page. Also, it's important to keep contrast in mind for your text against your background.

you should never set large amounts of text in script or italics or bold, etc. and not all caps.

This is true for short blocks of text..try to avoid all caps as it's more challenging to read.

I also learned how to make use of proper quotation marks (rather that the default " we get of we're not careful). This can be done by setting the correct code in the source of the webpage, or some software will give you a way to insert them without changing codes. Also, it shoudlbe noted that not all fonts are supported in all environments, so your fancy scripted font may show up as a blocky default. Fonts that are safe in this way are called "cross-platform fonts". The same is true for logical vs. physical styles..logical styles of text  (emphasis being an example) could display differently on different platforms. Physical styles (bold, for example) will remain uniform.

There was more detail on type spacing (proportional vs. monospaced... proportional text uses enough space to fit the actual character, monospaced uses the same space for each letter). They have their pros and cons depending on the effect you're trying to reach.

you can also control the defaul test size of your page, and you can layer your design characteristics using style sheets. these can be saved and layered over each other to simplify changes and edits.

Additionally, style sheets allow you to define and reuse sections of formatting that can be reused. Different types of stles are "cascaded" in different levels of priority as follows:

1) Default Browser styles - this is your overall settings, they are overriden in sequence below
2) Imported styles - this is formatting that is stored in an external style sheet
3) Linked styles - these are style sheets that are stored on a different URL and referenced in.
4) Embedded styles - these sheets are placed in a single HTML file that lives on your web site
5) Inline styles - these are small styles often pointed to a sertain paragraph or word.

i also learned how to identfy and read CSS code, used to define style sheets. This will prove helpful when debugging problems on the display of the site and to make sublte changes directly. It should be noted, too, that not all web browsers interpret this code reliably, but the basic commands are fairly standard.  

No comments:

Post a Comment