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.

Popular Posts

Read Next

Exciting New Tools for Designers, November 2023

We’ve got a mix of handy image helpers, useful design assets, and clever productivity tools, amongst other treats. Some…

The Dangers of Doomscrolling for Designers and How to Break Free

As a creative professional, navigating the digital realm is second nature to you. It’s normal to follow an endless…

From Image Adjustments to AI: Photoshop Through the Years

Remember when Merriam-Webster added Photoshop to the dictionary back in 2008? Want to learn how AI is changing design…

3 Essential Design Trends, November 2023

In the season of giving thanks, we often think of comfort and tradition. These are common themes with each of our three…

30 Obsolete Technologies that will Perplex Post-2000s Kids

Remember the screech of dial-up internet? Hold fond memories of arcade machines? In this list, we’re condensing down 30…

15 Best New Fonts, October 2023

We’re entering the final quarter of 2023, and even in the pre-holiday lull, there are still plenty of fonts to get…

Progressive Web Apps (PWAs): Unlocking The Future of Mobile-First Web Development

There are over 5.4 billion mobile users today, meaning that over 68% of the population tap into an online business via…

The 12 Most Controversial Ad Campaigns of the 21st Century

How far would an organization be willing to go for the chance to generate a little extra buzz? In this list, we're…

20 Best New Websites, October 2023

The Bento trend is still going strong: In some cases, we see this extend to the layout, but many more are picking…

Exciting New Tools for Designers, October 2023

This month, we have a whole bag of goodies for designers, developers, and designevelopers alike. (Yes, we did just make…

The 10 Most Successful Rebrands of All Time - Ranked

We’re all familiar with rebrands going wrong, but what happens when they go right? From McDonald’s health kick to…

3 Essential Design Trends, October 2023

Every now and then, website design trends can leave you scratching your head. This month’s collection includes some of…