Global Site Structure (Nike.com): Part 2

This is a second blog in the Global Site Structure Series. In case you haven’t read the first one, you may want to read it here.

Today, we will look at Nike’s website: www.nike.com. It is one of my favourite website when it comes to a clean Global Structure. Nike.com is a true Global eCommerce site. It has different catalogs based on regions .Looking at it from outside, it looks like Nike has given special emphasis on two points –

  1. They have regional catalogs – they do not sell the same merchandise in every region.
  2. The structure is ready to cater to countries where multiple language. I would like to see more languages for India 😀.

They make it really simple to change the region. The regional setting are shown via Flag at the top right corner of the website. Each region has a homepage designed to connect with that region. Here is the home page for India.

Nike.com.png

Source Url: http://www.nike.com/in/en_gb/

If you look carefully at the url, you shall see that www.nike.com has a consistent url pattern [www.nike.om/<region>/<language>] ]which helps SEO, fallback rules and discoverability.

If one wants to switch to a different region and a language spoken in that region, one can do so quickly by clicking on the Flag. They have implemented a special page which they refer as Language Tunnel for switching between different regions and language sites spoken in that region.

Let’s look closer at the experience of switching the website from India (UK English) to let’s say Switzerland. When I clicked on the Indian flag, I was directed to Language Tunnel

language_tunnel.png

Screenshot url: http://www.nike.com/language_tunnel

On this screen, when I clicked Europe, it listed all the country sites. Clicking on Switzerland opened a popup which listed four languages in which the site is offered. Here is how they do it today, please refer black pop-up where Nike.com offers Switzerland site in four languages – English, French, German and Italian:

europe_tunnel.png

Screenshot url: http://www.nike.com/language_tunnel

Clicking the language in the popup opens up the site with Swiss flag on the top right. If you switch between different language sites for Switzerland, you shall see that they have a very consistent and clean url structure [www.nike.om/<region>/<language>] as I described earlier.

English: http://www.nike.com/ch/en_gb/

German: http://www.nike.com/ch/de_de/

French: http://www.nike.com/ch/fr_fr/

Italian: http://www.nike.com/ch/it_it/

In the next blog, I will talk about how one could set up the content structure in AEM to support such a website.

I hope you are enjoying reading these blogs.

Global Site Structure: Part 1

Today, I am going to start a series of blogs to explore Global Site Structures. It is one of the most important decisions that you have to make while setting up your website. Adobe Experience Manager (AEM) is a very flexible tool and doesn’t restrict you when it comes to site structure or content architecture. Hence it is very important decision. Once you decide the structure, you will have to live with the structure. Changing a structure is possible, but it is an expensive processing with deep impacts on operational efficiency, SEO, governance etc.

Before we deep dive into several websites, here is a webinar on Adobe website, co presented by Christine Duran and Matthias Siegel.

https://docs.adobe.com/ddc/en/gems/aem-6-1–translation-integration-and-best-practices.html

In this webinar, Christine talks about two different Site Structures and Matthias then shows how to create those using AEM Translation features.

Here is a screen capture from the webinar. The two structures described are around translation optimization and shared content.
09302015_AEM GEMS_Translation integration and best practices.png

Corporate Centric Content Model (Language > Country Region)

This model works great for enterprises that have common global offerings. The website content is same across all regions. Here most of the content is authored centrally at a corporate location and is adapted at the country level.

Region Centric Content Model (Country Region > Language)

This model is designed for enterprises that have different offerings per region. A good example can be any eCommerce website. The goods sold at Amazon India are not the same as Amazon US or Amazon UK. In such cases, it is always advisable to have region based content masters (which can share content from a Global Corporate Master), but then have significant adaptations in the source at the region level before the content is sent out for translation.

In the next post, we shall look at some websites and see how they are structured.

Why Sightly?

Heard of Adobe Sightly??

Welcome to Adobe’s new AEM 6 Sightly framework!  Sightly is the new templating engine in AEM and is meant to replace JSP and ESP templating engine for AEM 6. Among the great improvements in the technology stack (like new OAK repository) it also introduces a new way of component development.

With Sightly, Adobe presents a more readable, maintainable, and secure code, while distinctly separating the logic and markup. Sightly is attempting to address the most common problems found in the existing foundation and sample reference code, e.g. the lack of separation of concerns between business and presentation logic and the sloppy use of scriplets.

Why Sightly:

 

WhySightly

Below is the feature comparison of Sightly vs Handlebar vs JSP:

Table 1: A comparative analysis of Sightly over JSP and Handlebar:

  Sightly Handlebar JSP
Basic logic permissions Y Y+++ Y
Open source/based on published standards Y Y Y+
Officially supported/documented Y Y Y
IDE support Y N Y
Extension model documented N N Y
XSS escaping included Y N Y++
Enables Bad coding practices N N Y

+ Proprietary Tag libraries
++ Additional tag libraries
+++ Very limited support

Reference links

[0] https://github.com/Adobe-Marketing-Cloud/sightly-spec/blob/master/SPECIFICATION.md

[1] https://docs.adobe.com/docs/en/aem/6-0/develop/sightly.html