Flag

We stand with Ukraine and our team members from Ukraine. Here are ways you can help

Get exclusive access to thought-provoking articles, bonus podcast content, and cutting-edge whitepapers. Become a member of the UX Magazine community today!

Home ›› Design ›› The Layers of Design: the style layer

The Layers of Design: the style layer

by Andy Rutledge
4 min read
Share this post on
Tweet
Share
Post
Share
Email
Print

Save

Style is an important layer in the design process and is not to be neglected.

Designing for the Web, as I see it, is a multi-layered process. It’s a process in which each layer addresses specific design needs related to client aims, brand characteristics and site user habits and expectations. Sadly, the last of these layers to be applied in the process, the application of style, is an oft-maligned element of design. Style for its own sake or by itself is not design, certainly, but stylistic concerns are important to successful design.

Even so, any day of the week you can find designers in online forums criticizing web page graphic designs for having style. Prime targets for criticism these days include rounded corners, gradients, drop shadows, large buttons, fat icons or a worn look. Some designs garner criticism simply because the title font is Trebuchet MS.

Much of this criticism is explained, ostensibly, by relegating these graphic elements into the dreaded and cliche Web 2.0-look category of graphic design. It seems that once a cliche is defined, all of its characteristics must be persecuted without thought or consideration for context; at least by those who lack relevant understanding.

Now certainly these or other graphic elements can be ill-used and irrationally applied to design. But like all graphic elements, each of these has communicative value and contributes to the message conveyed by the page design. A designer must know what each of these and other graphic elements communicates and use them where and how it’s most appropriate. Indiscriminate use of stylistic elements in design does indeed amount to needless affectation or embellishment. Nevertheless, style is an important layer in the design process and must not be neglected.

Layering

Breaking the design process up into layers is a useful mechanism for ensuring that the effort is comprehensive and contextual. By starting with the most fundamental factors in the design and designing them to be contextually appropriate, you can build successive layers of the design on the right sort of foundation.

Once you’ve got a clear picture of the client aims and desires, brand considerations, site and specific page purposes, target user habits and expectations and the different pages’ contents you can begin with the most fundamental layer. Different designers might categorize the layers differently, but my basic suggestion for layering would be:

  • Information architecture Start by deciding and/or planning for what information is available where, when, and under what conditions throughout the site.
  • Interface behaviors Specific behaviors are sometimes required or advisable for certain interface elements. These often affect the design effort from both a functional and visual standpoint.
  • Visual hierarchy of the content It’s often beneficial to provide clues to what’s most important on the page, next important, and so on.
  • Layout The fundamental visual framework to support the previously mentioned elements.
  • Style The look and feel of the page/site must support all of the above and tie things together neatly.

Each layer is important and, done well, contributes to the wholeness of the design. Leave out one layer and the design will fail to reach its potential. One could go so far as to say, as I have on a few occasions, that designs that ignore one of these layers are simply poor designs.

Elements of Style

The application of style to the design might be subtle or heavy-handed, according to the context, but no amount of stylistic application can be said to be too little or too much in and of itself. Context matters in every aspect of design and this is certainly true of stylistic concerns.

Let’s take a couple of those much-maligned interface cliches for example. Note that both Blogger and Sprint use rounded corners in their page designs. However, these sites don’t use the same sort of rounded corners, and for good reason. Each is chosen for specific effect. Do you know what that effect is? These sites’ designers did.

Both Blogger and WordPress are weblog software application websites. However, Blogger uses lots of gradients, drop shadows, fat icons and rounded text in its main page interface while WordPress does not. Know why? These sites’ designers do.

There’s no two ways about it; style matters. And style applied to a web page design is not always just style for its own sake. It’s often a vital supporting element in effective design. Competent designers understand this. The nattering nabobs and little design generals of the online forums do not. Which is why there’s a difference between getting paid and getting comments in a forum.

So don’t mistake the presence of style for a lack of substance. Don’t forget context when evaluating or applying design. And don’t work for comments by doing what’s popular – work for clients and get paid for doing what’s effective.

post authorAndy Rutledge

Andy Rutledge
Andy is a father, husband, designer, cyclist, composer, and curmudgeon. He is principal at Unit Interactive (https://unitinteractive.com) and writes about design and professionalism on his own site, Design View (https://andyrutledge.com).

Tweet
Share
Post
Share
Email
Print

Related Articles

Examine the boundaries of engagement and envision the ideal ethical design.

Article by Tushar Deshmukh
Gamification or Manipulation? Understanding the Ethics of Engagement Loops
  • The article examines the fine line between ethical gamification and psychological manipulation in UX design, contrasting harmful engagement loops, such as Snapchat streaks and casino-style mobile games, with genuinely empowering examples like Duolingo and Khan Academy, while offering designers a framework of ethical questions to ensure their work elevates users rather than exploits them.
Share:Gamification or Manipulation? Understanding the Ethics of Engagement Loops
5 min read

Find out how pre-selected options silently shape decisions, and what ethical designers must do about it.

Article by Tushar Deshmukh
The Psychology of Defaults: How Pre-Selected Options Influence Behavior
  • The article argues that defaults quietly guide user decisions through inaction, making them far more powerful than most designers realize.
  • It highlights that they work by exploiting natural human tendencies like status quo bias and the assumption that pre-selected options are “recommended.”
  • The piece emphasizes that ethical design doesn’t eliminate defaults but uses them transparently, with user intent and easy reversibility at the core.
Share:The Psychology of Defaults: How Pre-Selected Options Influence Behavior
5 min read

Discover how personalization crosses the line from serving users to silently shaping them.

Article by Tushar Deshmukh
The Ethics of Personalization: When UX Crosses the Line from Helpful to Harmful
  • The article argues that personalization walks a fine ethical line between empowering users and quietly manipulating them.
  • It exposes how over-filtering doesn’t just limit content; it limits identity, replacing user curiosity with algorithmic compliance.
  • The piece calls on UX practitioners to treat ethical personalization as a foundational responsibility: one that demands transparency, fairness, and respect for human dignity.
Share:The Ethics of Personalization: When UX Crosses the Line from Helpful to Harmful
4 min read

Join the UX Magazine community!

Stay informed with exclusive content on the intersection of UX, AI agents, and agentic automation—essential reading for future-focused professionals.

Hello!

You're officially a member of the UX Magazine Community.
We're excited to have you with us!

Thank you!

To begin viewing member content, please verify your email.

Get Paid to Test AI Products

Earn an average of $100 per test by reviewing AI-first product experiences and sharing your feedback.

    Tell us about you. Enroll in the course.

      This website uses cookies to ensure you get the best experience on our website. Check our privacy policy and