COAP:COAP-2100/week6: Difference between revisions
Jump to navigation
Jump to search
m (→Homework 5) |
|||
| Line 30: | Line 30: | ||
* HW feedback | * HW feedback | ||
* Term projects (short Q/R) | * Term projects (short Q/R) | ||
* [[HTML forms tutorial|HTML forms]] lecture (only parts) and hands-on. | |||
* [[HTML forms tutorial|HTML forms]] lecture (only parts) and hands-on. Modify the following example. Save both files on your local computer ! | ** Play with Kompozer or another HTML editor (adding some forms) | ||
** Modify the following example. Save both files on your local computer ! | |||
** [http://tecfa.unige.ch/guides/js/ex/coap/week-3/2-xhtml-radio-buttons.html 2-xhtml-radio-buttons.html] (save as !) | ** [http://tecfa.unige.ch/guides/js/ex/coap/week-3/2-xhtml-radio-buttons.html 2-xhtml-radio-buttons.html] (save as !) | ||
** [http://tecfa.unige.ch/guides/js/ex/coap/week-3/2-xhtml-radio-buttons.js 2-xhtml-radio-buttons.js] | ** [http://tecfa.unige.ch/guides/js/ex/coap/week-3/2-xhtml-radio-buttons.js 2-xhtml-radio-buttons.js] | ||
* [[DHTML]] lecture (part II, if needed) | |||
** Playing with more examples | |||
==== Homework 5 ==== | ==== Homework 5 ==== | ||
Revision as of 17:57, 15 February 2011
Week 6 COAP 2100
Topics Covered
We shall have a (superficial) look at key elements of client-side web page interactivity
- HTML forms
- JavaScript
- DOM
- DHTML (HTML + DOM + JavaScript + CSS)
Teaching materials
- Javascript tutorial - basics
- DHTML
- HTML forms tutorial (only parts)
- DOM (just some links)
Classroom activities
- Monday
- (Whort) mid-term exam feedback
- JavaScript lecture using Javascript tutorial - basics
- DHTML lecture (part I) and some JavaScript hands-on, i.e. code modification of examples shown in the DHTML tutorial:
- tree-walking2.html (save link as)
- tree-walking3.html(save link as)
- Wednesday
- HW feedback
- Term projects (short Q/R)
- HTML forms lecture (only parts) and hands-on.
- Play with Kompozer or another HTML editor (adding some forms)
- Modify the following example. Save both files on your local computer !
- 2-xhtml-radio-buttons.html (save as !)
- 2-xhtml-radio-buttons.js
- DHTML lecture (part II, if needed)
- Playing with more examples
Homework 5
- Due
- Before Monday week 7 class
- Submission
- Submit the files to the worldclassroom.
- Final exam
- There will be some minimal JS testing in the final exam. However, I do not require that you understand programming principles nor technical DOM details.
Pick either option A or option B !
Option A
- Task
- Create a DHTML page that has a least one button allowing the user to change a style or something else in a page
- You may reuse code from the DHTML page starting from the Collections and creation of elements section. For example, take either one
- tree-walking2.html (just color change)
- tree-walking3.html
You also can take code made by someone else. In this case, dot not forget to quote the source and to insure that you are allowed to reuse it. There is a fine line between plagiarism and reuse .....
- To get an A
- Create a page with real contents and implement DHTML changes that make sense for a given target population.
- Add some extra CSS style
- Care for usability. e.g. explain somewhere in the page what pressing the button(s) will do or at least make the button labels self-explaining.
Option B
- Create a simple quiz with JavaScript (including mine)
- You may use code from any source, but it must work with modern browsers, quiz contents must be your own and you must explain what you did change
- To get an A
- Create a small, but useful quiz
- Add some extra CSS style
- Care for usability and user experience
- Give credits in proper way