0
Week 3 Office Hours notesWeek 3 Office Hours notes     September 13, 9pm
Course Business              Course Business• After Saturday 4 weeks left  –SSaturday 9/24         d 9/24  – Saturday 10/1...
Many parts to a single page      Many parts to a single page• Main HTML  Main HTML• Style Sheet• Images and             d ...
Many Parts to a single pageMany Parts to a single page
Browser Web tools            Browser Web tools• Web developers tool bar ‐‐  Web developers tool bar   http://chrispederick...
What the FONT?                     What the FONT?• Your web browser has its own build‐in styles – those will   display if ...
Reset Style Sheet            Reset Style Sheet• Some CSS experts recommend redefining  Some CSS experts recommend redefini...
Visual Design Standards Badge              (aka C.R.A.P )             ( k          )• It is meant to be a simple way to sh...
Week3 office hours
Upcoming SlideShare
Loading in...5
×

Week3 office hours

995

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
995
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Week3 office hours"

  1. 1. Week 3 Office Hours notesWeek 3 Office Hours notes September 13, 9pm
  2. 2. Course Business Course Business• After Saturday 4 weeks left –SSaturday 9/24 d 9/24 – Saturday 10/1 – Saturday 10/8 – Class done – all badges awarded 10/15!• Set your goals – Finish HTML 5 Core by this weekend – Knock out CSS by 9/24 – With First Steps and 505 Basics you will be half  p y way there!
  3. 3. Many parts to a single page Many parts to a single page• Main HTML Main HTML• Style Sheet• Images and  d other media Don’t forget to upload all of them to the web site when posting  the page.
  4. 4. Many Parts to a single pageMany Parts to a single page
  5. 5. Browser Web tools Browser Web tools• Web developers tool bar ‐‐ Web developers tool bar  http://chrispederick.com/work/web‐developer/ For Firefox, Chrome. For Firefox, Chrome.• Firebug – http://getfirebug com Firebug  http://getfirebug.com Full version for Firefox, Lite version for others
  6. 6. What the FONT? What the FONT?• Your web browser has its own build‐in styles – those will  display if nothing else is specified.• Embedded/in‐line/linked styles can come with the web  page – these will take precedence over the local browser  styles.• Different Browsers have slightly different styles for standard  tags (<h1>, <ul>, <p>, etc.) – one reason why a page will  look different on different web browsers.• Fonts rendered by the local computer operating system• Browser safe fonts http://www.ampsoft.net/webdesign‐l/WindowsMacFonts.html• Embedded font  delivered to the browser– more control  BUT – Can slow page load process – only use in limited areas. p g p y
  7. 7. Reset Style Sheet Reset Style Sheet• Some CSS experts recommend redefining Some CSS experts recommend redefining  every standard HTML tag to even out local  browser differences. browser differences• http://meyerweb.com/eric/tools/css/reset/• F For more on this check out the work of Eric  hi h k h k fE i Meyer.
  8. 8. Visual Design Standards Badge  (aka C.R.A.P ) ( k )• It is meant to be a simple way to show off  your CSS skills AND work in an understanding  your CSS skills AND work in an understanding of basic visual design principles• Start with a visually BAD looking web page Start with a visually BAD looking web page – your own or one you find• Create a validated GOOD version using the Create a validated GOOD version, using the  design principles related in Robin Williams’  book.• In your nomination describe what principles  you used and how you arrived at your re you used and how you arrived at your re‐ design ideas.
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×