CSS site style testing

Use the links below to re-style this entire web site to see how you can change the looks of a website with CSS while leaving the content in tact.


Purple Style
gzuslivz
Rolling Navigation Menu
Ugly with Motion

Fonts on the Web

To use fonts on the web, the font must exist on the web and referenced properly. Using a font from you local machine won't work because the user's web browser most likely doesn't have access to the font. I recommend having the font on your web space and not referencing someone else's web space so you don't have to rely on their site being up and running, and so you won't have to worry about them removing the font without telling you. Here are is a font that I created from my own handwriting:

Fonts

Trying out a font that I created using Font Squirrel

What do you think? Do you like it? Before you answer those questions, I'll let you know that I created these fonts by scanning in my hand-writing (plus many steps) and converted it to a web font via http://www.fontsquirrel.com.

font1942

Trying out a font that I downloaded using Font Squirrel

What do you think?

Font Summary

While the fonts shown above are interesting, creating a whole site using them would be overwhelmingly difficult to endure because of their style. Use fonts that are easy to read (easier than both of those fonts) and when you use fonts like the ones above, use them sparingly. Typically you should have no more than 3 fonts on a page. I tend to use more ornate or experimental fonts on things like the navigation menu and headers.

Font sizes on the web

Check out the em vs rem page to learn about font sizes.