In this post, our friends at Komodo Digital shed light on the most common mistakes they see junior designers make when it comes to web design. Read on to learn what they are and how to avoid them.
According to the Behaviour & Information Technology journal, It takes roughly 0.05 seconds for people to form an opinion about the visual appeal of your website, and whether they will stay or leave. Designing websites can be tricky for beginners. This article aims to outline some common web design mistakes that should be avoided.
1. Jumping straight into design software
As a beginner, it’s easy to get ahead of yourself and jump straight into designing the interface of a website. However, we always see the best results when working offline first to help generate a foundation to build upon. This helps to inform your design, provide purpose, and should simplify the design process by adding more structure.
At this stage, supporting material should consist of personas that will identify the target user for the site, user flows, outlining key interactions and paths taken by the user to satisfy each user story, and most importantly, wireframes. Using paper and pencil to sketch out a rough design allows you to work in an agile way, iterating the design without consequence.
2. Overlooking grids, guidelines, & columns
Something that is regularly overlooked by junior web designers is the importance of grids and guides that are used to help ensure elements are aligned. Columns are great for segmenting content vertically and ensuring these blocks of content are aligned correctly, are very versatile, and can be set to the user’s preference.
Gutters on either side of the columns can provide breathing space for content. These help developers during a design handover, as they are able to view the columns which provide context to the space used in-between content.
3. Lack of visual hierarchy
Lack of visual hierarchy is another common mistake when people first start out designing websites. Visual hierarchy should guide users through the site and to their goal. This can be achieved by making elements larger than others or making them more prominent on the web page. White space can also increase the visibility of a hierarchy by separating out blocks of content, which will aid in drawing attention to them depending on your intent.
We regularly get client feedback asking to move content closer together, but you need to use your expertise to advise on what is best to achieve the desired goal.
4. Not designing for accessibility
One of the more important yet overlooked aspects of a website is accessibility. If the website hasn’t been built to be accessible it’s a barrier to entry for customers with visual or auditory impairments. Accessibility covers a vast spectrum but many aspects of this are easy to understand and implement, whereas others are more complex. Incorporating accessible design into your site is much easier when done at the start, rather than trying to improve later.
Color contrast is a large blocker for a lot of users, yet is fairly easy to fix. Color Blind Awareness states there are approximately 300 million people who have Color Vision Deficiency. This can have a massive impact should your site contain multiple colors that don’t pass the contrast test. It also affects things like iconography if color is used to demonstrate status. You can perform this test by simply typing ‘color contrast test’ into Google.
We have a more in-depth article about CVD and other accessibility issues.
5. Disregarding the mobile experience
Smartphones are a part of our everyday lives now. Websites should be designed mobile-first to ensure they are responsive. A BrightEdge report from 2017 noted that 57% of all web traffic is from mobile devices, which has no doubt risen since then.
Considering the mobile experience will result in better interaction between the user and your website. This usually involves smaller padding between elements to reduce scrolling time, and smaller text to allow for full-width content so that it’s more easily digestible than trying to cram large text onto a screen. There shouldn’t be an excuse for a site to not be mobile-friendly.
Summary
The points mentioned in this article are just a few common mistakes that we see beginners make when designing websites. There are more principles to good web design, but these are a good start. Fundamentally, it’s about thinking about who’s going to visit the website, what device are they going to be visiting it on, and what they are looking to achieve.
About the author: Jack Johnson is a passionate and inquisitive designer, working at Komodo Digital, solving UX and UI challenges for clients whose software is used by millions across the United Kingdom. Komodo helps teams build exceptional digital products that people want to use.
Find more Community stories on our blog Courtside. Have a suggestion? Contact stories@dribbble.com.
