Site hosted by Angelfire.com: Build your free website today!

Home | CSS | Tables | Images | Typography | Layout | Devices | Color Theory | Forms | Features | Resoures | Access |

 

 

 

Web Site Layout

Tracing Images, AP Divs, and Tables Defined
Item Definition
Tracing image An image can be a gif, jpeg,and png, that you can load into the background of Design view in Dreamweaver to serve as a reference for layout. Consider this the blueprint you follow to build your pages.
AP Div Absolutely Positioned <div> tags. You can place them anywhere on the page, and they are completely self-contained. They aren't affected by other elements, and they don't affect the position of other elements on the page. AP Divs were called layers in previous versions of Dreamweaver.
Table Tables can hold images and text in place, but they are not intuitive or flexible when it comes to positioning them on the screen. However, Dreamweaver CS3 offers some helpful features that give you more flexibility, including innovative table-drawing tools, and the capability to convert AP Divs to tables. But this is not recommended.

Review Question Pg. 49

1. What are client success criteria and why does it matter?

You need to find the demographics of the audience's needs, what services are offered by the company you are making a web site for. With those things in mind you should be able to map out a site with no trouble.

It matters because you don't want to clutter the site with things that are not going to help the customers get and do what they need. Links should be laid out in an easy fashion that will help the viewer navigate to the information they seek. You should consider the type of computer, monitor size, processor speed, and browser your audience is using. Make sure the site loads quickly at low speeds.

3. In your own words, explain why each of these design elements is important.

a. emphasis-the most important stand out.

b. contrast-makes more interesting site, easier to navigate and draw attention.

c. sense of balance-of lines, right alignment and text spread out evenly.

d. arrangement-left and right alignment of text and pictures.

e. repetition of elements-makes your page easier to become more familiar with.

f. visual direction-how your viewer will read your site.

4. Why should you use a logo on every page of a website?

Customers will remember the company name and it reassure them they are still on the company site.

 

 

http://my.yahoo.com/

My yahoo does make me want to know more about what they have to offer. It is easy to navigate. There are some links that do not open into blank windows. This page looks to be designed in the inverted L shape.

This is My Yahoo's home page.

http://www.nascar.com/

Nascar.com uses the full design, no room for white space format. It is easy to navigate when you get use to the site. But it is confusing at the same time. There is so much information on the home page, I almost don't want to click and find out more, being a NASCAR fan I can't help myself.

This is the Nascar web site.

http://www.studentveterans.org/

The Student Veterans of America's web site layout is box shape. The simple design makes me want to click to find out more information. It is easy on the eyes and easy to read. My focus is drawn to the middle of the page, and everything I need is there.

 

 

This is the Students Veterans of America web site.

http://www.pcbtour.com/

The Professional Championship Bullriders site is an inverted L shape. The basic navigation buttons are on the top, with the more in depth on the side. I don't think the brown on yellow makes me feel sick. The site is easy to navigate. But it has links to YouTube and I think the viewer will be sidetracked away from the site as I was.

This is the Profesional Championship Bullriders web site

http://www.bigfoot4x4.com/bf_home.html

The BIGFOOT web site is very easy on the eyes. I like the background it fills in space and still has plenty of white space. The alignment going down the center gives it a nice flow. This is a good use of the inverted L shape formatting.

This is the Offical site of BigFoot Monster Truck.

 

 

Home | CSS | Tables | Images | Typography | Layout | Devices | Color Theory | Forms | Features | Resoures | Access |