TITLE
PERIOD 1
PERIOD 3
PERIOD 4
PERIOD 5
PERIOD 6
Graphics
Illustrator
Image Manipulation
Photoshop
Photography
Digital SLR
Web Design
Dreamweaver
Animation
Flash
Video
iMovie
Audio
GarageBand
Slide Show
PowerPoint
Make a folder named “surf” on your desktop.
Make another folder named “media” inside your surf folder.
Download the surf.html file into your surf folder.
http://hulk.osd.wednet.edu/sleduc/surf/
Download the surf.gif file into your media folder.
http://hulk.osd.wednet.edu/sleduc/surf/media/surf.gif
Open surf.html in Dreamweaver.
View the source code and look to see how the div tags work in the CSS at the top of the page and [...]
This screencast is for students working through the Head First HTML and CSS book. Student from other classes may find it useful, because the process for publishing is the same for everyone.
Due Date: Tuesday, December 2nd at the end of day.
Must be placed:
in the folder
in the folder
on the hulk.osd.wednet.edu web server
Goal
Redesign McNashton’s business web site
Must include the logo and a Hawaiian theme in the design
Get better at the web site production cycle
Product
Rough draft paper sketch, scanned and saved in the folder on the Hulk Server
Save as a .jpg file so [...]
Due Date: Tuesday, November 18th at the end of day.
Must be placed:
in the folder
in the folder
on the hulk.osd.wednet.edu web server
Goal
Redesign The BilbyBaby.com business web site
Must include the logo in the design somehow
Get better at the web site production cycle
Product
Rough draft paper sketch, scanned and saved in the Project 1 folder on the Hulk Server
Save [...]
Goal
Understand how to build a web portfolio
Product
Your web portfolio with HTML content
Tools
Adobe Dreamweaver
Kompozer
Resources
Zipped copy of the LASTNAME Portfolio Template with folders
lastname_portfolio (zip file)
Continue reading about Explore HTML and CSS Relationship - Day 5
Be safe.
Do not publish personal information beyond your name
Do not share address
Do not share phone number
Do not share images of yourself or friends
If you are unclear about these safety precautions, please ask your teacher to explain.
Be legal.
Do not use copywritten material on hulk.osd.wednet.edu
Hulk server address: hulk.osd.wednet.edu
Your account is at /~username
EXAMPLE: hulk.osd.wednet.edu/~sleduc
Access Hulk from home with [...]
Goal
Understand how to download, edit and save an image to media folder and place in web page
Product
HTML document with images included
Sample CSS from the above example:
body {background-color: yellow}
p {color:blue}
{background-color: #00ff00;
color: salmon;
font-size: 400%}
h2 {background-color: transparent}
#divbox {
width: 300px;
height: 300px;
border: medium double #333333;
background-color:#FF33FF;
}
#container {
width: 1024px;
height: 682px;
border: medium double #666666;
background-color:#999999;
margin: 0px auto;
background-image:url(’media/flower.jpg’);
overflow:scroll;
margin-top: 50px;
}
Tools
Adobe Dreamweaver
Adobe Photoshop
GIMP - Free Open [...]
Continue reading about Explore HTML and CSS Relationship - Day 4
Goal
Understand how to create boxes with HTML divisions or as some call them “div” tags
Product
Create at least three div tag boxes
Place boxes on the page in different positions
Change dimensions of the boxes
Change the background color of the boxes
Tools
Adobe Dreamweaver
Kompozer
Resources
W3schools Div Tag Explanation
CHS ComTech DIV Tag Code Page
Basic file from today’s lesson
Advanced example as a [...]
Continue reading about Explore HTML and CSS Relationship - Day 3
Goal
Understand relationships between naming protocols, files, folders and links
Product
Web site folder
Combine CSS declarations under a single selectors
Watch video linked above for examples
Folder named “lastname_portfolio”
HTML file placed inside
media folder included inside
Include images for all future work
Make sure it is titled all lowercase “media
Tools
~ Adobe Dreamweaver
~ Kompozer
Resource
~ W3schools.com CSS Examples Page
Continue reading about Explore HTML and CSS Relationship - Day 2
