CSS Layout Sample

Look at this CSS layout sample.

Review the site in terms of it's LAYOUT ONLY.

http://jeffhowden.com/code/css/forms/

• Two things you like about the DESIGN
• Two things you would improve about the DESIGN

Site review

Review this site - http://www.typorganism.com/

• Two things you like
• Two things you don't
• How could it be improved?
  

Advantages of CSS

Look at some of the cool things you can do with CSS ... don't forget to come back and answer the questions.

What are the advantages of CSS? Why would we use it? What does it allow us to do that we can’t do with just HTML?

Maintenance-wise (if you’re changing a font say, or the size of all images) how does CSS help us?

The Web in 2030

Read this article (It briefly discusses the internet in 2030) … you can also read this site that discusses what might be coming in our future.

Read the articles, based off of these articles and your own predictions,

1. Describe how the web will be accessed in 2030.
2. What will it look like?
3. How will you interact with it?
4. How will it be coded/created?
5. What will it be used for?
6. If you want to be successful in the worlds described in the above articles … does your education end after High School? After college? What do you have to do to be successful in these worlds?

Review the HTML Playground

Check out this site http://htmlplayground.com/#css_background-image

Leave a comment about the design of this site using the web terminology you know.

You can "select reference" in the menu and pick HTML or CSS etc. It's also a useful reference for you.

What is XHTML

1. What does XHTML stand for?
2. How is it different from HTML?
3. Why should you use XHTML?
4. Is this a major change from what you've learned so far about HTML?
   

Web design - What next

What would you like to learn next about web design?

List two things that interest you that you'd like to learn.

Shopping Carts

Amazon.com is probably the most successful online store so reviewing their shopping cart will give us a good feel for what we are striving for in making a shopping cart/online purchasing tool.

Your goal is to analyze Amazon.com’s shopping cart system.

* Look at products
* Add them to your cart
* “Purchase” items (stop short of actually adding real information)

Respond to this blog entry

* What are the features of an online shopping cart?
* What are the features of an online store?

Your Sites - Review

As a comment to this blog, review EACH of these sites (even if it's yours).

1. Describe what the site is for.
2. Two things you like.
3. Two things you don't like.
4. Provide a list and description of how the web designer could improve the site.

This should be AT LEAST a few sentences per site

http://www.twobats.com/brad/guitarsitehome.html
http://twobats.com/lupita/lupitaiweb
http://twobats.com/Site%202/Welcome.html
http://twobats.com/phillip%20hasenbalg/Video%20Game%20Review%20Site/home.html

Cyberdyne"

Review this site - "Cyberdyne"

1. How quickly can you determine what this site is for?
2. What IS it for?
3. What is your opinion of this product?

Hulu

Review, http://www.hulu.com/

1. Discuss the site in term of the web terminology you've learned.
2. How could this site totally change the cable/broadcast tv industry?

Another web resume

Here is another web based resume - "Web Resume"

Given the current economy there is a large deal of competition for every job out there. Historically people created a paper resume containing work experience, education etc and conducted face to face interviews to find work. Now, with new technology and increased competition people are

1. Using the web to find jobs
2. Creating web based resumes/portfolios (like the above and like Vanity Clair)
3. Creating video resumes
4. More

The above resume is simply a linked version of a paper resume. It's not really doing much that a paper resume can't do on it's own.

Questions

1. What could be done with the web based resume that would make it more valuable/different from a paper based resume.
2. What would you include in your web based resume?
3. What is your opinion of the web based resume linked above?

Harry Potter

Review this site - "Harry Potter"

Using your web-design terminology list :

1. What is good about this site (using terminology)
2. What is poor about this site.
3. What is your opinion of the site

Vanity Claire

Review this site

Be sure to click on navigation. Also, scroll left and right.

1. How quickly can you determine what this person does?
2. What is unique about this site?
3. Do you think this person would do a professional job on your web site?
4. One thing you really like, and thing you think needs improvement.

Typical Pages

Look at three different sites.

In addition to the home page, what are pages that every one of these sites have? (Maybe under different names, but things like Contact, About, etc).

List FIVE pages that most every site is likely to have.

Site Idea

What would you like to make a website about?

Post on this blog a description of what a site of your choice would be.

Your Sites

Review these three sites.

For EACH ONE
- List two things you like
- Two things that could be improved

Try to list items (from any of the sites) that do not match the Do's and Don'ts of web design.

Here's the sites ...

Lupita's
Lindsey's
Jessica's

Whitehouse

Review this site - http://www.whitehouse.gov/

Regardless of politics, most people would agree that the current president is the most tech savvy we've had. He is the first to have a computer on the oval office desk, the first to carry a cell phone (albeit it only connects to about 40 people), this administration is the first to have a chief technology officer. Utilizing Facebook, YouTube, blogs and numerous websites this administration communicates with us.

Review Whitehouse.gov ...

Be serious and only provide APPROPRIATE comments.

1. Is it easy to use?
2. Does it look professional?
3. IGNORING POLITICS - How would you rate this site.
4. How quickly can you find this administration's views on "Net Neutrality or the 'Open Web'"?
5. If you were president how would you communicate with the people of the United States?

Wiki Uploads

Check out this site - Wiki Upload

Is this a web 1.0 or web 2.o type of thing?

When might a site like this be useful?

Is this site related to Wikipedia? Why do you think/not think so?

Use of music

Review "Gates and Fences" - Turn your sound on

1. What do you think of the site? Two things you like, two things you don't.
2. What do you think of the music? Helping sell gates and fences or no?
3. What could happen to this company if they did not pay for the rights to use this music?
4. Do you think they DID pay?

IGN - Web Site Terminology

Review this site - ign.com

Describe this site using the website terminology you defined earlier.

Evaluate - Salary.com

Check out - Salary.com

Think of a job you are interested in

1. How quickly can you find a salary for the job?
2. What is the salary for our location?
3. How quickly can you find the typical requirements to have that job?
4. Briefly, what are those requirements?
5. Is this site easy to use?
   

Evaluate - LaConner's Web Site

Evaluate - http://lcsd.wednet.edu/

Using the terminology you are currently researching, evaluate the site based on:

1. Navigation - Easy to find what you need?
2. Headers and footers appropriate?
3. Does site have dynamic or static LAYOUT? Why do you say that?
4. Does this site have dynamic or static CONTENT? Why do you say that?
5. Does the site use bread crumbs?

Look at the terminology you have been researching, any other terms apply to this site?

What is your opinion of the site?

test

my link to google

test

Site Review - Julie Garwood

I have to quit showing you BAD examples (like this) before you are familiar with many good examples ... but it's so fun!

Answer
1. What is the primary purpose of this site?
2. How long did it take from submitting the page to actually seeing something?
3. Do you think this would work on an older computer?

You can see why people would do this kind of thing, because it's kind of cool. Yes, cool for a game or a diversion, but if you're trying to sell something (Like books!), or get some information across (Wikipedia) you want to be quick and efficient. They don't make stores into mazes or amusement parks, because they want you in, and out with a purchase.

While you may (and should) make your sites interesting, also make them easy to use ... people should not have to "learn" how to use your site.

Site review - Microsoft

Check out Microsoft's Site

1. What do you think of their navigation?
2. Is it easy to find things?
3. Look for help with installing Word. Was it easy?
4. How many pages do you think their site has?

Site Review - Dalton Mailing

Focus on the homepage of this site Dalton Mailing Service.

What do you think about the navigation on the home page?

1. Do you think this is "Smart, Fast" navigation that will quickly get you where you need to go?

2. How much useful information is on this home page?

3. Given that people spend about 10 seconds on a site before they determine if it is what they are looking for, is this homepage design good business?

Site review - W3Schools.com

Go to w3schools.com.

What is this site for?

Rate this site in terms of "Ease of use" 10:Best, 1:worst.

"Navigation" refers the clickable links on a web site that allow you to move around or navigate through the site. Where is the primary or main navigation on this site?

Look at any 3 more sites. Where is the main navigation for these sites?

Site Review - Google

Spend about ONE second :) what is this site for?

How do you know?

Rate this site design 10 being the best, 1 being the worst.

Important question, why is there so little on Google's main page?

Site Review

Review Moire

Spend about 10 seconds looking at the site.

1. What is the site for?
2. Use the site a little bit, what other things can you find wrong with this site?

BTW ... This is an example of POOR web design!

Trace Route

You have seen a demo of an internet route tracer (there are many others).

Explain in your own words what this tool does, and what it means.

Why do you think the path is not directly from the source computer (yours) to the destination computer (the one you are typing into your browser.)? This would be much quicker.

When you look at the list of computers that the trace route goes through, what do you think would happen if one of those computers was down (meaning turned off, destroyed, having some other issue?)

Answer all of these questions completely with proper grammar, spelling, and capitalization.

Site Review

Look at this site (Accenture) for about 20 seconds.

In the comments, please state what this company does.

Also, about how long do you think the typical web surfer will spend trying to figure out what your site is for before moving on?

Purpose of web sites

List five different purposes a web-site may have.

Provide a link to an example or each type.

What I want to learn

The primary objective of this course is to teach basic web design principles, but you may have specific objectives that you hope to get out of this course.

What is your big goal for this class?