Lesson 05

371 views
337 views

Published on

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
371
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
12
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Lesson 05

  1. 1. Front-End Web Development Lesson 5 Lab
  2. 2. Agenda ● ● Review (10 minutes) Lab Time (160 minutes)
  3. 3. Review ● ● ● ● ● ● Classes, IDs, Divs HTML5 Structural Elements Floats Complete Fashion Blog Create index page for your server workspace Sign up for GA Front Row & read articles
  4. 4. Lab Time Learning Objective: ● Practice web development by transforming a design comp into an HTML and CSS web page
  5. 5. Project Startup Matchmaker: ● students work in groups to determine what needs to be done ● plan -- then code -- the website
  6. 6. Project Resources (assets): ● image ● fonts used ○ Source Sans Pro ○ Merriweather ○ Oswald ● ● class web server FileZilla
  7. 7. Project Tips: ● ● ● ● sketch boxes on paper determine file structure translate sketch into “html wireframe” add content and styling to wireframe
  8. 8. Project Research needed: ● background image ● opacity ● <del> and <ins> tags ● overflow?
  9. 9. Project Bonus: ● build out two additional pages ○ Find Developers ○ Find Designers
  10. 10. Project Deliverable: ● Each team will present their work at the beginning of class on Monday, December 2
  11. 11. Homework ● ● ● ● Watch football, eat turkey and take nap Complete Startup Matchmaker Create index page for your server workspace Sign up for GA Front Row & read articles

×