This is another proof that you can’t guess every possible reaction to a design pattern. In this case Aux would rather have wide layouts because it would mean a larger area to present content. But what can you do about someone just like Aux, but who believes the complete opposite?

Elasticity is tricky

The ideal solution to please both lovers and haters of the narrow look would be to construct an elastic layout. But images are the number one obstacle. They have fixed dimensions and look horrible when resized using HTML or CSS attributes—please, don’t go there, it’s just atrocious. Other solutions are just for decorative purposes, not for every image on the page.

Ads, widgets, and plug-ins all tend to have fixed dimensions as well. It’s a chicken-and-egg thing: designers resort to fixed layouts because they can’t resize all those fixed objects, and all those objects are fixed because their creators assume they’ll be placed in fixed layouts anyway. That, and there hasn’t been a move towards flexible anything. Is it because we fear the unpredictability of flexibility? If it were possible to have webpage elements with flexible dimensions, would we use them, or still go for the fixed-dimension ones?

A completely flexible layout width isn’t that appealing, either. In larger screens the lines of text will be so long that it becomes difficult to read. Every layout option has its advantages and disadvantages. You have to pick one and accept that you’ll piss someone off one way or the other.

Custom-tailored user experience

However, you should try to please as many people as possible especially if your website is any of the following:

• Very popular (e.g., CNN)
• Text-heavy (e.g., Wikipedia)
• Requires registration (e.g., My Yahoo!)

Don’t stop with the layout width. The general ability to customize is important. See what MSNBC and BBC have done. Users can control the type of news that appears, the order in which the news sections appear, the complexity of the page layout, the text styles (from color to letter spacing), and so on. It’s the empowerment you bring to the audiences that tells them they are highly valued individuals.

Design is about presenting information in the best possible way. Unfortunately there is no single way that is considered the best as long as someone other than the designer is experiencing that design. Although more difficult to implement, websites can let users choose that experience. If you can help it, let them.

Related reading:

• Two lightweight CSS grid frameworks: the 1KB and the 1-liner
• Really? Everything I Know About CSS Is Wrong?
• More niche design inspiration galleries popping up (do we really need them?)
• Microsoft is committed to a better web with MIX Online
• Apple, the pot-stirrer

Take a look at your average listing of posts, usually your front page but it could also be a category page or an archive. Post after post after post after post. Boring? Might be. Long? In most cases, yes. Too long? Yep, I’d say so.

I believe in using read more functionality, in other words, in just displaying some of the content (if the post is a semi-long or long one) in post listings. If you display a 20 paragraphs long post after a 30 paragraphs long post, but before a 50 paragraphs long post, then you have a very ugly page.

By using read more functionality, available in any good blogging software, you can show as much content as you like in your listings, and it shouldn’t be too much.

Take a look at Wisdump, for instance. You’ll find a Read the rest of this entry link on most of the posts I’ve written, only very short ones get published in its whole in the listing. Even less gets published on my blog, rethord.com, but the principle is the same – the only thing that varies is the font size, and that means I’ll have to make the read more break earlier.

If you’re a WordPress user you might be tempted to use the_excerpt, which publishes what you put in the optional excerpt box, or cuts your posts for you. That’s fine for long listings, but if you want an attractive front page, for instance, you want full control, and that means you’ll have to use the optional excerpt box on every post, otherwise it might look like crap since you can’t control where the post will get cut in a per-post basis.

Today’s homework is to take a look at your post listing. Do you have long post after long post after long post? Then reconsider, because it doesn’t look good, and it doesn’t offer the reader a decent overview.

The lack of read more in the blogosphere is both a usability and a design problem. It’s not practical to present big chunks of content in lists, and it looks like shit. That’s the bad part.

The good part is that you can fix it on your end, right away. So please do.

Related reading:

• Wisdump redesign concept, part 2
• Will CSS logotypes replace image-based ones?
• Web Trend Alert: Virtual business card sites
• Type designers “Coming Together” for Haiti; hopefully Chile too
• The ugliest websites in the world

The first person on my list to talk about is Rand Fishkin. Who is Rand Fishkin? Well, first off all the SEO girls want Rand Fishkin. Being a dude, I really can’t say either way why that is, but I am pretty impressed with the site he has built. Rand is the CEO and Co-founder of SEOmoz, a site that includes a blog with over 10,000 RSS readers according to Feedburner. It was voted the best SEO blog in 2006 by Search Engine Journal, and has been mentioned in numerous high level places like USA Today, Washington Post, and Newsweek Magazine.

The reason Rand is an authority is because of his mix of understanding of Finance, due to majoring in the subject, the web, from all his years of experience and bringing it all together. His articles on SEOmoz are some of my favorites, and the site is just a gold mine of information. You can find him at Search Engine Strategies & Pubcon conferences around the world, and of course on SEOmoz.

Related reading:

• No related posts.

1. First, Consider the Problem
2. Second, Bring Out the Sketchbook
3. Third, Do that Mockup Thing
4. Fourth, Time to Code
5. Finally, Deliver and I’m Done

Take a look. I’m off to watch Alice Cooper hang himself.

Related reading:

• No related posts.

Being visually–driven is a typical trait of every designer; we web designers may even be a bit more attentive than our print design counterparts since we always have to deal with the ever–changing configuration of the media used to display our work, the browser being the usual and major suspect. At the same time, publishing on the web presents other concerns not always dealt with in print. Yet, the web is more powerful now more than ever. Web pages are always designed to convey information, to send a message that elicits action.

Words that move

Designing for the web calls for graphical acumen, but more importantly requires an understanding of a page or a site’s purpose. It is this purpose that we designers must transmit through our visual design and the copy we produce. Thus, every designer should learn to speak the language of a page, one that is in line with the site author’s goals and the readers’ expectations.

A simple weblog or a complex web application can be made more usable through good copywriting. Interface design should use proper dialogs with the right questions and labels, just as widgets and headings should be named descriptively expecting to be understood as an average user would have it. 37signals’ Defensive Design mantra immediately comes to mind.

Blogs, on the other hand, were by–design meant to be personal and honest, though with the rise of professional blogging has been reduced to lifeless text that bounces around in an echo chamber. Certainly, it can be avoided by reviewing some of our favorite articles on ALA: “Attack of the Zombie Copy” and the ever–popular “10 Tips on Writing the Living Web.”

Let the writers write

Who should be writing for you? Who should be designing your interfaces?

If you are publishing your own site, you know your content inside out. It is you who knows how you intend to deliver your information. Building your own web application, you have an idea how a user should interact with your interfaces, ideally. But if you really think hard about it, the user determines how an article or an interface is understood, and should be written.

We sometimes get clients who provide us with content that reek of marketing–speak yet we don’t or are not allowed to make revisions to present it in a format more easily digested by a user. But honestly, there are times when we simply do not notice the content or choose not to. Web designers should learn to be good writers. Good web design does not end with the graphical aspect alone, it involves a process and a mission to get your message across.

Don’t just write

Projects typically allot a good part of the resources to design and programming. Unfortunately, interface and web copy is given little time and money for development. It is often overlooked, assuming that users already know how to use an application, or a reader already understands all the marketing and technical speak thrown around, assuming he actually got to finish reading a given article.

Good copywriting is part of the development process — it is not optional. It is part of good usability and accessibility. Don’t just let programmers or clients insist on what they think is good enough, look at it from a user’s point of view. If needed, let someone else who understands do the writing. Your design and content can only be good enough if it serves its purpose, if your message reaches the intended recipients.

Written by Markku Seguerra. He takes photos and blogs design at rebelpixel.com — sometimes.

Related reading:

• No related posts.

First Impression

Now quick, when you look at the site what is your first impression? While a couple of years ago I could easily see this site as being looked upon as being profressional there are just too many flaws that show how dated it is.

Site Alignment

While there is nothing wrong with left-aligned sites, I don’t think it works on this site because it leaves you with a feeling of emptiness. Centering the site will give it a little more polish and add more options to what can be done with the background and color scheme.

Logo and Typeface

Related reading:

• No related posts.

Rhetoric is a framework that allows us to quantify valuable information as having a beginning, middle, and end. This philosophy can be carried over to your websites to create an effective experience for your users. However, the three steps differ slightly in that they become attract, inform, and invoke.

Attract Them

The ability of blogs to attract customers is directly related to the quality of the content on their site. This also involves the topics discussed on a site. However, another element that generally gets overlooked is the aesthetics of the site. If the aesthetics of a site compliment the content, then you are already one step closer to a better design.

Just because you start another web design site, what differentiates it from the rest that will make people want to visit? How will it attract people? Will it be through the looks and feel of the site, the content, or both?

When attempting to attract people to your site and your message there are two main questions that must be answered by you, “Why should I listen to you?” and “What’s in it for me?”.

To answer the first question you must achieve credibility and in this community that can be a difficult thing to do. Over time if you continue to write quality content that others link to then over time you will develop a credibility for yourself. One should not expect credibility from simply placing a website on the web. Another way to gain credibility is through the endorsement of someone else who has high credibility. If Bowman was to one day write an entry talking about a designer that taught him everything he knew then that designer would be given instant credibility and people would be more willing to listen to his words.

The quick answer to the second question is that you will provide the audience with something new to learn and share. If there is nothing to be gained from your site, then there is no reason to visit it.

Inform Them

Once you have attracted users to your site it becomes your job to inform them. Certainly they have showed some interest because they are on your site, but how do you go about informing them? Of course the answer is content, but there are other issues that are involved with informing someone.

To effectively inform an audience you have to convince them of the relevance, importance, and timeliness of the message. This opens your audience up and allows them to more readily receive your message. The best example of this occurred when Zeldman began his tract on Web Standards with the article, To Hell With Bad Browsers.

Invoke Them

There are a lot of “call to actions” in the web community. Examples range from building accessible websites to getting rid of “www” in urls. A major problem with these movements is that they do not address anyone’s needs. To invoke individuals into action (eg. purchasing something online) their interaction with your message must address their real motivations and their real needs. It’s no use saying everyone should develop sites with CSS if making quick money is the intention of the audience.

The Three Steps

If you are consciously aware of the three step process and use it to relay your message over time then you should have no problem developing an audience that is willing to listen. All of the great writers on the web have captured this ability to implement the 3 steps in almost all of their writings whether they intended to or not.

Many of these ideas can be found in John Lenker’s excellent book, Train of Thoughts.

Related reading:

• No related posts.

This doesn’t hide the fact that comments shouldn’t be opened up for everything and this is clearly reflected on Jason Kottke’s site where he is very selective with which entry has comments open.

Related reading:

• No related posts.

Jon Tangerine, David DeSandro, Trent Walton have all come up with ingenious ways to create image-free logotypes by pushing the limits of CSS (Sean Martell made a mouth-watering CSS-based logo too, but doesn’t contain text) that one has to wonder: is this the next step in online branding and identity?

The simplest argument against this could be that a logo must be constant. In the absence of CSS styling, possibly even helper JavaScript, an image will not suddenly morph into a default browser style and render a brand generic. See the image above for how the CSS-based Opera logo degrades in different browsers.

Now that excludes the scenario where images are turned off, and where text—styled text—can come in. Instead of simple image replacement techniques, we now have @font-face embedding and other advanced effects to bring the text as close as possible to the original design.

Text is great because you can read it, as can search engines. Another thing text based logos have going for them is they’re easier to make bigger; that’ll win over a lot of clients.

But there’s a great deal of extra markup required to achieve the necessary look. Does this make sense for the notion of a logo, which is inherently more portable with an image than with a bunch of divs, spans, classes and IDs? Should logos always be images and nothing but, or can they be both text and images? Which should come first, designing the logo in the browser or in a graphics program? Or should all of this experimentation remain just that: experiments?

Me, I just love we could be on the brink of shattering print conventions, yet again.

Related reading:

• Thank you, CSS3 Please!
• Ten years of creating a better web: Google and A List Apart
• Not so standards-compliant after all
• Google enters the @font-face business
• Eric Meyer dissects WaSP Community CSS3 Feedback 2008

Google brought back the 80s arcade game Pac Man to celebrate its 30th anniversary last May 22nd in the form of a fully-working Google Doodle on its homepage (it’s been since moved to a dedicated page where people can still play it). The “I’m feeling lucky” button gets replaced by “Insert coin” and clicking on it lets you play. Click on it a second time and Ms. Pac Man joins in the fun.

Apart from hearing collective 8-bit cheers of delight upon discovering what could be Google’s most viral web toy yet, the Pac Man doodle was another display of its massive influence, both the good and the bad.

The Good: HTML5 evangelizer

The Pac Man game was developed in HTML, JavaScript, and CSS. Granted, Flash was used for the sounds, but other than that, this was a triumph for web standards as there is no bigger stage, no bigger endorser on the Web than the Google homepage.

The Bad: Procrastination enabler

On the other hand, people are now questioning if Google should’ve put such a major distraction on what is supposed to be a tool for getting things done. RescueTime reports that as people spent several more time on the Google homepage to play the game, millions of hours and hundreds of thousands of dollars were wasted. I wouldn’t be surprised if lawsuits started popping up, blaming Google for allowing such a thing to happen.

“With great power comes great responsibility” or “Geeks just wanna have fun”?

I’m just glad Google still knows how to have fun depsite how big it’s grown. And due credit must be given to advocacies it gets behind. Two years ago it was Chrome, last week it was web fonts. The Pac Man doodle just happens in between these achievements.

Related reading:

• Opera’s MAMA discovers what’s under the hood of the collective Web
• WaSP: Fight the Conficker Worm with web standards
• Twitter tweet embedding finally arrives, but is it any better?
• No-nonsense web design references to bookmark
• Mozilla Jetpack: jQuery-esque Firefox add-on development