Slice! Slice! Slice!

Morning all.

Firstly, well done to all of you who presented your proposals the week before last.
Fantastic stuff!

Right, now down to business:

Use the first part of the lesson to re-evaluate the look of your web pages.
Think about your basic "template".

By now you should have the menu / navigation page of your individual section nearly ready. This page must lead back to your group page and on to your content pages.

I would like you get together as a group and combine your powers to make your group page in photoshop.

Try and keep a "Brand" running through all of your pages.

Save this and make sure you each have a copy to work with.

After this, I would like you to create a single mock-up page of your content.
For example, if you are a photographer, make a page demonstrating what your gallery / portfolio might look like. Don't worry about the correct text jsut yet- just copy and paste something in to give the idea of where text would go and how it affects the look of the page.

Make sure you have three pages with areas where buttons can go to link all the pages together.

.
.
.

Right then.

Next you are going to create a working website using Photoshop and dreamweaver.

Select your main group page.

Select the "slice tool" (K)

(-the one we've all used by accident at some point- now we find out what it's really for)

Chop up your page into slices

make sure that there is a slice around each button / picture / link.

Go to "Save for web and devices"

Press APPLE & A (this selects everything)

save as "images and HTML".

You have created a working web page! Easy as that.

Repeat this for the other 2 pages (your "menu" and "content")

Open Dreamweaver

Select Open file and open the "group" page you just made in Photoshop...

Click on one of the sections you want to link to your "menu" page

click on the folder next to the link box.

Select the page you want to link to

Save.

Preview in browser.

WOW! Linking webpage!

Repeat this until all pages link to each other.

This will help you assess how easy your web pages are to navigate.