ART 128 Interface Programming 1

Assignments:

1. Simple Web Page
2. Simple Styled Web Page w/ CSS
3. Site Base Blank
4. Site Base Content * updated 2019 version
5. Site Base Layout + Site Base Layout (in class) * updated 2019 versions
6. Site Base Structure (Home) Page * updated 2019 version
7. Site Base Toggle Nav * updated 2019 version
8. Site Base About Page * updated 2019 version
9. Site Base Contact Page * updated 2019 version
10. Site Base Multi-Page Site * 2019 Version
11. Site Base Single-Page Site * 2019 Version
12. Mid-term Site #2: John Doe's First Portfolio Site
13. Final Single-Page Site: [ untitled ]

Exercises:

• Codepen: Text with HTML Markup
• Codepen: Div Test 1 (4 stacked divs)
• Codepen: Div Test 2 (block vs. inline elements)
• CSS Centering Test #1: Horizontal
• CSS Centering Test #1: Horizontal + Vertical w/ Flexbox
• Codepen: CSS Positioning Test 1 (Absolute vs. Relative Positioning)
• Codepen: CSS Positioning Test 2 (Absolute Child inside of a Relative Parent)
• Codepen: CSS Positioning Test 3 (Floats and Clearing Floats)
• Codepen: CSS Positioning Test 3 (Inline-blocks)
• Codepen: JS Exercise #1 (getElementByID)
• Codepen: JS Exercise #2 (querySelector & querySelectorAll)
• Codepen: Typography Specimen Test #1
• Simple Headers with Logos (images): Different Techniques:
  • Simple Header
  • Simple Header w/ Inline Image + HTML h1 Text
  • Simple Header w/ Inline Image + Hidden HTML h1 Text (via top/left -9999px)
  • Simple Header w/ CSS BacKround Image and Hidden h1 (via Leahy Technique)