COAP:COAP-2100/week4-2011: Difference between revisions
Jump to navigation
Jump to search
mNo edit summary |
|||
Line 19: | Line 19: | ||
* [[CSS tutorial]] (started in week 3) | * [[CSS tutorial]] (started in week 3) | ||
* [[Computer colors tutorial]] | * [[Computer colors tutorial]] | ||
* [[Web templating]] (will not be tested in exams) | |||
* Links pages: [[CSS]], [[Color]], [[Web design links]] | * Links pages: [[CSS]], [[Color]], [[Web design links]] | ||
Line 25: | Line 26: | ||
* http://jigsaw.w3.org/css-validator/ ('''validate !''') | * http://jigsaw.w3.org/css-validator/ ('''validate !''') | ||
* http://www.quirksmode.org/css/contents.html (CSS compatibility tables) | * 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://reference.sitepoint.com/css (SitePoint CSS reference, also available through the FF [https://addons.mozilla.org/en-US/firefox/addon/13048) Code burner] extension | ||
* http://colorschemedesigner.com/ (Excellent color palette design and testing tool) | * 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) | * http://kuler.adobe.com/ or http://www.colourlovers.com/ (sites that lets users publish color palettes) | ||
* http://blogger.com/ (you need a Google account) | |||
==== Classroom activities ==== | ==== Classroom activities ==== | ||
Line 42: | Line 44: | ||
; Wednesday | ; Wednesday | ||
* Templating for Blogger | * Templating for Blogger | ||
** | ** [[Web templating]] | ||
* Midterm Q/A | |||
* Wiki demo and hands on | |||
==== Homework ==== | ==== Homework ==== |
Revision as of 23:17, 14 September 2009
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
- Web templating (will not be tested in exams)
- 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 Code burner 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)
- http://blogger.com/ (you need a Google account)
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
- Midterm Q/A
- Wiki demo and hands on
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 (approximately) 2 page 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 (how to)
- Accessibility of web pages
- HTML 5 (new features)
- CSS 3 (new features)
- Requirements
- You are allowed to specialize a subject. If you do so, explain in the beginning of the text. E.g. if you are interested in color palettes, you may explain and discuss the functionality of a palette generation tool.
- 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