Courses/Design & Technique-Essential Web Design/04

styling links, positioning elements, typography

styling links

css uses a pseudo-class for the different states of a link

a:visited - a link the user has visited a:hover - a link when the user mouses over it a:active - a link the moment it is clicked

For each of them, normally a rule is written.

position

important

(leaving for next class) CSS property position chooses alternative forms to for position elements.

The most common are

• relative
• absolute
• fixed

https://developer.mozilla.org/en-US/docs/Web/CSS/position

centering elements

http://www.w3.org/Style/Examples/007/center.en.html

essential typography properties

• font-size: body in pt, rest of elements in em
• font-height: regular or bold
• font-style
• font-family
• color
• text-align
• line-height
• letter-spacing: increases or decreases the space between characters( negative values are allowed)
• text-shadow

Using fonts

system fonts	custom fonts
ready to use	need to load or upload
limited set	broad range
change slightly in each user's computer	remain the same to all users
too familiar	fresh

Exercise

• find a text or several that you consider interesting;
• place it on a webpage.
• type-set it, so that the style either illustrates the content or contradicts it.
• be bold, be extreme: you can go from a legible and soothing style, to total illegible and cryptic. Most important is that the style responds to the text content.