A Generation of Web Designs
The World Wide Web became publicly available in 1991. Twenty-six years later, we are now experiencing the web everywhere we go: on our commute, at work, and even right before we go to bed. With the latest developments in technology and design, web designs have drastically evolved to enhance our experience in today’s digital age. Not only are web designs more attractive now than they were in the early 90s, they’re also much more user-friendly and easier to develop. If we were to take a step back and see how web designs have grown over the years, it would resemble a booming millennial. Here’s what we’ve seen.
The burgeoning infant (HTML): 1994–1995
Web designs were very basic in the early 90s, and employed mainly web safe colours, fonts, and tables. It wasn’t much to look at but, at the time, this hardly matters. People were excited enough that they had access to the Internet.
This is also a period when HTML tables were often used to arrange text, images, into rows and columns of cells. For the most part, this limits web design as everything’s confined to rigid tables and cells.
The potty-trained toddler (CSS): 1994–2000s
Cascading Style Sheets (CSS) came into the picture in 1994, and is commonly used today. This provides a cleaner and simpler approach to laying out designs, where designers can set a sheet of visual rules to automate the font size, headers, background, and etc. of a page. This also made it easier for designers to have consistent layouts throughout the entire site.
Web usage became common during this era. This is a time when WordPress, Blogger, and user-friendly guides made it easier for people to create websites.
The playful child (Flash): 1996–2007
Flash rolled out around the same time as CSS. It’s a multimedia software that enables designers to create variety of shapes, layouts, animations, interactions, and fonts. Using the Flash plugin (and a lot of patience and loading time), designers could pack fancier creative expressions and interactive content into a resizable file format and send it to the browser for display. Flash marks a golden era for splash pages, animations, and all kinds of interactive web effects.
Many of these interactive web effects are very playful and advanced. It brought the static HTML websites to a level of user experience that closely resembles modern video games. Despite its visual appeal, Flash was not search-friendly and consumed lots of processing power. It lost its popularity in 2007 when Apple abandoned supporting this feature.
The mobile teenager (responsive design): 2007–2009
When Apple’s first iPhone hit the market in 2007, more and more people abandoned their flip phones for a smartphone. Cell phones were no longer just a tool for calling and texting, but to surf the web. However, most sites were designed for desktop users, making it difficult for mobile users to consume and load pages.
This led to a demand for Responsive design. The beginning of Responsive sites marks another breakthrough in web design. These websites adapt to any screen size so they look great on mobile, tablet and desktop. It does so by detecting a visitor’s screen size and orientation, and then adjusts the layout accordingly. As more people are accessing the web through a variety of devices, Responsive sites have become a standard in modern web design.
The realistic college student (Skeuomorphic design): 2010–2012
Designers wanted to make pages or apps look “real,” by incorporating visual characteristics of an object into a digital design. Texture, light, and colours are used to create a sense of depth and realism. Although this trend lasted for a short period of time, it inspired the development of mobile UI and widgets. One of the most common examples is Apple’s dashboard design, featuring planks of wood, metal, and plastic surfaces to imitate real-life objects.
The maturing adult (flat design and layout): 2012–Now
Designing a variety of layouts for multiple platforms is time-consuming, so designers decided to streamline the process. This entailed replacing the elaborate effects of Skeuomorphic design with a more minimalistic look, using flat designs and layouts. These designs simplify visual elements - and prioritize content - replacing glossy buttons and icons with vector images, icon fonts, white space, and beautiful typography. By simplifying visual elements, the process of creating multiple layouts and media became a lot smoother.
Today’s design process and tools: 2014–2017
With the emergence of new tools, such as Sketch, Framer, or Craft, and the evolution of existing tools, such as CSS, it is easier than ever before for people to convert their designs for the web. For instance, with Sketch, people can simply drag and drop to design pages.
Sketch: Drag and Drop based design
Browsing compatibility and coding restrictions are also becoming less of an issue, allowing for more design freedom and room for experimentation. Designers from some perspectives have less restrictions allowing them to extend their creativity and allowing content to be more fluid, where typography overflows its traditional boundaries.
In addition, fullscreen photography, videos, and high Internet speeds are a hallmark of the latter part of this decade.
Web designs continue to evolve with advancements in technology. For instance, because of higher Internet speeds and the more advanced design tools, we are now seeing an extended list of elegant web fonts, full screen photography, and videos, that we have not seen a decade ago. As the online world continues to change, we can expect to see more impressive designs that’ll take our online experience to the next level.