The evolution of web design

During our Interface Design and Typography-course at the Content Strategy Master programme of  FH Joanneum Graz we had to analyze the evolution of web design with the help of a specific example. This blog post should provide more generalized, broader insights into the journey from the very first websites in the 90s to state-of-the-art web design in 2020.

The first website

The inventor of the WWW, Tim Berner-Lee published the very first website in August 1991. It was a very simple webpage with just a few links. The original page is not online anymore, but you can find a copy of that text-based page at the W3 Consortium. The W3 Consortium is an international community with the mission to lead the web to its fullest potential. Back in the 90s, it was established to standardize the way HTML pages are built. Nowadays, the W3C continues to set standards like JavaScript and other languages

In 1991, the structure of HTML (HyperText Markup Language, the markup language webpages are written in) offered only very basic elements such as headlines, links, and paragraphs. Although the following HTML updates introduced more sophisticated elements such as images, it was still a long way to the adoption of CSS (Cascading Style Sheets) which allows the advanced design of websites.

Structured design with tables

With the introduction of tables, web designers brought more structure to the design of websites. In fact, the first WYSIWYG web editors like Microsoft FrontPage or Dreamweaver utilized tables to create multi-column layouts. Background colors and images allowed some creative layout design, but HTML was still very basic back then.

Complex designs with Flash & DHTML

Flash allowed web designers to design beyond HTML’s capabilities. As a relatively simple development tool, it became quite popular to design motion graphics, interactive content and complex layouts. Sometimes, even entire websites used Flash in the late 90s to offer an exceptional experience to their visitors. As an alternative to Flash, which was developed by Adobe, DHTML was used to enhance websites with interactive and animated components.

CSS-based design

With the new millennium, increasingly more web designers used CSS to design websites properly. CSS was already proposed in 1994, but it faced various difficulties with adaption. Although the advantages are obvious, it took web designers some time to wrap their heads around the separation of design and code.

Today, CSS is still an important cornerstone technology of the WWW (alongside HTML and JavaScript). It enables designers to create clean and lean layouts for websites. From the perspective of a content strategist, it’s the perfect approach to introduce semantics and separate design and content.

Responsive design & Mobile-first

With the rise of ubiquitous computing, the WWW can be accessed by devices of different sizes. Responsive web design approaches web design from a new perspective. It ensures that websites render well on any screen size.

Google introduced its Mobile-first approach at the Mobile World Congress back in 2010. This approach is based on responsive web design, but it always starts design from a mobile perspective which expands with more features to larger screen sizes.

New standards

Since the early 2000s, the web continues to evolve around HTML, CSS, and JavaScript. The W3C releases new standards for HTML and CSS regularly, with HTML5 and CSS3 as the latest updates. They also come up with new JavaScript APIs. New technologies such as Progress Web Apps (PWAs) use those common standards to build reliable, fast and engaging web applications (such as Twitter or Airbnb).

A new set of skills?

Nowadays, web design requires more skills and techniques than in the 90s. It’s an ever-evolving field encompassing disciplines such as UX and interaction design, usability, accessibility, typography, motion graphics, psychology, marketing, communication design and even more. Content strategy is involved in many of those disciplines. It’s a multi-disciplinary field that focuses on the actual content, but also the people that create the content.