What can web designers learn from mall designers? See why website is actually like a mall - at least if you build it like one. Get tips on crafting the perfect design brief and SEO & marketing considerations you should keep in mind when launching a new website. This presentation, and its presenter, are extremely thankful for their 45 minutes of fame on WordCamp Helsinki 2017, where this presentation was originally given.
4. Similarities between a website and a mall
Both are attracting visitors that are potential customers
Both should be designed for the visitor
The basic structure of both malls and websites tend to stay the same for a
long period of time, but fine tuning of the layout and visitor flow is
continuous
6. How to Design a
Mall - Inside-out
https://www.linkedin.com/pulse/h
ow-design-mall-inside-out-susil-s-
dungarwal-frics
7. “The project starts with
great enthusiasm &
fervor, but… soon turns
into a nightmare”
8. “The problem arises
when one designs the
space & decides to build
without proper
understanding or
knowledge of the
business requirements.”
9. “...the elevation of the
mall has been given too
much of importance
than the actual mall
inside.”
10. “...in a manner that the
customer is effortlessly
guided through the Mall,
as if in auto mode.”
11. An example of a mall design process
1. The right advice
2. Clarity in concept
3. Choose the right architect
4. Design brief to the architect
a. Introduction
b. Project vision
c. Project positioning
d. Aesthetic brief
e. Planning brief
12. The right advice
Mall world:
- “Shopping mall specialist”
- Group of Operations & Leasing experts
and architects
Website world:
- Choose an agency that understands not
only the technology but your
business/operations
OR
- Make sure that all of your stakeholders
are communicating together: designers,
developers, marketers, sales etc.
13. Clarity in concept
Mall world:
- Concept based in market research,
customer expectations, demographics,
location etc.
- Communicate the concept
Website world:
- Who are we serving?
- What do we want them to do?
- Communicate the concept
14. Choose the right architect
Mall world:
- Chosen architect should have in-depth
understanding of retail architecture
AND local market trends & shopping
habits
Website world:
- Developers and designers should have
in-depth understanding of the website
technology AND the business model
and industry
15. Design Brief: Introduction
Mall world:
- Company’s background - the bigger
picture
- City & location
- Targeted consumer segment
- Considerations and data sources
Website world:
- Company’s background - the bigger
picture
- Target audience
- Considerations and data sources
16. Design Brief: Project vision
Mall world:
- Intent of the project
- Context: part of a larger development,
center of a neighborhood or something
else
Website world:
- Intent of the project
- Context: is it a part of a larger online
ecosystem, what is the expected
customer journey and flow
- Social Media channels
- Other websites
- SEM/SEO
- Email marketing
17. Design Brief: Project positioning
Mall world:
- Specifics of the target customer
- Specifics of the context
Website world:
- Specifics of the target audience - buyer
personas
- Specifics of the context
18. Design Brief: Aesthetic brief
Mall world:
- The design language (high-end, low-
end, traditional or contemporary)
- Based on market research
- Details of materials
Website world:
- Brand guidelines (colors, typeface,
logos etc.)
- Based on market research, user data,
previous test
- If not available now, enable future
testing by giving the framework in
which marketing can do testing in the
future
- Mobile first/only
19. Design Brief: Planning brief
Mall world:
- Entry points
- Operational requirements
- Accessibility
Website world:
- Entry points (landing pages)
- Operational requirements
- Who is using the back end, what is their
level of technical competency,
language, training needed etc.
- Crawlability and indexability
- Accessibility
20. High traffic landing pages
Landing pages with most
conversions or highest
conversion rate
If these are different, focus on
redesigning the high traffic
landing pages to capture
more conversions
Make sure you have a process
in place to update high
traffic blog posts with most
up-to-date relevant
information
21. Design Brief: Infrastructure requirements
Mall world:
- Parking needs
- Security requirements
- A/C, electrical planning, lighting etc.
- Requirements for certifications
Website world:
- Available hardware/budget for changes
if needed
- Security requirements
- Expected traffic now -> 3 years in the
future
- Databases
- Integrations with 3rd party platforms
(marketing automation, CRM, ERP etc.)
- Must have/must not have plug-ins
22. Design Brief: Understanding the leasing
concept
Mall world:
- Zoning and related requirements
Website world:
- Understand business concept
- What kind of content will be displayed
- Any must have terms or functionality
according to the law
24. Location, location, location - Mall
Location drives traffic to a mall, it is like a sticky marketing channel
Locations are limited and static
25. Location, location, location - Website
Website with no marketing and no inbound links is an island → nobody
stumbles upon a new website
Your effective location is combination of your marketing channels
(search, paid search, social, paid social, email etc.)
“Location” is dynamic and different for each visitor
31. Technical SEO checklist
Property and language
Your website is your "web property" and it needs to be correctly defined in Google Search Console
Structure and navigation
Both search engines and people prefer short, readable URLs. If URLs are not optimized, there's a
decent chance you are taking a hit in the rankings
Indexing and crawling
In order for your pages to appear in search results, they have to be crawled and indexed by the
search engines.
Page speed
The faster the better. Amazon declared conversion rates went up by 1% for every 100ms reduced
load time
32. Property and language
❏Have all version of the website been added to Search Console?
❏Is the correct web property propery defined in Search Console?
❏Is it matched with a "rel=canonical" tag for the home page?
❏Has the correct country been targeted?
❏Has each language been correctly defined?
❏Does the site have a valid SSL certificate?
33. Structure and Navigation
❏Are the URLs as short and clear as possible?
❏Are paginated URLs correctly defined?
❏Are tracking tags, session IDs, etc. correctly defined?
34. Indexing and crawling
❏Has the site been indexed?
❏Has a sitemap been created and submitted to Search Console
❏Is robots.txt correctly set up to allow crawling?
❏Are bots able to successfully crawl your site?
❏Is your site free from broken links (404s)
❏If redirects are used, do they work as intended?
❏Does your site pass HTML validation?
❏Does your site pass CSS validation?
35. Page Speed
❏Is the server response time under 200ms?
❏Has render-blocking content been moved below the fold?
❏Is the code (HTML, JavaScript, CSS, etc.) minified?
❏Is JS/CSS code separated from HTML where possible?
❏Does the site use cache/browser chace wherever possible?
❏Are resources compressed with gzip where possible?
❏Have all the images been optimized?
36.
37.
38. Design and Mobile optimization
❏Does the site use UTF-8 coding?
❏Does the site have a responsive design?
❏Does it utilize standard W3C Schema markup?
❏Does the site render properly when fetched by Google?
❏Is the site mobile-friendly?
❏Does it utilize accelerated mobile pages (AMP)?
40. One page structure
How to promote specific section?
Linking to heading id helps, but doesn’t work well in social sharing
SEO:
Could benefit for having all links pointing to one page
Continuously earning links hard as it requires extra thinking to link to a specific section
41. News sites and blogs - does WP date structure
matter?
Republishing evergreen content gets harder with URL structure that
displays date
Studies show that articles without date on SERPs get increased traffic
Usability vs. clicks -> display in article, don’t display on SERPs
Exception, when you have an actual news section that you want to rank on
trending news
42. Ecommerce considerations
For most cases different variations of the products (size, color, etc.)
shouldn’t end up as a different URL → you end up with less duplicate
content and better control over the search results
Remember to handle your expired products
Redirect to replacement or category page
Aim for unique descriptions
If not possible, unique descriptions for most popular products or focus on category pages
50. Largest malls in
Finland
Avg. monthly visitors (2015)
Wikipedia data
Name Monthly avg. visitors
(2015)
Kamppi 3 170 000
Sello 1 920 000
Itis 1 625 000
Forum 1 150 000
51. Large
eCommerce
sites in Finland
According to SimilarWeb data
(March 2017)
Name Monthly visitors
(March 2017)
Verkkokauppa.com 3 300 000
Gigantti.fi 2 000 000
Huuto.net 1 800 000
Zalando 920 000
53. What would
happen if we
could develop a
website with the
budget of a
mall?
SEOSEON.COM
Contact info
Email:
joonas.jukkara@seoseon.com
LinkedIn:
https://www.linkedin.com/in/joo
nasjukkara/
Phone:
+358 50 309 8787