In-Class

We have just completed a lecture on design and thinking about navigation. But how is it implemented in the real world? Many websites are created using HTML and CSS. HTML is a markup langauge that describes how to lay out information on webpage. CSS (Cascading Style Sheets) is a language built on top of HTML, that allows us to morph the HTML into a particular style.

Choose your adventure below based on your experience with HTML and CSS proramming.

Beginner (Never or hardly touched web programming)
  1. Start with a few tutorials at w3schools HTML Basics
  2. Once you are comfortable with HTML, try some of the CSS tutorials HTML Basics
Exeperienced (Have used HTML and CSS often)
A famous project for learning CSS is the csszengarden.
  1. Navigate to CSS Zengarden and explore some of the interpretations others have made of the site. The only modification is the CSS. I have listed a few below as examples of the creativity.
  2. Next download the HTML and CSS files from the website.
  3. Make modifications to the design of your choosing.
  4. Does your design improve or make the navigation more fluid?
  5. Is CSS enough to modify the genre of presentation? (Magazine Style, Annotated Chart, Poster, etc.)
More Exeprienced (Have used HTML and CSS often and some javascript)
Download the csszengarden pages from above.
  1. Check out these tutorial on jquery: link
    • Try making links bigger when you however over them.
    • Try creating a slide show with the content.

Grading

Note that in-class activities are part of your participation grade, and participating will help you perform well on your assignments. You do not have to formally submit anything, (however I take notes of who participated!).


Please do not redistribute or host any materials without e-mailing me first. I generally am happy to share the latest .pdf or slide presentation with those who ask. Thank you for your time!