This ecommerce infographic is from the team at Graphitas, a design and search marketing agency. It provides an overview of webpage anatomy and is a must read for front-end designers, search marketers and general ecommerce pros.
One of the goals in designing an ecommerce site is to have it display prominently on search engine results pages (SERP) for relevant keywords. For example, if you are an affiliate marketer with a review site for children’s books you may want to design your site so that someone searching Bing for “illustrated hobbit book review” will find your site and not go straight to Amazon. This is called search engine optimization (SEO) and the more improvements you make in SEO, the more likely it is that people looking for your site will find it.
Even more important than having people find your site is having people use your site. In an ecommerce setting this is vital to business success. You must make your paths to conversion clear and help users complete calls-to-action (CTA) easily. This is called user experience (UX) and it is crucial for driving more revenue through your site.
Designing with Impact – Infographic | Graphitas Blog.
The graphic addresses the common conflict that exists when designing for human users of your website in order to get them to convert and designing a webpage for web crawlers in order to get your website displayed highly on search engines.
One of the first things designers are taught to understand is the importance of position of information on a page, calls to action, and trust signals – via “Designing for SEO” on Moz.
It provides a hierarchy of impact for five elements of a webpage starting with the billboard header and moving down to sub-panels and hidden gems. The graphic also offers best practices for each element of the webpage. For example, text behind a mouseover provides you an opportunity to improve both UX and SEO.
SEO & UX for webpages
The accompanying blog post on Moz has practical information to design better webpages – better in terms of UX and in terms of SEO.
One of the main pieces of advice and an example of a best practice is the principle of using webfonts, CSS and HTML in place of images. This makes your content more readable to the web crawlers and more usable to your site visitors.
So which elements of your webpage make the most impact?
