LIS 545 2008
Programming for Information Systems

Week Two: Impressing Martha Stewart

Visual presentation factors such as style, font, color, and reading narrative really do affect readers. Our first project is to create a 'font sampler'. This is a revelatory exercise for lots of folks, who end up saying "Golly gee, I didn't know that so many fonts were available."

Then let's build a webpage that models itself after the 'mother' of all pretty pages, Martha Stewart! We'll build a two-column grid and place an image in each column. Taking a color from one of the images, we can use the Color Schemer to find a suite of colors to use on the page. We'll also use an appropriate font and make a very fancy rubric (i.e., first letter of the first paragraph). Hopefully, Martha will be impressed.

Week two projects:  A font sampler   A pretty page




A student writes ...

Hi Terry,
Are we required to use the Andre Derain paintings for the pretty page assignment? Could we pick other pretty paintings for the pretty page?

Terry talks...

I chose Andre Derain because he is a colorist and his work provides lots of colors to play with.
If you can handle color coordination issues, go ahead. One of the points at issue with the Pretty Page project is the coordination of background color, font color, colors in the images and so on. If you are master of all that, use your own photos and beat Martha at her own game.


A student writes ...

I'm working on the Shipwreck page, and I am having the hardest time getting it to display correctly on my screen. I've used both Firefox and IE, and I think the code I am able to grab from your example page is missing information:
href="fontExerciseShipwreck_files/pageStyle.css" rel="stylesheet"
How do I get the rest of the path written above in red?

Terry talks...

My mistake! I copied the page and my browser saved the image file and CSS file in a new folder “fontExerciseShipwreck”. I just fixed it.
Now you should be able to (1) download my HTML page, (2) download the image, and (3) download the CSS file .
To download the CSS file, point your browser at
http://courses.washington.edu/d545s08/Specifications/fontSampler/pageStyleShipWreck.css


A student writes ...

Hi Professor Brooks,
I'm working on the font sampler project of week 2 right now, and I had a quick question - did you want us to include *every* IE font that will also display in Firefox, or just a selection of them?

Terry talks...

You don't have to do *all* of them because *most* of them are essentially identical (i.e., Arial, Arial Black, Arial Narrow, Arial rounded MT Bold, Arial Unicode MS are all variants of ARIAL). Here's what I require: do a whole big bunch and be sure to include all the *interesting* and *different ones*.