Preserved Topic: Elaments to a well desinged web page (Page 1 of 1)

Ok well i began a web designing class in school this year to help me with my designing and these are some thing they siad a well designed web page will have tell me what u think of them and if there are any that were left out or should be taken out please tell me.


Four elements
1 headline
2 art
3 body
4 logo


four stages
1 ideas/Sketches
2 rough draft
3 comprehenive detail
4 complet workup

six design pricpiles
1 porprotion
2 emphases
3 sequence
4 balance
5 unity
6 simplicity

I took a school web design class like that, and I thought it was a load of crap. Some of the design principals were totally outdated, and I didn't really get much out of it. Maybe yours is better. <img border=0 align=absmiddle src="http://www.ozones.com/forum/smile.gif">

Following just these pricipals will leave you with some big gaps in your design.

The biggest thing missing is navigation.

I feel this is one of the most important characteristics of a successful site. We are in the process of redoing our site (and it's a biggie) and more time in the design phase is spent on this than perhaps anything else. Remember the main thing on sites is traffic these are the numbers that pull in the dollars, more page views the more money. Getting around the site is key.

The other element missing is the background. Much more important than the headline (that doesn't seem too relavant. I have been placed in many situations where designers don't realize that the window size will be many different sizes so they do not account for repeating patterns to the right and bottom spaces of the page.


As to the stages the big thing missing is some sort of design review. Most pro designers are not production people so they need at least one or two design reviews to iron out some of the technical issues regarding the actual implementation of the design.

Finally I think page weight is also a missing concept. Many designers do not realize that people have to actually download the page to the browser. Each image takes time. Many complex images (in terms of colors and gradients) causes page weight to increase simplicity.

my $.02


Walking the Earth like Kane

Bitdamaged is right. A lot of heavy graphical sites use complex tables....takes longer to load in real time, but holds the viewers attention as the individual (but smaller) <TD>'s appear to load faster.....

Purpose purpose purpose PURPOSE!!!

The single most important element. All the rest follow from this. Why is this site here? Who is the audience? What do you already know about them, and what do they want to get from the site? Answer that before pencil meets paper. The rest is critical, and the points made above are impeccible. But there are SO many technically proficient sites out there that started with a visual idea and still don't have a clue to whom they are aimed! Personal pride on the part of the "designer".

Is it a general purpose site? The you need to thing Web Safe colors and REALLY obvious navigation. Is it for graphic people? Then you can (maybe) assume large monitors with millions of colors and some sophistication with more subtle navigation. Is it for engineers? For teachers? For teen-agers? For skateboarders? For gamers? Answer this first. Second figure out what you have for them in terms of content. And THEN start hammering out how it's organized, how it looks and how technological it will be.

My $0.25

Read Jakob Nielsen.
http://www.useit.com/

Read Jeffrey Zeldman http://www.zeldman.com

Think long and hard about "why" the site exists.

Please.
<img border=0 align=absmiddle src="http://www.ozones.com/forum/wink.gif">

('course that's going to be hard in a class, but do it anyway if you have any plans to do it for "real" some day.)

[This message has been edited by Steve (edited 01-09-2000).]

Location, location, location! Hah =)

Actually, after making that [bad] joke, I realized that often the URL of your page is somewhat important; people like a www.something.com more than a www.host.com/something.

Basically, that's a handy little list they've given you, and it has some important things on it. But every page will be a bit different. First, I'd like to know how they define "art"; I consider every part of my pages, and the way it all works together, to be art. Also, the whole "rough draft" thing is a concept from back when there were no computers and if you messed up you'd have to re-type your whole paper. I'd say, take out the "rough draft", and replace it with "large amount of tiny changes." That's what it ends up being. As for ideas/sketches, that's not always necessary, but I suppose it's a good idea in just about every case, so leave it in there.

Proportion? Hmm, I'm not sure what they mean by that, but they probably have a good point. The rest of the things in that list are important, yes.

And I agree that small file size is always important. =)

Alright c'mon guys. Do you really want this kid to turn the list in with what he has and what you've said? Your all missing the most important thing that any good webdesigner will tell you is a must ... naked pictures of me. Forget all that naviagtion, background,etc. crap. None of that means anything. A person wants to come to a website with Jestah sitting there in his birthday suit... thats it. Content is always an option but not always need. Slime had a great point about the location. The URL should be something similar to www.nakedJestahXXX.com that will attract attention and Im sure the pictures of me will keep them there...

Alright c'mon guys. Do you really want this kid to turn the list in with what he has and what you've said? Your all missing the most important thing that any good webdesigner will tell you is a must ... naked pictures of me. Forget all that naviagtion, background,etc. crap. None of that means anything. A person wants to come to a website with Jestah sitting there in his birthday suit... thats it. Content is always an option but not always need. Slime had a great point about the location. The URL should be something similar to www.nakedJestahXXX.com that will attract attention and Im sure the pictures of me will keep them there...

Seriously though, has anyone mentioned content? You have body but its not really the same thing. The real key to having a successful website is having lots of content that gets updated frequently. Art, and everything else is nice but content is always king ... thats why my websites always suck ...

Jestah
ieJestah@hotmail.com
ICQ - 77252449

thanks your replys have been helpful and i will keep them in mind. As for this web design class we spent a whole day theching people how to save and load files.I havent found any body in this class that even seems to know remotely what there doing with photoshop so it looks like im going to be broad out of my mind in this class but at least it will be an easy A.

While I agree that matt's list was incomplete by today's web standards, it is the right place to start in my opinion. You have to learn the rules before you can effectively break them. While these principles seem somewhat more suited to print design, we can learn a lot from what the last 100 years of design have taught us about how people respond to visual elements.

Anyway, there's nothing to really refute in his list anyway since it doesn't state any real design principles, only abstract ideas to consider when formulating a design. Any way you slice it your pages are gonna have most of these elements. Proportion, Emphasis, Balance? These things will exist in a design based on the interaction of visual elements, so until you learn what makes these things happen, the knowledge of these terms is very vague.

That's the story of every computer class I've ever been in...

(The easy A, that is, not the naked pictures of Jestah.)

"broad out of my mind"? Who're you sitting next to in that class?

Spend your free time constructively. While everyones else struggles with saving files, figure out what's the least number of frames you can get away with for an animated gif. Blow 'em out of the water. Main question is not with classmates, but with instructor - does he/she strike you as competent?

Hmmmm - I'll have to check and see if "Jestah_the_Molestah.org is taken yet.

nice, Ive been looking to get a domain ...

Jestah
ieJestah@hotmail.com
ICQ - 77252449

content?

what i am doesn't matter...it's what you are that does


corps is mother, corps is father

You dont think content is important? I dont know about you but graphics and everything else look nice but why stay at a website on anything if there is no conent what-so-ever?

Jestah
ieJestah@hotmail.com
ICQ - 77252449

Slime I dont know what type of second rate computer classes you've been in over the years pal but if naked pictures of me wasnt discussed and used well then it was a waste of your time. I would write the principal or department head. Let him know you want naked pictures of Jestah...

Jestah
ieJestah@hotmail.com
ICQ - 77252449

That list is not bad and you should pay attention to every one. All the other posts here have *very* valid points as well (especially Jestah's, you cannot underestimate the power of naked Jestahs).

One more thing that you absolutely must consider is - your audience! Their needs and wants will determine the importance/priority of each thing on that list. If I'm off to www.nakedJestah.com I don't wanna be bothered with words and stuff. Here in DialupVille everything I do is tempered heavily by the fact that there is no fast connection around here (page weight is extremely important) and I do mostly sites for local interest so I optimize graphics like a miser and try to provide content that interests and holds the surfer.

Get into your audience's head. 90% of the URL's posted in Ozone forums are just graphics but I sit through the dowload patiently awaiting my goodies cuz that's exactly what I came for...

JKMabry

See, thats exactly why JK is such an awesome designer. He understands the value of quality naked photos of me ...

Yes, nekkidness is imortant... I'm trying to get some collegues together and make a site with naked stock brokers, and than it's off to www.retirmentvixens.com . That's when the Real money starts rolling in.

Seriously, my cent-and-a-half goes back to something a friend of mine said way back when I made my very first commercial site. She said, "Have flashy things , people like flashy things...", and you know what? The advice ain't let me down once.

um... my friend asks if the naked pictures of Jestah are on file anywhere. I..um, him...yeah..HE want to know as soon as possible. Make it snappy.



tskull@techie.com">

OK, very good points raised by all. Here are the steps I usually take when designing a new site, and the questions I ask.

1) WHY!? Why build a website, what's the *purpose*, what's the *point*? This is generally vague and philosophical, but the best question to be asking, it sets the tone for all the other stages.

2) WHO? What are the demographics of the audience? Who do we want to reach? What are their levels of sophistication, what kind of equipment/plugins will they have, etc... This will tell us how crazy (or simple) we should be.

3) WHAT? Well, what kind of content will be in the site? Do we have any content? Do we need text, pictures, forms, contact links, etc...? We need to know the content in order to properly define the Navigation.

4) HOW? This is one of the critical stages, where we deal with the INFORMATION ARCHITECTURE. You can actually get a job as an Information Architect if you're good enough at this bit. (I've worked as an IA before, it's important stuff!) Here's where we start looking at the content we are going to present, and breaking it down into categories. You usally only want maybe 4-8 top level links, and these links should be available on all pages, in a neat fashion. You may have 15 groups of content, they can be bunched together with a sub-interface to link them together. Here are some of the basic top-level links I use, good for maybe 80% of all commercial sites.
&nbsp; - Who we are.
&nbsp; - What we do.
&nbsp; - How we do it.
&nbsp; - References.
&nbsp; - Contact us. (obligatory)

5) Graphic Design (finally!) Bet you thought I forgot about this, eh? Here's where most people start, but it's really step 5, woo! Now you can start thinking about your logo (gearing it for your "why" and "who" answers), and designing your site navigation tools. If you're doing a commercial site, maybe a boring, fast design will be best for the purpose of the client. If this is a site to showcase your graphics talent, gear it that way. This is the fun part, but it's SO much easier when you already know the answers to those other questions.

6) MORE information architecture! OK, now you have a pretty looking design, it fits your demopgraphics, it points to all of your content, time to start building this site, hey? NO! Now you have to do another boring bit, setting up a sensible directory structure to put all this content in. Think about it, will you be maintaining this site forever? Will the next guy understand what you've done and be able to make changes? You need a sharp dirctory structure, believe me. Here's how it would break down for that mythical 5 link site described above:

index.html (the front page)
&nbsp; -work (all working files should be stored here)
&nbsp; -images (all images should go in here!)
&nbsp; -common
&nbsp; &nbsp; -templates
&nbsp; &nbsp; -scripts
&nbsp; -who
&nbsp; -what
&nbsp; -how
&nbsp; -references
&nbsp; -contact

That should be all you see when you FTP to your site directory. A neat directory structure will make your life better, truly!

SO! Now you can learn HTML, DHTML, Photoshop and all that jazz, this is the core of any good website. Place all of the content for each top level link in it's separate directory, even if it's just one page (it won't *always* be just one page!) Have fun, and happy designing!

Your pal, -doc-



[This message has been edited by DocOzone (edited 02-09-2000).]

The wisdom in this post makes any further thoughts of mine trivial. And same for the first half of most books out there. Read and understand.

Heavy stuff for a high school Web class, but the foundation of a career. I've personally found all these points to be true -- but in hindsight! If you start off with this discipline, lots of dead-ends won't be waiting for you later, and lots of kludgy patches won't be necessary!

Wow.

One very important thing Doc said.

'the next guy'

As a web designer do you want to be remembered as the god who brought your company's site out of the dark ages then rode of into the sunset leaving the easy stuff to a new intern who the company can actually afford to keep on full-time?

Or as 'that bastard' who screwed everything to hell then complained about not getting prompt payment for your hack work. <img border=0 align=absmiddle src="http://www.ozones.com/forum/smile.gif">

Oh, and another thing about what Doc said. Information Architecture truly is the where most of your design effort should go. The usability of the site is more important than anything else (even, *gasp*, anti-aliased text in your graphics <img border=0 align=absmiddle src="http://www.ozones.com/forum/smile.gif"> ). That's why my current job designing the U of Minnesota Student Union websites is gonna probably be the best portfolio peace I've done.

My boss and I have agonized over the top-level links for weeks. We have finally worked it out so that no information on ANY of the tenants or services is more than 3 clicks away. No organization in the unions is more than 2 clicks from the top page. And any huge union-sponsored events we are promoting will be only 1 click. With the number of subordinate sites that I'm doing here, this is a miracle. This site will be miles ahead of any other student union site nationwide (I've looked at hundreds). Most of them are designed by students and look pretty amateurish, some even have good graphics, but they all lack a good navigational flow that allows someone with a specific question to look at the categories and decide where that question fits quickly and easily.