Garish, Overly-Bright Colors

I don’t mind a little shot of bright teal or light yellow to showcase a new addition or featured content. But when the whole page is bright orange and electric purple, eye-searing green and migraine-inducing yellow, my eyes go boggly trying to even look at the page, much less try to read and understand it. When designing our pages, well-thought-out color schemes and page styles are very, very important.

Have I Ever Broken This Rule? – Yes, sadly, with one of my first gaming sites back in 2004. Bright red background got a lot of complaints from visitors… :/

Background Color and Text Color Too Similar

Dark blue background + very slightly lighter blue text = I don’t come back to your site because I can’t see the content. Yes, I know, CSS and hexadecimal codes are fun to play with, but text contrast is REALLY important, otherwise no one will visit your site because it looks empty or too hard to read. You don’t need complete “black and white,” but make sure your colors are fairly opposite each other on the brightness scale.

Have I Ever Broken This Rule? – Not to my knowledge; I usually use a wide background/text color contrast, like the white background and deep teal text on this blog.

Misaligned or Overflowing Text

Drives me nuts to see a divided layer not doing its job, letting a line of text flow unbounded across the screen (and even way off to the side, making me scroll horizontally). Not only does it make it 10x harder to concentrate on the meaning of the text, it usually pushes other page elements out of the way, making the page look disorganized and amateurish.

Have I Ever Broken This Rule? – Yes, because I was a newb in 2003 and didn’t know any better…note to self: huge divs without ending tags do not equal awesome layout automatically.

Button or Text that LOOKS Clickable, But Isn’t

Underlined text? Yep. Decorations on a sidebar that look suspiciously like navigation buttons or submit buttons? Yep. If you want to thoroughly confuse your users, this is the tactic you want to adopt, making ordinary body text look like links or buttons look like menus waiting to be opened. Of course, if you want to keep visitors, you’ll stay away from these oopsies, otherwise your users will not return.

Have I Ever Broken This Rule? – Yes, on one of my early, early self-run blogs–I used underlines as purely an emphasis mark rather than just for links. People kept wondering why all my links in my posts were broken. Sad. XD

Menus that Completely Cover Up Content/Won’t Go Away

Several news sites do this with drop-down menus–either the menus are so huge that they cover up a whole lot of content, or they won’t fade away after you’ve clicked on a page title/category. The worst offenders are the ones who both cover up content and won’t be put away. I spend much of my time on the page wrestling with the designer’s conviction that menus are to be SEEN and the content is much less important.

Have I Ever Broken This Rule? – Nope, ’cause I don’t use menus that go across the top of the page if I can help it. (That’s how much I hate this design trend. LOL)

Popup Surveys that Keep Coming Up with Every Page Load

“For the last time, I’m not interested in leaving my [expletive] comments! Dang, take a hint!” –This is what I usually end up thinking when a popup survey (or any popup, really) keeps loading no matter how many times I close it. Every time I navigate to a new page on a site that uses this survey style, the whole page is grayed out except for the annoying little box which I’ve seen many times over. We can really, really irritate our users with these kind of tactics; no user’s comments are worth driving them away from the site!

Have I Ever Broken This Rule? – Nope, because I don’t use popup feedback surveys.

Info Overload

Whether it’s tons of little content boxes or multiple sidebars, when there is simply too much information on a page, my mind scatters and dashes itself against the wall of info on the screen. I just can’t concentrate on any one object without being distracted by other content, and I’m sure I’m not the only user who has felt that way. (Many news and entertainment sites use this kind of layout design, and it bugs me, not to mention makes me feel like I’ve got a sudden onset of adult A.D.D.)

Have I Ever Broken This Rule? – Yes, with one of my first CSS layouts–I did three columns, but I filled the two side columns with a WHOLE BUNCH of text, which kinda overflowed into the middle column because there wasn’t enough padding and margin space.

Flashing Graphics/Animations, Including Ads

When a graphic on the sidebar is flashing rapidly between several different colors, I’m more likely to ignore it as a spammy ad. And I know I’m not alone in that. Animated ads are not usually controllable by those who use them on their pages, but we can do something to make them a little less obtrusive into the design, like not putting them directly beside our content where they will distract users. But we can control what types of web animations we use, if any at all.

Also, more importantly, flashing graphics of any sort can trigger those who are Photo-Sensitive Epileptic, or PSE, to have a seizure. I didn’t know about this until I began dating my wonderful boyfriend, who has epilepsy easily triggered by stuff like strobe lights, and he mentioned how sometimes even flashing web graphics mess with his eyes.

Have I Ever Broken This Rule? – …*hides in shame from all the flashing animated web graphics I did in my newbie days*

Itty Bitty Body Text

Size 8 font is never appropriate for main body text, mmkay? We as web designers should not be holding contests to see which user’s eyes are better than everyone else’s. If we want people to read the content we have so lovingly crafted, we have to make it readable. I’ve spoken about this issue before in context with site bugs, but it’s worth repeating here, since text size is a major bone of contention with me.

Have I Ever Broken This Rule? – Nope, because I like not straining my eyes when I’m proofreading my content.

Sneaky Layout and Navigation Changes that Change the Way Users Access the Site

How many times have I heard my boyfriend’s mother express frustration over paying bills online, mainly because the webmaster of a site thought it would be cool to move the “Customer Login” page to a completely new navigation area, or completely eliminate it altogether? (Seriously, I spent 45 minutes trying to find the “Pay Bills” page on one of the websites she was needing help with, and to this day, I have no idea where they moved the page. I’m guessing they ended up with a lot of late payments!)

When we make big layout changes to our website, especially if we’ve got a large customer or user base, we need to make sure of one of the following things:

• We keep to the same basic content organization and presentation, so that things are generally where users remember them being;
• We tell the users explicitly WHAT has changed, WHERE new pages and content have moved, etc.

Doing one of the above will help users dramatically when we decide to change our site’s look and feel!

Have I Ever Broken This Rule? – YEP :C Forgot to tell my users where I moved one of the basic tutorials on my City of Heroes site, which led to some user frustration.