Slashdot Mirror
What Makes a Good Web Design?
Grand Master Math asks: "I'm currently redesigning my website and I have checked out tons of various web sites, gone from link to link, etc...to find the best web design techniques, layouts, and features. Wow Web Designs proved to be a pretty useful site, as it showcased virtually 'the best of the web' in design and creativity. I was wondering what the Slashdot community has to say about web design and what the best web design should implement and address. From browser compatibility, to simplicity and complexity, and customization to user interaction, what should a perfect web design incorporate?"
I always thought black backgrounds and red flashing fonts were cool
Too often, people get too gadgety when they design software. Keep it as simple and as direct as the functionality and purpose of the site allows you to. Gimmicks are worthless. The best web designs get out of the way and promote the presentation of their content. Once you've taken into account the structure of your content, half the battle is over.
tags. Gotta have those
The Anti-Blog
Do not layout your text, let it "flow naturally" around the large ill-considered pixelly gifs that you should rip from a cheap image CD.
Use a good readable font such as "Artica Smooth Casual Condensed Extra Italic With Mega Serifs" that everyone will have on their computer.
Don't forget that green and red are soulmates in graphic design. Use them to the max.
Make the text readable! Don't use a font size of less that 18pt.
Keep it simple
To the point
Searchable
Flash-non flash versions
no unnecessary plugins
no popups/unders, etc.
two versions of the same website is cool.
Not everyone has a blazing net connection, so remember the little guy sucking on a 33.6 dialup connection.
that's it.
Sent from your iPad.
There is no such thing as good web design. There is only good user design. Who are you users? What do they want to accomplish by visiting your site? What do you want them to accomplish on your site? Once you answer those questions you'll be in a position to make some decisions about a design that compliments your goals.
;)
Or, you could just put all the important stuff in flashing text
There's a huge split. If you ask the "Slashdot Community" what makes good web design, you'll hear... a lot of noise.
There's the progress camp:
www.webstandards.org, that wants everyone to upgrade their browsers and live on the bleeding edge of style sheets (how ironic is it that their bleeding edge stance has been replaced with an "under construction" sign).
Then there's the compatibility camp:
anybrowser.org that wants every web page to work in the old browsers.
There are probably a few things everyone can agree on, like Flash being worthless at best and extremely annoying most of the time.
Personally, I say: look at the successful dynamic sites. Google, Yahoo, Slashdot. Light HTML, very light images, strong dynamic backend. Don't get too caught up in the format details; it's the power of what's driving the web page, and the content, that matters.
Loneliness is a power that we possess to give or take away forever
It seems that web design has changed over the years in order to better accommodate database-driven websites. Text graphics, for example, are pretty much out.
Check out the big boys and see what they've been doing with their sites in order to compensate for massive quantities of content.
I'm biased, but I've got to say that the LDS Church website has done a remarkable job of integrating content and design in an attractive and useful way.
Got Rhinos?
Whats more important?
The "look" of the website, or the "content"?
Glammer up garbage, and its still garbage. Glammer up content and you've got a blockbuster site.
Just a tidbit to think about when redesigning.
BTW - Cliff, you realize that this is a "need hits on my website" article dressed in "AskSlashdot" clothes, right?
Good quote, too many chars. Seriously, the slashdot 120 char limit sucks!
Less is more. Just cause something is 'cool' doesn't mean you have to use it. When looking at a webpage, if it takes more than 2 seconds to find something you are looking for, it's too long. Keep the java/flash/frames to a minimum. Above all, keep the site fresh. Nothing is worse that looking for info and seeing that it was last updated in 20th century (gasp!).
---
#insert
Compatability. Visual appeal. Simplicity. Content. www.addaon.com
I've had this sig for three days.
I'm in the process of reading the book "Don't make me think!" by Steve Krug. It's a very easy read, very short, big pictures etc. One of the main points he brings up which I think you should keep in mind is exactly what his title suggests.. don't make the user think. If the user has to think about using your page, "Gee, where's that search button? Is that the product I want?" etc, well, who knows how long they'll stick around. Don't make the user think.
Another thing he brings up is usability tests. I admit, I haven't started doing this yet, but I agree with him. Grab a user that isn't a web programmer. Go to their machine and have them load your page. Then ask them to perform some function and watch what they do. Do they struggle when they try to add a user to the list of names? Do they search around for a help button? In some cases, have the user actually speak out loud about what they are doing. Usability tests can really help you learn where your app works well and where it just plain sucks. Hell, I forgot to add a 'save' button to one of mine because I knew how to get it to save without the button (there was a trick to it). I almost put it in to production, but we do quality checks with other people and they caught it (I believe my thoughts were, "Doh!").
Anyway, I'd suggest the book. It's something you could read while sitting in a Barnes and Nobel sipping tea or whatnot.
-Frijoles-
The key to web design is to design with your target in mind. Asking us what's good for web design would only be useful if you were designing another slashdot site. For example, if you're designing for kids, you wouldn't have to worry so much about supporting Netscape on Unix platforms. Likewise, it wouldn't be appropriate to ask kids how to design a slashdot site :)
<tim><
Good web design is like good music or good writing. It's only good insofar as it meets the desires and expectations of the audience. My wife and I think Son Seals and Koko Taylor are The S**t. The 18 year old young women in our WSD are bored with them. They like (boring, rhytmless, tuneless :-) techno.
Some people LIKE lots of Flash, animated buttons and dancing bologna on the screen. I like clean and simple. Each is appropriate for different tasks.
The question is, as always, "What problem are you trying to solve?"
The man who never alters his opinion is like the stagnant water and breeds Reptiles of the Mind -- William Blake
Web Pages That Suck
http://www.webpagesthatsuck.com/
Good web design is not necessarily flashy or technically brilliant, it's easy to look at, easy to understand, and most importantly, easy to convey information with. Too often the websites I visit are cluttered with buttons, banners, and animations that distract from the purpose of the site itself. I'm not saying ditch them, I'm saying use them in moderation, where appropriate. Isn't that what good design in general (not just web) is about? The use of elements to convey information with a minimum of distraction from the central message.
Find out about my new childrens book: SS Death Camp Criminal Batallion Go To Monte Carlo For The Massacre
Yikes, I certainly wouldn't recognize them as an authority. Blue text on brown backgrounds. Black text on dark green. Not the best link to use as an example....
someone who has done almost no web design it still seems to me that the layout of the site should fit the content and purpose of that site, slashdot is a good example, i personally think fidelity.com has one of the best and most useful websites i've ever used as htey provide a huge wealth of information and technologies very well laid out in an intuitive manner... (although it sucks under *nix)
I'm surfing the web looking for content.
...
What is your content? That is why I came to your site.
Can I find and understand it easily?
If I can't figure out the content, the rest is useless.
Focus on your content. Why is your website there? Why am I looking at it?
Flashy == distracting == frustrating == waste of time
... unless your whole purpose is strictly to entertain
O=='=++
I finally convinced someone that I could use frontpage, er code HTML... But I really have no clue how to do this, so I thought I'd get some pointers from the /. crowd. One of the guys who contracted me mentioned "perl script"... there's no pulldown in frontpage called this!! Please help me, I need the $$...
Get feedback from the people who actually visit your site, they're the ones who are going to staring at it. Beyond that, a good sense of graphic design to enhance your message is important.
To celebrate the occasion of my 1000th post, I will post no more forever on Slashdot. Goodbye.
Browsers:
Making your page look good on every browser and platform is impossible. It will take too much work and you probably don't have all the systems
Look at your target and decide what browser they are going to be using. For most web sites its IE4/5/6 and optimize for that... but also consider Netscape and Mozilla. You gotta remember the percentages.... (IE has like 85%+ of market share)... However if you are going to target LINUX/BSD optimize for Mozilla/Galeon. That seems to be common.
Use FRAMES and Images maps if you need it. Don't let people that use LYNX make you avoid those. Yes technically you can avoid using frames/image maps... but that's not the point... use them if you have to. What you want to do is avoid excessive use...
Scripting:
JavaScript is good... try to avoid VBScript and definately do not use ActiveX controls... Flash and Shockwave when necessary (what I mean is don't make your entire page in Shockwave/Flash)... there is no point.....
-- Note: These Comments are Generated by ME! Not You! ME!
Everything you want to now is here. Enjoy!
the thing yourself. Hire somebody with a good web portfolio that you've seen to create a template for you and build from there. It'll cost you money out of pocket but it will save you hours/days of fucking around with the layout. Also, if you're doing this for work, it'll give your work more credibility. CTO's and the like love to have staff decisions validated by an "expert"...;)
...to think about. Or rather, they are, but they should be on the list below usability. That is, if your web site is there to store some actual content or information, as opposed to being primarily a work of art in its own right (in which case you should go nuts and ignore the rest of my message).
For instance, just that front wowwebdesigns.com site you point already makes me grouchy. Why? They shrink the font size below the default font size. With my default setup, the page is completely unreadable. Fortunately, with Mozilla I can bump up the fonts for that page, but good web design would mean the user shouldn't have to do that.
The site is also too busy. Too many sites out there clutter the screen up with packed sidebars on both sides and advertisements and flashing animated images and Flash animations and oh my word.
The pages they list as "good" at may be pretty and eye candy, but unless you're trying to make a gallery piece which is supposed to be thrilling in its own right, they are what I would think of as *bad* web design. To my mind, good web design is a design that doesn't get in the way of your reading and getting to the information you want to find on that web site.
My idea of good web design? www.google.org is near the top. Very clean, simple, straightforward, does its job and is readable.
Clean, readable, not sensory-overload inducing, well-organized: all of these things are far more important for 80-90% of the web sites out there than anything having to do with being visually appealing or using creative and fancy new touches.
-Rob
What Makes a Good Web Design?
A good web designer.
Seriously, that's all there is to it. You can't really say what elements make a good web design.
You can say things that most people consider bad web design and avoid them, but not really what makes good web design, unless you are so boring and obvious as to say things like "clear, consistant layout" or "works on most modern browsers and is standards-compliant". (Well, duh).
graspee
You really can't go wrong if your website follows those three principles. There are hardware concerns, too (make sure your servers and your connection is up to the expected task).
Light a fire for a man and he'll be warm for a day. Light a man on fire and he'll be warm for the rest of his life.
It deserves a WOW award! Don't use slash websites either! Heres an alternative
Well first, I like clear fonts that are readable.
:)
Darker backgrounds go easier on my eyes.
But most of all, I HATE pop up ads. This will surely not make me come back to the site.
Heavy java scripted websites I wont return to either. I don't like getting script errors...
go light on the html.
Having the option for flash and non-flash I think is really really good...
Ok my $.02
Well, Wow Web Designs' web design is an example of how you shouldn't do it, IMO :-). Blue text on blue/white snow, yuck.
I mean *lots* of it.....in fact, just do the entire site in Flash.
from design, by Jamie Zawinski.
314-15-9265
These are the rule of thumbs I like to go by:
1) Keep it simple, stay away from very complicated layouts, avoid tables if you can, avoid nesting tables.
2) Use stylesheets as much as possible, for layout and control of appearances. But avoid using fixed fonts.
3) Avoid fixed-width layouts if at all possible, make sure your design can flow. Users who want to print your pages will like you. Users at very high resolutions will like you.
4) Don't use javascript to implement any critical functionality, use it to enhance the user experience.
5) Don't use splash pages, avoid flash or use it sparinglly.
6) Try to honor the conventions of the web that users will expect: i.e. underlined text=link, don't disable back buttons.
There are more but these should get you started.
Uh-huh. Also, if your web design tool displays how long it will take a page to load, shoot for something that's around 10 minutes at 56k. That way your audience will *know* it's an important web page. If you can get close to 10 minutes on broadband, you know you're on to something!
I am not a professional web designer.
I'm just a guy who goes to a lot of web sites.
Here are my personal preferences
(1) THERE MUST BE CONTACT INFO. I was doing a project for a bit where I had to call various university math departments. It was very annoying when there was no way to get an address and a phone number for a website. Put that stuff on the first page.
(2) THERE MUST BE A SEARCH BOX. It is not hard to attach a search engine to a web-site now. So there is no excuse for not doing so. If I want to buy a bow-tie from you, and I know you sell them along with eleventibillion other things, I should be able to type "bow-tie" in a box instead of going through your navigation
(3) IT MUST LOAD FAST. Unless it is a photograph of a naked lady, I am not going to wait for that graphic to load. I have a very nice internet connection, and I still find pages where I have to wait for the labels on the "forward" "back" "search" "about" buttons to load, because of all the other graphics that are on the page
(4) THERE IS NO POINT FOUR
(5) IT MUST NOT CRASH MY BROWSER. Some pages make Internet Explorer crash. I don't know why. I don't care why. I just plain don't like it when that happens, so please make it not happen to me.
DJS
God is real unless declared integer
This may be a simple way to state the obvious, but don't force me to the point where I have to deduce how to navigate around your site. Things should be plainly labeled, and obvious. The worst thing is using images on buttons without telling me what it's leads to. Skip sounds altogether. If I want multimedia, I'll go to a multimedia site.
Developing for the different viewing possibilites is a royal pain, but it a) should be done in the hobby arena, and b) MUST be done in the professional arena. Take into account when you're developing different browsers, platforms, resolutions, browser versions, etc. Because of these differences, try to conform to standards, make minimal use of technologies unsupported in some browsers (VBScript, lots of JScript) and try to code for ALL your users.
A good site will be easy to navigate, will help you along if you get stuck, is preferably searchable, and actually has content.
Oh, and NO auto-popups.
... yellow text, with the strong tag on, font size 4, on a neon green background. Ooohhh... Also, embed a bunch of sounds! People love sounds... but make sure they are random sounds that have nothing to do with your website.
Google is a very good example of my favourite web-design style. No frills and it loads like a greased lightning.
My opinion? See above.
The first thing you should think about is who your target is going to be. If the target is geeks, you can spare on the bubbly crap and display essential information with ftp links and all.
If your target is in the elderly group, BIG fat fonts, etc...
It think the thing to keep in mind is simplicity. Stay away from flash & cie on the front page. Always have a link back to the front page. Put the search in an abvious location. Don't put popup menus. Clearly identify categories (a la slashdot with icons...). Provide an alternate page for dialups, with less graphics (or simply for text-only browsers). DO NOT try to put everything on the front page. Remember that not every one has high res 22 inch screens. this site looks freakin great on my screen but looks like crap at my friend's place. It's simple and it's got style. But it's not for dialups.
The important thing is to keep the end user in mind.
Imperium et libertas
Autocracy and freedom
Compare the web sites of companies that make their money on the web (Google, Amazon, etc) to companies that make their money off the web (Ford, Pepsi, etc). You will notice how the web-based companies have sites that do not use Flash, big images, or anything else that makes it harder or slower to read their sites. The companies that make their money off the web will typically have sites designed by their marketing department to include the "coolest" features possible, regardless of how hard it makes the site to use.
One wonderful IE feature... MARQUEE tags
message goes here
(try it)
-- Note: These Comments are Generated by ME! Not You! ME!
- they have no
idea what good art is and have never
taken any courses to find out, and
- they have never
taken courses to develop their artistic
ability.
Education is essential! We need more professionals and fewer pretenders out there.If for info, then Keep It Simple Stupid. Don't use javascript. Keep graphics to a minimum. Make sure it works with image loading turned off. Make sure it works with text browsers. Don't use image maps. Keep pages short with clear links up and down. Better to navigate 5 simple pages than two complex pages. If a page of links won't fit in a single page without lots of scrolling, consider breaking it up (intelligently).
K.I.S.S.
If for entertainment, I have no advice for you. Entertainment sites are meant to entertain, so I reckon Flash, javascript, animated gifs, audio, and all that stuff, well, it's sort of expected. But when go to a business or info site, I want speed and accuracy and simplicity.
Infuriate left and right
useit.com. It's a great resource for usability information, including a lot of stuff on web usability and design.
Whatever you do, don't make it look like this. I've never seen a website that said so much but left me wondering, "What the hell is it that they do exactly?"
http://www.absurd.org Personally, I think one of the worst things a Web site can do is use a lot of stupid icons and horrible color combinations and post a lot of disinformation and dumb polls where one of the choices is Cowboy Neal. Sites like that really piss me off.
Personally, I like Slash. What's that? You say your website isn't an interactive forum? Oh, dear.
Secession is the right of all sentient beings.
If designers fawn over a website, it probably sucks. Sure it's pretty but where the hell do you click to go past the flaming logo on the tunnel page? Once you decide on a design, make yourself some templates to use for additional pages within the site. Consistency is key. Think more like google.com and less like foxsports.com
Free Porn!
Sorry, I couldn't help that one.
But really, easy to use navigation.
Lots of information rather than image driven.
Try to keep the site from becomming like an onion. (Layer after layer...)
No popup/popunder ads
Try to keep the images to 20k or less.
Keep it simple. The more whistles and bells you add, more chances the code will break on someones browser.
Spelling. Try to spell check yourself.
Keep the colors simple and contrasting. There are color blind people that surf the net.
Keep the animations to a minimum
Post the size of large files next to the links
Just a few of the top of my head.
-Goran
Carpe Scrotum - The only way to deal with your competition.
Keep it simple. Its that simple.
Ok, thats not really all there is, but its a big part.
Simple, clean, easy to read websites are the best. Too many web sites over design and fill their pages with flashy icons, images, links, etc. and poor color combinations. The result is the main content gets lost in a mess of stuff. Simple designs with links down one side (or sometimes both) and the main content taking up the majority of the screen. Slashdot is an example of a well designed website. When the page loads you are immediately drawn to the main content. This is good. An example of a bad web site is Excite.com. It is way too cluttered and when it loads you have no idea what you are supposed to be looking at.
Simplicity is a good thing.
Never forget thet "KISS" Keep it Simple, Keep it Stupid.
A good website have those feature:
- Appealing
- Simple
- good content
- Fast
- Not overload
I know it can be fun tro try new technology or soime 'coo' feature, but remeber that a good website doesn't need a heavy Java Applet that do a 'water reflect' of a pic. Keep your site user friendly.. and alway do a 'light' version of it. Example a HTML link to 'Skip' a flash intro.
Never assume for your visitor. If you use IE/Netscape it doesn't mean that all your visitor will.
Remember KISS the Web !
"Tui Nati vulnerati."
If you're target market is the general population, most of your users are connecting at dial-up speeds. Flash, animations, etc. may look great in your development (LAN) environment, but take forever to download to a user's PC. Take a look at the page design at Yahoo and Google. They've taken a minimalist approach that downloads / renders fast and is still visually appealing. On the other hand, it all your users are on a intra-net, or have broadband - ignore this message.
[Insert pithy quote here]
It really depends on who you're targeting, and on what your content is. A personal homepage with a bunch of family pictures is going to have different requirements than a site where you're trying to show off your Flash skills in hopes of landing a new job.
Jakob Nielsen's useit.com is a highly regarded source of information on what makes people's browsing experiences enjoyable and worthwhile. Generally speaking, Jakob advocates designing sites so as to make the user's experience as painless and "friction-free" as possible; some specific recommendations would be to try and design your site so that it doesn't require specific browsers, resolutions, or plug-ins to operate properly. If you want to keep people's interest, page loading times should be under 10 seconds, which places limits on how big your graphics will be and how many of them you'll have on a page (somebody has already mentioned remembering people on 33.6 dialup connections).
On the other hand, I've seen some amazing sites that were pure eye-candy. In that case, having a specific browser and/or plugin (usually some version of Flash) was an absolute prerequisite, and nobody minds because the animations on such sites push the envelope of what can be done with current technology, so it's understood that the "latest-and-greatest" stuff is required to view them. Few if any of them are practical; they're just fun, so it's OK to break the rules.
Good luck!
Slashcode!
(or is it Slash code?)
You get the funny.
1) Go to this website.
2) Do everything the exact opposite.
Now let's see how many people here have a sense of humour...
I'd suggest reading Jakob Nielsen's Alertbox on web design, not only the current columns but past ones, too. Some columns like The Top Ten New Mistakes of Web Design are definitely worth reading. It's a couple years old, but people still make those same mistakes.
Besides not falling into the trap of flash without substance (pun intended; Flash is frequently useless for most web sites), keep in mind that people have come to expect certain things from how web pages work. It's nice to have an inovative design, but if it's so far outside the norm that no one can figure it out, people aren't going to use it.
For example, for web commerce, you may not like Amazon, but their site has become the standard for how people expect to shop on the web.
It is said that most people wont wait more than 30 seconds for a webpage to load...
I've seen many webpages loaded with stuff to make it "nicer", I bet coming up with a simple attractive page is more challenging than a robust and attractive webpage.
Though the term "attractive" could mean different to different individuals: "Beauty is in the eyes of the beholder", so a webpage should be designed to it's public.
Simplicity is best. Trying to align all your graphics, fit your text in the right little boxes, etc. just makes for ugly display with the wrong-sized font (and don't ever hard-code the font size!), and makes it impossible for folks with blindness to read it. Simple is best.
Avoid JavaScript (and any complex client-side functionality) like the plague. It's fine to use JavaScript, but realize that it won't work on someone's browser (I can't count the times "JavaScript Error" appears in my browser's status bar on professional sites) so you'd best provide an alternative.
Those are my pet peeves.
Read the Apple Human Interface Guidelines (available as a pdf from their website), think of what they argue like, almost all they say is reasoned and explained.
The only reason this is not already obvious to You is, that there is so much crap out there.
Yeah, and be cross platform (as in speech, not as in marketing lingo). The last time I had to work with that I stuck to what was rumoured to be the most standard compliant browser, though (no, that is not a Microsoft Product, but IE 5 was just tweak away from there).
At no point should your design impede the dissemination of information. If someone wants to look at pretty pictures they can go to an art gallery. That said, your website should be pleasing to the eye, but in a way that makes it easy to navigate and read... not in way that makes art students drool.
Also, please take the time to test your website on multiple platforms in multiple browsers, you may or may not be surprised at how easy it is for your amazing design to be rendered completely useless by some browser's crappy rendering engine.
While everyone here will cry about it, you can make a better website by focusing on the 95% of the web who use IE 5.0 or greater. The same site, supporting all browsers would be a nightmare to maintain and test.
Ive always been fond of turquoise headers that mix to form a slightly retro/weird modern look... hey kinda like this.
--aiee
try slashcode!
"If a quarter is two bits, then a dollar's a byte." -R Deric Miller
kfjasjflka
Never (and I do mean never) steal graphics from another site. I used to work with a "designer" that did this kind of things and it caused us some problems. It's OK if you see a good design and create something similar. but as soon you are using someone elses pixels you don't deserve to be called a web designer.
If you use flash don't use it to display important data. Flash should be used in such way, that you can't really tell if it's flash. Use it for eye candy - but not too much.
- You also don't want sites that do not display well (or even worse, crash) in some browsers. I don't say you have to support every netscape version up to 0.7, but there really *is* a world apart from Internet Explorer 6.
- Make it fast. If you really want to cram your site full of gizmos, be sure to provide an alternative version for people who haven't got an OC30 directly connected to your datacenter.
- Do not annoy your visitors. That means: No pop-whatevers, no "If this banner is flashing, you've won a monkey to punch"-type of stuff. I also don't like pages with sounds, like the "cameron diaz ad" on kazaa, or even the embedded mp3 on mobistar's page. (Mobistar is a Belgian GSM operator).
One thing I think is really cool is the site of URGent, a Belgian student radio, where you can choose between several designs. The content is drawn from a database, and the designs range from a "lynx" theme to heavy graphics. (And I've heard there's a "kde-like" theme under way)...
The more compatible you want your site to be the more you'll have to pour into compatibility coding.
As a rule og thumb I generally design for Netscape as there are fewer problems that crop up when the same page is viewed in IE.
Keep your styles limited to ones that operate the same over different browsers.
You'll find that macs and PC's show font sizes with much variation. My solution was to create a perl script to gather browser info and spit out a style sheet for that partuclar browser so that the font sizes and colors will be the same on multiple platforms and browsers.
Keep it appealling, but don't over do it. The only way to gauge what works and what's overkill is with experience.
Above all go to various sites and see what is functional and what is not. A site may be pretty as hell but impossible to use from a practical standpoint. Likewise a site may be wonderful to use but boring to have to sit through. Let your site's purpose dictate which way this should lean.
A portfolio site might do well with more graphics while a site on programming would do better with mostly text.
Whatever you do, just keep it functional first.
1) Do not attempt to control every aspect of the display of the site in the browser of your visitors. This is not the purpose of HTML.
2) Create a site that is standards compliant. Please note that doing this requires adherence to 1.
3) Hypertext is an excellent manner of displaying and linking information. Keep that in mind. Information.
4) Proprietary inclusions such as Flash should be segregated from the main of your site, and identifiable as what they are.
5) There's not much that Javascript does that you really need. Honest.
6) Newspapers use narrow columns for a reason.
7) Sarif fonts are easier to read in column-form than sansarif fonts.
l
I browsed a handful of sites featured on the mentioned 'wowwebdesign' site, and frankly, I think the criteria is in question.
When I go to a website, there are a few things that will immediately piss me off:
If I have to resize my windows to view the page properly... I ration out space on my desktop right down to the pixel... if I have to resize the window to view some big page layout, I usually decide not to look at the page at all
If there is a pop-up anything... pop up ads are infinitely more annoying than banner ads. Why can't people take a lesson from Google, and their text-only ad policy? Also, if I click a link on your page, and you force my browser to launch a new window, I'm outta there. (I've always wondered why my browser can't disable this feature and just replace the current page with the new one ALWAYS)
Sacrifice of useability for artistic masturbation... if you find yourself thinking that you've just GOT to use that flash animation, or animated GIF, or whiz bang javascript, first do everybody a favor and ask yourself if it adds to the useability factor of your site. chances are your visitors are a lot less impressed with those gadjets than your are.
Not only do these things annoy, if you keep things simple you will have more time for content, which is all most of us are really concerned with anyway. Now that I've opened my fat mouth, I'm sure everyone will go visit my site and proceed to rip me a new one about how it could be better *grin* (feel free, btw)
First off, Ebay (no link provided) is the ugliest site I have ever had the displeasure of viewing. An example of functionality with completely minimal and ugly aesthetics.
An example of a website that looks really, really sharp is:
Morimoto
It's the restaurant owned by Iron Chef Japanese Masaharu Morimoto (and his partner, some big restaurant guy whose name escapes me). Don't be fooled by that frightening animation with that scary looking woman on the front; it's actually a very nicely designed site.
Also, as far as interface goes (which seems to be the only thing I have any information about), the new SAP R/3 6.10 GUI has a really, really nice design to it. Unfortunately, I can't seem to find any screenshots of it, but if you do manage to get a look at that software, it's pretty good stuff.
no sound; not much animaition; very little scripting; and easy to read (black on white) text.
sulli
RTFJ.
One thing that I think is very important is to make sure your page is at LEAST readable and USABLE on ANY platform and ANY browser... there's nothing as irritating as a site that just WON'T work. Use javascript if you want, but make sure your webpage doesn't rely on it, java is OK but make sure your code is compatible with the SUN java VM and not just MS java VM ow and use flash if you want, just make sure you have an alternative, is hardly any more work, and people will love you for doing it! I think that would be about it ;-)
ow and make EXCESSIVE use a lot, you can't alt enough... I kind of like using lynx from time to time, defenetly when I am installing software on on a remote server through a SSH session.
Fighting for peace is like fucking for virginity
Having a look or theme is important.
You have to define it and keep true to it.
It's more than colors, fonts, and sizes.
It's something you cannot teach
The only design that works contains the following:
.Gif icons (a must: apply a drop-shadow filter with Gimp or Photoshop!) .sig to advertise their business/website
/.!
[] A teal color scheme
[] Black text on a white background
[]
[] A plethora of spelling and grammatical errors; otherwise, it will look like some type of machine is running the site rather than a genuine dumb human being
[] The ability to add users
[] At least 40% of all users must troll
[] Allow them to have a
[] Commenting capabilities
[] Comments must be rated as an integer value with 5 being the highest and -1 being the lowest. In special cases, incessantly naughty trolls can be bitchslapped into a -2 blackhole.
[] First post is life, the rest is just details
[] Moderating capabilites
[] Posts may be moderated an infinite number of times. Even if every rating is used a handful of times on the same comment, it should be rated as whatever adjective the last moderator thought it deserved.
[] Ultimate goal: build a large enough user base so that you can post links to sites you yourself hate on the front page and watch those sites' servers go up in smoke in a little under five minutes
This is meant as a joke. I love
:-)
When you ask a question like this, people are going to tell you 1 of/or 2 things:
1. The specs for a good site. Such as file types, plug ins, hi/lo bandwidth, etc.
2. What doesn't make for good web design. Most everyone can look at a site and say "This is bad". Even fewer can look at a site and say "This is what makes this bad". And the fewest, smalllest group of people can look at a site and say "This is what makes this site good."
Good web design is, like any design, very open to interpretation. Although bad web design is a much easier subject to discuss.
Th
Personally, about 95% of the pages I load are shit. They load, but they either look like ass or have a very, very pissass poor information layout.
You should prioritize the following:
1. The code needs to be simple, as does the design- your page needs to load on everything. I've stopped bothering with Netscape 4.7 (layers! Gah!) but make an effort to make sure my pages load on Mozilla and Netscape 6, which requires effort for the fact that they both really hate multiple nested dynamic tables.
2. I'll get a "redundant" for that one, but I haven't seen this mentioned yet- The actual Information Design needs to be clearly thought out. What are users coming to your sight for? What do they want? Design your site to make whatever that is easy to find and quick to get to. You should be more concerned with the actual FLOW of your DATA than of your design- the form, naturally, follows function. If I have to run a search to find something that should be on the front page or part of the static navigation, or if running your URL through Google gets me somewhere I couldn't find, you've failed and need to take the class again.
3. Stay away from plugins. All Shockwave and Flash do is eat your bandwidth- not everyone has the latest version of the player, not everyone has the bandwidth to pull a 500k splash page, and most importantly, not everyone actually likes flash. All depends on your audience.
Beyond that, it becomes personal preference. I run at 1024x768, but my browser is a window that's about 700x400 - I hate browsing fullscreen and am not fond of pages that either force my rez or require horizontal scrolling. I also am strongly against audio elements in pages, and useage of flash if I notice it.
So build small- both in graphic file size and minimum physical area of the page. Build simple, so it runs on anything. Design minimally, so the user isn't overwhelmed with a wall of links and options and gets lost. And bottom line, keep in mind that no matter how clever you think your design is, 90% of the people using the web are idiots.
1) Are you selling a product or yourself?
If you are selling a product, keep it simple. Flashy shit, while nice as eyecandy, inevitably will cause problems with SOMEONE's browser out there if they don't have installed/activated the plugin that you require and then you've alienated a potential customer.
Also, make good use of the title tags. Put the page name AND COMPANY OR PRODUCT NAME in it, and not "Home" or, worse, "Untitled Document". Think of how you want your bookmark in their list to look.
Is second only to content in terms of importance.
The best place to start:
www.useit.com
Also, check out Jakob's book Designing Web Usability . The importance of usability cannot be overstated. If the website is not immediately useful to surfers, they have millions of other pages to choose from.
Step 1: decide what you are communicating
/., since most of us can't even spell).
Step 2: decide who you are communicating to
Step 3: communicate to your audience
Step 4: DO NOTHING ELSE
The genuine purpose of most of the web is communication; once you've accomplished that, don't waste time, bandwidth and screen on anything else.
If you're having trouble with #3, maybe you should be asking questions in a writing newsgroup or something (but definately not on
second society
Make up a smart ass question and post the link...
Web design is information design. Overdesign will make the user loose their way, underdesign will look bleek and unprofessional. Your design should package and sell who you are so obviously there is no single design palate thats going to work for everyone. Ask the people who are going to use it what they want and what you could improve on. Dont use a ton of fonts and colors. Make it easy to get anywhere from any page. Use HTML text instead of graphical. Keep your page size under 50K-80K. Good design comes from a good original idea, you arent going to get one by looking/copying other web sites. Try exploring another media (tv, movies, print) to get a fresh idea for the web. Dont make your fonts too small (too hard to read), but dont make them too big (too much scrolling).
A web design blog.
A web design blog that looks like total shit.
Great.
My personal favorite example of good web design is Baseballreference.com. The layout is very clean so that the information is easy to digest and the pages are reasonably sized. It has a good search engine so that the information that people want the most doesn't require a lot of clicks to find. Just about everything that can be is made of pre-processed static pages rather than dynamic ones, which (together with the lightweight layout) makes it very fast. Most importantly, it really makes use of html. The information is densely hyperlinked so every page makes it easy to get to related information with one click. It's an incredibly useful site that's become a standard internet reference, and a lot of that is because it's well designed to make it easy to use.
There's no point in questioning authority if you aren't going to listen to the answers.
If you are making a site of any real importance do not use server side crap. Keep it simple HTML so that every one can use it AND it can be archived. If it is important enough to do right it is important enough to archive and made "real"
As a web developer, the primary difference for me between designing for the web and designing for any other publishing medium is liquidity. You never really know the size of the browser the user's going to be viewing you in, so you better make damn sure your page flows correctly to fit.
Nothing makes me madder than having to scroll back and forth across a web page because some idiot figured that since the site looked fine in his maximized browser on his 1024x768 display, he could hardcode the tables to be 1000 pixels wide and no one with have any trouble with it. Other than people using too much superfluous flair for its own sake, I think this is probably highest on the list of big problems designers make.
Take steps in the beginning of your design process to avoid the problem. Start using the percentages for widths in your table tags. Start using the ALIGN and VALIGN attributes correctly. Don't rely on FrontPage to position things for you with style properties, instead put them into properly formed table tags with the alignments set right so that the page flows when it's resized.
It really does make a huge difference.
This tagline is umop apisdn.
Troll maybe, but he does have a point with all but the goatsex links.
:)
Design is kinky has some great visuals that pull you in and make you want to view everything there is to offer.
Eimod is a nice clean layout. It's easy to find your way around, it's got some great articles and is visually impressive.
And I've got something to do with it. Snoogans
You've got mail. Pattern baldness. - Crow
-"I seem to be having tremendous difficulty with my lifestyle." - Arthur Dent
1) Doesn't make your browser crash.
2) Doesn't take 5 years to load.
3) Isn't crowded with banner ads, worthless graphics, annoying animation.
4) Doesn't have -5 pitch fonts that no one can read.
5) (short answer) is HTML 1.0
Wow Web Designs, maybe, but if they're gonna get slashdotted showcasing such great web sites, you think their ISP would be Wow Web Bandwidth
Just Read and follow these and you will be OK
http://www.tuxedo.org/%7Eesr/html%2Dhell.html
-"The early bird catches the worm, but the late bird sleeps the most"
If I wanted your website to make noise, I'd like my finger and rub it across the monitor.
son of a bitch
*must pay attention*
the people wander around and suppose, while the secret sits in the middle and knows.
...it was suggested that all information should be reachable in 3 clicks or less.
But I suppose it would depend what content you were providing, as well as who your intended audience is.
See gnu.org for that great 90s look.
it's best to approach design from the perspective of the user (take a step back and put yourself in their shoes)
what do they want? where are they? what are they using?
if you want simple tenets of design,they're commonly summarized:
- speed of download & page rendering
- compatibility - no negative experiences!
- no more than 3 clicks to any piece of information
- don't make it necessary to scroll for essential information
- always give people a 'back' option - don't trap them on 'dead ends'
- no more than 7 +/- 2 choices on any page
- search and/or sitemap for targeted inquiries
very likely more, but that's a good start (and should keep you busydon't search for 'great web design' instead, search for 'usability' and try to find a critique that deconstructs some of the same types of site that you're going to build (e.g. no need to read a detailed critque of yahoo if you're not building a web search/catalog).
the most important thing is to realize the scope of your site/vision before you start. if you get frustrated/bored because you planned something grandiose and it's taking you years to build, then by the time you get around to filling it up with content, your content will suck.
be disciplined - plan out the 'dream site' then whittle that down to what's realistic - step back and make 'release 1.0' and implement the more disparate features/content in future releases. it will help you keep your content up to par with your coding & design, and give people a reason to come back again & again! do you think people read slashdot because they like GREEN and it's easy to navigate? ;)
www.pixelectric.com
This is just an example, of course, but perhaps sears (and the like) should think about _why_ people would come to their website. All the fluff in the world won't mean anything if I as a consumer don't find what I am looking for.
Its impossible to tell you what good webpages are, but its easy to spot bad ones.
Good reference.
http://www.webpagesthatsuck.com
Rob
Good web designs are best viewed in any browser, including Lynx.
OSWD.org
"God fights on the side with the best artillery." - Napoleon, Marshal of France - speaking truth to power
Keep it Smart and Simple (There are other versions, I know, but I'm gonna use this one) I've been on projects where a web designer was needed and he just had to show his stuff and used every technology under the sun of a thousand systems. It was horrid. The only web browser that could use it was IE for windows (And the main target audience of the product was NOT the windows area) and it took a good minute to load on my Cable line. If you don't need to do it, don't. You don't need to have the links of the website be redirected through something else so download managers can't catch it or some web browser will show you the zip file in the web browser (I.E. the text you'd see if you opened it in a word processor). You don't need to make the page refresh it's self 5 times between every click so you have to do rapid fire on the back button to get to the page you were just at. A simple link to the site it's located on will do just fine, no redirection needed.
(Score:0, Interesting)
It's a long story, but for various reasons I have to buy Eukanuba Lamb and Rice food for my dogs. Unfortunately, my wife and I just moved to a small town, and we haven't been able to find any local dealers. This is a big deal to my wife; she wants her pups to have the food that's best for them, to the point of asking me to find a place on the 'net to mail-order it.
The obvious first place to look seemed to be the food's web site at eukanuba.com, so I went there to look for an online order page, or still better a dealer locator. However, all I can see on my browser (Mozilla 0.9.8/FreeBSD) is pink mess with some Javascript rollovers that are supposed to create navbars, but just make ugly chopped-text buttons at random places on my screen. A Google search revealed that Eukanuba dog food is made by Iams, so I tried their site instead. Too bad for me - it's the exact same design.
Although I know that I'm using a minority browser, I'm pretty sure that if I can't render the page, then most Netscape users will have problems as well. However, the idiots who designed the page are probably the same idiots who look at the server logs and tell their bosses that Netscape users suck, because they never even go past the entry page.
The end result? Eukanuba can't be bothered to make a website that I can use to do business with them, so the $!()@ mutts are eating Old Roy from now on. Thanks, Iams. Your disregard for your customers just saved me quite a bit
of money.
Dewey, what part of this looks like authorities should be involved?
If you're going to have a complicated DHTML / Java / Flash / whatever site, I'd suggest also having a bare bones site. I don't have a browser that supports Flash and I've been shut out of countless sites who just assume everyone has Flash. Granted, most people do, but I come from the school of thought that websites should work for everyone, not the just Microsoft majority. Also, if you're going to use a Flash intro, for the love of God have a "skip intro" button in the HTML.
Also, what about skinning your site? I just redid my entire site to work with different skins and it's very easy to do if you keep the content seperate from the actual design of the page. You could try XML and XSLT for that, or you could just do it with a decent backend. I don't have the most beautiful site, but I can change the appearance of it in under 5 minutes by changing 1 line in a config file and then adding the skin.
Style sheets and included files are wonderful. I'd highly suggest using them because it cuts down on the time it takes to update the site. But don't go overboard because it could eventually slow things down.
I despise frames, for the most part, because it makes it difficult to link to different pages. If you have your navigation in a frame, make sure if someone links to a frame directly that they can still navigate the site. You can do this by having a navigation footer or something, or by using Javascript to check and then redirect them to the framed version. But again, I warn you about relying on Javascript.
As many people have already said, content is the most important thing. Don't try to fit your content in a pretty design. Design the site to work with the current content. It will save you hours of agony.
I like google because it loads terribly quick which comes in handy if you use it once every hour and only spend 10 seconds on the page itself.
If, however, I were to visit a website once or twice a month/year and I don't need a lot of information in a very short time period (let's say for example lionhead studios though I prefered their previous lay-out) I don't mind looking at some nice flash, some fancy java applet or whatever it is with which they try and attract my attention.
So I reckon Flash and Java and whatever more you can think of (if it works of course) is ok as long as it doesn't bother me. Try to make an educated guess of how long your average visitor is going to spend on your website and then try to come up with a good mixture of beauty and usability
(please note, these views are not entirely mine though I must admit I lost the source of my information, also note that my only experience with web-design is Phicus so I'm not really an expert)
"We live in our minds, and existance is the attempt to bring that life into physical reality" Ayn Rand
I have been doing web design pretty much since the inception of a viable online presence for major companies, and the #1 thing I have learned is that you have to find the balance between designing from a designer's standpoint, and designing from a user's standpoint. Users are not designers, and the cooler it is for a designer, usually the less it serves the user (unless the users are designers).
Get to know your user. I have worked with many designers better than myself on a visual level, and have had my designs chosen over their (much cooler in my opinion) designs simply because I designed for the target audience, and not for the sake of my own skill.
This book by Jakob Nielsen & Marie Tahir is an excellent look at wesbite contruction. They take 50 sites and literally tear them down pointing out what is good and what isn't.
. htm
Their homepage shows which sites they look at including ESPN, Gateway and Microsoft. Their comments on the sites are priceless: http://www.useit.com/homepageusability/
This is a part of the web design process that I don't think many people think about.
We did a review here: http://www.compunotes.com/BookReviews/homepageuse
When browsing the web, make a list of all the little annoying things about other web sites. Background music, no contact information, bad color schemes, too many graphics, poorly defined links, no coherent structure, all flash (or Flash) and no substance, etc. Pay particular attention to issues like page loading, accessibility of information, and ease of navigation. You want people to be able to find information on your site (unless you're a sadistic bastard), so think about what information your site's visitors will be looking for and make it easy to find. Avoid large graphics in your pages (link them to thumbnails) and load up on descriptive text (including ALT tags). Test in every browser you can get your hands on - some browsers tolerate mistakes that could cause others to choke.
well, as expected there was the typical "if you can't view it in lynx, then it sucks".
i can agree with this on certain types of web sites, but what you failed to mention is the nature of your web site.
the nature of your statement should be reflected in your design. for instance, lets say you have site about something really geeky and you are expecting *nix-based users to access it. then, sure lynxify it.
if you've got the worlds most amazing product that you are advertising to a bunch of beer drinkers or whatever, then have stupid animations and porno backgrounds and annoying midis playing.
otherwise, if you are serving a general audience then clean, neat design with WELL ARCHITECTED INFORMATION. this means logical menu structures - don't let people try and find things, give them what they are expecting to find.
the other question, of course, is to flash or not to flash. personally i'm no big fan of flash intros. every time i see one i click on "skip intro". unless of course its nike.com or something that i expect wow, oooooh, aahh from.
ok. conclusion. profile your audience, put yourself in their shoes/browser and do what you think they would want.
1. World Wide Web Consortium is thy God. Thou shalt have no other gods.
2. Flash is evil, and of the devil. Flash is blaspemy.
3. Javascript can be useful for on-page functions that don't necessarily require a server call, but remember your page still still fundamentally work with no javascript enabled.
4. Images should be used for illustrative purposes, not to show you found a neat image and *never* as a background.
5. Images should be small and reduced to webpage resolutions.
6. Content shouldn't be laborous to read. Black on white text is the best, but at least always make sure to use contrasting colors.
7. Style sheets should always be used (see number 1) but make sure that necessary style pairings (such as colored tables and the text within) are defined in the same scope. A page-declared table color and text/css file declared table text color could cause problems if your style sheet file doesn't load.
8. Design for non-compliant brower protocols *only* if your business depends on it. Private sites should *always* be written to the HTML specs (see #1) all browsers be damned.
9. Do not covet they neighbors hyperlinks. Links should be used in *context* and not in a random listing. Don't say "you can find a link about greyhound adoption *here*." Instead, write either "There is a lot of information about *greyhound adoption*" or "*Greyhound Puppies Inc* has a lot of information about greyhound adoption." All of this results in a page more useable by non-traditional browsers. (see number 1)
10. If you change the color of links, you should make sure that the default colors (blue, purple, red) will show up on your site. Another reason not to use picture backgrounds. Also, don't ever *ever* reverse the color scheme... cool (blue-like) colors for unvisited links, purple or red-like (hot) colors for visited links.
yes, I think you've discovered the fundamental problem in all web sites! Designers have been too concentrated on creating their web sites and not on designing their users! --Gosh, i have all of this content... if I could design the perfect person to view it, what would that person be like?
"Things should be as simple as possible, but no simpler"
I think you should stop looking at other websites and stop thinking about how you are going to code the site. And concentrate on the content. What are you trying to say? Who are you trying to say it to? These are questions which most people who design websites breeze over, and yet these are the core of any good site. You can make the best and most usable navigation in the world but if the content is no good then who cares.
Look to design history books, architecture and industrial design to learn the real lessons of design.
Frankly, I think you're asking the wrong crowd.
Of all computer users, the Linux crowd is the least qualified to comment about design. Oh sure, there are exceptions, both among Linux users and among Slashdot readers, but just read the comments that have already been posted. The common thread is that people wouldn't want to sacrifice content for a flashy web site, and that just shows their ignorance. These people don't realize that good design does not involve compromizes. Good design is about presenting the content in such a manner that the appearance enhances the content presentation, not distracts from it.
Besides, look at the state of 99% of Linux software, especially the open source stuff. User interfaces are the last concern of the developers. It's obvious to me that the majority of Linux developers and users really don't care, or just don't know anything about, good design. But, I guess I should cut them some slack, since it's very hard to be a good programmer and a good designer. Yet I'm disappointed that most developers don't try to get good design ideas from others.
So yes, Virginia, you can have your cake and eat it too, provided that the web site is designed by a real graphic designer. Such an individual has both training and experience in creating designs that work.
And the men who hold high places must be the ones who start
To mold a new reality... closer to the heart
Black text, white background, all images with appropriate tags on them. Links whatever color the browser renders them at by default.
:P )
Advantages: Easy to read, readily accesable, everybody is happy.
Cons: You don't get to show off your m4d Java/Flash skills.
Some of the sites that I stay at the most have a very nice KISS policy. (Keep It Simple, Stupid. Oringaly said to be posted in the main work room for a bunch of airplane engineers.)
At the very least, do NOT use dynamic page serving for STATIC pages. Please. I beg of you. Do _NOT_ dynamicaly generate all of your pages just because it may make future site changes easier to implement.
If you REALLY need to change the site two or three years down the road, then use a web page pre-compiler that will allow for you to change the style of your website before hand.
Most sites just have news updates and an occasional article posted. There is NO NEED for you to dynamicaly generate every last little bleeping thing just to make the occasional news update easier.
(and no flaming text either.
Need help treating your acne? Come here!
I remember seeing this years ago and it definitely had a huge impact on any web pages I created.
Just look at the most popular web sites on the web for your lead. By doing this, you will soon realize, a good site has: a plethora of pop-up/pop-unders, at least 2 new windows on closing the current one, spam advertising to ever known email address in existence, and lots and lots of boobs. It's a simple formula, boobs = hits, ask any teenage boy.
"Information wants to be expensive" - Stewart Brand, the same guy who said "Information wants to be free"
According to this, the key to good e-commerce site design is that it should be as easy to buy something from your site as it is to walk into a 7-11 with a $10 bill and buy some milk. I think it makes perfect sense, as there are way too many sites which make the process of buying something so friggin' cumbersome that you just give up and go to the next vendor.
In case of fire, do not use elevator. Use water!
I think you should stop looking at other websites and stop thinking about how you are going to code the site. And concentrate on the content. What are you trying to say? Who are you trying to say it to? These are questions which most people who design websites breeze over, and yet these are the core of any good site. You can make the best and most usable navigation in the world but if the content is no good then who cares.
Look to design history books, architecture and industrial design to learn the real lessons of design.
...but use CSS!
/> etc. not too difficult to do.
How many sites still use the <font> tag, etc? There is no point.
And use xhtml, <br
Not bad, not bad, but it commits the sin of forcing side scrolling. Open that puppy up at full page on a 640x480 machine, and you have to use the bottom scroll bar. True, I know of almost no computers that are set that small, but it does happen.
I would also argue it is a slippery slope type of thing. Today, it is people running at 640x480; tomorrow, anything less than 1280x960 has you using two scroll bars.
Let the CmderTaco's of the world unite!
Jesus was all right but his disciples were thick and ordinary. -John Lennon
Who are you making a web page for? How will they view your web site (bandwidth, browser, etc.)? What information are they looking for?
Make sure it's quick and easy for your target audience to get to the info they want. Make sure the site renders correctly for all platforms you must support. You should design to the lowest common denominator.
If you don't know who the page is for your question is pointless. What's the best kind of car? Well, what are you going to _do_ with it? Pack it full of equipment? Drive around and look cool? Race off-road on the weekends?
I believe it depends on the site. For our site we went for fast loading and clean layout. We used text for most everything and optimized images to the max. We also followed W3 standards although I do believe a couple small errors have found their way into the page.
Tips to appease your Mac audience
Other general Tips
Good site, eh?
:)
This new site is good!
Clean, minimal design, plain tables (no bitmapped layout), clear arrangement of content, standard HTML, no plug-ins, fast-loading and resizes to any browser size.
And it's full of trance music imported from Tokyo in the future, which makes it extra good.
Although many usability experts will tell you that information is key, and barebones, functional sites are godlike, this is not always true. There are at least two categories of websites, grossly simplified as "Business" vs. "Art".
If you site is information and function oriented (e.g. an intranet, extranet, or product information page) then usability, clarity of information, etc. are very important.
However, there are some sites (for example, sites for movies) where the experience on the site *is* the purpose. The site may be as much about dazzling you with effects as it is about letting you find out who is in the movie.
By and large, "Business" sites should be clean, clear, and designed to convey information and function like the majority of good sites out there. Don't make the user have to figure out what your section names mean--use "contact" for contact, 'search' for search, etc. No section names like "The Fish", "The Gun", "The Smoking Barrel".
But if your site is about the experience of being there, then go crazy. Get funky. Make the site explorative.
www.
google.
com.
Liberal (adj.): Free from bigotry; open to progress; tolerant of others.
A consistent layout and a good colour scheme's all I look for.
That and I feel like rallying a lynch mob every time I see a site that uses Flash.
1. It shouldn't take more than 3 clicks to get to anything a user is looking for.
2. If you're selling something, make it easy for the user to buy it. Don't have a "Click here for more info" and then a page that says "Click here for pricing" and then one that says "Click here to add to the cart" and so on.
2.a. Always, always, always make it obvious EXACTLY what the user is getting for their money. Show shipping/handling charges. Show a contents list, etc. You would be shocked at how many sites don't do this.
2.b. Always show the user exactly how much they're paying before asking for payment info. Again, you'd be surprised by the number of sites that screw this up.
3. Big images = bad idea, unless the user specifically requests them. A page shouldn't be more than 40-50k on average. I've seen really clean sites that are still graphically interesting that weigh in under 10k/page.
4. Sound. Don't put midi-sound loops on your site, unless they have a purpose. First, they're almost never original, second, they're annoying as hell, and third, no one, and I mean NO ONE ever wants to hear them. Ever.
4a. If you must use sound, keep it short, sweet, and clean. And give your users an obvious way to turn it off.
5. Flash - it can be good, for some things. BUT! If you're using a flash intro, make sure the user can skip it. If you were going to give a sales presentation and the prospective customer cut you off saying "I wanna buy," would you tell them to shut up until you were done? Same thing.
6. "Cute" javascript. Don't ever do anything screwy with my pointer. Ever. I don't want little stars, or a message trailing it. I went to the site of a local software dealer, and he had a little text trailer on his pointer that said "Jesus loves you!" I didn't buy - I'm jewish, and don't give a damn who Jesus loves, especially when he's loving me via a trailer.
7. Non-functional scripts. Make it clean, make it work, make it good.
8. Forms that require stupid information, or information in a stupid format. I should be able to enter in my phone number in any format I like, and the validation scripts should deal with it, as long as there are 10 digits (for the US, at least). And I shouldn't have to enter irrelevant info - if I say I'm in Chicago, Illinois, I shouldn't have to specify that I'm in the US and so on.
9. Scrolling. My ideal website would not scroll, ever. Generally, if you need to scroll, you're either trying to communicate far too much, or you're saying your message far too verbosely. The web is not about full on essays - it's about word-bites. Short, sweet, to the point text that conveys info is it.
10. Focus. They say that the average person does 50 things in a given day, only 1 of them well. The successful person only does 2 things, but does them both well. Same with sites - do one or two things, do them well, and all will be great. Do too much... and it'll suck.
11. EASE OF USE. Don't hide anything. Ever. If it's important enough to be on the site, then it is important enough to spend the time making it easy to find. Lots of sites screw this up - you have to scroll or wander all over to find "important" bits of the site (you know, like a search function, or the "buy me" button, etc.)
12. Standards. If I see blue, underlined text on a site, it had damn well better be a link. If it isn't, I know two things: 1) whoever made the site doesn't know shit, and 2) I'm not going to bother with anything else. There are certain behaviors people have learned, don't try to retrain users just because you want to try something "cool" out.
13. Last thing - design. For the most part, there is a difference between business and art. Business should drive a business website, not art, and vice versa. I've seen too many business sites get screwed up (but they sure do look pretty!) when the designers decide they want to try something avant guarde. Don't let them. If they wanna make art, let them do it on their own time.
None of this may mean anything, but it might help. For what it's worth, I'm one of the only web-jockeys I know who is still employed, and I haven't had a paycut due to the recession, so I must be doing something right...
I'd say my personal favorite things are:
Consistent graphics - size your pictures to the size you want them viewed at. I went to a band homepage with a 4 meg jpeg. Uh no.
Consistent color scheme - single color background, complementary colors. (Easy to read!)
Poor user interfaces - If I can't figure your site out in 5 seconds, I'm off to Google.
Banner Ads - As long as they are unobtusive, (slashdot) I don't mind. If I find myself in the land of 10,000 banners, I'm gone. Make sure the ones you have are actually geared towards the site's info. eg - Hardware review site=no increase size of my software, thanks
Don't use 900 different fonts. Use fonts and font sizes to set sections apart, not sentences. Don't underline unless it's a link.
Animated GIFs - a personal pet peeve, especially 'Under Construction' digging dudes and dancing hamsters
Please check your links often, and update oftener! Nothing sucks as much as a site that's been dead for 2 years. If it's dead, put a bullet in it and take it down!
Real Audio(TM) - Just say no. I will not use the resource sucking, HD bloating, Info-Grabbing crap, and neither should you.
Test on every browser on every platform you can, not just the latest or your personal favorite.
No embedded MIDI. Ever. Period.
Just a couple off the top of my head...for real examples of what not to do, SomethingAwful has a good selection of sites. Plus, Photoshop Phriday is a hoot!
Enough!
the blink tag
large animated gifs
pop-up banners
javascript errors
a flash intro
a counter
many java apps
a really busy background image
oh yeah, and don't forget the blink tag
Meaningful content and a good way to search for it is where a site actually makes the grade for me.
If all web sites were text, tables, charts, and pics relevant to the topic at hand, that wouldn't bother me a bit. No JavaScript, flash, Active X, applets, or anything else to slow my connection down.
Plain sites with content may not win web site design awards, but I would certainly visit them way more. Google is a good example of that.
Some of the best websites usually have a disclamer like "must be 18 and older to enter"
http://www.kubuntu.org/
Obviously, /. is going to have many different forms of reply's on this subject just cause everyone here wants to make everything backward compatible.
C'mon! live in the now. Without giving up some backward compatability we'll never move forward. (eg: MacOS X trying to move from OS9 and under. It's hard, slow, and gradually they hope that everyone that used 9 and under will move to 10. No more being stuck in emulation of the old).
As a graphic designer, i personally think that flash is the coolest tool around... there is MUCH to be said for ease of use with plain HTML. It all depends on who your audience is.
Personally, for all the people that are going to rip on flash, eat this:
once you have the plug in, Flash is simply one of the most efficient ways to get content over the web with a small amount of bandwidth.
Simple. Straight forward. Vector graphics.
This site is a true style manual focused on design principles. I know you guys have said the basics like no pop-unders, etc.. but that doesn't help with aesthetic and functional designs. Just removes the pet peeves some sites put up. Give it a looksie, especially if you are a web designer.
JOhn
Campaign for Liberty
You've got to look at the context. There's no "standard" for good presentation in any other medium. Why should there be one for web design?
You wouldn't expect a type-specimen booklet from a type foundry be organized the same as a page from the OED. You wouldn't expect a music video to have any visual similarity to the evening news. And you wouldn't expect a Ramones song to make use of counterpoint as if it were a baroque fugue.
Judge each website by it's purpose. A website for a Star Wars movie *should* be designed with a totally different mindset than a news wire site.
-- "The reward of suffering is experience." - Aeschylus
I'm surfing the web looking for content.
I'm not. I'm looking for information. Content is too trendy and vacuous. Content is a word propagated by corporate drones, the kind of people who would sell you a book but never think of reading one themselves.
...after all THEIR site kinda sorta... stinks.
I am very small, utmostly microscopic.
I was wondering what the Slashdot community has to say about web design...
,-. / /
;)
||.||
| |
| |
| |
__ | | __ _
| ' ` ' \
/ |
/ , |
\ |
\.
\_
| |
1) Take a look around Slashdot.
2) Do the complete opposite to everything Slashdot has done.
I see a few complaints on how not to make a site. What people need is more of a structured method to make a usable site.
1) Start with your users. Who are they? Can they be categorized? i.e. Business Men, Students, Computer geeks. Rank them in order of importance.
2) Figure out what each group wants from your site and what characteristics about them make them that way.
3) Organize the hierarchy of the site based on what each group wants, giving priority to the category of users declared most important. Organize your content based on user goals and not the other way around.
4) Design the pretty web pages to fit the hierarchy, choose the interface tools that fit the data best.
(Galeon has a handy disable animation feature :-)
I'm trying to teach myself to set people on fire with my mind... Is it hot in here?
http://www.web-redesign.com
buy the book.
I think all the 3 ranked posts here are good.
you just have to find a functionality, and stick with it. nothing sucks more then a site that does different things diffferent ways across different pages.
keep your navigation simple, and easy to use.
and unless your an amazing pro, don't go near flash. it takes real talent, and real technical knowhow to do it well.
As FP's go, this one is a dud. This one lacks any mention of the key FP insults. Things like open sores, FP d00d, and anuses. Kudos for making a very lonf FP, that isn't done to often. For the love of all things, try to improve your FP so that slashdot may become a brighter and better place.
I give this one a D
[[Ay fukkand lyke ane furious Fornicatour]]
1) Fast page speeds. No page should ever take more than roughly 12 seconds to load on a 56.6 connection. If you have highly dynamic, scripted, or flashed pages/sites, offer an alternative low bandwith one. HTML compressors, when used correctly, can do wonders for WYSIWYG built pages (go notepad!). If you have only one or two pages that loads slowly, make sure you tell people before they click into it. Never have a home page that takes more than 9 seconds to load (six or less is better, 10 on the outside).
2) Cross browser compatibility. Contrary to popular belief, you do not have to make your site backwards compatible for less than 4X broswers, nor do you need to make your site cross compatible with oddball or lesser used browsers. I typically make my sites compatible for IE5+, NN4.X+, NN6.1+, Opera, and Mozilla 6. That's it, and that's 99% of your web traffic on a common site (though account for your expected users... *nix types probably will have a widely differing browser set to accomidate than above for instance).
This done by adhearing to HTML standards, using CSS effectively, and only cross-browser compatible javascripts and dhtml. I love CSS... it can ensure that everything even looks good on the lowly mac in IE.
3) You gotta understand what computers, browsers, operating systems, and color/resolutions will be visiting your site. A good rule of thumb is 8X6 at 16bit depth and cross compatible for major browsers (4X on), especially IE and later Netscape browsers on PC and Mac.
4) Avoid frames like the plague unless you are an expert at it. Most people dispise frames, though there are sites they may visit where they never even know they are there.
5) Use Ilayers only if you truely know them and their limitations on the user's end. Nice stuff, but it can really screw things up
6) Content is king. Avoid annoying flashing text and distracting colors. The most popular is still black on white, and other good colors are a vibrant red, medium yellow, and a subtle blue. Keep the content fresh and up to date where possible or expected, never date (or outdate) your pages with "last updated on" comments unless you plan on updating regularly. Justified text is nice.
7) Site navigation is queen. No page should be more than 3 clicks away from the home page. Also offer search and a site index that is current (dynamic is nice). Your navigation system should be consistent, clear, and easily understood.
8) Vertical and Horizontal content scrolling. Vertical is okay (big arguments still over this, but most don't mind a minor amount of it), but horizontal scrolling of any kind is a big no no.
9) Highly optimized, clear, clean graphics with minimal (translate non-distracting) animations if used. Compression is good, as long as you can see them clearly and without distortion or pixelation.
10) Make your site ADA compliant if you think for even a second a person who needs ADA styled pages might visit. Even a minimal effort, such as ALT tags is nice, and it's not too hard to do except on highly graphical sites.
11) Make your privacy and use policies clear and legally ready to be disputed. Nuff said.
Of course, content is king. But one of the tradeoffs is always nice graphics vs. load time.
To some extent, you can have your cake and eat it too- a fair number of graphics, as well as a page that displays quickly if you always use the "height" and "width" attributes in your IMG tags to manually specifiy the dimensions of your graphic. This way, the user's browser can go ahead and render the rest of the page quickly before the graphics are downloaded since you've alreay told it how big that image will be.
This is potentially a HUGE gain in the perceived load time for your site. I hate waiting for a bunch of graphics to load, but if I can start reading the page while the graphics load in the background I don't really mind.
The "alt" attribute for your IMG tags is important, too. This "alt" description is what gets displayed before the image has loaded, or if the user has graphics turned off or is using a non-graphical browser (maybe they're visually impaired!).
Additionally, descriptive "alt" tags help your images get ranked higher in image search engines, such as Google's. This is an increasingly popular way for people to find your site.
OtakuBooty.com: Smart, funny, sexy nerds.
I learned all I need to know about web design from http://www.superbad.com and http://www.e13.com
Edward Tufte has 3 or 4 books out dealing with the orginization of information, as it pertains to laying it out on a page. A lot of the stuff deals with maps, charts and diagrams and there's not too much about interactivity. But what there is is absolutely brilliant.
The books are kind of expensive, but they're beautifully put together--top quality paper, binding, colors, printing, everything. There are even a few fold-out's and pop-up sort of things.
Also, do some usability testing--where you sit people in front of your site and watch them use it. "Don't Make Me Think" is very helpful in suppling guidelines to do this.
c-hack.com |
Lots of them! Pick any four, and mix and match on your page for maximum effect.
Seriously, Flash can be used for good effect. There's nothing wrong with making pages that are beautiful, but the best way to do that is to choose a decent color palette instead of layering your page in graphics.
Too much text is just as annoying as too many graphics. Is there any reason why you need a summary of the forums, two sets of incomplete listings of articles, a list of news headlines, a list of quick tips, and two sets of links provided by Internet.com. It seems like the people at PHPBuilder.com were so enamoured with their ability to pull data from a database that they chose to stuff the front page with as much of it as would fit. One of the primary goals of an index page is to provide the user with an idea of how to navigate your site and how it is organized. Too many graphics is bad, but too many links is worse, its confusing!
Clarity should be your first goal in presenting your message. Sometimes I come across SourceForge projects that don't bother to tell you what the project is about. Your webpage is presumably about talking to visitors, not talking to yourself.
Bad graphics are worse than no graphics at all. It looks unprofessional if you do a hack job at it. Better to stick with basic text elements and a few colors
"It's Dot Com!"
I strongly believe in 100% W3C compliant web design. Its what the company I am employed with specializes in. It reduces bloat and increases the number of people who can view your site.
Its simple to follow once you get into the hang of it, and you won't get any (justified) emails from users saying that the site doesn't work on their browser.
1. Excessive use of the tag is a must. Epileptic seizures are always a laugh riot.
2. You can't go wrong with dancing hamsters.
3. Bright yellow text on a white background will weed out those pesky colorblind users.
4. Pop-ups and pop-unders are a great way to keep your users from going anywhere.
5. Multiple megabyte flash animations will amaze your users!
Do not taunt Happy-Fun Ball
Why, I bet you don't even bat an eyelid when Jennifer Lopezs' ass comes into view! ;)
Good points made by all on the virtues of simplicity, searchability, aesthetic pleasure, and such.
:)
Additionally, conformity to W3C HTML recommendations (at least HTML 4.0 Transitional) is always a plus.
Try my website, The Sensorium in IE 5+ and/or Mozilla 0.9.5+, and notice that it looks the same. This site conforms to the proper recommendations. It's based on PHP Nuke for the back end scripting, but the page design itself was created from scratch.
Cross browser compatibility used to be one of the most daunting challenges for a web designer to overcome, but since the birth of the new releases of Mozilla, it has become easier and easier to create pages that satisfy the Windows crowd, Linux crowd, AND the W3C.
Good luck
--
The Bailiwick - DESIGNHUB2005
http://www.webpagesthatsuck.com
There's no such thing as the best design or the best website. It's your audience that will tell you what to put.
You should not use Flash if your primary targeted audience are Linux Administrators. Not to pick on any LA, but that's not what they mainly are interested in.
Neither you should use Javascript code that works only in Internet Explorer, even if your log files say that 80% if the web is using it. As once someone said, someone in that 20% might be the one that wanted to spend 10 thousand dollars in your e-commerce website.
Use standards, but not all of them. There is a huge and useful part of the CSS and CSS2 specs that no browser has implemented, not to mention DOM, XML, etc...
The proper balance is achieved with the audience input and by looking at the logs. If you see that Opera users don't click on any link from your main navigation tool, might be because they simple don't work for them.
And forget what other people did. I was used to visit www.coolhomepages.com a lot. From time to time, a trend appears. Once were futuristic looks like www.2advanced.com, recentely have been 'micro-fonts'. There's no point to follow these trends, as they are only this, trends. And you would not like people recognizing that you stole design ideas from others.
Visit www.useit.com. Search for usability on Google. But never forget (other comments have said this), Content Is King. Almost nobody that's deep into art go to museums to look how pretty a picture is. Usually, the artwork is a breakthrough somehow, from techniques to social critiques.
Buy a Nintendo DS Lite
Unless you're site is intended to appeal to geeks, shouldn't you ask someone else about design decisions?
validator.w3.org says "Sorry, I can't validate this document." when pointed at "wow web designs".Why should I pay any attention to the work of someone who can't even manage a DOCTYPE declaration?
Warning: this article may contain humor, sarcasm, parody, and perhaps even irony. Read at your own risk.
There are so many backend hotshots and content delivery gurus on Slashdot. Clean, streamlined design and multimedia are not mutually exclusive, regardless of what the current crop of webmasters push on people.
Part of the dip in web popularity and content, content, content push right now has something to do with how BORING most sites are visually. Information and communication can be highly visual, multimedia experiences without the techno soundtrack and popup windows. "Content-freaks" tend to forget that photos, infographics, video, audio (used sparingly), even motion graphics are often ESSENTIAL components of successful communication.
I think good web design goes beyond presenting viewers with long articles and extensive commenting/forum features.
It's the attention to detail.
Sites like k10k, pixelsurgeon, presstube, and others, succeed in providing visual stimulation, while google, slash-anything, etc. succeed in providing content. There are very few sites that succeed at both. None that I've ever done. Probably because the number one feature people ask for is SPEED.
Well used flash, with a nice php/sql powered backend, can really deliver speedy content to slow modems and fast modems alike.
That said, I'm still leery of using flash on front doors and on high traffic / wide user-base sites.
Oh and one other thing that drives me crazy. Forms that don't allow auto-fill for states b/c of pull down menus, and forms with excessive validation or required fill boxes...
Been thinking about this a lot myself.
Excellent subterfuge. Your presence on the "wild wild web" is a boon to all who know you. Your fate will be sealed, though, when you trip and fall into goatse's gaping anus, choking to death with a mouthfull of colon.
[[Ay fukkand lyke ane furious Fornicatour]]
1) I cringe when web developers say about a page "it's worth the download time". It never is.
2) When you go to some sites, they pop up a whole new window without browser controls and make you navigate them that way. It is very irritating.
3) Indicate what a button does without needing to do a rollover. I've seen too many sites with buttons that you don't know what they do until you put your mouse over them.
4) Please use JavaScript for error checking form contents before they are submitted. A good programmer will also do error checking on the server side - in case JavaScript was turned off or not working properly.
I know this is offtopic as most of my posts are, but I think there should be a new rating for moderators:
+1 Creative Goatse Link
anyone else agree?
THERE IS NO DATA. THERE IS O
Anyone learning web design is bound to have heard the above - Keep It Simple, Stupid (and indeed it seems I'm not the first to mention KISS here). I'm a terrible artist so my sites aren't the most visually intricate, but by sticking to what I think are some important web design rules anyone can make a decent site. Here are my main rules:
:)
:)
- Pick three colours and stick to them. Background colour, foreground colour (i.e. text colour) and a third one, maybe for menu graphics and the logo. This doesn't mean your site has to have ONLY three colours, but if you primarily stick to three main ones your site will be cleaner and have a stronger visual identity. There should also be very strong contrast between text and the background colour (I say very strong because, for example, red is harder to read on black than white is).
- On a similar note, for type only use two fonts max - one for the regular type and one for titles (in my experience a sans-serif font like Arial works best for type as its easier to read and a serif one like Times New makes headlines etc. stand out more).
- Stick to the four click rule. If you have to click more than four links to get anywhere on your site the navigation is too complex, though you really want to strive for three clicks max or even two for a small site.
- Your site should pass what I call the Granny Test. You don't literally need a Grandmother for this, just someone with little more than a basic knoweledge of how to use the net, AOL types basically. Get them to play around with your site and give feedback - they'll be a lot more unforgiving than a net savvy user, but at the same time net savvy users will be grateful for any improvements made at the suggestion of your "Granny".
- If you've got more than 5 links on one page, start categorising them. Simple.
- A number of my previous points have been to do with this, but it's still worth hammering home the importance of consistency. Aside from potentially confusing some, if half your pages look like they're on a different site it looks unproffesional.
Some of this might sound blindingly obvious or basic, but looking around the net, all too often it seems they're not obvious enough to enough people. Well, those are my starting suggestions for good site design, others can (and already have) offer some more detailed and technical suggestions.
icemind
I forgot to note that for the price of the seminar ($320 full price, $160 student) you get a copy of all four of his books. As a student, that basically means that for the price of his books, you get a full-day seminar from him on the application of the ideas.
Not too shabby!
If you're looking for good web designs, you might check out OSWD. It is a great place for designers or webmasters to go to submit their web designs they have made or to download a web design for their site. Whether you're just too lazy to make your own design or if you have no creative talent, you can use the design templates on the site as a solution to your problem. I hope this doesn't seem too much like shameless promotion. ;-) I'm just saying that we're here in case you need inspiration or a place to vent the designs you've created yourself.
yes...because those damn clones are horrible web designers.
"you sonofabitch i didn't know!"
Another problem with the flashy-ness of sites is search engines. If your content is all in some graphic or complex flash animation, then it can't be sucessfully spidered, thereby reducing the effectiveness of your content (as you have greatly reduced your audience). Similarly, if your navigation system relies on such complex systems, then the spiders won't be able to navigate past the frontpage.
If it's your personal site, do whatever the heck you want and don't listen to the design luddites. DO WHAT YOU WANT.
For any site, PLEASE have something worth reading. I think anyone who's actually worked in web design before should be able to understand the fact that most web sites are completely useless and really only serve to keep their web designers in business. I wonder how many sites actually generate business or encourage customers to communicate with/come back to a company?
Design luddites make me sick. They're no different now (when things are actually much better than they used to be) than when I read the comp.infosystems.www.authoring.html newsgroup and participated in the incestuous web design clique years ago. While their basic demand for accessible web sites for all is impregnable, it's basically cowardice that prevents them from trying to do what a truly gifted web designer should do, which is to combine content, usability, and design all into one successful package. Whereas design with no content or usability is ignorance, it is the luddites who tend to show intellectual weakness by refusing to embrace design.
Of course they'll never admit it, and lash out at those who tell them as much, but it's plain as day to anyone who actually does this for a living instead of preaching from the Ivory Tower. =)
Except when they're not.
Computer Games Online was a better site before they switched to their new design. It used frames but in a good way. The new site *looks* better but I find it harder to find stuff and keep track of what's new.
"Make the text readable! Don't use a font size of less that 18pt."
I actualy have my computer at home setup to have fonts on sites set to 16+ or bigger.
For one thing it tests out how well a page wraps itself. I cannot STAND sites that DEMAND that their text have CRs only where they want them to be at, bleh.
(and whats up with flash animations that are of a set size? IT IS VECTOR FOR CRYING OUT LOUD. IT SCALES. DO NOT, I repeat, DO NOT, set the size of the window to an absolute value! And don't make it 'widescreen' either, it is dynamicaly generated, all you are doing is friggin LIMITING the number of pixels you have to work with!)
Need help treating your acne? Come here!
Any site made with MacroMedia Flash is NOT good design. God how I hate not being able to use the back button!
Whatever you do, please try to use some form of valid HTML. You can very easily verify that your HTML is valid using the W3C Validator.
What is valid HTML? I suggest you check out The Web Design Group web page for extremely useful information on the topic. Also, the W3C web site has the definative specifications of HTML. Don't get tricked into thinking your WSIWYG editor is going to give you anything even close to resembling a valid HTML document. If you are even remotely seriously about doing a good job, you owe it to yourself to learn the standards.
At this point I would normally insert the comment that knowing the difference between valid HTML and invalid garbage marks the difference between a professional and a kid in a basement with FrontPage, but unfortunately the kids in the basements are producing more valid documents.
Yes, not many sites use valid HTML, but that is their problem. Don't make it yours. As an analogy -- a whole lot of big name commericial software products contain buffer overflow exploits, but that doesn't mean you should be lax about letting them into your code.
Finally. Design your content first, then make the web site fit the content. NEVER make the content fit the page, or all you will wind up with is a fancy (usually broken) design that ultimately just wastes everyone's time.
Alan
Even discussion boards such as this one have been done in Flash format. Flash adds animation and many other attention getting features. Use Flash *correctly* and you'll have a cool site. At least I'll find it cool.
||| I still can't believe Parkay's not butter.
Heres the list:
(1) Work with either size font. (2) Work with multiple browsers. (3) Work on a 15" with 640x480.
Beyond that decide what you want to do: (1) Should the user be picking from a smorgasboard of info or being led through a pre-planned on-line experience? (2) Are you trying to create a sense of place with this site? (3) Are you trying to make it look like there are real people providing the content for this site? (if so, be competent and friendly and provide contact info) (4) Never puzzle the user about where to click next. (5) Don't surprise the user if you are trying to give the user a sense of power / control. (6) Let the user know if they have to support any of the following and they don't: (a) Cookies, (b) javascript, (c) java (7) Don't lock up the user's machine with an applet that eats all the CPU, (8) Test javascript on multiple browers (9) Draw a flowchart of typical uses of your site. Make sure that the most common branches are the most prominent choices on the screen, and that the flowchart is not something that would get you flunked in CS1, (10) Don't ask the user for information before you know that you need it.
These are pretty simple criteria. Approximately 30% of sites where I attempt to apply for work flunk.
On the content side, up-to-date is the key. On the technical side, no flash, no animated gifs, no browser specific formatting, no assumptions regarding the size of the browser window.
IMO
-michael
The International Herald Tribune
This site is simply one of the best I have ever seen. It has all the right attributes, works in both Mozilla and IE5/6 identically, without loosing any of its cool functionality, beautiful typography or features.
37 Signals
Is an example of a design firm that excels in clarity and a good understanding of what web design needs to do. Take a look at the work they have done.
Both of these sites are given as examples because they look superb without throwing away any functionality. They demonstrate through beauty and execution what usability means.
The pro usability websites, whilst good for evangelism are sometimes ugly to look at, and not simple to navigate (and yes I know that "ugliness" subjective). You can find them for yourselvs.
I've thought for a long time that one of the great web design firms should team up with the makers of a strong distro, so that the next generation of Linux desktop could be created; a desktop that is not windoze or aqua, but a third, elegant and unique thing.
ATH0 Bitcoin: 1DnwFLXczVZV8kLJbMYoheUrpqHesjxrSi
All you have to do is to look at the most popular sites on the web. And they are popular for a reason. Good content, easy user interface, quick navigation etc etc etc.
The best way to do this might very well be the W3C standard described here. Renowned usability guru Jakob Nielsen's site. He has TONS of information on how to design a site effectively. And maybe the most obvious thing to look at is the comaprisons between the top 10 sites on the net including yahoo, msn, google, disney etc (sorry, slashdot is not on the list). It compares the most basic parts of a website (colours, links, navigation bar etc). This gist of it all is, keep is as simple, clean and easy to use as you can possibly make it.
Simplicity. Simplicity. Simplicity.
One of the best site designs I've seen uses this to great dramatic effect. Fixed width, plain, calm soothing colors and a semi-low contrast. Besides, everybody knows white on black pages are so 1998.
--
No underlined links! There's a thing you can put in tags (which I can't remember off the top of my head), which turns off underlining of links. Underlined text is one of the most horrible things you can have on a page. Avoid it at all costs!
Links being in a different colour is sufficient, there is no reason to make the site look terrible with underlined parts.
The best websites are usable in Lynx at 300 baud. No graphics, certainly no Java... keep text terse and to the point... abrviate where possible.
There are 10 types of people in this world, those who can count in binary and those who can't.
Happy to share these with you!
bad design goes everywhere...
:)
before someone goes off and just redesigns their site, you really need to know just what you are trying to do. design is a form of problem solving, like designing a better chip, designing a better chair, or poster, or layout. it is not something that the average joe can do. so many people think design is just about asthetics. when really, astheticly pleasing is of course important but it shouldn't be what carries the piece, the information should, and how it is presented to the viewer.
design is so much more then most people think about, the colors, the siz of type, the font, the leading the kerning, the imagery, it is a lot of work, unfortunately almost everyone it seems fancies themself some sort of designer, unfortunately, that is is why there is so little useful stuff out there, if you can't name at least 5 designers of today as well as yesterday or don't read the design mags and such then it is probably just best to leave the job to someone else.
but then again, sometimes a cigar is just a cigar and who really needs a profesionaly design personal website
Live EVERY week... Like it's Shark Week
(and whats up with flash animations that are of a set size? IT IS VECTOR FOR CRYING OUT LOUD. IT SCALES. DO NOT, I repeat, DO NOT, set the size of the window to an absolute value! And don't make it 'widescreen' either, it is dynamicaly generated, all you are doing is friggin LIMITING the number of pixels you have to work with!)
Agreed, generally. However, many Flash animations include some portion of bitmaps, which don't scale well at all. I'd still prefer to scale than looking at a thumbnail animation, though, and using bitmaps in Flash should be avoided like hell, of course. Finally, IMHO widescreen does look cool sometimes, so I don't mind it being used, really.Switch back to Slashdot's D1 system.
n/t
pooptruck
There's nothing more irritating than having
some web designer I never met decide to take
control of my computer and make the browser
window full screen! If I wanted it full
screen, I'd make it full screen to begin
with. Some of us LIKE to browse at
800x600 (if nothing else, just to see how
screwed up some pages look at that
resolution).
-Ed
docbrown.net
Ed Wedig
Graphic design services
docbrown.net
The 'KISS' ("Keep it Simple, stupid!") principle is one that has stood the test of Time very well indeed (NOTE: I'm not saying you're stupid... just quoting from memory).
When I did my web page, I kept the following in mind.
1). Get the message across. Plain, simple, quick. Most people have a pretty short attention span when they're surfing, so I designed the main page to be able to load in less than 20 seconds. Don't do graphics bloat.
2). Keep it readable. Do NOT make the mistake of locking your users into one specific browser, or requiring them to have Java, Javascript, Flash, or any of that bandwidth-wasting crap enabled to use the site. Make the site so that it can be fully read and navigated with anything from Lynx to the most sophisticated graphics-enabled browsers around.
3). Consider your audience! If you must use graphics, use meta-tags describing what the graphic is and (if necessary) its text contents. Here's why: Computer users who are visually impaired or who have no sight depend on text-to-speech software to use their computers. Set your site up so that it is navigable by those who may lack one or more of the senses that too many of us, all too often, take for granted.
Yes, I realize that such guidelines may kill the use of a lot of graphics bloat. And this is a Bad Thing, how?
Good luck.
Bruce Lane, KC7GR,
Blue Feather Technologies
What kind of site do you have?
./, benefits the most from the least. We readers want to get to the information on the site, and if there are text links instead of javascript-driven rollovers, that's just fine with us. We want to get to the information fast. One click to the content is what we expect from a site that we've come to for information.
There are many different types of sites, and while all of the suggestions have been good, they all assume one type of site or another.
A straight news/discussion site, such as
A portfolio site neeeds whiz-bang, otherwise who is going to want you to design their next web site? Are you selling your company's services? Then sell, baby, sell! You need to attract attention in order to sell. So if that means that every element on your site is interactive, then so be it. Same applies for kid-oriented sites, and brochureware.
E-commerce sites need something in the middle. Enough sparkle to catch someone's eye, and then quickly get the info to the customer as quickly as possible. And the information that the customer gets needs to be clear and accurate.
<monologue type=soapbox>
Web designers/developers fall into two categories: front-end and back-end. Generally, front-end developers excel at visual technologies (Flash, GIMP, Photoshop, 'D'HTML), and have little backend experience, other than configuring Formmail.pl. Backend developers can code Perl, Python, PHP, maybe even *shudder* ASP, but their site tend to be black text Times New Roman on a white background. Neither one can fully understand what the other one does, nor see the real value in it, but isn't that up to the customer to decide?
</monologue>
My answer to your question on what should a perfect web design incorporate is: consideration for the user. A good UI makes all the difference. And that includes the graphical front end as well as an accurate back-end.
Note to Starship Trooper:
There are probably a few things everyone can agree on, like Flash being worthless at best
Sorry my friend, but if you haven't coded Flash/XML, you haven't lived. Flash is the only proprietary technology that I have chosen to learn, because of it can really make a difference in the presentation of a site. Don't knock a technology just because you can't code in it. And oh yes, it is most definitely coding. There's a big fat O'Reilly book on Actionscript. Can I do it with plain graphics and HTML/Javascript? Yes, but TMTOWTDI.
Responsibility is the punishment for compentenc
Since we can't expect every web person to consider good design, here's some future requirements for browsers:
* Provide an easy to reach on/off switch for irritants like large images animations and flash.
* If I have flash turned off, don't tell me so every time (IE does this)
* Allow me to turn off all pictures/animations/etc and click on the page to then selectively download just that one.
* Allow a total popup ban, without some third party tool.
* Don't allow the browser to become full screen, or let me turn this off.
* Always give me the minimize, restore and close buttons, never let some web bastard take them away from me.
* Let me specify the Java version I use.
* Give me multiple proxy options--our's a frequently down for whatever reason, and I don't want to dig deep into options to manually switch them. And for that matter, help me figure out what proxy is being used, since I can't find that out easily.
* Minimize the unknown information disclosed to the web server.
... people like designs that incorporate naked chics. Lots and lots of naked chics.
Don't turn it into brochure-ware but think in terms of an ezine or a regular magazine article. When people talk about web pages (especially with clients who don't know anything about it) everyone starts to make things too complicated. All you are doing is trying to convey your message to strangers (in most cases). Granted writing the HTML and making it work in different browsers presents a different kind of challenge than printing a magazine, the general idea is the same. A lot of other people here have said the same thing, get your point across in the simplest way possible.
Design types will want a huge image with an image map as a way to navigate around the site. Developer types will want almost all text. Try to find a happy medium there and stick to that. Use images that get the point across and make them look good but don't overuse them. If you are selling a product, obviously you will want to use images so people can see your product. If you have Gimp/Photoshop, add a simple drop shadow or gradient so the picture blends into the background seemlessly, instead of just dropping the image onto the background. If you use images for links, use alt tags. People using links (not sure about lynx) will see where the link will take them. As another person has said on here, put the contact info ALL OVER THE PLACE. I've been to so many sites that didn't have contact info anywhere (that I could find). How are you going to sell a product if people don't know how to contact you.
Sites can look good without using too many graphics. Creative use of colors and CSS can make the difference between a site that takes 40 seconds to load or 8 seconds to load.
In terms of design, navigability, tasteful display of content, and ability to be rendered in many, many, browsers, no other personal site comes close to this one. I wish more people would use it as a model.
http://www.tuxedo.org/~esr
I think lots of naked ladies are a great design characteristic in a web site. Even better if it's free.
ALG
Actually, not. There's the normal page that 99% of users will use but through effective use of SSI it doesn't have to be duplication of effort at all.
" />
If your default design requires Javascript, include a
<noscript>
<meta http-equiv="refresh" content="0;http://server.domain.com/texthome.html
</noscript>
in the HEAD.
This will send all of the folks with no scripting to the page that has none.
The very first thing that should appear on the default page is a link to the text-only version. This is for the benefit of non-sighted users who are using a browser that processes the scripting. This should appear first because you don't want them to have to wait while their screen reader recites the entire page before they get to the one piece they really need to function.
Yes, by all means "know your audience." But, remember that unless you are going to authenticate your entire audience there will be other people coming to your site.
My office has been taken over by iPod people.
I'd say that my site is pretty good design-wise. I tried to make the navigation as minimal and clean as possible, while still allowing it to be pleasing to the eye. I have gotten complaints about my background from colourblind folks though...
It's been a long time.
The term "web design" indicates someone that is moving in the wrong direction. There is no such thing as "web design." There is Internet development and Internet applications development, but "web design" is simply a misnomer.
All web sites are software applications -- not "designs." The differentiation is critical. I see numerous "graphic designers" who offer web sites. What they are offering is simply a means of double charging for placing a brochure online. The ubiquitous "Contact Us" does not qualify a web site as a business application or customer relationship management application.
If you are serious about creating an Internet application, start just as you would with any sofwae development project:
-- define the user base
-- define the business case
-- define the budget
-- assess available resources
-- plan the project
-- start development
Note there there are no references to "designing comps", slicing-and-dicing PhotoShop files, adding Flash, rich media, or other related garbage.
I know that some Slash Dotters may take umbrage with my comments and simply classify me as a raving Lynx-bigot. However, there is a real method to my seeming madness. No one belies someone a nice looking site. But such a site must be developed from usability, functionality, and capabilities. You don't start a web site "design" by opening PhotoShop (or the Gimp).
An overwhelming number os "web sites" are simply online brochures that do little or nothing. These sites take particular joy is designing new "interfaces" that challenge the user. Flash "navigation", pop up menus, image maps, roll overs, underline links (anathma to "designers"), etc. create a very forboding environment for the average user. Consistency is not bad -- common navigation methods, common navigation elements, common navigation structure, common naming convetions. All of these are regularly jettisoned by "designers" seeking a "cool" new design -- "how pedestrian" they chide.
My advice is: start with a solid business case and add the "design" later.
first off, what information are you displaying? if you're an artist and are using your website to inform potential clients, you would most certainly want to be creative with a design. take for instance 33mhz.com now this guy is an artist in the graphic design, etc. he needs his site to be creative and original, since that is what will get him clients. for a personal site, you should be personal. if it's personal, you shouldn't have to think about what everyone else thinks, if they want to view it, they'll deal with whatever YOU the artist, create.
:wq!
I write code.
So many get uppity when someone uses the word "content", but there is a reason people use it. Content is information. Content is ideas. Content is entertainment. Content is style. Content is can be just about anything, as long as it is something.
To say that the reason anyone goes to the web for information is wrong. Kids play on the web. IM/ICQers come for the community. Gamers come for the multiplayer games. Crackers come for the 31e73 challenge. Trolls come to /. for entertainment. How much of that can be narrowly constructed as "information?"
"Content" has been made a dirty word by marketing droids who were trying to save their ad-based revenue streams, but it is still a good word that lets you talk about paintings, music, movies, photos, style, communities, rants, raves, and yes, information in one simple word. In many respects, "content" is like "art", a generalization word that allows broad discussion without being cumbersome. Can you imagine the Metropolitan Museum of Art being renamed the Metropolitan Museum of Paintings, Photos, Statutes, Tapestries, Antiquities, Music, and Books?
That said, while people come and stay for the content, bad design can drive people away. I was looking for a site that had the rules for all kinds of games (sports, card, board, etc...) I found everyrule.com, which looked to be a good start. I even bookmarked it. But as I browsed the catagories, I found that with multiple pop-up, most links opening in new windows, and an inconsistent design (because it's really just a portal site), I deleted the bookmark and haven't been back since (except for now to check the URL.) Content, with a good interface makes for a good web design.
-sk
I would guess at Western(?) Square/Social(?) Dance. But that wouldn't explain why the young women in your group like techno.
Hmm. Group of young women who like techno. Can I join? Good job my wife doesn't read Slashdot.
--
E_NOSIG
NOTHING. Web design is CRAP, and the people who do it are a bunch of arrogant poseurs. If you ask me, the best design goes back to the days of BBS's and TEXT ONLY. I don't give a damn what a page looks like-bottom line is if it doesn't tell me what I need/want to know, it's worthless.
All this talk of simplicity, avoiding flash etc is all well and good, but don't loose sight of the basics when you're coming up with your design.
/bin/sh you can make sure nobody notices. No worrying about 404's, no waiting for search engines to catch on, and if you're lucky and/or smart, you'll get nice clean meaningful URL's the user won't be scared of. Cool URI's Don't Change, and they mean the same to everyone.
.. } in CSS2); excellent for publishing documents on a site without making multiple versions AND without dropping the niceties of your site.
;)
Look at your URI namespace; think about what it means; go read about what it means, don't just choose names arbitarily or you'll find you break them in no time. Do your users really need to know all your content is served by index.php? Does that really mean anything outside Apache? If not, remove it; go mod_rewrite it away and when you find you need to move to Java or C# or
Always remember that HTML is a semantic markup; a <h1> tag, for instance, defines a HEADING, it doesn't define a larger font or anything else; on an aural browser it'll be read in a slightly different tone or gender of voice, on a PDA where space is limited it may just be a different colour, or displayed indented, or any of 1001 different things. With XHTML and CSS2 you can accept all this and still have decent control over how your site looks and lays out on the devices you do know about. A great way to see this in action now is to play with turning off navigation elements, and even things like making copyright notices bigger for print media (@media print {
Make use of the semantic structure of HTML; surround abbreviations with <abbr>, use title="" attributes to give links and even arbitrary areas of text descriptions; these things add to the user experience and provides them with the rich set of information hypertext was always supposed to without you needing to worry about crap like DHTML bubble windows; they're standard parts of the browser.
A nice technique for design is to develop your HTML from XHTML 1.1 Strict (think: HTML 2.0 in XML). Build up a meaninful document and surround all the logical sections in <div>'s, then you can use CSS to move them around; you'll probably find a nice natural layout magically appears.
Er. Better stop now
If we agree on 2 things, that a web site is a UI and that by learning what makes a design bad you can make good ones, then this one'll help you:
The Interface Hall of Shame
It concerns itself mainly with applications, but the concepts are there.
As an afterthought, one tihng I really liked was on the bbc site; there's a link to a low-graphics version, or was that a text only one, I forget. If you want real elegant design, make the content independent of the HTML and generate the page dynamically based on client capability and preference.
Blearf. Blearf, I say.
http://www.wowwebdesigns.com
What makes a good website?
No cookies, no javascript.
A fancy site may look nice, but not to the point where I'll trust them to run whatever programs they want on my system. Far too many sites seem to have decided that making it look cool is the most important thing, and don't bother to provide a plain HTML version.
Since I can't view the site without trusting them enough to turn java on, and I can't even begin to decide whether to trust them if I can't see the site, I simply take my business elsewhere.
Most of the time people think of these as two extremes of web design. On one hand, you have sites like DiK, which are all about miniscule pixel fonts, strange contrasting colors, and total "coolness." On the other hand, you have government web sites that look about as appealing as a military barracks; it's blocky, ugly, has bad contrast, and while it's functional, it's got the aesthetic beauty of a cinder block.
... it's got a little bit of eye candy with their oft-customized logo, but it gets the job done and doesn't waste much time loading a snazzy interface. (Think MSN, eBay, CNN ...) A List Apart is another excellent example of combining form with function; it's got more images, but it's still dang fast.
... write VALID XHTML. Know and use the W3C's Accessibility Guidelines so that people with disabilities can visit and get what they need. There are reasons for standards compliance, and it's stupid to throw away the benefits.
The problem is, these things really aren't exclusive. Take Google for instance
So what's the secret? Nothing really mysterious, really.
1. Provide quality content. If you've got a monopoly on your content, people will come no matter what your page looks like; they need the information that you and only you can give them. So: Use good grammar, syntax, and organization when your deliverable is primarily text. When it's multimedia, make the media the nicest choice available from anywhere.
2. Just the facts, ma'am. The corollary to #1 is that you provide ONLY what your visitors want. Keep your site organized, keep it very easy to navigate, and for god's sake, leave out things they don't want. So: Minimize advertising. Keep your structure logical and keep a search function a click away at the most.
3. Make things accessible. XHTML has been a standard for three years now. HTML 4 has been a standard for nearly six. Screw Nutscrape 4.7 users, write compliant code. The content can still be visible, but hey -- they're the ones who choose to use a two-year old browser, so don't sweat it if you get complaints about your site not working for people who are too lazy to upgrade. Just point them to mozilla.org or windows.com/ie, and if they don't like that, well, that's their problem.
Don't just write XHTML, either
4. Keep 'em small and beautiful. Graphics, that is. Eschew GIF for the newer and better PNG, and make sure that you use antialiasing where it's appropriate. Nothing is more annoying than jagged, improperly sized images that look like they were drawn in MS Paint. Optimize the hell out of them with fireworks -- you can usually cut JPEGs down to about 1/5 of their normal size with that program, and PNGs are similar -- and let users cache the stuff so that they're not constantly downloading.
5. Design for everyone. 800x600 might be the standard, but what about your users with higher resolutions? Graphic designers are all well and good, but make sure the one you choose realizes that this isn't a fixed presentation medium you're working with. Users like resizing their browser windows, they like control, and they hate it when they can't do things that they normally can -- using the Back button, closing a window and making it STAY closed, et cetera. You're not God, and you can't force everyone to view your site as it looks on your monitor. Deal with it.
There's more, but it'd take pages to write all this out. Read Apple's UI guidelines. Read ALA (the link at the beginning of the post.) And of course, read the W3C specs.
got standards? --- http://www.w3.org/
Keep in mind that video resolutions can vastly effect how a page is viewed. While trying out some ideas, see what it looks like at 640x480, 800x600, and 1024x768. Sometimes you'll be surprised at the results.
A good design can flow with the resizing of the browser window too. Not every one has their browser maximized.
White space is your friend.
Other than that, do whatever you want, really. Some may tell you not to use dark colors, others will tell you not use bright colors. (I designed a web page once where I got complaints that it was too dark and too bright) In the end, make sure the web site serves it's purpose. That's all that really matters.
I'm so tired of all the "if it doesn't work in Lynx, it's not a good design", "no flash because I don't like it", "don't use " crap.
If you design a website, the first thing you should do is find out who your audience is. Once you know who your audience is, then you can start figuring out how the design should work. It's all about the audience.
For example, you're designing a site that whose audience will be mostly elderly people. Make sure your font sizes can be increased and this won't break the design. Make any clickable links large and easy to hit.
Or, maybe your site is for kids. Make sure the site is flashy (perhaps use flash), cartoony. Any text areas are short and can be digested quickly and easily.
Another example, you're building a help site. No flash, no DHTML (unless where it helps the user get to what they want quicker), little eye-candy. The user who hits this site will not care in the least how multimedia-rich it is. All they want is to find the answer to their question and leave, so give them the quickest route to that answer without all the crap.
Anyway, just my two cents. All the "don't use this because it doesn't work in all browsers" is crap, IMHO. Know who your users are/will be. Know what they use/will use. Know what their skill level is/will be. Then design your site based on those guidelines.
--mh
I have a hard time believing that browser compatibility is much of an issue any more. Here are my reasons:
1. Most browsers (IE, mozilla (netscape), Opera) follow (most of) the standards now thankfully: XHTML, CSS, DOM. The world is a better place thanks to the W3C.
2. Browsers are free. The only cost is the time it takes to upgrade. If people have no motivation to upgrade, guess what - they won't. If you make your site compatible with Netscape 4 until 2004, people will keep using it until then. Only when the stuff they want requires an upgrade do they actually do it - so force your users. It's a small price to pay.
This is pretty simplified, I know - but it'll get you started. If you are going to offer back-compatibility, GET IT IN WRITING exactly what you are going to support and how.
I've seen backwards compatibility blow up in people's faces. But I've also seen companies pay a pretty penny to have it, so they must REALLY want it. Make it worth your time to do the extra code and charge more. And sometimes charging an obscene amount for it can help the customer determine if they really need it.
It doesn't sound like it, but backwards compatibility is a LOT OF WORK, especially testing! My advice is to support the latest version of IE and mozilla and nothing more - you'll cover over 95% of the market that way.
----- rL
Oh I just love those HOME PAGES with animations that recur EACH TIME you GO their.
Navigate the site, and click home, and there is that GREAT(ly annoying) ANNIMATION.
And I especially like the (overdone) FLASH which takes 4 minutes to LOAD (or longer) on my 28K connection
As a designer and geek-by-trade, I'm going to have to side against the majority of Slashtypes here.
The importance weighting of design vs. content can vary by 180 degrees depending on the context of the site.
First off, if it's a shopping site, or "brochureware," design is 50 times more important than the content within. It's the difference between handing a customer a professionally designed brochure and a photocopy. The content on those sites is almost always brochure/catalog spooge.
Design isn't Flash, it isn't animated graphics... it's a polished, useful, easy to navigate user interface that doesn't suck or make them think. (Those are both fantastic books, BTW)
If you're building a community-based site, or an information-based site, then design falls (rightfully) into the back seat.
I guess that the point I'm trying to make is -- establish your priorities when designing the site. Is your primary userbase going to be the Slashcrowd? If so, you better make sure that the site is tolerable in Lynx -- and that crowd is much less likely to avoid a site just because it's ugly.
Joe Sixpack Consumer AOL User or Middle Management Stooge, on the other hand, will be less forgiving.
Bottom line -- if you're selling image or product, design matters a LOT. If you're selling community and ideas, design doesn't matter as much -- but try to make the site easy on the eyes.
And, please know that I'll personally hunt you down and kill you if you require IE5+, Win, or a plug-in to view over 50% of your site.
You've been warned!
Best web design EVER: www.tubcat.com
Great content without the fluff...or somthing.
Moneyed corporations, non-working 'poor' and criminal prisoners are turning productive citizens into tax-slaves.
I say use XHTML and CSS... It is supported by Mozilla, Opera, and IE I know. It's not a big deal to make your html pages valid XHTML, and there's a higher chance it will look right for more people. And CSS is just great, tags are not.
God became man to enable men to become sons of God. -C.S. Lewis
Blue text on red, red text on blue. Either has a very nice way of inducing headaches in all. Some folks will even look for the sailboat!
"Goodness, how did you people live long enough to invent tools?" -Hobbes (the tiger, not the philosopher)
No Javascript except for those things that can be done no other way. Everything that can be done in plain old HTML, must be done in plain old HTML. Where Javascript adds on some enhancement, such as consistency checking a form submission so the user doesn't have to wait for you underpowered server on your slow network to respond, OK. But make sure it is coded so that if Javascript is NOT enabled, or has been filtered out by a proxy run by the company BOFH, it still at least works, and sends the submission to your server. The server had damned well better not assume that it gets valid data. All validation must always be done by the server no matter what for security reasons.
If you make what should be just a hyperlink or a submit button be a Javascript invoking URL, then you better not come within bullet range of me.
now we need to go OSS in diesel cars
I typically despise any animations or plugins, and I prefer Lynx to any other browser. However, Opera's nice for looking at userfriendly every day. What's annoying, though, is that I have to enable javascript just to view some sites. This is useless. Offhand, Mail.com... there's absolutely no need to make links with javascript. As other people have said, keeping things simple is best. If you have no content, then you're just wasting bandwidth anyway, and no amount of cutsey pictures will disguise the fact. There is only ONE site that I've ever seen that makes *perfect* use of flash/gif animations, and that's How Stuff Works. Check out their article on lock picking, or Programming In C. Compare useful stuff like that to frivolous garbage, shown here: FX Networks. The world will be a far better place when we can simply euthanize Frontpage users.
We can face anything... except for bunnies.
I have found that one of the best ways to have good web design is to simply review crappy web designs. Web Pages that Suck put me well on my way to making web pages that are slightly more than mediocre.
Go to http://www.greenspun.com, http://photo.net, and http://www.arsdigita.com. Philip will teach you the way...
In case you don't wander across it, read Philip's book about web design.
Also, some other related reading would be Nielsen Norman Group, Nielson's own site www.useit.com, and their friend tog.
Make it work first, make it pretty last. User interface is key.
Gabriel Ricard
Step two: Make your site look nothing like Slashdot.
Repeat on a per-site basis.
- A.P.
"Remember when the U.S. had a drug problem, and then we declared a War On Drugs, and now you can't buy drugs anymore?"
Granted: sites need to be content focused, simple, fast, and easy to use.
But your great content will never impress anyone if it isn't painted to do so. Your great back-end and your brilliant navigation will bore people if its not visually appealing.
I like a clean, professional look. Continuous color scheme. Visually balanced pages. Illustration....
Doesn't anyone like pretty webpages?
(My 2 cents)
John
The next major worry for corperate web designers will be accessability -- making pages viewable for persons with disabilities. There are several different browsing methods available for physically and mentally handicapped persons. For the most part, they depend on text-only or well-defined HTML pages.
Up until the 9-11 attacks, the U.S. Gov't was feeling the pinch of updating their pages for accessability. Pretty soon public universities will be mandated by the gov't to make their pages accessable under Section 504 of the Rehabilitation Act of 1973.
And very soon after that, corperations will start getting sued by different disabilities groups for not making their web pages accessable according to Section 504.
Check out W3C's Web Accessability Initiative for a starting place.
Christopher N Emmick
A good man, a better nerd.
Minimalism and clarity.
Let me say one thing first, the Wow Web Designs site is NOT a good example of web site design. Look at it in Opera and see for yourself how nice the dark blue links look on the dark brown background. Yuck. Try turning the images off. Almost none of them have alt tags.
Good web site design is subjective. What one person considers good to look at, another won't. Some people actually like those huge flashing animated gifs they put on web sites. Do what you like if its a personal site. If its commercial and you're doing it for a client, then of course do whatever the clients like.
That aside, I know I might be rehashing a lot of other people's comments, but here are a few of the things I keep in mind when designing sites:
- Conforms to the W3C accessibility guidelines and validates (HTML, CSS, etc.) If your site does this, it will cover a lot of the other bases and cut down on problems. Also try running your site through Bobby at http://www.cast.org/Bobby/
- Doesn't use unnecessary graphics or flash. When you have a site about art, movies, or other topics that lend themselves to heavy graphics or when you want to show off something, like a product or your campus - use the images and make sure they're nice ones. In most cases tons of graphics and fancy flash things aren't necessary and just contribute to download time.
- Looks acceptable on as many browsers as possible. It might not look identical on all, but there isn't anything that's illegible on an older or non-traditional version. Try a site like Any Browser's Site Viewerthat will show you what your site looks like on using other browsers, or older versions of HTML support.
- Dynamic Content is important if you want to bring visitors back. They come to your site once, find what they want and never come back again unless your content changes. On the same note, when they get there the content must be up to date on things that are timely, like events information
- Make sure the site downloads fast - most importantly the front page. I now have a 24kbps connection at home and realize just how important this one is.
I guess those are my main ones. I won't get into all the others because so many people have covered them on here already.
This site - Any Browser and this site Software QA Test have testing tools that may be of some use to you.
I'd give you some examples of my work, but I really can't afford for for any of my sites to be slashdotted right now.
Most people would die sooner than think; in fact, they do.
What happened to all the hit counters?!? You wouldn't believe how often I visit a website and wonder, "How many people have come here before me?" It used to be that all I had to do was scroll down... Now, however, I'm stymied!
Save the hit counters!
I can't tell you how you SHOULD design your page, but this site is a pretty good example of everything you SHOULDN'T do. Excessive javascript, needless browser dependencies, superfluous navigation 'gadgets'...
Content matters the most. But then several hundred people have already told you that. Probably because it's true.
However, if you want your site to look lush, then you can do a lot worse than learning from these fine people.
"If being a geek means being passionate about something, then I pity those who aren't geeks." - Pike65
It seems it's quite popular to say Flash is eeeeviiil, but I'd like to make a case for it:
- You can make a site that's very small, and still looks good (80kb)
- You're sure of how it will look at the user's side. Fonts for instance are embedded in the format.
- The format is as open as for instance pdf (check www.openswf.org) and there's lots of open source libraries and tools that use it.
- You can make it so it's scalable - so it adapts to the size of your browser window. This is important to me, because I can't count the number of times I cursed when I'm viewin html websites on my high-res monitor because they used fixed font-sizes in their css.
Yes, it's true that there's alot of crap sites out there made in Flash. I get the willies everytime I see an "intro". But there certainly also are a lot of crap HTML sites.
Using jpegs or gifs that are 100kb to begin with, or that just cram so much text in a view that you don't know where to start looking, and you get a headache to begin with.
At least with Flash you don't have to deal with slight differences in rendering CSS boxes between internet explorer 5.0 and 5.0 SP2 or whatever. (Even mozilla has it's share of anomalies)
Even if you do your entire html site "by the book" , spec-compliant, clean, etc, you can't avoid encountering bugs between the different implementations.
The only reason _NOT_ to use flash, is because there's no adequate Flash editor for Linux, (or for that matter, an adequare vector drawing program for linux either) - it's the only reason I still need to dual-boot. I'll try wine+flash soon - hoping it's usable.
What makes a good website? Well, it all depends on the actual information you have to offer. If people can find something interesting on your site, and the UI of your site doesn't get in the way, or even, does actually _help_ the visitor to find what they're looking for, then you succeeded.
The difference is that you can make links open in a new windows by control-clicking (or whatever) on them. But if the developer forces all links to open in a new window, how do I (who doesn't want a new window) make it not open in a new window? I can't -- the developer has overridden that option.
To provide the user with choice (which is one of the most important things that a website developer can do), it's important to not force particular UI styles on users. Give them choices. In this case, the only way to do that is by not opening links in a new window.
-Waldo Jaquith
-
Content
-
Animations
-
Valid HTML
-
HTML is not a typesetting language
-
<NOSCRIPT> tags
-
Remember about other browsers than yours
-
Remember about people with disabilities
-
Colors
-
Fonts
-
User defaults
-
Accept-Language
-
See good websites and learn from them
- debian.org
- gnu.org
- google.com
- dmoz.org
- w3.org
-
Try to learn from the good old books
-
Hire an expert, like
me
This is everything what I can think about right now. I'm sure many of you have already said the same things (I do hope so!) because I started writing this comment when there were only few other comments posted. Those are, in my opinion, the most important things about a good web design, so it's worth being a little redundant. Forgive me any typos, it's quite a long comment and I'm very tired (and very lazy).If you don't have anything interesting to say, don't even bother.
Do not use any animations or blinking text on a page, when there's any text to read, especially if they can't be turned off by simply pressing Escape or clicking Stop. I don't mind ads, as long as they don't interfere with reading, and animations do interfere.
Don't publish invalid HTML. Always use W3C HTML Validator and CSS Validator on your pages online. Always use HTML Tidy before your new pages are online. If you don't write HTML but you use a WYSIWYG Web authoring tool instead, and its output gives any errors or warnings when tested with HTML Validator, complain to the vendor of this tool you use asking to remove the bugs.
HTML or XHTML are for the logical informations about your document. CSS is for defining the look and feel.
The <NOSCRIPT> tag is not for writing "Your browser is bad, come back when you install better" but for providing the same functionality for browser without JavaScript or with JavaScript turned off.
(By the way, texts like "If you can see this text, that means you have no JavaScript" are as stupid as "If you can see this text, that means you have a kernel panic")
If your website is unusable without JavaScript, it needs a redesign. Don't use <a href="javascript:..."> links if you don't have equivalent <a href="http:..."> links inside a <NOSCRIPT>.
If your website is best viewed with any specific browser, or in any specific resolution, you're not a good web designer and worst of all, you don't understand what the Web is all about. See the Any Browser Campaign. Install Lynx (a text-mode browser) and see how your website looks like. If it's unusable, it's poorly designed. Remember to always use ALT property in IMG tags, aspecially in navigation buttons.
See the Web Accessibility Initiative and always try to meet the Triple-A, Double-A or at least Level A Conformance. Use Web Accessibility Initiative logos on your website, or just a text information about your level of conformance.
"The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect." - Tim Berners-Lee, inventor of the World Wide Web
People may access your website using Braille terminals or voice synthesis. Testing your website with Lynx is always a good idea.
Remember that 10% of your visitors are color-blind in some degree. Remember that black text on white background is the best combination for any text longer than few lines. Try to learn from the good old books, not from the magazines about the latest celebrity gossips.
Remember that the best font for text longer than few lines is a serif, variable width font, like Times. Try to learn from the good old books, not from the magazines about the latest celebrity gossips.
You should always use the default font face and default font size for the normal text content on your website. Just don't define the face and size, and it'll be ok. Remember that when you use size "-2" for the whole text on your page it means: "For the text on this page, use the font two levels smaller than what the user has chosen as his/her default and favorite size of font".
Use your own font faces, sizes and colors other than black on white, only for logos, headers etc., but not for the main text to read, longer than few lines and especially longer than a paragraph. Soemone has set a bigger size as a default for a reason - maybe he/she has a small screen, maybe he/she has problems with eyes, maybe he/she just likes big fonts - respect this decision.
If your site is multilingual, use the Accept-Language HTTP header. My browser sends Accept-Language in every single request and it's stupid that I have to click English version links, after I've already told it in my HTTP request. See the RFC 1945 - HTTP/1.0 (May 1996)
It's nearly 6 years old feature, still most of people don't use it. RFC 2616 - HTTP/1.1 (June 1999) defines much richer Accept-Language header (See section 14.4), but please, use HTTP/1.0 functionality at least. See www.debian.org which is a great example of this feature functionality.Try to learn from the good old books, not from the magazines about the latest celebrity gossips.
Contact me and I'll fix your broken website or supervise your webmasters for very affordable prices.
~shiny
WILL HACK FOR $$$
I have always loved websites where the background changes every half second to a different bright color. Great for causing seizures!
<RANT>
<TINFOIL HAT status="on">
Kiss my ASP, The day I tell one of my clients who wants to pay me $35,000.00 to develop the coolest site he/she's ever seen that their site would actually be better if it were a plain text site with straight HTML links, no soundtrack, no animation, NO 3D OH!... AND FOR THE LOVE OF GOD, MAKE SURE IT WORKS WITH F*CKING LYNX, WE CAN'T HAVE ANYONE WHO HASN'T UPGRADED THEIR 80386/14.4KBPs BOX PISSED OFF, NOW CAN WE I MEAN THOSE PARAGONS OF ECONOMIC MUSCLE MIGHT NOT SPEND ANY MONEY ON YOUR E-BUSINESS, RIGHT?...
You guys might want to have a peek outside the cave every once in a while. After five minutes or so (when your pale bloated eyes adjust to actual daylight) you will notice that most of the people out there seem to be spending their disposable income on fasionable clothing, SUV's, condos etc. That's because they would like to look cool so that they get sex and social affirmation from others without having to go through the painful and frustrating chore of getting to know and trust people. They do this because they got born in good old 1st world North America, land of the haves! These shallow stupid people (who are also having a lot more fun than you guys) would rather enjoy the 60-100 years on the planet than feel shitty because they wont ever be as smart as you. Consequently, these people spend their lives wallowing in the shit that looks cool, you know, LIKE CONSUMERS ARE SUPPOSED TO!
Now someone who's paying $BIGWITHLOTSOFZEROS for a website is definitely in that category (I mean, otherwise they'd be so smart that learning HTML, Flash, Java, etc. would be easy like it is for you guys and they'd just go write it themselves, right?)
Actually, the day I tell my clients that their website should be designed around the principles of simplicity, functionality and elegance is probably the day after I get paid for 100% of the shares in my software development company.
BTW. I really do like you guys, I just think that a lot of what's being said here seems to deliberately ignore websites that weren't designed to deliver tons of usefull, real world content, I mean this site is the only place I've ever heard the expression "free, as in beer".
I guess it must suck to be Noam Cholmsky and have to live among the greedy grasping shallow stupid stinking hoards, but most people actually like how commercialised everything is getting, it makes life easier to understand for most people (I'm not one of them, but I write software for businesses and that means understanding and creating what MY CLIENTS want, not necissarily what I want).
<TINFOIL HAT status="yeah right I'm gonna take this f*cking thing off!">
</RANT>
Standards, Standards, Standards!
I spent hours getting my site to validate as XHTML 1.1, and CSS, and it renders correctly in modern Netscape browsers, and modern versions of IE. Standards should be the way of the future (and should have been in the past).
Anyway, other that that:
Content! Don't let the design get in the way! KEY EXAMPLE: The new site for The Matrix, awful, design makes it very hard to access information.
"We shall show mercy, but we shall not ask for it" -- Winston Churchill
Having now spent a while studying the "web compatibility" issues for our various projects, I (and others) have come across some of the tradeoffs, and noted them, since the information has been very useful for us:
1. Pop-up windows are very useful if a page is being designed for a specific resolution. Having a set resolution (as most game developers and DTP developers will agree) makes development of a good GUI *far* easier. Having to support all available resolutions from Palm Pilots through 640x480 on up to 1600x1200 and all possible color depths, *and* have a great GUI is impossible. (No, the percentages in style sheets don't help. Been there, done that).
800x600 is a minimal resolution, IMHO.
2. CSS is great. XSLT is better.
3. Javascript is necessary to development of a good GUI too. Visual cues are vital to explaining to a user what the GUI is doing, and those cues usually require Javascript.
4. Unless a common (black text on white background) color scheme is the only goal, changing the default link colors will almost always be necessary. Royal blue looks terrible on almost every background color except white and pastels (yarg). Yellow backgrounds give people headaches. Purple is invisible everywhere royal blue looks terrible. And so on..
5. Requiring a specific browser will be necessary until all browsers support the proper standards *or* all (or most) users use current browsers. Our sites generally do not support Netscape 4x well. Mainly because we use style sheets and inline styles, which Netscape happily renders wrong every chance it gets (not to mention what it does to nested tables). We would need to maintain a seperate (broken) site for Netscape 4, and that isn't practical.
If Mozilla, for example, were the only browser, we could do incredible things with web interfaces (like put more information on each page with a simpler navigation mechanism). Having to support IE, Opera, etc., means that all the advanced cool stuff won't work reliably, so we can't use it.
6. Mozilla, BTW, should set it's default resolution to 120dpi to match IE. Yeah, yeah, I know, Linux is great and all, but 7pt fonts that are 4 pixels high aren't readable, and bumping the font size to 960pt to read one site, then finding an 'E' that fills 80% of the screen on the next site is less than ideal.
7. I'm very intrigued by Shockwave and Flash, but have hesitated to use it because everyone complains about it so much. Some of the Flash things can be done with DHTML, but then the compatibility problem comes up again.
8. I'm always intrigued by the word "content." Here's the basic tradeoff: If people want *really* good "content" on the web, then web developers (client-side people) need a bigger palette than the HTML 2.0 tags, default color links, tables and 8-bit static jpegs. Sorry, but that's the way it is. HTML and JPEGS have been pushed about as far as they can go, and while these are adequate (and actually preferred) for information like 'man' pages and HOWTOs, when it comes to making something genuinely interesting, it is difficult to get more than a yawn without something better.
Just another $0.02
Yah it CAN look cool, but remember where it originated from. . . .
:)
:) ) but hell, it is still annoying a lot of the time.
:) )
Namely from movies that were originally filmed in a 'wide screen' format.
Only wide compared to the TV sets which actually came AFTER the movie screens, so technically we should be calling the 4:3 ratio Narrow Screen Format instead of movie theaters Wide Screen.
Still though, generating original content for a 4:3 display in a widescreen format is just stupid. You are basicaly throwing away a few hundred pixels of vertical resolution. (think about it, black bars at the top and bottom of the screen. No you do NOT have to cut off items from the side, remember you are GENERATING the content, you can draw in the top and the bottoms were the bars are!)
Now I can understand using it due to the Cliche Factor which creates an instant feeling of action or conflict that has come to be associated with a sudden switch over to a Wide Screen format (Thank You Anime!
One last example. Golden Sun, the GBA RPG.
End scene.
They go over to wide screen as you Sail Off. (ain't a spoiler, trust, you get a ship, just like in all other RPGs, if that surprises you then you need help.
I almost wanted to scream.
(For one thing the GBA screen is ALREADY wide screen to begin with, well more or less,).
The effect was created by just sliding two black bars up and down from the top and bottom of the screen. Oh wow, black out some pixels. ^_^
(even worse are flash animations that completely animate things and then insert the black bars AFTER the fact. Oh man that is soooooooooooooooo stupid. WTF is wrong with people? Imagine if painters did that, completely paint a painting and then add black bars to the top and bottoms of the piece!
Need help treating your acne? Come here!
This is one of the funniest and most ironic things I have read on Slashdot in a long, long time. Sehryan does a perfect job of playing the comic "straight man" who just doesn't get it, in one of the best performances of the year. Thumbs up!
As copyright owner of this comment, I authorize everyone to defeat any technological measure which limits access to it.
Look at google. Google has one of the best website designs in the world. It is simple and loads quickly. The website looks clean and is easily navigated. Go for the minimalist approach on a website. It will probably save you money and bandwith when there are thousands of people who want to see your website every because it is so great.
Wow! that site looks like ass. Crappy colors, crappy graphics at the top, what more could you want!
HTML is not page layout
HTML is not page layout
One more time, for good measure: HTML IS NOT PAGE LAYOUT
Thank you very much.
Content and content management systems aside, the big thing is usability over cross platforms. We all know about image formats and that optimization is a must these days.
The biggest mistake that designers continue to make is to use a huge table to layout the page - this gets ugly when degrading to low end browsers on handheld/wireless platforms. And if you muck up a table then netscape dies.
I use divs for the main layout, often in reverse order from the actual way they end up on the page so that if your browser doesnt support them you might get a menu or a banner or something at the bottom of the page instead.
HTML4 is great, stick a DTD in and keep your CSS in separate files. Degrading to lower end will work, they dont get the design but the content. I check my sites in Opera, Galeon/Mozilla, IE5.5, IE6 and Konqueror to make sure they look right in all of those browsers, and then in Netscape 4 to make sure that the content is still readable. A nice div with style="display:none" holds an unobtrusive message that notifys the user they might want to look at getting a newer browser.
Make sure you validate your HTML and CSS on w3.org, if its valid and well written it *should* degrade. Check it in lynx too, if you have to scroll through a page or two of menus to get to the content then bet that some wireless users will too.
There are some bugs you can exploit as well, to make certain versions of IE import additional sheets if you need to fix that padding bug, and others to make netscape not import your advanced sheet that could screw it up. Another nice thing if you are providing articles, is to include a print media style sheet which formats things for print, some suggestions there are display: none for banners and menus and other unimportant information.
A great place for some real examples of these is the New York Public Libraries style guide at http://www.nypl.org/styleguide/
I do web programming for a living, and we get into some very interesting conversations when we're designing a site. Occasionally, I get some very wierd requests for new and novel interfaces. This is a bad idea.
Although the web is fairly new. almost everybody is expecting to see a few things.
- A navigation bar on the left
- A breadcrumb, like on Yahoo!
- Navigation at the very top
You do anything different, and you risk confusing the hell out of your users.You can argue all you want about why your interface is better,but unless you can hard data from usability testing, don't break tradition without a very good reason.I may be heavily biased, since that is what I do all day, but make absolutely sure your code is valid HTML, and leave out all the kruft. Pretty much all WYSIWYG design interfaces by default don't put out valid html, so don't use them. [Emacs |VI] will perform admirably, produce clean code, and if you use a server side scripting language and hide most of your code in templates, will be as fast or faster than Dreamweaver or Frontpage. (You are using PHP/Coldfusion/CGI/ASP, Right?)
For the Love of (insert your choice of deity here), don't make a site all flash unless you have an extremely good reason to. As of yet, I have never heard of a good reason to do so, but they might, in theory, exist. Anything that you put into a web page, be it Javascript, Flash, Shockwave, audio, video, and massive, massive graphics, slows down the site, makes it harder to load, and will turn people away. I'm not saying to use NO graphics. I use quite a few at work, but keep them small, and realise that users very well may have images, stylesheets, or browser-supplied fonts turned off.
Finally, remember what HTML is designed to do. HTML is a markup language designed to format text. All the nifty graphics and such are good, and they have their place, but they weren't invisioned when HTML was designed, and in a sense, they are foriegn to the medium. Use them with caution.
Whoever mentioned the book Don't Make Me Think has a very good point. That one sentence tells you more about User Interfaces than many books ever will.
Well, I know XML and HTML. But what is DML? ;)
Good design, as many have said, is a function of knowing who your audience is, and what they are expecting to get from your site. From these principles, we can derive the following vague rules of thumb:
/. readers, the answer is simple. Pr0n.
1) If you're about providing information, make the site clean, fast, and easy to read, understand and use (i.e. don't be Amazon.com ).
2) If you're about art, design, or demonstrating particular web technology, then you can make it as fancy as you want.
3) If you're about driving traffic, making money, or distracting
If you design a website, the first thing you should do is find out who your audience is. Once you know who your audience is, then you can start figuring out how the design should work. It's all about the audience.
hallelujah!
Pooty tweet
Content vs. functionality is probably the wrong way to put it. design vs. application or whatnot. In physical terms, a magazine is an application used for viewing various kinds of content. There is a standard way of navigating the content of a magazine with minimal integration into the actual content of the page. You don't spend most of your time gawking over the corners of the pages the way you would the menu on a website. the way you interact with your content tends to be more important than the content itself on the web, only because there is no real standard yet. It's like buying a book with round pages simply because it's got round pages, not because the book is interesting. One of the big goofs of the browser companies in the past few years is that they didn't keep trying to make things better in this respect. You can make a website more visually exciting than print (via Flash, even, with real honest-to-goodness content), and it's far more extensible that way, but most of the innovation in the functionality and application-type area tends to be done by overexcited web designers. When you make your website, try something like this: make the functionality basic, out of the way, and unessential to the design. Make the design itself as dramatic as you can, but approach it like it's super-paper. Maybe I'm just getting sick of making beveled buttons for clients. I really hope the role of "web designer" gets broken up and eaten by "web programmers" and "graphic designers" soon.
The world's only surviving livewriter.
this page has some helpful tips on getting your images down to a reasonable size
Cool Home Pages also has some neat designs you can use for ideas too, but original designs are better.
This was said before, but it IS important to know your audience. I try to stay away from DHTML because it is different in every browser OR requires a lot of maintenance to keep it friendly with all the browsers. However, if your audience is a bunch of Mac zealots you can probably use more modern scripting techniques because Mac users are usually forced to upgrade their hardware often (due to new OS and application requirements).
Try your page on many platforms. A lot of Windows developers (other platforms, where?) forget about Macintosh and Linux users. My number one personal priority when I develop my pages is that it is compatible with as many browsers as possible. However, I'm starting to not care about Netscape since it is a pain in the ass to make it work and fewer and fewer people are using it anyway (upgrade already!). I mainly focus on compatibility with Mozilla and Internet Explorer now, and I think that hits the majority of people.
You have to balance elegant design with compatibility. I figure if I can get 99% of the browsers, I can sacrifice the rest for elegance.
All of these "expert" sites can talk about what is proper website design, but I still hate sites that take forever to load. Especially those "expert" sites.
(12 + 1). Use bobby ( http://www.cast.org/bobby/ ) to help users with disabilities ( For example blind People ) to use this webpage)
Jakob Nielsen has written TONS of material on this subject. Following his words will result in a good website, most of the time. Check out his site at Useit.com.
I think the thing most website designers forget to do is place useability before aesthetics.
Promise porn
I once shot a man who posted too many, "Imagine a beowulf cluster of these"
I don't know about you, but as soon as I opened that site, two young boys in white-on-black shirts and ties showed up at my door...
No. YOU want a new window, YOU go get it yourself.
It doesn't mean much now, it's built for the future.
http://archive.webstandards.org/
Great example of style sheets:
http://www.neuralust.com/~cac6982/
A List Apart:
http://www.alistapart.com/index.html
---
eeww, I'll have a crab juice.
I wouldn't know. I've never seen a good web site yet. I really can't see that anyone has figured this one out.
Sure, some sites are lots better than others, but none of them are really good.
You never really know how close to the edge you can go until you fall off.
You're asking geeks what the best design of a website is? Ut-oh.
The 10 Commandments of Designing Websites for Geeks:
1. Thou shalt make sure the site works in mozilla, galeon, konqueror, etc. while producing multiple errors under MSIE of any version.
2. Thou shalt make the background black and the text off-white. If you're confused about how this should look : a.) format drive b.) install Linux c.) without running startx look at the screen.
3. Thou shalt not use evil plugins.
4.) Websites designed to work with Lynx get extra points.
5.) I know it doesn't relate to design but it needs to be said anyway: ASP bad PHP good.
6.) If Netcraft doesn't report back that the site is running on Linux it doesn't matter, we don't want to see it anyway.
7.) Site must prominently list all important sections either across the top or on the left side. Do not hide your navigation under buttons. We do not like buttons. We surf with graphics off. Additionally, at least one of these links must take us to a page about Beowulf clusters.
8.) If graphics are necessary, please have them be Linux logos, penguins, or naked women.
9.)We like our screens set to utterly ridiculous resolutions. If your site is best viewed at 640x480 keep in mind it will look awfully odd on our screens. (Picture a teacup poodle wearing a sweater designed for a great dane.)
10.) Design is optional.
-Sara
If you feel the sudden need to program, there is always PHP.
And I agree.
--- Sueños del Sur - a webcomic about four young siblings
View Source... Cut & Paste. =)
thelikesofwhich.com
If you're the site owner, the best design is one that pushes your message onto the user. Forced intro-pages, obfuscated flash navigation, 50-click-depth, no "site search" feature, etc, all benefit this perspective - they all increase time of visit and quantity of message exposures.
If you're the user, the opposite holds true. The perfect site is psychic - you go to www.some.com, and the things you're looking for are exactly at the top of the resulting page, perhaps with some useful references near the end. The perfect user-site has a No-Click depth... page loads, bullseye! Done.
So, you can't answer the question yet - you need to figure out who's perception you're using, and what your agenda is. After that, it's concession time... 8)
- SBB
help me i've cloned myself and can't remember which one I am
There's only 1 thing needed on any webpage:
Content - presented in a readable manner.
All else is fluff and unneccessary.
/dTd
Back when I did this for a living we had an ancient machine running win95 (bleh) with IE and NS, running in 640x480 @ 256 colors. We tested every web page on this machine under both browsers. Our rules were simple.
First, the user should NEVER have to scroll horizontally. Never. Period. Second, we used GIFs as often as possible, optimized to a web palette (and therefore look acceptable under 256 colors). Note that obviously for photographs we didn't use gifs--just logos, maps, and other miscellaneous decoration.
These days, I'd probably include Konqueror, Mozilla, NS 4.x, IE, and Opera at a minimum. 640x480 is a bit restrictive these days, so I might be inclined to optimize for 800x600. On the other hand, I know plenty of people (usually older individuals with poor vision) who run in 640x480--even on a 21" monitor.
No God damned Java! No ActiveX! No Javascript! No CSS! Nobody supports ANY of these properly. I'm sick of NS, Moz, and Konqueror hanging on every other web page I view. If I can't view it the first time without changing options, I will NOT go out of my way to view it unless it is absolutely vital information.
If you MUST run with the flock and use Javascript, don't design a site that is unusuable without it. I'll never come back.
Don't write a site entirely in Flash. Yeah, it's pretty. But the functionality sucks. I can't copy text or save pages this way. Forget it.
Don't pop up another window for ANYTHING unless the link says it will do so. Offer it as an option rather than the only choice.
Don't pop your site into a preset size window and disable the tool bars and such. That's just downright cheap and highly annoying. I won't do business with you either.
Don't use named fonts. Just change the sizes, but don't rely on them either--some of us love 1600x1200 on a 21" monitor, but have no choice but the override font sizes so we can see damned sites like Office Depot, GoGoCity.com, or others. No more of this 6pt text nonsense.
Don't link an entire damned sentence.
Okay, I'm just rambling now. Obviously there are a LOT of pet peeves over stuff like this. Deal with it, and you'll find a lot more people hitting your site.
is a good starting place for learning about web design. It's free online, and available via dead tree. You can also try the Lynda books.
One of the best on web design,
Your suggested code will fail when I visit it on a JavaScript-enabled browser
with JavaScript turned off.
Turning off javascript in IE5 is good. It means you don't get pop-up advertisements.
However, it also means you don't get to see the text in <noscript>
tags, because IE5 supports javascript.
<script language="JavaScript">
<!--
window.location="My Javascript-enabled page";
//-->
</script>
<h1>Welcome to my text page</h1>
And pair the real graphic designer, who
knows the difference between good a bad looks, with a usability specialist. Just as good desingers are not good copy writers and visa-versa, so designers and copy writers usaually work in pairs. Designers have learned a lot about design, and a little about usability. So with the designer + usability specialist + copy writer, it'll give the engineering team a lot to do. A good designer can whittle 25 possible approaches down to four that look good, and the usability specialist can help whittle those possibilities down to two that look good and work well for the target user. Then toss in the marketing and brand managment... (Brand managment is the type of stuff people do so that the FSU web site has a FSU "look and feel" and the U of F web site has a U of F "look and feel" - they're the guys who keep track of what the "look and feel" is).
I don't want to sound high-handed, but a good designer knows what looks good, a good copywriter knows what readable and effective text is, and a usability specialist knows good usability. There ain't enough time in the day for someone to be good at all. There are exceptions, but there aren't enough of these superheros to go around.
Microsoft's website is the perfect example of a website that has always been clean, loads fast, and easy to navigate
Everything you need to know about usable design.
My God, it's Full of Source!
OUTSIDE_IP=$(dig +short my.ip @outsideip.net)
I'd say the main thing to remember is have very clear categories. I hate going to some manufacturer's site, getting a dozen options that are all close to what I want, but none seem more appros. than the others. And if you have a 'misc' section, you've completely missed the point!
Secondly, I don't know who in their right mind would recomend WHITE backgrounds! Ye Gods! My retinas are already under constant attack. Reading anything on
Reading text on a white background is like trying to read the label on a fluorescent lightbulb. That's grounds for assault charges as far as I'm concerned.
In my junkbuster (ijbswa) re_filters I stop that crap before I ever have to see it. Most people aren't that fortunate, and get driven away by sickening colors.
Backgound pictures are okay, as long as they are as small as possible, the page is readable without them, and they aren't so busy that they make the page hard to read.
Flash is the tool of the devil and lazy web designers (the same that use frontpage).
Your page should NOT be packed with info. Sites like MSN.com are a good(bad?) example. It makes it hard to navigate, and hard to consume that info. People that go to your site won't get much out of it.
There's millions of other peaves I have, but none of them are being suggested to you by the rest of the slashdotters, s I'll leave it at that.
Slashdot gets worse every day... Pipedot: News for nerds, without the corporate slant
Good design doesn't necessarily mean using only the newest browsers and proprietary technologies. Far from it, I have a friend who develops the page for a local college, and the page is a fairly clean, tight layout that quickly connects the user to the main areas of the site (the one problem is the menu, which was designed by a committee, but last I hear he was fighting to trim it to a reasonable size). All that, and it's not ugly. No scrolling, and the info is right there. The interesting thing in all of this, however, is that he claims that the page works at least decently even with "beta versions of lynx", as he puts it- in short, it was designed with other browsers in mind. (I've been trying to find a browser where the page doesn't work, but so far no success. Any ideas?). Cross-browser compatibility doesn't require multiple versions of the same page, or a stripped down ugly site- just a little thought.
all these are of course simple usability thoughts. you still need to consider file sizes/image optimisation, cross-browser issues, etc. key to all of these though is knowing your target market. if I'm making a site for other designers it's doubtful it would need to support anything less than 32bit colour 1024x768, a higher than usual bandwidth and slightly more patience to see some eyecandy. however cross-browser compatibility becomes a key issue.
thats all for now, i may follow this up a little more if people want it at a later date.
Glenn
The Smrt way to trade CFDs on the ASX
The most important element I would consider to be content. The data one is trying to get across is critical. What is the site selling, or what ideas is it trying to put across? Given the radical difference across the board of different CPU speeds, monitors, capabilities (eg Links/Lynx and text based browsing VS NS/IE[456]) multiple versions of a site designed for the optimum experience on a particular system would be the ideal. This would be where templated frameworks such as AWF (Active Web Framework) come in useful. Fast, cacheable data and the ability for different templates to generate Dynamic HTML or static content as needed is likely to produce the best result in most circumstances. On the other hand, some sites are designed with the eye-candy content being the more important factor, such as theme sites for Movies, fan sites etc. The target audience would determine which of these 2 approaches to take.
Award-winning London-based designers of Requiemforadream.com and Donniedarko.com. Some of the most obfuscated, beautiful (flash) website design on the internet. A lesson about how to draw people in and let them forage for content in a way that piques their interest, generates buzz, and makes viewers crave more, more, more.
To re-iterate: keep the content the main focus of the site, not some flashy gimmick. Keep it cleanly laid-out, and easy on the eyes (neutral colors work well, bright colors only for details).
And my biggest gripe: Javascript. I personally surf with Javascript support turned off. This, as you should know, can avoid a host of problems ranging from annoying pop-ups to full-out browser hijacking by warez sites with pr0n affiliations. If I need to have javascript enabled to use your site, then I won't use it. That's that.
No blink tags!
"when the going get's wierd the wierd turn pro." -hst
As an example of what happens when people don't take your advice:
1. Turn off Javascript
2. Go to http://www.directv.com/
3. Prepare to wait a long time.
This is called progress?
It seems many web designers, such as some from A List Apart, seem to confuse the support of standards with standards compliance. There is a difference. Compliance is an issue considered for each supported standard. A browser may not support some standard for some reason (maybe it was written before that standard was finalized). But it could well be compliant with those standards it does accept. So please don't use the term "standards compliant browser" when you're upset because it doesn't support every W3C standard out there. Use "browser that fully supports every W3C standard" when you mean that.
now we need to go OSS in diesel cars
I'm with you for Google and friends, but slashdot is NOT a good example of good web design.
First, the graphics are just ugly. I dunno, I guess this is a subjective thing, but I have to read in "light mode" (which I think actually has a rather usable interface even on real browsers) or my eyes will fall out.
Second, the front page is filled with all sorts of clutter that needn't be there -- especially stuff that is old and hardly ever changes.
However, I agree with you that the content is the most important thing.
We are plesed to inform you that, after careful consideration, we have accepted your troll into the Troll Library.
You show a masterful skill at trolling.
Thank you for your time and your contribution.
Nielsen is so focused on practical usability that aesthetics are out the window.
Mastering a visual medium like the web means that, in most instances, you have to find the intersection of good content, usability, and pleasing design.
when your web site is bigoted, ignorant, and moroever, obnoxious? Don't use the word 'inextricably' in a flagrantly incorrect fashion if your intent is to make yourself look cool and make others feel stupid.
Moderators: Read his page before you mod me down.
{begin rant}Designers ought to write 100%-valid html, period. I think the idea of coming up with a design, then spending weeks getting it to work in IE (all versions), Netscape (ditto), and the minor browsers (I'm not knocking Konquerer, just trying to make a point) is utter foolishness. Graphics are nice added touches, but having to depend upon them for your site to work is lame. Same thing for flash, javascript, etc.. If the browser can't or won't run these extras, the site ought to remain usable (i.e. degrade gracefully).{end rant}
Need a Linux consultant in New Orleans?
Lots and lots of pop-ups. and it helps if you can get x-10 or some pron site to pay for your bandwidth via click throughs etc...
oh and naked women doing nasty things with animals you always thought were extinct.
Whilst there are a few good rules that should generally be followed most of the time, there is no such thing as a perfect web design, or a hard and fast design rule for any user interface. Much of what makes a design work relates to individual things such as the way one perceives information, aesthetics and so on. It also largely depends on the nature of the information that you want to convey, both explicit and tacit. Given that you have no control over who will visit your site, and therefore their personal ideosyncrasies, all you can hope for is a good interface that works for most people most of the time. The only way to do this is to test, test, test and, oh yeah, do a bit more testing.
The latest nightly builds of mozilla now have the option to now open pages in new windows.
Got friends?
Simplicity in design is beautiful... check out this site: http://www.samerjan.com
Make it work in Lynx. If it works in Lynx, it works. People may poo-poo this sort of thing, but I can't tell you how many worthless sites packed to the rim with crappy flash, ugly midi and buggy scripting I've had to wade through (and quickly exit forever) that could have been saved had their designers performed this simple test.
There's nothing wrong with having a nice looking site, but content rules, my friend, so do nothing that would impede a user from searching out, finding and using that content.
regards
ac23
1) Do not use Flash for navigation. Or if you do, be sure to provide some alternate means of navigating as well. No one should have to download plug-ins just to navigate the site.
2) Keep your page size down. Most users are still behind modems. As a corollary, don't use graphics just to have graphics; put them there with a purpose in mind.
3) Make your pages validate. Just a quick run through Tidy will fix this up for you. I'm not saying you necessarily have to use structure HTML (I think you [i]should, [/i]but that's not as important as plain old validation). The Slash authors would do well to take this one to heart.
4) Don't open any new windows, except in response to clicking links, and only do this very sparingly. Popups are annoying.
5) Automatic music = BAD. Embed music if you want, but provide a PLAY, and more importantly, a STOP button. This means no using the evil IE-specific BGSOUND tag.
6) Unless you're trying to show off your m@d j@\/A$kr1p7 $k1Llz, don't use it unnecessarily. Be particularly careful with dialog bozes and alerts.
7) Visit AnyBrowser, A List Apart, and the old WebStandards.org sites. While these latter two sometimes miss the point of standards-compliance (it's not just about neat tricks, though you certainly can do these), it's important to at least get the page legible in anything you throw at it, even if the design doesn't look right in some of them. In the end, design is nice, but the information is what's really important.
7) Speaking of that last one, don't let the design get in the way of your information. Grey text on a white background is a Bad Idea. So is anything that's blinking. And so on, and so forth.
Green, gray, and black.
- Never suggest that "this site is best viewed with..." unless Microsoft or Netscape is paying you to do so
- Never refuse to load a page because the browser doesn't support the latest specifacation
- Always check you work with lynx
- Keep your byte count low on your initial page
- Don't animate gifs unless you have a very good reason to (cute is NOT a reason.)
- <blink> kills
- If clicking one of your links will cause the viewer to download more than about 150KB, warn them
- Funky colors often look stupid
- Include contact information up front, that's often the reason someone came to the site in the first place
- Remember, it's a web page, not a brochure
- Remember, it's a web page, not a movie trailer
- There is no sound spec in HTML, don't send me audio unless I ask for it
- Don't make me wade through your mission statement to find out about your products
- Don't make me fill out a form for info, give me a toll-free number or an email address with a name
- Don't fill out the subject for me in a mailto link
- Don't send me to sales@ or info@, send me to a person
- If you have a big site, provide a map of it
I could go on. The basic gist is, "if it bothers you it will bother others." Don't design something into your pages without a reason. Don't make it look like everyone elses just so it looks like everyone elses. My page (url above) is a very BAD example, it was done in 1995 when I (and not many) had a clue. One that I did do back then that has done well is kiwa.com, a site that is very simple but gives Kiwa's buyers exactly what they want. I'm not a web designer so I can't really claim to "design". I do know what I like and what pisses me off though.-- I have a private email server in my basement.
... should the perfect web design incorperate?
;-)
There is no perfect web design, and it would obviously differ for your type of site.
However, everyone but IE 3> and konqueror has javascript. Netscape 4.x> tend to render best with transitional html, as well as IE5>. Mozilla, netscape 6.x, IE 6, Opera 5 usually do well with a XHTML and CSS combination.
Your closest to perfect solution would be to use javascript to select a different page for Netscape 4> than Mozilla and Opera. Then be a MAN and just ignore IE
Conclusion: Everthing would have worked out fine if M$ hadn't come along and messed it up, no surprise here.
"And we have seen and do testify that the Father sent the Son to be the Savior of the World"
1 John 4:14
1) Design should serve the function of the site. Whatever the sites mission is, make sure each element furthers that mission, and does not detract from it.
More specifically-
2) Do not overuse graphics. Graphics should be of lowest quality and smallest size possible while still preserving clarity. This saves alot of time displaying the page.
3) Use a text font large enough to read, in a color that contrasts well with the background. Your viewers should not have to select the text or override the websites color scheme to read your text. Most websurfers don't know to do either and even those that do, don't want to be bothered and will surf to your competitors.
4) Don't do in JavaScript what can be done in HTML. Don't do in Java what can be done in JavaScript. Don't do ANYTHING that requires a plug in unless it is necesary(not just nice) to the mission of the site. Actaully- DOn't do anything in anything other than W3C standard HTML unless you need to. And keep those uses of non standard code to an absolute minimum.
With all that said, if you can do an adequate page in standard HTML, but have an idea for an absolute knockout site with fancy gizmos, I'd recommend do both. Have a basic standard HTML screen as people enter the site, with a special effects heavy version and a basic HTML version. Provide links on that page to any fonts/plugins/etc they need to view the full version of the site. That way, you get the people who are impressed by the fancy shit and the people that don't have time to be bothered by a slow website.
Here's a useful (and fun!) way to evaluate web design.
1. Obtain one (1) bottle of your favorite 80+ proof liquor.
2. Drink past tolerance limits.
3. Load website. (you may wish to do this step before #2)
4. Try to navigate.
If you can easily navigate and find content, it's pretty solid design.
You laugh, but it really is a useful metric. Try it and load amazon.com. To many blocks of test, it's cluttered and thousands of pathways. Now compare to something like slashdot. There's still a large amount of content, but it's still easy to find the important stuff.
Plus its give you an excuse to get hammered at work.
Vote Technocratic! Government by killer robots!
Thankfully I don't run across it too often, but it really bothers me when I run across a page like this that locks users completely out of the website unless they change browsers. Unless I really need to know something in the website, I'm just going to move on, and I'd wager most other peole will too.
Design is important, but not to the complete exclusion of content.
Yeah, I have a webcomic...
...rather than create an impression or image:
-- simple is better than complex
-- don't let the design distract readers from your words
-- use black text on white
-- people dance, words stay in one place
-- use more white space than you think necessary
-- don't show off; don't be cute
-- Slashdot: When Public Access TV Says "No"
Check out anamorph for patterns patterned ala Christopher Alexander's Pattern Language.
the best web site design keeps its audience as its primary design driver. Most people still use modems.
I like websites where the content is readable and easy to find. I don't want to look at lots of images or listen to music (or wait for those files to download). I shouldn't have to click through a bunch of pages to find what I'm looking for.
Make the content easy to read, and make it easy for me to navigate to the content I want.
And don't put anything important up in the top inch or so, where banner ads usually are on many sites. I've developed a blind spot there, so I won't see it.
Cara Hart chart@eNOSPAMfurn.com Systems Administrator eFurn.com, LLC. and ARITEK Systems, Inc.
And if you want to hire a web designer, ask them what they think of Jakob Nielsen, and don't touch them if they make a face. "Designers" hate him because he wants them to put their toys away and do their job.
He's got a new book out that's pretty good: Homepage Usability: 50 Websites Deconstructed. As is his previous book: Designing Web Usability: The Practice of Simplicity
Jakob Nielsen's schtick is that his opinions are actually based on useability studies. Everyone else is just guessing, Jakob Nielsen knows.
I give you two amusing web pages: Need To Know and Naked News (Click through for the news page and start the sample). Which page is best Grasshopper? Weigh the thought most carefully in your head - is the page with almost only text best because it loads quickly? Or does the page with graphics make you feel better? Is a functional page better than an experimental art page? Feel your way around the categories that the question generates.
Ahaa Grasshopper!, you have discovered that it depends on your audience. There is no single answer to your question - sometimes wonderful graphics are good, and sometimes plain is good.
A wiser question perhaps is - What are the the underlying rules of good design? Sadly Grasshopper we cannot tell you, for it is akin to sculpture - the masters of the art take many years to come to an understanding. We can only show you the tools, you must learn yourself by doing.
Learn like the masters. Study the web pages you meet, compare and contrast them to help you gain an understanding of how they work and the degree of success. Most learning will show you what not to do. Buy some books on design and think how you could apply the ideas that they propose. Remember that those that profess themselves to be masters are often people who can no longer learn. Be wary of their advice. Think of your web pages in various ways - grids, spirals, concentric circles and other patterns - examine the possible layouts and feels that these generate. Consider whether dynamic or fixed sizing will be best for your audience. Consider your web page as your clay and mould it so that it feels good to you. Then ask some ordinary users how you can improve it.
Here is a crumb I can offer to help you down the difficult path you have chosen to follow... http://www.tangledtime.com/article.php3?sid=200012 01184155 for some ideas. Disclosure: I wrote that and much of it has become outdated as the design language of the web has evolved.
On my 28.8, if your page is larger than 50K it will probably never be loaded on my machine. Even on cable, there is a perceivable difference between a 10K page and 300K page.
Now maybe if you can stick a graphic designer *under* an HCI (human-computer interface) *engineer* who will sit with people on a 9600 modem and measure their frustration, then you can give the graphic designer a job.
http://www.tuxedo.org/~esr/html-hell.html
I always lose the font wars. On many monitors, sans serif fonts are easier on the eye than the default serifed fonts. Serifed fonts are also difficult to read when made tiny. On project after project I get requests to change the font for the few readers who would prefer helvetica but couldn't figure out how to change their browser defaults. The original idea for the web was for the end user to have as much control over their environment as possible, and the web site would concentrate on content.
Close to the right idea, but implemented the wrong way 'round.
Have javascript, if enabled, immediately redirect to another page which utilizes all that crap. That way, if anybody is promiscuously surfing with it enabled they can have all the superfluous code you can shove down their throats, while the rest of us don't have to wait for the change of venue.
Why the hell are you going there? The fucking top 25 list consists of .. flash site, flash site, flash site, flash site... ..
Flash is half ass tv.
www.zombo.com --nuff said.
You don't have that option... as a user, I can leave your site if I want to, by turning off my computer if necessary. And if you make it inordinately difficult for me to leave your site when I want to, by doing your best to disable my normal browser functions, then my likely choice will be not to go back to your site again, and you'll lose my business.
--Dan
Web Tips
Other things to consider:
Don't constrain your content to a two inch-wide column no matter how wide the user's browser window is.
Don't have a picture on your front page saying "click here to enter this site".
Don't use Flash, unless you're selling Flash consultancy services.
Listen to the clever people. Not me, but Joel Spolsky.
From his book, User Interface Design for Programmers:
Usability is not everything. If usability engineers designed a nightclub, it would be clean, quiet, brightly lit, with lots of places to sit down, plenty of bartenders, menus written in 18-point sans-serif, and easy-to-find bathrooms. But nobody would be there. They would all be down the street at Coyote Ugly pouring beer on each other.
(he also said that on his site in Nov 2000.)
Joel's a far more clever guy than I, and is always much more eloquent in expressing ideas. You should listen to him, too.
J.J.
skribe
Blog
A company that stays in business for more than 9 months.
The w3c have the good oil on the technical end of things, but they have some shocking design, if you don't believe me, see shockers like:
http://www.w3.org/MarkUp/#xhtml-basic
Oh, and don't talk to me about their bad links!
netdiver.net has a good selection of nice website and cutting edge designs. Subscribe to lists like the ones at evolt.org, and read A List Apart and Zeldman. They all preach standards and do great work.
m.kelley
life is like a freeway, if you don't look you could miss it.
black background
light grey text
no images
no frames
no flash
.
.
.
I opened that site and Opera spewed about 15 "illegal cookie" dialogs at me!
Well designed indeed...
. o O ("Look, Daddy, I can karma whore!" "That's nice, honey.")
--
viqsi - See "vixen"
If we do not change our direction we are likely to end up where we are headed.
Great looks, straightforward to navigate, and the content you're after, but the site is frustratingly buggy, frequently unavailable, and/or easily hacked.
Sites with these defects are not well designed, no matter how well other aspects are designed.
javascript has some great uses, but as long as people continue to abuse it (popping up shit left and right, resizing windows, stealing focus, ...) i and many others refuse to leave it enabled. it's just much easier to turn it off and be done with all that.
...)
with that said, don't lock out people from your site just because they turned javascript off. personally i consider this to be very poor design (too bad everyone does it
AC
Actually, I've found gray (#999999) on dark blue (#000055) to be easier to read than black on white.
Tbis means learning the proper way to design web pages using HTML (or XHTML now). This means using layers (div tags) more often than tables (which should only be used to display tabular data/information), and with the use of CSS to seperate content from presentation. This is often a hard practice to follow as some browsers don't work well with CSS (Netscape 4) and others can often render the same elements differently. I suggest checking out A List Apart (http://www.alistapart.com) for some good information.
I like the designs of most Open Source web sites. Take freshmeat.net for example, very basic, but still catches the eye. Also they are loaded with content, which I like.
:p) but after having the Aqua themes for a while I just get tired of them, I just want my computer to run fast.
For me, flashy graphics only last so long. Like Windows XP and OS X, sure they may look nice (well, OS X
I agree that you should K.I.S.S. and concentrate on something that interests people (like...content). So don't waste all your time on making some "cool" DHTML menu.
Not to say you shouldn't try, of course. But bear in mind that different purposes, feature sets, and demographics are going to require different things. Consider what you want the site to be and do, and what your target users will expect and know.
There are some good books on Web design in particular, including Jakob Nielsen's Designing Web Usability and Flanders and Willis' Web Pages that Suck. You might also check out more general books on Human Factors and HCI, including Tufte's books on information design and Donald Norman's The Design of Everyday Things (these examples are just a few). You might also check out Jakob Nielsen's Web site at useit.com, both for the articles and for the links to other material. asktog.com is also sometimes helpful.
There's also a book out called Web Sites That Suck. (ISBN: 078212187X) Enter taining yet informative. One is almost suprised how many large corporations made the book.
It really just comes down to common sense and efficiency. Like several people have said already, you have to know your audience. If 0.001% of your audience uses Netscape, feel free to go wild with the IE-only tags. Likewise, if a sizeable chunk uses it, you better design your site in Netscape first since it'll be more likely to view smoothly in IE than a site created from the other direction.
Also consider how many people are on the Internet these days. Consider how many of them don't even know what the hell Opera is, and may have heard vague mentions of Linux. Sure, they're popular, but if your site isn't tech-oriented, the chance of your viewers using them isn't very high.
There's really only 3 things that apply to every site (though many fail to adhere to them).
1. It must load fast. The most tolerant users have been known to wait 30 seconds. That's really lenient.
2. The design must be visually appealing and the navigation system must be easy to use. You may WANT flashy, especially if you're trying to sell a product.
3. Don't use banner ads. Not only do they add to the overall clutter of a site; throwing in extra colors that don't fit and basically just acting as a blemish on the screen, they don't work. I dare you to find a company who's primary source of income is the banner ads on their site, and they're actually making money. Unlike television ads, magazine ads, etc. people can actually train their eyes to stay far away from banner ads.
To create the best web design for your site, I very highly recommend taking a look at Jakob Nielsen's book, "Designing Web Usability" (New Riders, 2000)
flow being that someone will spend hours on end and then keep coming back because you have such good content. Content can be games, articles, novels, links, databases, all sorts of things. And to get flow you need to work it out on paper first so you can get your creative juices flowing with out technical stuff interupting you.
I have an article in a mag I read that has helped me in the music mixing stage of things. The writers talks about making a good product by not chopping and changing from creative to tech and stoping your creative brain from flowing with ideas.
Well that is my thought on how to get a good website. It is nothing technical just an philosophy to get you to make the best you can.
If you go to the University of North Dakota online campus map, you will love the music:
http://www.und.edu/tour/flash/tour.htm
(For those of you who don't recognize it: It's Deutschland, Deutschland ueber alles, a song even the Germans don't play since 1945.)
Many posters have asked - who is your audience? Both the viewers and search engines! After all, a biz website is supposed to attract traffic, right? For your SE results, stick with basic design principles and put your context in text form. Make sure to cover all the meta tags, and hand-submit to SE's the right way! Stick to tables if possible. Design for slower download speed and smaller monitors/resolutions. If you must use javascript, put it in separate external.js file. There are good situations for using Flash & DHTML/XML - if designing for an artist or programming geek.But this is rare if you usually build for businesses. Don't build entire site around a database - SE's are still behind the times on reading those. hope I've added something constructive to this subject.....
Content.
You can have the flashiest graphics, the coolest sound, the niftiest interface, but if you
don't have anything to say, there is no point.
If only everyone would just kill the color options in body tags... People could acually choose what color they want to read in. Imagine that: a choice! A website that wants to let you (that's right: you!) choose what color, background, etc. you want to browse in at *their* web page. I like to make my computer look as cool as possible (statistics show that people who keep their cars clean take better care of them - extend that to themes/color schemes on computers) and the only things that just won't match are web pages. Tell the browser to ignore the color tags and it doesn't display right on half the pages. This goes right along with the problem of non-standard interfaces/skins/themes in windows.
And let's extend on this - kill java, flash, etc. If a company webpage *really* needs flash to make a nice little menu system or java so you can see buttons change (images shouldn't be links anyways) as the mouse hovers over them, then they need to fire some web designers (kinda like clothing designers, huh) and go text-only. But no: it has to be a billboard, an enormous advertisment that all the customers need to stumble over to get in. These companies don't realize that a webpage should be a storefront or office, not a billboard or TV ad.
Long live lynx!
Carefree use of Flash, ActiveX and the BLINK tag. Mmm... tasty.
However, putting everything in lower case is a BAD idea. There is a reason why punctuation exists...
I always thought a good gui was like a good API: minimal and complete.
Minimal, as it's just confusing to give me a million ways to do same things in such a small amount of space.
Complete, as it's frustrating if there's something I *should* be able to do, but can't!
-Bill
SlashSig Karma: Excellent (mostly affected by moderatio
javascript/java/flash/etc imho is just a pain in the arse when used for lame pull-down menus (with in-built dodgyness and lag) etc.
use technology if it makes things more efficient, or easier to use - don't just use it for the sake of it.
just my opinion
smash
I run: Windows, OS X, Linux, FreeBSD. Just because you have a hammer, doesn't mean everything is a nail.
I know of people who use dreamweaver and golive who use the templates and mix-match without even thinking of the company's look and feel. These sometimes make the most horrible designs! I also can't stand it when web designers do not know the html behind the design!
===== Fiction ebooks and paperbacks.
I went to the link in the topic and got a "Server Busy" error ... I think the perfect website probably should incorporate dealing with high traffic / efficiency as well as good visual design =)
Sorry, Server Busy
--- Als de angst oprukt, trekt de logica zich terug.
It looks like this is going to get buried under the barrage of other posts, but I thought it worth mentioning anyway: go check out W3C's Web Accessibility Initiative. They have a list of guidelines and checkpoints for making sure your web site can be read by the widest possible range of users.
Nowadays, it's not about this anymore. It's about the topic that the text discuss and the information that the page present. I am still visiting pages that contain pure TXT documents (e.g. ietf.org) and it still gives me the information I need.
The internet needs a better way of users telling everybody the actual value of an information. This can atleast not be done by renting HTML coders to produce a site that still lack of interesting info.
Lots of people have given their opinion on colors, here's mine:
As far as possible don't specify colors at all on your pages. HTML is about Viewer Control . I stare at the screen for hours on end, and white backgounds get too bright for me. I have no problem when I'm using a browser that allows me to override document settings with my defaults, but otherwise I find looking at pages with different backgrounds a real pain.
To summarize, your markup should be structural, not presentational.
Is there any site out there that allows you to view how a page renders on other platforms, not just other browsers? Being able to see how a page renders in, say, Netscape on a Mac would be a mighty useful tool... I don't see that on anybrowser.com?
Very simple.
Some sites only have functionality, and some only design.
But a good webdesign unites both.
Don't answer me. Moderate. Slashdot is about moderation, not discussion.
Corporate web sites these days are starting to get rid of all the flash and big images that some people seem to think that the web is all about.
Having a Macromedia Flash page is great if you are a game development company... but then again, look at some of the really cool sites associated with games. They are more into using DHTML rather than flash.
As a professional web designer, I know that when I go to check out sites, if it hasn't loaded in less than a minute, I'm out of there.
Having lots of graphics isn't as bad as some would think, so long as you break the one big image into a heap of smaller images. Even on a 33.6k modem, the bandwidth is enough that the browser can load 10 10k images quicker than trying to load a single 100k image. And if you pre-load the images of your buttons and any other serious images on your site. It will load quicker and then usability starts coming into the equation.
If you have a lot of content on your pages, break it up into smaller sentences and paragraphs (I used to know the paragraph readability formula, but that was in first year at university).
If someone has to read huge paragraphs of content, they will soon lose track of what they are trying to read and get bored with it. Once that happens, forget it, you have lost the person reading the page.
Use of graphics in strategic area's are good, especially if they are related to the content and enhance the content. Use of hyper-linked thumbnails are better unless the image contains critical information, then display the image in a prominent position.
Try and avoid excessive scrolling as well. There is nothing worse than having more than 2 screens of information loaded into a single page. It's easier to put a link to a second page at the bottom of the 2 screens of content.
Also, you should try and scale your information to the maximum width of the browser, there is nothing worse than looking at a page that is designed for 800*600 when your monitor is set to a screen resolution of 1280*1024... where did all that white space come from?
Navigation of a site is also important. The main navigation should be in a prominent position. These days, a lot of people are starting to put their navigation at the top of the page. This means that they usually have an extra 150 pixels of screen real estate to play with.
For cross-browser text sizes, it is better to look towards using pixel size rather than point size. This is because IE renders point size slightly smaller than Netscape, and IE for the Mac renders if differently again.
The point that I am trying to make, is that if you want to, you can design a site with all the latest bells and whistles available to you, but if it doesn't work in all browsers, you're up that well known creek without a paddle. If you keep a site simple, but pleasant to look at, you will find a lot of people coming back again. And if you are in business, this is what it is all about at the end of the day.
*** I had a
Slashdot has quite an amount of good programmers and a big heap of *nix users (or at least 'nix wannabees). /.ers don't know sh*t about webdesign, in contrary to what they think their Webdesign is in quality.
/. patrons. Of course I would be one of the exceptions to that. :-)
But honestly now, most rant about compatability and flash being o so crappy and superfluos (actually one of the main reasons to use flash is/was compatability), smartass about HTML being no typesetting language (blahblahblah...it makes me sick!) and at the same time make the crappiest webdesign one could ever imagine. Reading some the comments posted here just gets me fuming again about the arrogant *nix comunity.
Bluntly said: Most
My suggestion:
Get into it and try for yourself and learn form the people you've seen good webdesign from. A very good community is built around Zeldmans AListApart and WebStandards.org(stick to this site when your going into implementation phase!).
Top of the pops DESIGN (.dcr and flash - of course) you can find at Yugo Nakamuras Site Yugop (check out the archives!!) and at NosePilot(the link at the bottom!).
Note that this is DESIGN that is kinda over the top in the way that it actually allready is art.
If you're going to make a massivley content orientaded site you might want to go dynamic form the begining. Check out PHP/MySQL for this. Or get youself a full featured GPLd CMS that are out there for a dime a dozen, maybe like PHPNuke. But that's actually all more webprogramming, that kinda comes later on...
Good luck. Oh, and NEVER discuss design with the people of kornshell.com, xfree.org or listen to the advice from
We suffer more in our imagination than in reality. - Seneca
Keep it open. Don't have everything crammed into as small a space as possible. Entire pages of nothing but textlinks are highly confusing...put stuff in logical places. Don't "nest" links in menus-keep functionality simple, and make it easy to find that which the user wants to find. In the case of a corporate information website, this may involve redundancy. Don't be afraid to be redundant...better to be redundant than to have a frustrated user (potential customer) leave the site.
Don't adhere to a traditional color scheme...make your own.
Check out my website - it's my own personal "optimal design..." - http://lemonwood.aexx.net/
google: uses javascript, uses graphics, but not relying on it.
gmx: dito (though they are using such gimmicks excessively...)
yahoo: dito
altavista: dito
not necessary to say something about /. or fm here...
What they have in common: useful functions/content.
What success would a "real" store have with a sign at the door: "Sorry but you have to wear shoes by company XY to enter this shop"?
Thought I'd check out their site, given the free plug on /. Here's the reply from their server.
"Sorry, server busy. We are currently experiencing extreme traffic due to slashdot.org, which already consumed 40 gigabytes of bandwidth in just 12 hours. We are sorry for the inconvenience. Please check back later."
Doubt I will...
Slashdot ain't such a shining example of web design, when you think about it. Using 3 different link colours (green, dark grey and black) is totally confusing and black is about the worst possible choice, ie. no contrast with text. Slashdot's worst web design sin, however, is the abandonment of visited link colour. Navigating vast tracts of nested threads without this feature is a royal pain in the **** . Surely Slashdot, of all sites, could have done better on the basics.
If you don't want to use XHTML, then use HTML 4.0 and tidy. Using the -e option will report errors. Again, I am surprised by how many people don't use a tool like tidy, which is available for free from the W3C.
Tidy doesn't catch all HTML violations. However, you can also use the W3C's validator, which will validate your HTML against a DTD.
Erm, the original Acadamy Format used in cinemas had an aspect ratio of 1.37:1 - which is pretty close to the 1.33:1 that TVs use.
It wasn't until after the introduction of TVs and the fall of Cinema attendance in the 1950s that the widescreen formats were introduced.
So technically we shouldn't be calling TV's "Narrow Screen" at all, as the American National Television Standards Committee adopted the basic Academy Frame ratio for television when it was introduced and simply rounded off the proportions to whole numbers i.e. 4:3
try to make ends meet, you're a slave to money, then you die
Web site design needs a lot of different things, Information architecture & usability, HTML & XHTML, CSS & implementation bugs, search engine ideas and keyword research, Web server techniques & content management, deeziner discussion & tech discussion, good practices & sucky practices.
/. home page is a good start.
I could go on. My point is that you can either be a half-hearted jack-of-all-trades, or do the Web a favour and pick something, learn to understand it and collaborate with people who have complimentary skills.
Of course a Web site is no use if no one visits it. A link from the
Calum
Whenever I make a page with a fixed width (which would be most of the time), I make it no more than 600 pixels wide. I remember web browsing on a Mac IICI. That and I like having small browser windows, and I realize some people are looking at the web on TV sets.
I wish web designers would limit themselves to 800 by 600 MAXIMUM, without EVER having a single table cell or column wider than 640 pixels if it doesn't have to be. Either that or just not have fixed widths.
web design is one of the best applications of the "kiss" methodology of design. Rarely does a site impress me with its bells and whistles. I want content and easy navigation.
vgullotta wrote:
I don't want to give my customers a choice as to weather or not they are going to leave my site. I want them there spending money on my products.
Then I suppose you force their browser full-screen, remove their navigation buttons and disable the option to quit. And that makes your income go up, up, up.
You know, since taking away the option to leaves gets people to spend money.
Right?
-Waldo Jaquith
the one where user isnt AWARE there's a "design". He just gets on with the content. good design makes it easy for the user to do what he is suposed to do.
rest (95% of websites) is poor design.
dont advertise your company here.
0xC3
You always gotta ruin things for us!
Bandwidth Limit Exceeded
The server is temporarily unable to service your request due to the site owner reaching his/her bandwidth limit. Please try again later.
Apache/1.3.20 Server at www.wowwebdesigns.com Port 80
;/
seem to disagree with your POV. I'm admittedly biased, (see my site, but I'm not the only one. In fact, I'd much prefer to have the web designer set the background color, as very often you run across sites that assume you have your default background color set to white, so there main logo is black text with a drop shadow on a white rectangle--which looks like crap if your background color is grey (default UNIX Netscape) or light blue or tan.
Admittedly people need to be careful and judicious when designing pages. Putting red text on a fractal background image or lime green text on an off blue background are evil. If you want to try overriding somebodie's site with images=off background=grey text=black, good luck, but you may find the site to be an ugly mess.
What is your Slash Rating?
Sorry, server busy. We are currently experiencing extreme traffic due to slashdot.org, which already consumed 40 gigabytes of bandwidth in just 12 hours. We are sorry for the inconvenience. Please check back later
Sorry people , you really know nothing about webdesign and being clever when according to this article , the best webdeveloper is right here and you should all look and learn
Msg from Wow Web Designs: "Sorry, server busy. We can only accept 40 simultaneous users at the time being due to the extreme traffic coming from slashdot.org, which already consumed 40 GB of bandwidth. We are sorry for the inconvenience. Please check back later."
it has everything you need.
music
text that follows your mouse
clear intent
http://members.aol.com/oneqck76ta
How should one argue to keep webdesigners from designing web pages only viewable in MSIE 4+ if they are comfortable with the fact that their pages can "only" be viewed by 90% (or so) of their potential users?
As long as the bulk of webdesigners take this view we are forever stuck with javascript-only menus and flash-only sites. Has anyone ever "exorcised" one of these webdesigners?
Terje
Assumption is the mother of all fuckups
it really needs to be able to handle a fat Horsefly and a teeny Mosquito without falling apart - ideally it should be accesible but not too exposed to the wind, and anchored in at least 2 places to something solid.
That was classic intercourse!
I agree that there are times when I want to open a new window, and there are times when I don't. There are times when a good design might want to a user to have a new window, however, the problem that I see with most designs these days is that they attempt to use Javascript for this.
You DO NOT need Javascript to cause the link to pop up in a new window. If you're one of those fascist bastards who has to control the user's experience (take off the chrome, etc), you might need javascript, but if it's just going to pop up in a new window, use TARGET inside the <A>. You can even specify it inside a <FORM> tag.
This way, when we, as content consumers, wish to open the link in a new window, and we choose 'Open Link In New Window', we don't get blank window with a javascript error at the top, because the source for the javascript isn't in the new window.
As with anything in design, there are right times, and wrong times to use just about anything. Just because there are right times to use Feature X, it doesn't mean that Application Y is that right time.
The most important advise I can give you is to know your audience.
Build it, and they will come^Hplain.