1. Put the core data into headerTalking about websites, it is an extremely helpful idea for quick and easy navigation. The only problem is to decide on what core data is, especially for websites with a huge amount of various data, like big e-commerce websites, news platforms or multi-theme blogs. Header is a strategic part as people see it before scrolling the page in the first seconds of introduction to the website. Being a sign of invitation, header should provide the key information about the digital product so that users could scan it in split seconds. In our article telling about web headers design in detail, we provided the typical kinds of content which can be included in headers:
- basic elements of brand identity: logo, brand name lettering, slogan or company statement, corporate mascot, photo presenting the company or its leader, corporate colors etc.
- copy block setting the theme of the product or service presented
- links to basic categories of website content
- links to the most important social networks
- basic contact information (telephone number, e-mail etc.)
- switcher of the languages in case of multi-lingual interface
- search field
- subscription field
- links to interaction with the product such as trial version, downloading from the AppStore etc.
2. Make branding highly visualIn terms of the discussed topic, brand means a sort of image created via a set of distinguishing features and promoting awareness and recognizability of the product or service on the market. This image can be created in tons of diverse ways - visual, verbal, touchable etc. In web and mobile design, branding supposedly means a set of visual elements defining the brand style, which can be applied in the interfaces such as logo, typography, brand colors and the like. All of them together are a powerful tool for creating visual recognizability of the product as well as its style. Being based on the analysis of target audience and marketing/ customer research, branding in this sense plays the vital role in product promotion as visual perception is very fast and easy for most people, much easier than reading the text and much more memorable than listening to speech. Moreover, if the brand is already well-established, its signs observed in the first seconds of seeing a website or app increase the level of trust.
3. Use numbers, not wordsOne of the investigations of user behavior provided by Nielsen Norman Blog shared an interesting finding: based on eye-tracking studies while users scan web pages, numerals often stop the wandering eye and attract fixations, even when they're embedded within a mass of words that users otherwise ignore. People subconsciously associate numbers with facts, stats, sizes and distance - something potentially useful for them. So they are hooked with the numbers included in copy while words representing numerals can be missed in the bulk of text. Even more, whatever numbers represent, they are more compact than their textual variant, which enables to make the content more concise and time-saving for skimming the data.
4. Make the call-to-action (CTA) instantly noticeableA call to action (CTA) is actually a word of phrase stimulating users to interact with a product in a way and according to the aim it is designed for. CTA elements are the interactive controls which enable users to do the action they are called to. Common types of such interactive elements in the layout are buttons, tabs, or links. In the interfaces of all kinds, CTA elements are the core factor of effective interaction with the product, which plays the crucial role in usability and navigability. When all the path of interaction and transitions is built clearly for users but CTA element is not thought-out, placed or designed well, users can get confused and will need to take additional effort trying to achieve their goals. That sets the high risk for poor conversion rate and general user experience. That’s why this navigation element should draw particularly deep designers attention. In any interface, it should be one of the most prominent and quickly noticeable parts to inform users how the product can be helpful or useful for them.
5. Care about general page scannabilityAs it was already mentioned, users don't usually read and observe all the content on the page or screen from the starting point: instead, they start from quick scanning to understand if it contains something they need or want. This significant domain of user research is massively supported by Nielsen Norman Group and provides designers and usability specialists with the better understanding of user behavior and interactions. Different experiments collecting data on user eye-tracking have shown that there are several typical models along which visitors usually scan the website. Among the following common models, you’ll find Z-Pattern, Zig-Zag pattern and F-Pattern. Let’s check what are the schemes for them. Z-Pattern Zig-Zag Pattern F-Pattern Knowing these models, designers and information architects can build navigation and important data in the points where they have the highest chances to be seen and get the user interested. The well-thought-out visual hierarchy will make the page easily skimmed saving users' time and energy.
6. Check the icons perceptionIcons are pictograms or ideograms used in the web or mobile interface to support its usability and provide the successful flow of human-computer interaction. It's hard to overestimate their role in UI navigation: they make it much quicker as most users perceive images faster than words. Usage of recognizable and clear icons has a great potential for boosting usability. However, even the slightest misperception can become the reason of poor UX so the solutions on the type of icons should be carefully tested and if needed supported with the appropriate copy content.
7. Strengthen the message with theme images and hero bannersNo secret, in many cases an image is worth a thousand words. In web and mobile UI, it often works that way: images become highly supportive and effective in setting the mood or transferring the message. In addition, images present the part of the content which is both informative and emotionally appealing. Original illustration, prominent hero banners, engaging photos can satisfy multiple goals:
- catch users' attention
- transfer the message visually
- support the general stylistic concept
- set the needed theme, mood or atmosphere
- demonstrate the core benefits or items effectively.