CTN 161 Web Production 2

Download: Exercise 8 pdf | Download: menu.html

Exercise 8 | Menu Makeover

In this exercise we will explore the flexibly of CSS in formatting, typography and design.  We have a menu written in HTML that contains several different tags including IDs, Classes and traditional HTML elements.  The menu is rather plain, because it does not have a style sheet.

Instructions:

Your job is to recreate the menu, by recreating the style sheet.  The only condition is that you cannot change anything on the menu itself, only the style sheet.  To give you a little bit more direction, you may be given an image that should inspire your design. The style sheet is called menustyle.css

You will have 1 hour to create your style sheet and we will be presenting our designs to the class.  You are encouraged to chat with classmates for inspiration and ideas, but of course will do your own work.

• Download the menu html document
• Create a style sheet called menustyle.css

Not sure where to start?
Check out the links below, or chat with classmates to share ideas.

Examples

• 10 Examples of Beautiful CSS Typography and how they did it
  http://www.3point7designs.com/blog/2008/06/10-examples-of-beautiful-css-typography-and-how-they-did-it/
• Typography for Headlines
  http://www.smileycat.com/miaow/archives/typography-for-headlines-2.php
• Websites with Excellent CSS Typography
  http://www.cssaddict.com/blog/websites-with-excellent-css-typography-design/

CSS Typography Tools

• Typetester
  http://www.typetester.org/
• CSSTypeset
  http://www.csstypeset.com/
• Typechart
  http://www.typechart.com/

See an example: Menu | StyleSheet

Tags: css, exercise8, Exercises, week4

This entry was posted on Wednesday, October 21st, 2009 at 4:02 pm and is filed under Exercises, Week 4. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.