Layout for virtual store must adapt to all screens.
Layout for a virtual store is the name given to the way in which structural, visual, audiovisual and textual elements are distributed within the space of an e-commerce website page.
In fact, when most of us hear the term “online store layout” we immediately think of an online storefront. However, the term covers several pages of an e-commerce site, such as:
• Home (initial):
It usually exposes offers, search fields, general products.
• Department:
It presents products by categories; It has a filter system.
• Product:
Displays individual product with photos, videos, texts, infographics, etc.
• Service:
It exposes individual service with photos, videos, texts, infographics, etc.
• Cart:
Lists the products selected by the consumer.
• Check-out:
Verification of consumer data to close the purchase.
• Requests:
Lists orders placed by the consumer.
• Payment:
Virtual environment where the consumer pays for the purchase.
• Registration:
Place where the consumer can register on the e-commerce site.
• Institutional:
It exposes the history, mission, vision and values of the e-commerce company.
• Policies:
It exposes policies for exchanges, returns, uses, privacy, delivery, etc.
• FAQs:
It features the most frequently asked questions along with the store's answers.
• Attendance:
It exposes phones, emails, chats and other means of communication in the store.
• Physical stores:
Displays physical store addresses for omnichannel purposes.
• Representatives:
It presents the sales representatives of the brand by region.
• Awards:
It presents the seals, certifications and awards won by the store.
• Work with us:
Exposes job openings and options for applying for them.
• blog:
Set of Marketing content pages attached to the online store.
Anyway, all this has a layout. As you can see, many of these pages are part of most online stores. Therefore, the layout of all of them must be taken into account when implementing and/or optimizing an e-commerce site.
Main aspects of a good online store layout
Among the main aspects that you should take into account to create a good layout for an online store are:
• Design principles:
Design theory primarily encompasses the application of principles such as alignment, balance, contrast, proximity, repetition, proportion, and the use of color. You should employ all of this in the structure of your store. Start by creating a balanced layout based on your wireframe sketch.
• Organizational Culture:
Organizational culture unifies your company's sales channels around a philosophy encompassing Mission, Vision, Values, symbols, logos, colors, etc. Certainly, it should be included in your e-commerce layout. In this way, it prevents carelessness and avoids loss of credibility.
• Objectivity:
The fewer clicks consumers can make to complete a product purchase, the better. So, avoid unnecessary presentations, entry screens, intrusive screens and other blocks. Instead, take your consumer straight to the point, that is, to the product pages, shopping cart, and checkout page.
• Highlighting the “Buy” button:
The "Buy" buttons should stand out on the page to the point where consumers don't need to search for them. Basically, they should be in the most appropriate places so they can be easily clicked. Their calls-to-action should be precise. Furthermore, access the article " When a button makes all the difference in e-commerce design " and read a story about optimizing this aspect.
Online store layout: buy button should be easily found on pages.
• Highlighting products:
In addition to having beautiful photos, which replace physical contact, the products must be highlighted on the pages. To do so, preferably use one-color backgrounds. Finally, the white background is the most traditional.
• Highlighting services:
Many online stores sell products and services . Some sell only services. In this case, you will need to make what is intangible tangible. So, I recommend that you create illustrations of packages to "wrap" your products. This way, the consumer will see your service as something palpable.
• Brazilian e-commerce legislation:
A self-respecting online store layout complies with e-commerce legislation. In this context, Law 10.962/2004 proposes the following: “Art. 2: the following forms of displaying prices in retail sales to the consumer are allowed: III – In electronic commerce, through ostensible disclosure of the spot price, together with the product image or service description, in easily readable characters with a size of source not less than twelve.”. So be aware of these rules.
• Readability:
All information must be perfectly legible. You must ensure that the typography is appropriate, that the font size is optimal, and that the contrast between background and text is excellent. Not to mention the proper use of the Portuguese language. Furthermore, format your texts using the " F-pattern ," as this has been proven to facilitate reading.
• Usability:
It is good usability practices to offer multimedia content (texts, photos, videos, audios) ideal for all audiences; the suggestion of related products and an unbureaucratic checkout system; Among other things. Invest in usability and ensure more satisfaction to consumers who visit your store.
• Responsiveness:
Use an e-commerce platform that makes it possible to create a responsive virtual store, that is, one that adapts to different models and screen sizes, from those of small smartphones to the largest of desktop computers and smart TVs.
• The thumb zone:
Online Store Layout: On mobile, put what matters most at your fingertips.
The thumb zone is the area of the smartphone screen that is most comfortable and easily accessible for touch. It is estimated that at least half the population uses these mobile technologies with only one hand. Therefore, in this context, it is important that the "Buy," "Place Order," and "Pay" buttons, among others, are within easy reach of the thumb.
• The security:
The layout for the virtual store must also include the seals and security certifications, which lend more credibility and confidence to consumers when they need to enter their personal data and/or make a payment.
Maximum sophistication in the layout for the virtual store
As the market and e-commerce technologies evolve, an online store also needs to evolve. It is never ready, that is, it needs to be periodically optimized. In this way, the layout is one of the things that should be improved.
Therefore, invest in A/B testing to discover what works and what no longer works in your layout. I take this opportunity to mention that Agência e-Plus offers three services that can help you with this: " E-commerce Design ," " Evaluate my e-commerce (free)," and " E-commerce Redesign " (click on the links to learn more).
In addition, take good care of the layout of your virtual store. Keep it close to maximum sophistication.
