Monday, April 18, 2011

Let's work on the FLOW of your websites

The websites you turned in last week were good. Now it's time to make a GREAT website. We're going to jazz up our designs a bit with a few easy tricks to make them flow a little better, look a little nicer and generally be easier on the eyes.


We're going to talk about resizing images to fit the page. Remember, you're supposed to be wireframing your sites before you build them. You should go into the construction phase with a nice set of blueprints for how your website should look. You should know how big your images need to be before you start constructing the html. We will wireframe TWO pages of a new site and you will be required to come up with correct sizes for your photographs/images on your wireframe. Then, you will create all your graphics using photoshop before you even open dreamweaver. You will use your wireframe as your blueprint and create all your graphics from that.


We're also going to talk more about consistency with your navigation and footers. These need to be the same on every page, so people don't have to look for them. We will talk about creating a web "template" to use so the headers/footers can always be the same. It is imperative that you don't make a visitor think too much, or else they may click right out of your site. We want them to stay!


You will be designing this website for YOURSELF. It can be a portfolio website or a personal website, but it will be for YOU and have YOUR name on it. So make it good, or people will know who built the bad website! :)


HOMEWORK:

• Pick the type of website you want to build: personal or professional.

• Gather together some photos to use. Remember, if you are getting them off the web, make sure they are big enough (resolution) to use! If they are tiny, they probably won't work. Please feel free to take your own photos if you would like!

• On paper (not computer) wireframe TWO pages for your site. Remember to keep your header, footer and navigation consistent!

• Clearly mark measurements for website width, table/cell widths, etc on your wireframes. You MUST do this!

No comments:

Post a Comment