Since the origins of the web nearly 30 years ago, web designers have written tens of thousands of web design articles.
Trends have come and gone, best practices have been created and made obsolete, and the devices we browse on look nothing like those of the past. In short, the world of web design is constantly adapting and improving—and many of those improvements can trace their origins to humble blog posts.
So, to honor some of the best writing on web design, here are ten of the most influential and widely regarded articles on web design. From its origins in print to the flexibility of today’s browsers, web design continues to influence makers everywhere. You’re sure to find some inspiration in these articles that you can bring to your own design work.
A Dao of Web Design by John Allsopp
In the early days of the web, when the digital design industry was still finding its feet, most web design was heavily influenced by the medium of print. Modeling an existing medium made sense at the time—the web was still so new that the best practices we take for granted today simply weren’t even possible yet.
“The web’s greatest strength, I believe, is often seen as a limitation, as a defect.” – John Allsopp
John’s now-famous manifesto argues that elements being borrowed from print design constrained the possibilities of the early web, and that web designers should embrace the unique characteristics that digital design unlocks.
“It is the nature of the web to be flexible,” John writes, “and it should be our role as designers and developers to embrace this flexibility, and produce pages which, by being flexible, are accessible to all.”
Even now, almost two decades after it was written, Dao is still an invaluable read for any web designer.
Responsive Web Design by Ethan Marcotte
Inspired by John Allsopp’s piece from a decade prior, Ethan’s 2010 essay was the first to coin the term “responsive web design,” when clients at the time were still asking for “an iPhone website.”
“Rather than tailoring disconnected designs to each of an ever-increasing number of web devices,” Ethan argues, ”we can treat them as facets of the same experience … In short, we need to practice responsive web design.”
For designers who had until then been creating entirely distinct experiences for different devices, the idea was a revelation: Hundreds of devices with infinite screen resolutions—all served by a single, responsive design that adapted content to fit the screen.
With the meteoric rise in popularity of smartphones and tablets over the next decade, responsive design quickly became the default way of designing new websites—all thanks to Ethan’s original article.
The Web’s Grain by Frank Chimero
The question at the core of Frank’s wonderfully illustrated essay on responsive design is a fascinating one:
What would happen if we stopped treating the web like a blank canvas to paint on, and instead like a material to build with?
Drawing inspiration from the art world, he explains how the unavoidable edges of our screens limit how we approach web design. This approach, while based on proven design patterns, inevitably leads to much of the modern web looking uncannily similar. Frank argues for “edgelessness” in design—instead of beginning by drawing a box, designers should first understand what needs to go in it.
It’s an inspiring read that pushes web designers to think outside the box when it comes to their designs.
Atomic Design by Brad Frost
Traditional web design has always started top-down. Designers create the overall structure of the site, then drill down, designing smaller interface components like inputs and buttons to fit within the overall page.
Brad’s chemistry-inspired approach to design flips this idea on its head. His 2013 article suggests starting with what he calls “atoms”—the smallest possible design elements, things like labels, inputs, and buttons. Each atom can then be combined into simple “molecules,” like search boxes, and even larger “organisms,” like site headers.
The concepts first described in Brad’s article have had an immense impact on the design world. Atomic design gives teams a clear methodology for creating consistent and collaborative design systems, helping teams speed up the design process and reduce their design debt.
Since the article was published, Brad has expanded his thoughts on design systems into a book that he wrote live on his site—it’s worth a read if you’re looking to create and maintain your own design system.
Four Letter Words by Jason Fried
No, they’re not the four-letter words you’re probably thinking of.
Jason’s short but galvanizing essay warns web designers to beware of certain four-letter words in the workplace: Need, Must, Can’t, Easy, Just, Only, and Fast. The words, according to Jason, are especially dangerous when strung together, like in his example:
We really need it. If we don’t, we can’t make the customer happy. Wouldn’t it be easy if we just did it like that? Can you try it real fast?
While avoiding these words may not directly affect your designs, collaborating with others is an essential part of delivering great designs. Jason recommends using the words sparingly, since they often discourage helpful conversation and can prevent you from getting real work done.
This is a Web Page by Justin Jackson
“At its heart,” writes Justin Jackson, “web design should be about words. Words don’t come after the design is done. Words are the beginning, the core, the focus.”
Justin’s punchy essay argues that web design should be about more than just responsive layouts or style guides. Written with vanilla markup in a standard text editor, the article challenges web designers to think about their words first, both through Justin’s writing and the no-frills design of the page itself.
First published in 2013, Justin’s article has since been shared thousands of times, and has been translated into 26 different languages. Now that’s something to write home about.
In Defense of Eye Candy by Stephen P. Anderson
Stephen’s 2009 essay on the importance of aesthetics gives a great contrast to Justin’s article on words, asking readers: is “pretty design” important?
In Defense of Eye Candy makes the case that aesthetics are just as crucial to good web design as function. On top of communicating the meaning of visual elements to users, visual appeal improves trust and brand perception, and users are more tolerant of problems with things that they find attractive.
Citing scientific studies that back his case, Stephen’s argument that form and function aren’t separate items, and that web designers should treat aesthetics and function with equal weight, should inspire you to consider beauty an essential part of your design approach.
In Search of the Holy Grail by Matthew Levine
A good number of early blogs were built around the same layout. Three columns—one fixed-width column for navigation, a second fixed-width column for advertising and other assorted widgets, and a fluid center column that expands to fit the width of the page.
Implementing this layout in a way that works across multiple browsers and screen sizes, though, proved a challenge for many web designers—that is, until Matthew’s 2006 article came along. The value-packed post describes Matthew’s approach to designing what he calls the “Holy Grail” page layout, with descriptive code examples and step-by-step diagrams explaining the design.
The resulting “floating column” layout became the basis of countless blog templates and page layouts, and can still be found behind many popular websites today.
Color Theory for Designers: The Meaning of Color by Cameron Chapman
Color theory is simultaneously one of the most important and most misunderstood parts of web design. Understanding the effects color has on site visitors is a valuable skill web designers can offer to their clients. Even simple changes like adjusting the hue or saturation of a color can evoke an entirely different feeling.
The first in a three-part series, Cameron’s weighty article on color theory explains how different colors and color families can be used to invoke emotion and action in your web design projects. Dozens of examples show the effect of each color on different sites. She also links to additional resources to learn even more about the theory of color.
Her post is among the most popular on Smashing Magazine, and for good reason—if you’re looking to understand how best to use color in your designs, Cameron’s article is a great place to get started.
Everything You Know About Web Design Just Changed by Jen Simmons
Perhaps this one is cheating a little bit, since it’s a video instead of an article, but Jen’s talk on intrinsic web design at An Event Apart in 2018 describes the cutting edge of what’s possible today in web design.
Intrinsic web design takes elements of Ethan Marcotte’s approach to responsive design and makes them inherently “squishy.” Instead of relying on fixed breakpoints and fluid columns, intrinsic design lets designers describe the layout of the content directly. This unlocks designs that were only possible by hacking existing layout tools—things like fluid columns and rows, images that scale dynamically without distortion, and intentional white space that remains, regardless of screen size.
Just like Ethan’s groundbreaking essay from eight years prior, Jen’s presentation describes what many see as another inflection point in how we design websites—it’s a valuable glimpse into the future of web design.
In web design, change is the only certainty
With the fast pace of innovation in web design, nothing stays fixed for long. New technologies become the standard, current standards become outdated, and the only thing that’s certain is that 30 years from now, the web design industry will look entirely different.
These ten articles, though, have stood the test of time, continuing to influence the path of web designers years after being written. Take some time, read them end-to-end, and you’ll no doubt find some insights to help inspire your own design career.
Source: Go Daddy Garage
Republished by Blog Post Promoter