The Principles of Graphic Design Websites
If we were to ask you to think of a business – any business – that puts design principles at the core of its product, it’s fair to assume that the first name to spring to mind would be Apple. From iPods to iPhones to Macs and AirPods, the company knows that innovative design wins out. It’s that thinking, extolled by Steve Jobs, that got Apple ahead of the game in the 2000s, and it’s the commitment to that thinking that ensures Apple remains the world’s most iconic producer of hardware in the technology world today.
But Apple also has that commitment to design on its websites. The company has, of course, overseen an evolution of its websites over the years. In fact, you might cringe a little bit if you look back to see how it looked in the late 1990s. But overall, the company has been the leader, not the follower, in creating the structures for sleek website design. Its high point arguably came around the late 2000s when it began focusing on a minimalistic format that encouraged the visitor to go on a journey to learn more about the latest products. The core principles of that website design are still used by Apple – and now its competitors – today.
An open interpretation
The purpose of this is not to hail Apple, but rather to point out the unsurprising fact that a company famed for innovative hardware design should also be celebrated for the graphic design principles of its websites. Apple may have ripped up the rulebook from time to time, but it also stayed true to the principles of graphic design. Rules are not principles, and Apple broke the former of graphic design when it felt necessary, but it respected, upheld, and helped evolve the latter.
When exploring graphic design websites for inspiration, perhaps before launching your own portfolio on a platform, it becomes apparent that the principles of graphic design are open to interpretation. The basis of graphic design, both online and offline, is to interpret, order, and present visual images. In the simplest terms, that means telling a story through the design. And that story-telling in graphic design can be just as diverse as it is in literature or any other type of art.
Most academic institutions set out around half a dozen core principles of graphic design, although some do more. In addition, there is debate over the basic elements of graphic design. But for our purpose here when considering graphic design websites, we can look at areas like:
- Balance – the distribution of the different elements on the website page.
- Alignment – the core visual connection bridging the different design objects on the page.
- Hierarchy – the distribution of priority and weight given to different elements.
- Contrast – the art of distinguishment, drawing the visitor’s eye to the hierarchal elements.
- Rhythm – sequences and continuity, such as repetitions of color, that intertwine the elements on the page.
- Proximity – how the elements combine in the layout.
- Color & Space – the use of color and space to differentiate and complement the different elements.
The list above is certainly not exhaustive, and you’ll like notice that many of those principles can overlap. Hierarchy and contrast, for example, are almost synonymous. Moreover, each principle will also have subsections, some of which might feel somewhat contradictive of one another.
The art of the story
As hinted above, there is an onus upon the website designer to recognize the key principles and interpret them to their own style. There is no rule in graphic design that governs how you must implement balance or alignment on your website. If we return to the allegory of telling a story, then you can think of the principles of graphic design like the structures of writing – syntax, grammar, vocabulary, etc. Storytellers must understand those structures, but it does not inhibit nor determine what they are going to say. That becomes apparent when you look at the richness in the variety of graphic design websites. They are all using the principles of graphic design to tell stories in a different – sometimes remarkably different – way.
But the key question facing graphic designers now is arguably not how to interpret the principles of their craft but to instead anticipate the new ones. We mentioned Apple earlier, and it was about more than simply highlighting the slick design that characterizes its modern websites. Apple’s websites spanned the first two eras of the internet, broadly known as Web 1 and Web 2. The former was the era of the static website in the 1990s and early 2000s, where the priority was to provide information on a page. Web 2 – the current era – is the era of social media and mobile internet. In terms of graphic design, there was a seismic shift in the thinking of what a website could – and should look like. And now, many believe that we are on the verge of web3 (it’s deliberately presented in lowercase). The web3 movement is defined by blockchains, cryptocurrency, NFTs, metaverse, and avatars, and it can even incorporate elements of AI. For the latter, check out some of the incredible design work being done by DALLE 2 and OpenAI. It all represents a challenge to graphic designers, but it is also an opportunity to ride the wave of new technology and a new way of thinking.