back one page arrow button
Go Back One Page
July 14, 2021
main post image
Art + Design
Swiss Style as a foundation for web design.

Applying Swiss Style To Websites

The principles of Swiss Style are relevant in modern web design.

The main ideas behind the Swiss Style design movement are simplicity, objectivity, and readability. Despite originating over 70 years ago, I still find these ideas very important in modern web design. Swiss style rejects decoration and favors clear communication, and a website that doesn't communicate clearly and succinctly is doomed to fail.

I first became aware of Swiss Style; also called International Typographic Style, while studying architecture. It is a culmination of several minimalist, modernist movements that intrigued me as a student - Russian Constructivism, De Stijl, and Bauhaus. It features Asymmetrical structure, bold headlines, grid layouts, geometric abstraction, photography, negative space, and a minimalist approach.

Form Follows Function.

The pragmatic Swiss Style approach is very considerate of the Bauhaus mantra of form follows function, where beauty is found within the functionality of the design and not through unnecessary ornamentation. UX designers have to take a similar approach in that they are designing for an end user, and not for their own artistic concerns.

All of the characteristics of Swiss Style can easily be applied to websites.

Websites need proper structure and hierarchy to perform adequately, load quickly, convey information easily, and convert users to buyers or clients. Elements that cause confusion or distract from the content are not only a hindrance, but will cause users to leave the site and not return.

The grid is a foundation for design.

One of the most obvious design characteristics of Swiss Style involves placing elements on a grid to create a unified composition. It's also a vital tool for designers that need to present a coherent, usable, and accessible user experience. The grid can be used to order and present visual information in a clear and easy to understand way.

4 ways that Swiss Style can be applied to web design.

In Swiss Style design every element is functional and there for a reason. This is a result of its minimalist origins.

  1. Creates clarity with fewer UI elements.
  2. Restricts typography choices.
  3. Builds a visual hierarchy.
  4. Favors photography over illustration.

Using fewer elements and limiting typographic choices in a design removes distractions and communicates clearly the intention of the website. Font size, color, and weight are used to establish an understandable order, and position and contrast create structure. Illustration and graphics are important to conveying information, but photography and videos still have a more empathic connection to users, which results in higher engagement and conversion rates.

Swiss Style was created as a communication tool for industry, and communication is the most important aspect of web design. Always design around the content.