COAP:COAP-2100/week4-2011

Week 4 COAP 2100

Topics Covered

• HTML (continued)
  • The div and span tags
• CSS (continued)
  • The class and ID selector (plus the HTML div and span tags)
  • values and properties
  • Discussion of some more properties
• Colors schemes and palettes
  • RGB colors
  • HSV colors (shortly)
  • HSL colors

• Templating (to be confirmed)

Teaching materials

• CSS tutorial (started in week 3)
• Computer colors tutorial
• Links pages: CSS, Color, Web design links

Online tools and reference

• http://jigsaw.w3.org/css-validator/ (validate !)
• http://www.quirksmode.org/css/contents.html (CSS compatibility tables)
• http://reference.sitepoint.com/css (SitePoint CSS reference, also available through the FF https://addons.mozilla.org/en-US/firefox/addon/13048) extension
• http://colorschemedesigner.com/ (Excellent color palette design and testing tool)
• http://kuler.adobe.com/ or http://www.colourlovers.com/ (sites that lets users publish color palettes)

Classroom activities

Monday

• (Short) feeback homework 2
• Other HTML editing tools and strategies (Kompozer, Tidy)
• Colors (lecture)
• Creating a color palette (visit of some online color scheme tools)
• Drawing a sketch for a "multi-boxed" web page (e.g. a portal)
• CSS 2 (part II)
• Hands on CSS (you may work on homework 3). Use of the HTML div and span tags, CSS values and properties.
• Homework 3 Q/A (in particular regarding the term project)

Wednesday

• Templating for Blogger (to be confirmed)
  • Documentation: http://www.google.com/support/blogger/bin/topic.py?topic=24776

Homework

Choose one (!)

Due: Before Wednesday week 5 lesson

A. Blogger templating

Task

• Modify a blogger template. To do so, you need a Google account (see week 1). To edit the template, select "Layout", then "Edit HTML".

Minimal requirements

• Change the CSS properties of block and text elements
• Shortly list the changes you made in a blog post of the blog for which you made the changes

Submission

• Submit the URL of you blog to the World Classroom

Note

• I will not test templating in the exams

= B. Write a short introduction or tutorial

Task

• Write a 2 page (approximately) introduction on one of the following subjects:

Use of color palettes in web page design

Web page design principles

Usability and ergonomics of a web page

Usability testing

You may suggest another course-related topic until the end of Wednesday week 4 lesson.

Requirements

You may liberally quote from web sources, but under the condition that you clearly identify your sources and particularly the directly quoted text and that you provide a reference (the URL)

The text must be written in HTML. It should be valid (minor mistakes are tolerated). Styling is not important, however the text should be well structured (title, author, date, subtitles).

Submission

• Submit the HTML file to the World Classroom

Tip

Use a Wysywig editor to write the text, e.g. download Kompozer