%20(17).png)
Design dissertations
Blocks are not pre-established, they depend on aspects such as the size of the website or theme, but over time, studies such as Beaird J.'s[2] have described a hierarchical configuration that is framed within a container that, according to this author, it organizes them in order similar to the following:
- Logo blocks: they are located at the top of the container and the elements that integrate them, usually they are dedicated to the identity of the website or the company. Identity implies a logo, name, color or other type of marketing element that is used to identify the website.
- Navigation blocks: they are also located at the top, the elements that integrate them are the menus that guide users through the different pages of a website.
- Content blocks: these are located after the navigation blocks, they give structure to information elements that the owner of the site wants to share with users and can be of a different nature: text, audio, image or video.
- Footer blocks: are located at the bottom of the page and the elements that constitute them contain information regarding: “copyright, contact and legal information, as well as some links to the main sections of the site”[3].
- Blank spaces or negative spaces: these are "areas of a page without type or illustrations"[4] that allow you to "breathe the design in” while providing balance and unity. An example is the space that surrounds the images, the margins, the space between columns, and the spaces between lines. Without these gaps a design is at risk of feeling visually saturated, and that has a negative impact on how it’s perceived.
The following image allows us to have an idea about the basic structure of these blocks in the construction of a web page:
These blocks are visual components that we can call design objects[6] and also form a variable that we have called Type of Block. On the other hand, although they are not pre-established, the structuring of the internal elements that compose them could be a distinctive feature of the interface of a web page, for this reason we have considered them as another variable that we call Elements. For the purposes of this study we have focused on those elements that internally make up the logo, navigation and footer blocks, with the aim of establishing how these elements can determine the user interface in a set of ecommerce stores.
Our subject of study: ecommerce for physical goods
It is common that, when referring to ecommerce, we are vaguely describing many things, "from the amount of sales generated by an online bookstore to explanations about fluctuations in the global market."[7] Although there is a certain consensus, the term is reluctant to a universal definition, which may be due to “the broad Internet market, the large number of its participants and the rapid evolution of their complex relationships"[8].
An etymological review of the term reveals that, in essence, ecommerce involves a transaction (sales, purchases, transfers, exchanges of products, services or information); The crux of the matter is how this transaction is done. Everything points to the use of "electronic media"[9], "electronic networks"[10] or ICT[11]. However, while it is true that these tools are essential, e-commerce is not restricted to its use, in fact it goes further and could be defined as “a business model based on the application of information and communication technologies to any aspect of the value chain of products and services”[12].
If we meet this definition, ecommerce can cover different dimensions, because, unlike traditional commerce, it does not deal with products, processes or exclusively physical agents, on the contrary, it must deal with intangible products, processes and agents of a digital or virtual nature[13], in other words, all those products, processes or agents "that can be sold or delivered electronically, that are already in digital format or perhaps digitized"[14].
There are three dimensions: physical, digital and virtual, each of which can set up an ecommerce model in relation to market elements[15]: products (goods that are exchanged)[16], processes (purchase, payment, delivery and consumption)[17] and agents (sellers, buyers, intermediaries)[18]. If we see it from the perspective of the product, different forms of ecommerce arise that take into account whether the product is physical, digital or virtual, consequently there will be a form of ecommerce dedicated to trade physical goods such as clothing, appliances, furniture, etc., other dedicated to digital goods such as ebooks, videos, images, music, etc. and other dedicated virtual goods such as services.
From our point of view, these forms of ecommerce have particularities that are reflected in the user interface. In order to verify this we have carried out a study that has allowed us to reveal these trends. However, due to the broad classification of these companies, we have concentrated on the broadest category, that of physical goods.
It is important to note that these companies also have some differences regarding the magnitude of their catalog, which can influence in the same way in their interface, for this reason we have made a subclassification based on the Shopify criteria[19] that differentiates between wide catalog stores and those with medium, small and singular catalogs. This allows us to make a clear delimitation for this study, which we can state as follows: study on the elements that characterize the user interface of logo, navigation, and footer blocks in ecommerce stores with a wide catalog of physical goods.
Starting point: variables, population and sample
For this study we have selected a population of 50 ecommerce stores from the most popular in the United States. To establish this criterion, Finder statistics were used (https://www.finder.com/online-shopping#Nike), Finder provides information that helps buyers make decisions when it comes to choosing the most appropriate products and services for their needs. The result was presented in categories, which has allowed us to establish a more detailed classification that originated the Type of Store variable that, along with Type of Blocks and Elements, constitute the organization of the database. The derived classification is as follows:
- Fashion
- Department
- Shoes
- Unlimited
- Beauty
- Home
From this population we have selected a sample of 35 stores distributed as follows:
- 10 stores in the Fashion category
- 5 stores in the Department category
- 6 stores in the Shoes category
- 5 stores in the Unlimited category
- 5 stores in the Beauty category
- 4 stores in the Home category
In each of these stores we have observed the elements that make up the LOGO, NAVIGATION and FOOTER blocks. A frequency analysis has allowed us to establish two things: first, what elements are more frequent in each block and second in what kind of store those elements are more frequent.
Results: Logo, Navigation and Footer.
Most Evident Factors.
According to the frequency analysis, the SEARCH, SIGN IN, BAG elements appear in the Navigation of 100% of the observed sites. Similarly, the frequency analysis shows that in FOOTER, the elements that appear in the vast majority of the observed sites are: CONTACT in 74% of the sample, SHIPPING 83%, RETURN 91%, OUR STORY 86% and CAREERS in 83% of sites. In FOOTER, the appearance of links to SOCIAL MEDIA such as Facebook in 91% of the sites, Twitter in 87%, Instagram in 86%, Pinterest in 77% and YouTube in 40% are also very common. The frequency of appearance of these elements suggests that they are essential and should not be lacking in an Ecommerce of physical goods and a wide catalog.
Least Evident Factors.
From our sample of 35 ecommerce stores, fashion stores represent a total of 10, 28% of the sample.
Fashion stores, FASHION tag
- Frequency in the Navigation block:
In this category, according to the frequency analysis, the following pages are more frequent: WOMEN, MEN in 100%, that is, in the 10 stores, DRESSES 60%, CLOTHING 70%, SHOES 70%, ACCESSORIES 100%, EXIT 100%. It should be noted that these elements are not exclusive to fashion stores, these can be extended to department stores and shoes.
On the other hand, elements such as ACTIVITY, BOTTOMS, TOPS, UNDERWEAR, JACKET, KIDS, BEAUTY and LANGUAGE have a low frequency, their percentage of appearance ranges between 10 and 20%, which could be an indicator that a more general classification is preferred for the products of these stores.
- Frequency in FOOTER:
As for the FOOTER’s elements, the most frequent in our sample of 10 stores are SIZE with a frequency of 90%, APP 100%, TRACK 100%, SIGN UP EMAIL 100%, INVESTOR 100% and GIFT CARD 70% and FAQs 40%. On the other hand, the less frequent pages in the footer are: DISCOUNT, LANGUAGE, CUSTOMER SERVICES, EVENTS, BRANDS, CATALOG, CORP. RESPONSIBILITY, with a frequency percentage that ranges between 10 and 30%, that is to say, of 10 stores, between 1 and 3 of them used these pages.
- Conclusion
Fashion stores usually categorize their products in the navigation block using the WOMEN, MEN, DRESSES, CLOTHING, SHOES, ACCESSORIES, SALE elements, but they can also add ACTIVITY, BOTTOMS, TOPS, UNDERWEAR, JACKET, KIDS, BEAUTY, among others, but the frequency data indicates that the majority opt for pages with more general categories.
Department stores, DEPARTMENT tag
- Frequency in NAVIGATION:
Like fashion stores, in the department stores the WOMEN and MEN elements stand out with a frequency of 90%, but, unlike those, they include the KIDS element with a frequency of 90%. Although in stores like Target, of minimalist design, these elements do not appear in the navigation block, they are part of the CATEGORIES element. Other elements have a high frequency in this block, such as: SHOES 70%, ACCESSORIES 70% and HOME / FURNITURE 90%.
As for the least frequent elements in this block, the data indicates that they are NEW, BEAUTY, BRANDS, SALE on an average of 40% and CATEGORIES with a frequency of 20%. This last percentage is represented by the TARGET store, whose design differs from the rest, since it presents a very minimalist design that encloses its products in very general categories.
- Frequency in FOOTER:
As for FOOTER, the most frequent pages are: STORE 60% and EVENTS 80%. The least frequent in this category of stores are: FAQs, APP, TRACK, CUSTOMER SERVICES, OUR STORY, GIFT CARD CATALOG with 40%, SIGN UP EMAIL and SITE MAP, which frequencies are below 20%.
- Conclusion:
In general, the elements that regularly appear in this category of store are: WOMEN and MEN, KIDS mainly and can be complemented with less frequent ones that are: NEW, BEAUTY, BRANDS, SALE, elements that usually appear in the navigation block.
Shoe Stores, SHOES tag
- Frequency in the navigation block:
In its design, the WOMEN, MEN and KIDS elements are highlighted again with a frequency of 66% and 50%. The NEW and ACCESSORIES elements also have a high frequency with a percentage of 66% and 50% respectively.
The elements that are least frequent are: BRANDS 32% CATEGORIES 16%. It should be noted that some very specialized elements usually appear, such as the ones in Simmi Shoes site, whose navigation block has elements like WIDE, HEELS, FLATS, TRANSPARENTS or TRENDS, very exclusive categories of this store that focuses on women's footwear. The case of TOMS shoes is also very particular because it has a very minimalist design that contains the classification of navigation elements in CATEGORIES.
- Footer Frequency:
In FOOTER, the most frequent elements are: FAQs, STORES, TRACK with 66% frequency and SIZE in 50%. The less frequent elements in this space are: SITE MAP, DISCOUNT APP, INVESTOR with 33% frequency; GIFT CARD and LANGUAGE with a 16% frequency.
- Conclusion:
With regard to the navigation block, the categories of fashion stores, department and shoes have a very similar structure. Now, in FOOTER they differ quite a lot in terms of how the elements are organized in each store.
Unlimited Product Stores, UNLIMITED tag.
- Frequency in the navigation block:
Its structure is quite different from the previous stores, so the elements that are shown most frequently are: CATEGORIES 100%, DEALS and SERVICES with 40% frequency.
The least frequent elements in this block are CONTACT, ORDER, GIFT CARD with 40% frequency, while pages such as HOME, BEAUTY, LANGUAGE and TRENDING have an average of 20%. In regards to the Walmart store, it presents a different structure from the rest in which the use of icons for CATEGORIES and other elements stands out. This gives the page a very minimalist look, similar to that of Target and TOMS.
- Frequency in FOOTER:
As for FOOTER, the element with the highest frequency of appearance is APP 60%. The least frequent in this category of stores are: SITE MAP, BRANDS, SIGN UP EMAIL, CORP. RESPONSIBILITY that have a 40% frequency, and STORE, LANGUAGE, TRACK and SERVICES, have a 20% frequency of appearance.
- Conclusion:
In general, the elements that regularly appear in this store category are: CATEGORIES, DEALS and SERVICES mainly and can be complemented with less frequent ones such as CONTACT, HOME and BEAUTY, ORDER, LANGUAGE, GIFT CARD and TRENDING, elements which usually appear in the navigation block. The FOOTER differs a lot in the organization of the pages that appear in each store, in fact it has a quite personalized structure.
Beauty product stores, BEAUTY tag
- Frequency in the navigation block:
These stores are quite different from the previous ones regarding the type of elements, the most frequent are: MAKEUP, SKIN CARE and BODY with a frequency of 80% and NEW, GIFTS with 60%. As for elements with less frequency, the data indicates that they are MEN, BRANDS and BESTSELLERS with a frequency of 40%, while BEAUTY, CATEGORIES and BATH at an average of 20%.
- Frequency in FOOTER:
As for the FOOTER, the elements with high frequency that stand out are: STORES, SIGN UP EMAIL with 80% and GIFT CARDS, CORP. RESPONSIBILITY with 60%. The elements with a lesser frequency of appearance are: SITEMAP, BRANDS, SIGN UP EMAIL, CORP. RESPONSIBILITY that have a frequency of 40%, and STORE, LANGUAGE, TRACK and SERVICES, 20%.
- Conclusion:
The elements that regularly appear in this store category are: NEW, GIFTS, MAKEUP, SKIN CARE and BODY mainly and can be complemented with less frequent ones such as MEN, BRANDS, BEST SELLERS, BEAUTY, CATEGORIES and BATH. As in the previous cases, FOOTER differs quite a bit in terms of the organization of elements that appear in each store, its structure seems to be quite personalized.
Home-goods stores, HOME tag
- Frequency in the navigation block:
The structure also differs from the previous stores, the most frequent elements are: HOME, SALE, DECOR, LIGHT, OUTDOOR with a frequency of 75%; BATH & BED, GIFTS, REGISTRY and INSPIRATION with a frequency of 50%.
Regarding the elements with frequent withdrawal in the navigation block, the data indicates that they are KIDS, CATEGORIES, ORDER and DEALS whose frequency is 25%.
- Frequency in FOOTER:
The elements with the highest frequency of appearance on the FOOTER are: GIFTS CARD with 100% frequency, CUSTOMER and SERVICES, BRANDS, SIGN UP EMAIL and INVESTOR have a frequency of 50%. The pages with the lowest frequency in this category of stores are: APP MAP, TRACK, EVENTS, CATALOG and CORP. RESPONSIBILITY that have a frequency of 25%.
- Conclusion:
The elements that regularly appear in this store category are: HOME, SALE, DECOR, LIGHT, OUTDOOR mainly and can be complemented with less frequent ones such as BATH & BED, GIFTS, REGISTRY and INSPIRATION. Again, FOOTER differ quite a bit, which may indicate that each store adapts it to your requirements.
General conclusions
- The elements of the navigation have a general character that is manifested in all pages regardless of each type of store.
- Fashion, shoes and department stores structure their navigation block elements in a very similar way.
- Beauty, home and unlimited products structure their navigation block elements very differently.
- Footer elements are structured by very different criteria, for example, sometimes there is a CUSTOMER SERVICES category in which CALL US, CONTACT, ORDER STATUS, etc. appears, but sometimes they appear as individual pages.
- In the case of stores whose design is very minimalist, the categories WOMEN, MEN, KIDS, etc., do not appear as elements in the navigation block, but are shown in a drop-down menu, a clear example is Macy’s.
- The main products that are commercialized in a store can define the website’s design. Two styles of design can be evidenced in the pages of these stores, one detailed and general, of greater frequency, FASHION NOVA type; another, not so frequent, but more minimalist with the categories usually enclosed in the CATEGORIES element in which a menu with the rest of the elements is displayed. Representative stores of this style are Walmart, Target and TOMS.
- Legal elements (e.g. Privacy Policy, Terms of Service) have a frequency of appearance that surpasses 60% in unlimited product and department stores, in the rest of the stores this frequency is not bigger than 30%.
Our proposal: standard templates
The frequency study has allowed us to observe some trends in each type of store. We already affirmed in the general conclusions that the main products that are commercialized in a store can define the elements that constitute their website, which we can represent in several templates like the following:
References
[1]Beaird J. (2010) The Principles of Beautiful Web Design. Canada: SitePoint
[2]Beaird J. Ibid.
[3]Beaird J. Ibid.
[4]Beaird J. Ibid.
[5]Beaird J. Ibid.
[6]Kröner A. (2003). Adaptive Layout of Dynamic Web Pages. Berlin: AKA
[7]Subhajit, B. (2016). Global Perspectives on E-commerce Taxation Law. New York: Routledge.
[8]Subhajit, B. Ibid.
[9]Report of the Electronic Expert Group to the Attorney General (Austraila), ‘Electronic Commerce: Building the Legal Framework’, in Subhajit, B. Idib.
[10]Davies (1998). Computer Program Claims, in Subhajit, B. Idib.
[11]Wigand (1997). ‘Electronic Commerce: Defintion, Theory and Context’, The Information Society, Vol. 13, pp. 1.16, in Subhajit, B. Idib.
[12]Subhajit, B. Ibid.
[13]Manzoor, A. (2010). E-Commerce: An Introduction. Saarbrücke: Lap Lambert.
[14]Choi, Soon-Yong, Stahal, Dale, Whinston, Andrew. The economics of electronic commerce. Indianápolis: McMillan Technical Publishing, 1997, en Luciano, E. M.; Freitas, H. E-commerce of virtual products: definition of a business model for the selling of software. Approved for publication in the annals of: 8ème colloque de l'AIM. Grenoble: 2003.
[15]Manzoor, A. Ibid.
[16]Luciano, E. M.; Freitas, H. E-commerce of virtual products: definition of a business model for the selling of software. Approved for publication in the annals of: 8ème colloque de l'AIM. Grenoble: 2003.
[17]Luciano, E. M.; Freitas, H. Ibid.
[18]Luciano, E. M.; Freitas, H. Ibid.
[19]"Themes - Shopify Theme Store." https://themes.shopify.com/themes. Accessed 10 Oct. 2019.
