Agenda
- Homework review
- Wireframes
- Color palette
- Overview: Forms
- In-class exercise – building a contact form
- Download this zipped folder (and extract the file)
- Open the HTML file in Brackets
- We’ll walk through customization and then you’ll upload via Filezilla to your working directory
- Test the form (you must use an email address you can access in class)
- You must validate the service by sending yourself a test message
- In-class consultation (one-on-one) with Thomas and Kathy
- Assignment for next Wednesday: assignment 7: contact form
Resources
- Form styles (CSS)
- W3C Form tutorial
- Your first form (Mozilla Developer Network)
Homework review
Due today at 9 am: assignment 6: visual design
The assignment URL for the PDF of wireframes showing your grids should be xxx.washington.edu/yourNetID/pdf/assignment-06.pdf
NOTE: some of you have full-color comps (a step ahead) but no grid lines (the goal of this assignment). See Aastha and Jake for two different approaches
- Aastha | https://staff.washington.edu/aastha11/pdf/assignment-06.pdf
- Alice | https://students.washington.edu/uwalice/pdf/assignment-06.pdf
- Chun-Fang (Jenni) | https://students.washington.edu/jennicf/pdf/assignment-06.pdf – 404
- David | https://students.washington.edu/molinero/pdf/assignment-06.pdf
- Jake | https://students.washington.edu/grhodes/pdf/assignment-06.pdf
- Jihoon | http://students.washington.edu/jihoons/pdf/assignment-06.pdf – 404
- Julie | https://students.washington.edu/jstu2/pdf/assignment-06.pdf – 404
- Laura | https://students.washington.edu/lmeise/pdf/assignment-06.pdf – 404
- Pierre | https://staff.washington.edu/pdelcour/pdf/assignment-06.pdf
- Putri | http://staff.washington.edu/putrih/pdf/assignment-06.pdf
- Rachel | https://students.washington.edu/xukun/pdf/assignment-06.pdf – 404
- Thana-On | https://students.washington.edu/thanaon/pdf/assignment-06.pdf
- Tucker | https://students.washington.edu/tstandle/pdf/assignment-06.pdf
- Yaonan (Natalie) | https://students.washington.edu/yaonah/pdf/assignment-06.pdf
- Ziyan | https://students.washington.edu/ziyan053/pdf/assignment-06.pdf
From last week – color palettes (has anyone fiddled with this since last week? LOL)
Assignment URL xxx.washington.edu/yourNetID/hcde532/color-palette.html
You need to identify background/foreground (text), links, and headings.
See David and Ziyan for two different approaches
- Aastha | https://staff.washington.edu/aastha11/hcde532/color-palette.html (“links” and “link text” are the same thing)
- Alice | https://students.washington.edu/uwalice/hcde532/color-palette.html (the link color will not have sufficient contrast and is not significantly different from header color)
- Chun-Fang (Jenni) | https://students.washington.edu/jennicf/hcde532/color-palette.html – 404
- David | https://students.washington.edu/molinero/hcde532/color-palette.html
- Jake | https://students.washington.edu/grhodes/hcde532/color-palette.html (check the contrast with the dark amber – I don’t think it will be sufficient for readability — what color will your visited links be?)
- Jihoon | http://students.washington.edu/jihoons/hcde532/color-palette.html
- Julie | https://students.washington.edu/jstu2/hcde532/color-palette.html (how are the colors to be used? which will be link colors?)
- Laura | https://students.washington.edu/lmeise/hcde532/color-palette.html – 404
- Pierre | https://staff.washington.edu/pdelcour/hcde532/color-palette.html (how are the colors to be used?)
- Putri | http://staff.washington.edu/putrih/hcde532/color-palette.html (make sure your gray gives sufficient contrast for readability – what will your visited links look like?)
- Rachel | https://students.washington.edu/xukun/hcde532/color-palette.html (how will the colors be used?)
- Thana-On | https://students.washington.edu/thanaon/hcde532/color-palette.html (how are the colors to be used?)
- Tucker | https://students.washington.edu/tstandle/hcde532/color-palette.html (how are the colors to be used?)
- Yaonan (Natalie) | https://students.washington.edu/yaonah/hcde532/color-palette.html (what color will your visited links be?
- Ziyan | https://students.washington.edu/ziyan053/hcde532/color-palette.html (double-check contrast if the headers are to have a different backgrond)