The benefits and examples of placing the site map at the bottom of the web page

The benefits and examples of placing the site map at the bottom of the web page

In the past, almost every website had a sitemap page listing all of their pages. The purpose of a site map page is to help visitors and search engine spiders find information on the website. Nowadays, many modern websites have removed sitemaps and replaced them with a sitemap placed in the footer area of ​​the website. 123WORDPRESS.COM will list 20 websites (from large companies to small portfolio websites) to see how they cleverly organize their footers to increase the usefulness of the website.

Benefits of Placing a Sitemap in the Footer

1. Attract users to click and visitors to stay.

As you know, online readers don’t read everything on a page, they scroll and scan. The footer is the last place they look before they leave. Placing a site map in the footer may attract readers' attention and increase page clicks and page views.

2. Make sure your users don’t miss out

Sometimes your visitors may be too lazy to click on the link to the site map page and miss something. Having a site map in the footer can ensure that your visitors know every page.

3. Use your footer to promote relevant links.

You don't necessarily have to actually list every single thing in your footer. You can use it as an alternative location to promote reading of related important pages.

4. Save readers’ time

Having a site map in the footer allows users to quickly jump from one page to another.

5. You save your visitors clicks

By placing a site map in the footer, rather than on a separate page, you save your users a click.

6. Enhanced layout design

Not sure what to put in your footer? Sitemaps can be used to fill in, which can make your website look larger.

Digg

Digg keeps a nice and clean header by placing only category content. The header focuses on the user, while the footer focuses on the company.

Mozilla - Firefox

Thanks for the site map, I know what's on the site at a glance.

Apple

If you have a huge site (in terms of content), putting a full sitemap in the footer might be insanity? You can learn more about Apple.com from Clever, which splits the sitemap into sections. For example, if you go to the Apple section, you will only see Apple's Sitemap.

GoodBarry

While GoodBarry’s footer sitemap doesn’t list all of the content on his site, it does list the important parts.

White House

On the recently redesigned White House website, navigating the site has become easier with drop-down menus and a site map in the footer.

Miro

Miro website uses a "Looking for something?" text field to separate the footer site map

Six Apart

You can also use a site map to connect your website like Six Apart does. In the footer, in the blog section, there are links to sister sites: Typepad, Movable, and Vox.

Clearspring

On the Clearspring website, it divides its services into two parts: Launchpad and WidgetMedia.

SqareSpace

SquareSpace's site map tells you which pages have been visited. Please note that the visited webpage has a tiny check mark instead of the usual triangle icon.

SugarSync

SugarSync's footer lists only the main site hierarchy, while a separate site map lists all pages.


Previous Page 1 2 Next Page Read Full Article

<<:  Native JS to achieve sliding button effect

>>:  Detailed process of installing and deploying onlyoffice in docker

Recommend

Some suggestions on Vue code readability

Table of contents 1. Make good use of components ...

MySQL 5.7.24 installation and configuration method graphic tutorial

MySQL is the most popular relational database man...

Vue3 Documentation Quick Start

Table of contents 1. Setup 1. The first parameter...

Tutorial on binary compilation and installation of MySql centos7 under Linux

// It took me a whole afternoon to install this, ...

Four ways to combine CSS and HTML

(1) Each HTML tag has an attribute style, which c...

Vue implements multi-grid input box on mobile terminal

Recently, the company has put forward a requireme...

How to make form input and other text boxes read-only and non-editable in HTML

Sometimes, we want the text boxes in the form to b...

Steps for Vue to use Ref to get components across levels

Vue uses Ref to get component instances across le...

Sharing experience on MySQL slave maintenance

Preface: MySQL master-slave architecture should b...

Web development tutorial cross-domain solution detailed explanation

Preface This article mainly introduces the cross-...

Vue3.0 project construction and usage process

Table of contents 1. Project construction 2: Dire...

How to create a new user in CentOS and enable key login

Table of contents Create a new user Authorize new...

User experience analysis of facebook dating website design

<br />Related article: Analysis of Facebook&...