Web Design Through the Ages

Web Design Through the Ages

Web design through the ages

Web and UI design has come along way over the years. All of the innovative changes to design trends have led up to the sleek design of today. As designers, we have learned what has worked over the years and what hasn’t through the many technologies we were able to utilize throughout the timeline. Here are some noteworthy changes and trends that have highly impacted web design from the launch of the internet into the future.

The first web page developed by Tim Berners-Lee that ran on a NeXt computer.
The Birth of the Internet
The point of the internet was to be able to communicate government information globally. As this revolutionary technology developed, design only came in the form of the information itself. As with any piece of new tech, there was a massive learning curve using it. The learning curve was so great, that design was not a factor in the dark ages of the internet.

Yahoo Homepage 1993
Yahoo’s Homepage in 1993 – Source: Pickmore.com
1995 – 2000
The mid to late 90’s was an interesting time period for the web. It was then, that people realized the potential for the internet. E-commerce was birthed and a focus for the internet shifted. Navigation became a priority and with the development of CSS, styling such as color, buttons, and graphics were used in web design. Compared to today, these sites still appeared to be quite bare, but at the time, designers relied on organization of information along with general hierarchy when it came to making design decisions for the web.

After 1995 sites became a bit more dynamic thanks to the rise of Flash. This added a whole new dimension to how people view the web. People believed that Flash would be the ultimate choice of web design going into the new millennium. With fun navigation, people took great joy in browsing information and interacting with a Flash site.

web20 example
An example of a Web 2.0 website. Source: HowStuffWorks.com
Web 2.0
After the development and the improvements made for CSS, styling began to truly take off for the web. The focus for web design began to shift as certain navigational elements became common knowledge. Using wording on buttons such as “Learn more” or “Get started” eliminated a handful of issues that users have had in years prior.

Websites wanted to be include flashy elements such as gradients, really large graphics, and a “bubbly” navigation bar. Deep drop shadows began to trend. With these new styling elements, designers were able to develop a new way to assist users navigate a website using strictly visuals and less text.

Example of Skeuomorphism
Example of Skeuomorphism – Source: downgraf.com
An innovation was made in the early 2000’s with the concept of skeuomorphism. User interfaces began to look like some of the real world objects you would typically use daily. Dashboards would include turn dials, realistic buttons, with backgrounds that resembles a wooden surface or even a notepad.

When Apple launched the iPhone, designers and developers greatly use skeuomorphic design that would resemble some of these real world objects such as calculators and radios. However, due to size and layout restrictions in terms of adapting these objects to a rectangular screen. It wasn’t long before designers began to move away from skeuomorphic design.

Example of flat design
Example of flat design
Flat Design
Shortly after 2010, HTML5 had surfaced that rocked the web design world greatly. It solved a great number of page speed issues by eliminating graphics that could otherwise slow down loading times. By eliminating daunting graphics, users can also have the ability to focus on content more. By creating and refining graphics with the help of the new CSS, the trend for web design started taking a “simple is more” approach. Flat design has also allowed more open space for web pages and spacing was a bit easier to work with in terms of web navigation.

It wasn’t long until Microsoft became an adapter of flat design with the launch of Windows 8. Flat design proved to be easily scalable for not only desktop, but for tablets and smartphones as well. Scalability allowed sites to be much easier to use and easier for the eyes as well across different devices.

Example of material design
Example of material design – Source: envato.com
Material Design
Developed by Google, material design became their response to flat design that has become widely used among designers. Material design reintroduced some of the most basic concepts of skeuomorphism in the sense that it mimics paper overlapping one another. This allows designers to use hierarchy

What is next for web design?
Something that was not mentioned in depth with the most recent design trends was the fact that despite some elements phasing out through time, you do occasionally see them appear every now and then. It is possible that in the future, web design as we know it may not only evolve, but will evolve with previous philosophies in mind.

Technology has also given designers new opportunities to explore uncharted areas of design. People in general will become more tech literate which means more often than not, we will begin to see web ideas vanish into common knowledge.

What are your thoughts on the future of web design and how far we’ve come?