Home
Funny look at design request that don’t support good design principles
https://youtu.be/qgcX0y1Nzhs
34.81% of all traffic entering sites start on the Homepage
(the 2nd is used vehicle listing at 10.81%)
11.8% of all Page views are on the Homepage
Conversion by Device
Although the majority of users are now viewing websites on mobile devices, conversion rates across the web are typically much higher on desktop. Even with improvements in mobile UX, the mobile journeys continue to be shorter and less likely to convert.
Desktop 6% - Tablet 1.5% -Mobile 1.6%
Each household has an average of 7.4 devices and a consumer uses will often use 3 devices every day. We see the peak time for mobile users is on their commute, desktop users while they’re at the office and tablet viewers are more common in the evenings.
Main Navigation - Desktop
The top Navigation is the primary method of navigating a website and fewer items you have in your navigation,the easier it will be for visitors to scan your primary site sections and find what they’re looking for. Short-term memory holds only seven items, plus or minus two. This is from the famous psychology paper published by George Miller in 1956. Only have 6 to 8 main menu items, for ease of use and improved SEO navigation needs to be priorities navigation for your visitor.
Navigation should be designed for responsive compatibility - should fit comfortably and look logical on most devices.
'A great navigation translates easily to mobile and tablet. Design a navigation that works across all devices, or consider two similar navigation that don’t require people to adjust to a different mental model when moving from desktop to mobile.' The Rules for Modern Navigation - Stephanie Lin UX Booth (January 31, 2017)
Hamburger menus at desktop can be harmful as they reduce discoverability (the ability to find key information) by around half of a traditional menu.
'Discoverability is cut almost in half by hiding a website’s main navigation. Also, task time is longer and perceived task difficulty increases. ' Hamburger Menus Hurt UX Metrics - Kara Pernice Nielsen Norman Group (Feb 17, 2017)
The main logo for your site should be in the top left hand corner.
'Shifting your website's logo away from the top left corner impairs navigation efficiency, and may also reduce brand recall.'Logo Placement Affects Web Navigation and Brand Recall - Kathryn Whitenton Nielsen Norman Group (Jan 20, 2017)
Main Navigation - Mobile
5 items set across the top of the device. Search Saved and Menu are set nav items leaving Call and Valuations as configurable options.
Hamburger menus are widely adopted and understood across mobile devices and provide the best solution for limited screen space ‘Navigation on mobile takes a larger proportion of the screen space than on the desktop, simply because the screen is smaller. Thus, people are more likely to notice it and use it.'The Rules for Modern Navigation - Stephanie Lin UX Booth (January 31, 2017)
Icons with labels 'Universal icons are rare. To help overcome the ambiguity that almost all icons face, a text label must be present alongside an icon to clarify its meaning.'Yes, Icons Need Text Labels - Aurora Harley Nielsen Norman Group (March 23, 2018)
Due to the use of mobile apps where hidden navigation are quite conventional,people will be more familiar with them and more likely to think of looking for and using them.
Mobile pages naturally require more scrolling, have less content visible above the fold, and may be slower to load (depending on your internet connection), so people may resort to using a menu instead of looking through the page and exploring whether there is any content that matches their interest.
Homepage – Banner
Hero Banners are the fastest way to grab a user's attention, create a positive impression and strong brand identity.
‘When users home to your page, they’ll have some kind of reaction. Whether it’s positive or negative, in large part, is determined by what they see. Since vision is the strongest human sense, hero images are one of the fastest ways to grab a user’s attention. Bold, graphic, and intentional imagery helps to engage the user.’Best practices for Hero Images - Nick Babich UX Planet (January 19, 2017)
Banners at mobile - GForces data shows banners make up a high proportion of a homepage load time and so banners should be kept to a minimum.
‘53% of visits are abandoned if a mobile site takes longer than 3 seconds to load.’ Google Data March 2016
Include 5 or fewer images within the carousel, as it’s unlikely users will engage with more than that. It also keeps load times down and reduces the number of users that abandon the page load.
‘It can be taxing to swipe through many frames on a mobile device, and it’s difficult for users to recognize topics they have already viewed when a set exceeds about five. Limiting the number also helps with discovering the content, and finding the content in the carousel again later.' Carousel Usability: Designing an Effective UI for Websites with Content Overload - Kara Pernice on September 14, 2013
HTML text maintains legibility on small screen resolutions, as it scales independently of the banner image. It also offers flexibility of positioning and benefits SEO.
Homepage – Search
Search has been optimised to surface the most important fields first, avoid over refinement of search results and ensure that its layout remains consistent as it responds. 2/3s of the users on the homepage go on search for used car using the search widget.
Maximum of 5 search fields.To simplify the search journey on homepages. The primary purpose of the search widget on the homepage is to get users through to the listing page with their basic search criteria entered, then filter further within the results page, where results are updated in real-time. This becomes more vital as the GForces BI team stats highlights that 56.7% of all traffic is on used listing pages. Some users can be overwhelmed by having too many options at first glance and they may over-filter their search and end up with very few results.
No New/Used Filter. Why?It limits users too soon. If a user selects Used Only on the homepage, they may never realise that they could have afforded a new car or that a new car was available that DID match their other criteria at only a slightly higher price point.
