Web Design Class III- Using Photoshop to Start with Creating a Page

Why do we use Photoshop to start with for creating a site?
Because designers use Photoshop to show their clients the looks and feels of design.
Transfer from printed material to webpage.
Why do we slice the whole piece of image to smaller ones?
Smaller image’s download time is faster
Since image file is bigger then text/html code, we can delete unnecessary blank image piece, and use background color to replace it. And use real text to replace image text, so we can apply style to it, and make the file smaller for quicker download time.

Create a new site name Quick_Site from your last week’s sliced image:
Create a folder name it “quick” and drag (1) index.html (or if you forgot to name it index, it should be “photoshop” or “design1”) and (2) images folder into your “quick” folder. Define a site by click site menu from Dreamweaver siteànew site and select advance tab from the top, select local info on the left panel. Give a name of the site and click on the folder icon of local root folder: select your quick folder, and then select image folder inside your quick folder as default image folder. Click link relative to document, and leave URL blank (unless you have a site out there running).

Open your site first page: index.html and delete the “text image”, replace it with real text.

3.Create hyper link


Continue with Café Townsend tutorial add text apply CSS style sheet and create a new style sheet

Cascading Style Sheets Video
http://www.adobe.com/go/vid0152.
Open index.html do page space layout using “div” tag or under Layout tab
Insert text, and image by drag from file panel