Should the Web Have a Universal Design System?

Default avatar.
January 16, 2018
The web is a diverse platform, but that diversity impacts usability and user experience. We explore the case for an open source design system for the entire web.
Should the Web Have a Universal Design System?.
Unlike mobile applications, the web has no set design guidelines to which a designer can refer. Instead, each web project tends to be a blank canvas. There are frameworks like Material, Bootstrap, and others which provide a base, but no set guidelines which span the web as a whole. The result is a wide-ranging and diverse web, but one with a lack of cohesiveness, particularly in terms of user experience. Navigations differ in placement, structure, and overall design. Layouts alternate in width. Text sizes and typographic scales vary wildly. And a wide range of differing components, interactions, and user interface elements are used. [pullquote]Design systems ensure consistency between apps, resulting in a more cohesive product[/pullquote] The lack of a set design system for the web is due to its open source nature, and lack of ownership. No company or organization has the power to enforce guidelines or standards. The closest anything or anyone comes to impacting the way we design is Google, who can affect your search rankings based on factors such as user experience, responsiveness, and code structure. On the other hand, mobile operating systems like iOS and Android have the power to enforce certain application structures, user experience practices, and standards. Design systems ensure consistency between apps, resulting in a more cohesive product, and one that is easier to use and understand for the end user. It also enhances performance and optimization, as well as accessibility. 001 Despite such a defined set of guidelines in both cases of iOS and Android, designers still find ways to differentiate through aspects like color, layout, and design details. In these circumstances it’s still entirely possible to achieve outstanding and unique designs which still fall within the guidelines. Conversely, the web is an absolute blank canvas. There is the ability to take a design and user experience in any direction desired. On one hand, it’s what makes the web so attractive, diverse, and abundant. On the other hand, it can lead to a confusing experience for many people: one that is highly inaccessible, inconsistent, and uses a variety of sub-optimal and dark user experience practices. The case of iOS and Android show just how rich and diverse a digital product or ecosystem can be, even under such regulation and moderately-strict guidelines. This poses the question of whether a set of open source guidelines should be introduced for the entire web. Whether it comes from W3C, is a unified effort between major browsers, or is devised by a group of designers, it could improve the web for all. There would still be great scope for producing unique designs, while ensuring the web reaches much more acceptable levels of accessibility and usability as a whole. Designers and user experience professionals could contribute to this as an open source project, pushing forward the progress of the entire web. 002 It’s not just web applications this system should apply to. Whether it’s a blog, portfolio, landing page, or wiki, they are all still usable products. They still require important user experience considerations such as accessibility, navigation, color practices, and typography scales. Many companies consider such aspects, while many ignore them either through choice, misjudgement, or lack of consideration. It’s an area which is so fragmented under the current system, and does not work appropriately for everyone. That includes those with a disability, visual impairment, or lack of familiarity with computers and the web. These users should be designed for first. As it stands, the primary consideration is often the design visuals: making something impressive, unique, and eye-catching. Often this desire to differentiate can lead to oversights with user experience, and design choices like unique navigation solutions which are confusing and unfamiliar to most. 003 Google is a prime example of a company who have developed a set of guidelines and applied them with absolute consistency across mobile and web. Whether you switch from Google Keep on iPhone, to Google Drive on the web, the user experience and design elements remain consistent. Then when switching between products on the web like Play Store or YouTube, it again remains consistent. This ease of use and transition from one product or site to another should be a model to follow for others. It puts the user first, making for an entirely accessible and understandable experience. Google is beginning to take this even a step further, as they introduce Android apps and web-based equivalents that work at desktop size. With products like Chromebooks, it makes the transition between devices even more seamless. [pullquote]The closer we can get to a cohesive design system across the web…the better it will be…for all parties involved[/pullquote] The closer we can get to a cohesive design system across the web as a whole, the better it will be in the long run, for all parties involved. This means having systems span much further than just one company. IBM or Airbnb may perfect their design systems to the nth degree and apply them with excellent consistency. However, as soon as a user switches to another product or service, their design system is likely to be wholly different, from typography and layout, to navigational practices. That’s why it needs to be looked at as an issue from further afar. And apps are the closest example we have to how successful this can be as a means to improve the everyday lives of users.

Ben Bate

I'm Ben, a Product Designer from the United Kingdom. You can visit my website or follow me on Dribbble.

Read Next

3 Essential Design Trends, May 2024

Integrated navigation elements, interactive typography, and digital overprints are three website design trends making…

20 Best New Websites, April 2024

Welcome to our sites of the month for April. With some websites, the details make all the difference, while in others,…

Exciting New Tools for Designers, April 2024

Welcome to our April tools collection. There are no practical jokes here, just practical gadgets, services, and apps to…

14 Top UX Tools for Designers in 2024

User Experience (UX) is one of the most important fields of design, so it should come as no surprise that there are a…

What Negative Effects Does a Bad Website Design Have On My Business?

Consumer expectations for a responsive, immersive, and visually appealing website experience have never been higher. In…

10+ Best Resources & Tools for Web Designers (2024 update)

Is searching for the best web design tools to suit your needs akin to having a recurring bad dream? Does each…

3 Essential Design Trends, April 2024

Ready to jump into some amazing new design ideas for Spring? Our roundup has everything from UX to color trends…

How to Plan Your First Successful Website

Planning a new website can be exciting and — if you’re anything like me — a little daunting. Whether you’re an…

15 Best New Fonts, March 2024

Welcome to March’s edition of our roundup of the best new fonts for designers. This month’s compilation includes…

LimeWire Developer APIs Herald a New Era of AI Integration

Generative AI is a fascinating technology. Far from the design killer some people feared, it is an empowering and…

20 Best New Websites, March 2024

Welcome to our pick of sites for March. This month’s collection tends towards the simple and clean, which goes to show…

Exciting New Tools for Designers, March 2024

The fast-paced world of design never stops turning, and staying ahead of the curve is essential for creatives. As…