How to Draw the Eye to Parts of your Webpages
- Category: Blog
Here we show you how design features can be implemented to draw the eye to certain parts of your webpages by covering the facets of text, images and buttons.
The dilemma is as follows. On one hand you want to provide a solid chunk of high quality information to your website visitors. Yet on the other hand, you are conscious not to overload them and to saturate your webpages and make them look unwelcoming. However with this you run the risk of not including information that people may be visiting your website for in the first place. Due to this conundrum, there exists some website design features that can be implemented to draw the eye to certain parts of webpages and thus highlight the most important parts for you and the reader.
As we know, text can be rendered in different sizes, fonts and styles (bold, italics etc.). Each of these can be used to achieve different things. For example, normal written text as seen in this blog for example is perfectly fine to denote explanatory information. To draw people’s attention towards this information, you may write a heading over it and make the text of this heading be in a bigger and bolder text. Because this is now more obvious, readers of your website can scan the webpage and the bigger and bolder text will stick out to their eyes and make it easier for them to read.
When text gets too tiring and cumbersome to read, images come into play. After all, a picture does say a thousand words as the saying goes. Having a large picture on a webpage will naturally draw the eye to it to subconsciously analyse the image. With mobile devices, images can be more effective than text because we have an automatic reflex to view and digest images instead of having to forcibly read and digest text. That is why blocks of text are usually peppered with images – they are a visual punctuation that naturally draws the eye to them, which in turn means that the eye is drawn into the surrounding text.
Buttons are much like responsive images in that they perform an action when clicked/tapped on. They can also be designed to literally flash and increase and decrease in size like a constant heartbeat effect. For example, you may place a button with the words ‘Click here to Contact Us’ at the end of each of your webpages. This does two things. Firstly it feeds into your exit strategy by giving website users a viable option to take (rather than exiting) when they read through a webpage. Secondly the design effects of the button draw the eye to it instantly and alert those who see it that an action can be taken immediately by clicking/tapping on it or that this option is available to avail of at the time.