WDS 10: CSS TIPS & TRICKS 03/31/17

INTRO:
– Import and display fonts (Show)
– Try an image Roll-over (javascript or CSS) (Show)
– HTML5 Code (make sure you have tried it) (Show)
– Try a Favicon (Show)
– RWD tutorial
Start Working on your Final – Planning

NEW:
JS Redirect:
– Sub-domain. How does it look?
How to redirect? My Page. Code. Screen Shot on iPhone

WORDPRESS:
– Install! First, need to get it
– A “how to”
WP customize
– More WP custom
– WP theme mods
– WP theme customization
– More WP tips

FINAL DELIVERABLES:
A. The Development Process Documents (This was your mid term. Make sure process reflects the finished final project):

B. Homework Assignments.

Studio 01:
Create a splash page for your web site (use anything you want) with an image and a link. Example?

Studio 02: HTML and Process
HTML: Try out all the code samples: 4, and 5 and 6.

Studio 03:
Read: Chapter 7 and 8.
Complete Code review for 7 and 8

Studio 04:
Mount an image in a table. Put text in certain table cells.

Studio 05:
– Try Meta tag, refresh and redirect
– Create at least 3 HTML pages, using CSS to complete the following on each page:
– 1. place background image,
– 2. Use the “box model”
– 3. Use pseudo classes

Studio 06:
– Try External CSS
– Try CSS opacity hover

Studio 07:
Make sure you understand “Float” and “Clear”.
Review this EXAMPLE. Copy and customize! (Show next Week)

Studio 08:
– Create a 2 Column layout using HTML/CSS
– Create a 3 Column layout using HTML/CSS
– Try a JS Drop down menu
– Try CSS Drop down
– Try Media query (color change)

Studio 09:
– Import and display fonts
– Try an image Roll-over (javascript or CSS)
– HTML5 Code (make sure you have tried it)
– Try a Favicon
– RWD tutorial

Studio 10:
Try the JS redirect

C. WordPress site. Installed and customized

D. Final Site (URL)

Studio 10:
Sources to Review:
More on the Hover
Advanced Hover effects
Zen Garden

HTML/CSS
Try the JS redirect. Show next week.
Read Chapter 19
Install WP. Play!