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.
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!
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/
Not just that, but also make sure that every word on your web page has a different color. That makes things easier to read.
// file: mice.h
#include "frickin_lasers.h"
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....
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=='=++
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.
Everything you want to now is here. Enjoy!
...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.
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.
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
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.
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.
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.
Or, instead of going into this foolish mindset of thinking that you have to code for every platform, just write your web page using the standards that are out there, and they will render just fine on any standards compliant web browser. It's not that hard!
-Rob
One wonderful IE feature... MARQUEE tags
message goes here
(try it)
-- Note: These Comments are Generated by ME! Not You! ME!
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?"
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 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!
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.
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)
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
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.
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
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.
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.
-"I seem to be having tremendous difficulty with my lifestyle." - Arthur Dent
"A user," huh? Suuuuuure. And these condoms are for your, uh, friend, right? ;)
"If he thinks he can hide and run from the United States and our allies, he's sorely mistaken." Bush on bin Laden
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
OSWD.org
"God fights on the side with the best artillery." - Napoleon, Marshal of France - speaking truth to power
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?
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.
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.
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!
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"
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
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.
Some of the best websites usually have a disclamer like "must be 18 and older to enter"
http://www.kubuntu.org/
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
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.
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
Bullshit!
Making a page that looks good on every browser is as simple as using standard W3C approved HTML. Once you start using advanced CSS you'll run into a few problems, but they're managable. But once you start using scripts, animations, frames and proprietary plugins, you'll never get it to look decent on any browser but they one you're coding for.
We've got a new guy at work who used to be a web developer. I had a long discussion with him about why websites were designed for specific browsers. Why use all these proprietary plugins and scripts redirecting browsers to appropriate versions, instead of just using the standards that are out there. The answer was surprising to me. "The requirement and specifications that come from marketing demand that the website look *identical* to every viewer."
He was serious. His former company was paying testers to measure stuff on the screen, to verify that a box in NS wasn't two pixels taller than it was under IE. They even had some pages on the site that were 100% Flash. If more browsers could handle embedded PDF, they'd use that instead. Ridiculous.
Use FRAMES and Images maps if you need it.
Good idea. Especially since you NEVER need to use frames, and should ALWAYS accompany image maps with standard text navigation.
Sheesh, I bet you're one of these guys that doesn't even use alt tags.
Flash and Shockwave when necessary
And just when are Flash and Shockwave ever necessary?
A Government Is a Body of People, Usually Notably Ungoverned
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?
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.
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
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
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.
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
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.
Three possibilities:
- You're lazy.
- You're stupid.
- You're a troll.
It's not impossible; lots of sites manage somehow to pull it off.What does this have to do with anything? I use the latest IE 99% of the time, but why should someone's choice of browser matter two shits in whether someone can access your site?
Frames are evil. Use CSS positioning instead. Nutscrape <=4 doesn't like it, but you can serve up a tables-based layout to deal with them if you must.
Image maps are appropriate for some purposes (such as enabling a selection based on geographic location), but they shouldn't be used for everything.
Now you're just rambling. The only JavaScript I've run across that's genuinely useful is the one that keeps your site from being framed inside another site. Nearly everything else—JavaScript, Flash, or whatever—is more often than not an example of somebody using a design element just because he can.
20 January 2017: the End of an Error.
Especially since you NEVER need to use frames
I dispute that: there's a certain very well-defined set of circumstances in which using a frameset is beneficial. Although I agree that 99% of the frameset usage on the web is inappropriate, in certain circumstances framesets can be used for efficient navigation and still look good - the main advantage of frames is that they only need loading once - it's a frivolous waste of bandwidth to put the same graphical navigation bar on each page, for example (not that I'm a huge fan of graphical navbars).
Still, the rule for frames is: If in doubt, don't use them.
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
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.
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
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.
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
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
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
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.
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 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.
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?"
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.
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'...
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 $$$
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.
Indeed! Usability, simplicity and legibility are the most important aspects of your UI design.
Web Navigation: Designing the User Experience
The Design of Everyday Things
Those are possibly the two most important books you could read. Of course you should read Tog and Nielsen. They are a good primer. Generally they tell you more what you should not do rather than what you should do.
Pooty tweet
However, a few critical things need to also be specified in the HTML in addition to the XHTML and/or CSS. Such things as background color are important. Don't assume that everyone has CSS. For those who don't the page might not look so pretty, but it should be at least readable. If everything works fine in any default color (most are either white or gray) then this isn't so important. But if you have a special background and special text color or images that really need the right background color, then be sure you cover all the bases and specify it completely.
now we need to go OSS in diesel cars
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.
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
Some people forget that hyperlink active text defaults to blue on many browsers. They set the font color black, but not the active text font color. It's still the same mistake and still should be punished by 5 years in prison.
now we need to go OSS in diesel cars
There is NO NEED for you to dynamicaly generate every last little bleeping thing just to make the occasional news update easier.
I don't understand this suggestion. Unless server load becomes an issue and dynamically generating the pages makes the pages load noticably slower to the end user, what does it matter?
OtakuBooty.com: Smart, funny, sexy nerds.
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
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.
Most things you describe are good things, but I do disagree with your notion of jumping ahead to next generation browsers so quickly. Using the new standards is good, but the page should be made to work over a two generation browser range (that means including Netscape 4.7). It doesn't have to look as pretty in the old browser, but it should at least be functional. Every text should be visible. Every button should render. Learn to design flexibly. Sticking to validated standards is good, but being capable of being used with the standards actually implemented one generation back (while the new generation matures) is still essential. Compliancy is NOT about having to use all of the standards out there. It's about using what standards you need to have correctly. The point is, if you don't actually need XHTML, then don't make a site that can't work without it. And even if some part of the site really need XHTML, or CSS, Javascript, then don't make the rest of the site crippled by requiring it everywhere.
If you need to put some pressure somewhere so you can present some really cool new designs in front of more and more people, then join me in pressuring browser developers to work on writing less buggy, more stable, and faster performing code. Unfortunately, it takes time for software projects to mature when there is a flurry of new things to implement. And at some point the developers really can't go any faster anyway. This is something else we all need to deal with.
now we need to go OSS in diesel cars
One of the best on web design,
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.
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
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
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.
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
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.
{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.
The latest nightly builds of mozilla now have the option to now open pages in new windows.
Got friends?
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.
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.
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.
http://www.tuxedo.org/~esr/html-hell.html
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.
Actually, I've found gray (#999999) on dark blue (#000055) to be easier to read than black on white.
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
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
"Because of all of the mostly useless formatting information."
OK. So you don't like useless formatting information. Fair enough, I agree. I still don't see what that has to do with dynamically generated pages as opposed to precompiled or manually generated HTML.
I really don't think you know what you're talking about.
OtakuBooty.com: Smart, funny, sexy nerds.
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.