A well-designed website is a beautiful thing but where do you start? Design in its essence is all about problem solving and designers excel in resolving specific problems. Every design, of any ilk, starts with a question (or perhaps a list of them) and if you’re successful, you will ultimately have an answer and a clear solution which you can implement.
Websites are one of the more complex mediums you can design for. To design a webpage you use pretty much the full spectrum of design areas, from branding, to layout composition, to editorial and typographic composition, to photography, illustration, video, motion… the list goes on and expands as websites grow bigger and more complex.
Let’s start with the basics; the fundamental design anatomy of a website. There are a few core design elements that, when combined, make up a website page. These are shapes, colours, images (moving or not), typography and, the element that ties everything together, the layout of the page.
Shapes
The construction blocks for a webpage are rectangular but this doesn’t mean you can’t add other shapes to it. The shapes used are very much design-driven and there has been much research into their psychological implications. For example, the straight, regular lines and right angles of squares evoke a sense of reliability, strength and security, whereas the softer lines of circles are seen as being pure, representing infinity and perfection. Where angles and jagged shapes are used to indicate movement, dynamism and excitement, rounded shapes are more friendly and appealing to the eye. Spirals denote growth, creativity and calmness. In essence, different shapes will invoke different feelings in the user so should be considered carefully.
Colours
Colours can have an even greater psychological effect than shapes and should therefore be chosen wisely. When it comes to website design, the first consideration should be to follow brand colours, before thinking about contrast and, ultimately, colour psychology. Each colour in the wheel has a specific psychological trait attributed to it, stirring emotions and invoking reactions. For example, red evokes feelings of passion, love, strength and action, whereas blue is calming and evokes trust, reliability and integrity. Your colour choice can influence the way a user interprets what they see on their screen as much layout and even copy. For better user experiences, the psychological effects of colour should be an important consideration.
Images
Context and purpose are key here. Images can take various forms, including photography, illustration, or moving images such as a well-shot video or animation. Images can be used to directly represent something, for example with a product shot, or they can represent a concept or an idea. The way an image is shot will also be of utmost importance. Being closer to the subject will invoke feelings of familiarity, friendliness and understanding of the subject, while a wider shot can transmit an idea of formality and a corporate feel. Its size, too, is an important consideration. Perhaps the most crucial to get right is the hero image on your landing page – the impact of this on a user’s emotional reaction to your brand cannot be underestimated, especially if it is large.
Typography
Good typography is invisible. Think of it this way; reading is one of the most incredible things we as human beings can do. We identify specific symbols and associate those with sounds. These symbols put together make up words, and then sentences, paragraphs, and so on, culminating in a dialogue with the reader. The main purpose of typography will be to facilitate this process but also to aid branding and position your business. Firstly comes font choice – this should be one that is legible and immediately sets the right tone for the context (think of formal documents using serious fonts and wedding invites elegant ones). The text is then laid out in a way that facilitates reading, with a concise line of text for ease and a correct line-height to prevent the skipping of lines while reading a long paragraph. It is vital to make the words flow, avoiding the risk of turning the act of reading into a daunting task.
Layout
When you have all of the individual components figured out you will get to the holy grail of design – layout. It is when you have to start laying out elements on a page that the real task begins. What is most important? Where do I want people to look? What do I want people to click on? Layouts can make or break a website, the best ensuring functionality, that users stay on the site and engage and, ultimately, that they perform the task that you wish them to. Our article on visual hierarchy should help you to think about the layout of your website pages, offering top tips and advice.
Each of these design elements, implemented successfully, helps to ensure your message is clear and the results are effective. They help to strengthen branding, guide visitors’ perceptions of your business, and deliver a positive user experience. In short, the design anatomy of a website is crucial to the success of your recruitment website and should therefore be very carefully thought through and executed.
