A LIST Apart: For People Who Make Websites

No. 302

Topics: Design: Graphic Design

Visual design. Art direction, visual communication, creative direction, illustration, photography, visual art. Using color, symbol, and type to communicate ideas, brands, styles, and expressions. Arranging image and text to communicate a message. Style versus design. Layouts, grids, identity and logo design. User interface design, user experience design, interaction design. GIF, JPEG, Flash, PNG, SVG. (52 articles)

On Web Typography

Issue 296November 17, 2009

Until now, chances are that if we dropped text onto a web page in a system font at a reasonable size, it was legible. But with many typefaces about to be freed for use on websites, choosing the right ones to complement a site's design will be far more challenging. Many faces to which we’ll soon have access were never meant for screen use, either because they’re aesthetically unsuitable or because they’re just plain illegible. Jason Santa Maria, a force behind improved type on the web, presents qualities and methods to keep in mind as we venture into the widening world of web type.

Redesigning Your Own Site

Issue 289August 4, 2009

Redesigning your freelance website is an exercise in masochism. There are no colleagues to share the pain: It’s just you. As the designer who wrote The Art of Self-Branding, freelancer Lea Alcantara knew her site had to be just right. People were bound to scrutinize any update to the design, and she couldn’t afford to damage her credibility. Follow her process as she experiments to find the perfect balance of change and consistency.

Taking the Guesswork Out of Design

Issue 283May 5, 2009

Clients, like other humans, often fear what they don't understand. Daniel Ritzenthaler explains how sound goal-setting, documentation, and communication strategies can bridge the gap between a designer's intuition and a client's need for proof.

In Defense of Eye Candy

Issue 282April 21, 2009

Research proves attractive things work better. How we think cannot be separated from how we feel. The next time a boss, client, or co-worker scoffs at the notion that beauty is an important aspect of interface design, point their peepers here.

The Details That Matter

Issue 277February 3, 2009

We no longer lay out pages with composing sticks and straight edges, and design is no longer a trade position requiring a lengthy apprenticeship, but an eye for details is every bit as important today as it was in the early days of graphic arts. Learn the habits of successful designers, who think critically as well as creatively, and who see the forest while never losing sight of the trees.

Fluid Grids

Issue 279March 3, 2009

How awesome would it be if you could combine the aesthetic rigor and clarity of fixed-width, grid-based layouts with the device- and screen size independence and user-focused flexibility of fluid layouts? Completely awesome, that's how awesome. And with a little cunning and a tad of easy math, ALA's Ethan Marcotte gets it done. We smell a trend in the offing.

Faux Absolute Positioning

Issue 261June 17, 2008

CSS layout is awesome, except when your layout calls for a header, a footer, and columns in between. Use float, and content changes can cause columns to wrap. Use absolute positioning, and your footer can crash into your columns. Add the complexity of drag-and-drop layouts, and a new technique is needed. Enter "faux absolute positioning." Align every item to a predefined position on the grid (as with absolute positioning), but objects will still affect the normal flow (as with float).

Saving the Spark: Developing Creative Ideas

Issue 260June 3, 2008

Ideas are at the heart of every creative process. However, coming up with them can be hard work. Mark Boulton arms us with tools to meet this challenge.

Writing an Interface Style Guide

Issue 260June 3, 2008

Ever designed or developed a beautiful interface only to find your hard work ruined months later by gaudy graphics or invalid markup? With proper documentation you'll have a better chance at seeing your interface stay beautiful. Jina Bolton guides us through the process of developing an interface style guide.

Design is in the Details

Issue 254March 4, 2008

Stop worrying about how good a designer you are, and start worrying about the myriad tiny details that can elevate your work from passable to near-perfect.

Designing For Flow

Issue 250December 4, 2007

Ask a web designer what makes a site great, and you're likely to hear "ease of use." Jim Ramsey begs to differ. Web applications in particular, he tells us, work best and engage most profoundly when they challenge users to overcome difficulties.

Understanding Web Design

Issue 249November 20, 2007

We'll have better web design when we stop asking it to be something it's not, and start appreciating it for what it is. It's not print, not video, not a poster—and that's not a problem. Find out why cultural and business leaders misunderstand web design, and learn which other forms it most usefully resembles.

Design by Metaphor

Issue 243August 14, 2007

Sometimes the best way to understand a client's needs is by comparing their project to an existing site or service. The site should feel "like eBay" and work "like Expedia." But what do such comparisons really mean? Learn to master the metaphor while avoiding unrealistic goals and expectations.

Staying Motivated

Issue 243August 14, 2007

Been stuck in a creative rut so long so you've started to decorate it? A List Apart’s Kevin Cornell drops his crayons to share tips on developing and maintaining a productive creative routine.

Human-to-Human Design

Issue 240June 26, 2007

Help your audience fall in love with you by moving beyond human-to-computer interfaces and embracing human-to-human design.

Stand and Deliver

Issue 237May 8, 2007

You've got thirty seconds to sell your work to the well dressed nemesis who's paying you. Handle the next few moments gracefully, and the project will be one you can be proud of. Flub an answer, and you can kiss excellence goodbye. Are you prepared? Can you deliver?

Contrast and Meaning

Issue 236April 24, 2007

Yes, Virginia, design does matter. Better web page layouts aren't only about aesthetics. A layout with clear hierarchies can turn scanners to readers, and readers to members. Learn how visual contrast can turn lifeless web pages into sizzling calls to action.

Whitespace

Issue 230January 9, 2007

So you think you know all about whitespace. You may be surprised. Mark Boulton, type expert to the stars, shows how micro and macro whitespace push brands upscale (or down) and enhance legibility in print and online.

Designing Through the Storm

Issue 220July 25, 2006

As designers, we all face the inevitable slump. That point where our creativity stagnates and we find ourselves at a dead end. Walter Stevenson offers suggestions on staying productive and creative.

Design Choices Can Cripple a Website

Issue 207November 8, 2005

Do you test your designs? If not, Nick Usborne wants you to take responsibility for your design choices and the very quantifiable effect they can have on websites that are built for business.

A List Apart 4.0

Issue 201August 22, 2005

From the crown of its cranium to the tips of its Ruby-slippered toes, A List Apart 4.0 is both old and new.

When You Are Your Own Client, Who Are You Going To Make Fun Of At The Bar?

Issue 201August 22, 2005

Should your blog have a business? Jim Coudal shares insights into the adventure of transitioning from client services to product creation.

Good Designers Redesign, Great Designers Realign

Issue 206October 24, 2005

The difference between redesigns that make you look busy and give your stakeholders something else to argue about, and strategic overhauls that reposition your brand and help you set and reach business goals.

Big, Stark & Chunky

Issue 191January 11, 2005

You’ve designed for the screen and made provision for blind, handheld, and PDA browser users. But what about low-vision people? Powered by CSS, “zoom” layouts convert wide, multicolumn web pages into low-vision-friendly, single column designs. Accessibility maven Joe Clark explores the rationale and methods behind zoom layouts. Board the zoom train now!

A Better Image Rotator

Issue 186August 10, 2004

The first image rotator made it easy to generate a random image on a web page, even if you had never worked with PHP before. The new, more powerful (but still dead easy) version uses a simple configuration file to create custom links, alt tags, titles, and even CSS styles for each image. Plus it handles differently sized images without a hiccup. Enjoy!

Dynamic Text Replacement

Issue 183June 15, 2004

Let your server do the walking! Whether you’re replacing one headline or a thousand, Stewart Rosenberger’s Dynamic Text Replacement automatically swaps XHTML text with an image of that text, consistently displayed in any font you own. The markup is clean, semantic, and accessible. No CSS hacks are required, and you needn’t open Photoshop or any other image editor. Read about it today; use it on personal and commercial web projects tomorrow.

Print It Your Way

Issue 182May 21, 2004

Because ALA’s readers are web users as well as designers and developers, we offer this tidbit from Derek Featherstone on creating user stylesheets to print articles to your own specifications.

Onion Skinned Drop Shadows

Issue 182May 21, 2004

Animators use onion skinning to render a snapshot of motion across time. Now, web designers can use this technique to create the truly extensible CSS-based drop shadow.

Read about onion skinning with div stacks.

Separation: The Web Designer’s Dilemma

Issue 181May 14, 2004

Presentation separated from structure. Structure separated from content. The foot bone connected to the ... what were we talking about? Michael Cohen steps in to examine our assumptions and relieve our separation anxiety.

Art Direction and the Web

Issue 180May 7, 2004

If design lives in the details, art direction’s turf is the Big Idea. Stephen Hay introduces the principles and techniques of the art director, and shows how art directional concepts can shape memorable user experiences.

Mountaintop Corners

Issue 179April 30, 2004

Most of us have experience creating “rounded” corners by erasing pixels. It’s a rudimentary web design technique — or so we always thought. But in the hands of Dan Cederholm, author of Web Standards Solutions, this seemingly simple technique paves the way for boxes and borders that can change sizes and colors at your whim.

Making mountains out of pixels, which are even smaller than molehills

CSS Drop Shadows II: Fuzzy Shadows

Issue 178April 23, 2004

Picking up where Part I left off, in Part II designer Sergio Villarreal takes his standards-compliant drop-shadow to the next level by producing warm and fuzzy shadows.

Creating soft-edged shadows. Read the article.

Zebra Tables

Issue 173March 5, 2004

While misused tables are becoming increasingly rare, the table retains a legitimate role in data formatting. A little CSS and JavaScript magic can make tables better at what they do best: displaying tabular data.

CSS Design: Creating Custom Corners & Borders Part II

Issue 172February 27, 2004

Part I showed how to create fluid, dynamic CSS layouts with customized borders and corners. Part II advances to the next level, extending the technique to work with more complicated backgrounds such as gradients and patterns.

CSS Drop Shadows

Issue 172February 27, 2004

Much used, oft maligned but always popular, drop shadows are a staple of graphic design. Although easy to accomplish with image-editing software, they’re not of much use in the fast-changing world of web design … until now.

CSS Design: Custom Underlines

Issue 169February 2, 2004

While web designers generally have a great deal of control over how a document should be presented, basic CSS doesn’t provide many options for the style of underlines below the links on a page. But with a few nips and tucks, you can take back creative control of the way your links look. Frequent ALA contributor Stuart Robertson shows how.

Random Image Rotation

Issue 160October 20, 2003

Readers return to sites that appear fresh and new on each visit. On a news site, magazine, or blog, stories or headlines will be updated frequently. But how can static sites keep that fresh feeling? Dan Benjamin’s free image randomizer may do the trick, and you needn’t be a programmer to install it.

CMS and the Single Web Designer

Issue 133January 11, 2002

Content Management Systems free designers from the gruntwork of individual web page production. They may also free companies from the need to retain design staff. How do content management systems work, and what impact will they have on a web designer’s job?

The Bathing Ape Has No Clothes (and other notes on the distinction between style and design)

Issue 129December 7, 2001

Why has the level of discussion in “design forums” degenerated so quickly? Maybe because they’re not populated by “designers.” Greenfield explains the difference between Stylists and Designers—and why that difference matters so much.

Reading Design

Issue 128November 23, 2001

With so many specialists working so hard at their craft, why are so many pages so hard to read? Unabashed text enthusiast Dean Allen thinks designers would benefit from approaching their work as being written rather than assembled.

Information vs. Experience

Issue 125October 26, 2001

The conflict between presentation and structure reveals two views of the web. Which one’s winning?

The Flash Aesthetic

Issue 123October 12, 2001

Scaling, 2-D style, cycle-free motion, and heavy strokes. They’re not just web design trends any more. Join Olson on a cultural scavenger hunt as he tracks the ways Flash design techniques have crept into non-web media.

The Declination of Independence

Issue 102March 23, 2001

Three web designers discuss trendiness and innovation in design, and list 15 sites that made a difference in the year 2000.

How to be Soopa Famous

Issue 101March 16, 2001

Become a famous web designer. Or ... just look like one.

Experience Design

Issue 77August 18, 2000

It’s time for web designers to peek over the cubicle and start sharing ideas with their peers in related design disciplines. Jacobson suggests one way to do that in this overview of the emerging Experience Design paradigm.

Usability experts are from Mars, graphic designers are from Venus

Issue 74July 28, 2000

Usability mavens like Jakob Nielsen think the web is an ill-used database. Graphic designers like Kioken think it is a fledgling multimedia platform. Could both groups be right? New ALA author Curt Cloninger explains why usability experts are from Mars, graphic designers are from Venus. This one's a hottie.

Why Are You Here?

Issue 72July 14, 2000

Whether we’re designing experimental sites or keeping an online diary, we go to the web in search of meaning. Will we find it? Or will we build it ourselves?

A Design Method

Issue 71July 7, 2000

In a high-powered production environment like the web, a design method can help you get more done faster ... and provide you with rules to break. New ALA writer Ross Olson shares his company’s game plan.

Fragments (of Time)

Issue 64May 19, 2000

The best web interfaces take time – the one asset that seems to be in perpetually short supply. Leading Scandinavian web developer Pär Almqvist presents a time-based perspective on web interfaces and the network economy.

Much Ado About 5K

Issue 63May 12, 2000

A full-fledged website under 5K? Some of the brightest people in the industry swore it could not be done. Yet hundreds of developers not only came in under the 5K budget, they built great sites in the process. Zeldman explores how the 5K Awards rocked the web.

Time to Close the Web?

Issue 61April 28, 2000

Focusing on presentation at the expense of content, and invasive money-making schemes at the expense of everything else, designers must take some of the blame for the trashing of the web. Herrell wonders if it’s time to call it a day and close up shop.

The Creative Process

Issue 8March 12, 1999

Ideas are like policemen — they're never around when you need them. Mattias Konradsson sketches a campaign to seduce the Muse.

*Can’t find what you’re looking for? View all topics and subtopics »