What are Website Landmarks?
If you look at a web page, you can probably recognize its basic layout without thinking much about it.
The logo and menu are at the top. The main information is in the middle. Supporting links and policies are usually at the bottom.
But that visual layout doesn’t help someone who cannot see it and it doesn’t automatically tell assistive technology what each part of the page is for.
That is where website landmarks come in.
Landmarks identify the major regions of a web page, such as the header, navigation, main content, and footer. They give people using screen readers another way to understand the page structure and move directly to the section they need.
And while landmarks happen behind the scenes, you do not need to be a developer to understand them or check whether your website has them.
In This Article
What Are Website Landmarks and Why Do They Matter?
Landmarks, Skip Links, and Bypassing Repeated Content
Do Squarespace, WordPress, and Website Builders Add Landmarks?
How to Check Website Landmarks With WAVE
What Are Website Landmarks and Why Do They Matter?
Website landmarks are major regions of a page that have been identified in the underlying structure of the website, the backend code.
Think about walking into a large store.
You can scan and maybe see different departments, but signs for Produce, Pharmacy, Customer Service, and Checkout make it much faster to get where you need to go.
Landmarks provide a similar purpose on a website.
A screen reader user can navigate between landmark regions instead of moving through every individual link, button, heading, and paragraph.
For example, they can jump directly to
The main navigation
The primary content
A search area
The footer
Landmarks help communicate how the page is organized behind the scenes. They are part of the WCAG requirements related to identifying structure and giving people ways to bypass repeated content.
Common Website Landmarks
There are several different landmarks to use wen building a website. But every website should contain the four staples in order to be minimally accessible.
Header (Banner)
The main website header (<header>) usually contains things such as your logo, business name, navigation, search, announcement information, or other site-wide content.
When structured correctly, the top-level header can be recognized by assistive technology as the website's banner region.
You generally only need one main banner for the page.
Navigation
The navigation landmark (<nav>) identifies an area containing links that help people move through the website, and it is usually placed within the header landmark.
Your primary website menu is the most obvious example, but a page can have more than one navigation area.
For example, you might have
Main navigation
Breadcrumb navigation
Footer navigation
When multiple navigation landmarks appear on the same page, they should be identified clearly enough that someone using assistive technology can tell them apart.
Hearing “Main navigation,” “Bread crumbs,” and “Footer navigation” is much more helpful than hearing “Navigation” three times.
In website builders like WordPress you have control over labeling these. But in platforms like Squarespace you do not.
Main Content
The main landmark (<main>) identifies the primary content someone came to the page to use.
On a blog post, that would be the article.
On a service page, it might include the service description, pricing, process, and call to action.
On a contact page, it could include your contact information and form.
This is one of the most useful landmarks because it lets assistive technology users move past repeated site content and get to the information that is unique to that page.
A page should generally have one primary main landmark.
Footer Landmark
The main website footer (<footer>) often contains supporting information such as copyright details, privacy policies, terms, contact information, social links, or secondary navigation.
It is quite common to have more then one footer landmark section on websites these days. So be sure to label them if your platform allows (i.e. Newsletter Footer, Map Footer, Main Footer).
When structured correctly, the main page footer can be recognized as the end of a page.
Website Accessibility Audit
Your website can look organized and still be confusing behind the scenes.
Our website accessibility audits include manual testing of page structure, navigation, headings, keyboard access, screen reader usability, and more.
Website Landmarks vs. Headings
Landmarks and headings both help organize a web page, but they do different jobs.
Landmarks identify major regions of the page.
Headings organize the content within those regions.
Think about a service page.
All of the service information should sit inside the main landmark.
Within that main area, you could have
H1: Website Design Services
H2: What Our Design Services Includes
H2: How the Design Process Works
H2: Website Design Services Pricing
H2: Frequently Asked Questions
The landmark says, “This is the main content.”
The headings breakdown each part of the page.
Understanding the difference is important because a page can have a perfectly logical heading structure and still have poor or no landmark structure.
The opposite can happen too. Your website might have landmarks established properly, but you have vague and out of order headings, making the page confusing to move through.
A website needs both.
Landmarks, Skip Links, and Bypassing Repeated Content
Landmarks also connect to another accessibility feature you may have encountered: the Skip to Main Content link.
Imagine visiting five pages on the same website using only your keyboard.
Without a way to skip ahead, you may have to tab through the logo, announcement bar, navigation menu, dropdown links, search, and other repeated content every single time before reaching the page information you actually want.
WCAG requires a way to bypass blocks of content that repeat across pages.
Landmarks can help people using assistive technology move between page regions and bypass repeated areas.
A skip link provides another direct route. It is usually one of the first links on a page and allows a keyboard user to jump straight to the main content.
These features work well together.
Having a main landmark does not mean you should automatically remove a useful skip link. Different people navigate in different ways and with different tools. So ensuring your website is setup to accommodate as many people as possible will only benefit your business in the long run.
Continue Learning
Want to understand website accessibility without digging through technical documentation?
Visit our Tutorials library for quick explanations and demonstrations covering headings, links, forms, images, navigation, video, and other accessibility basics.
Do Squarespace, WordPress, and Website Builders Add Landmarks?
If you use a website builder, there is some good news.
You probably do not need to manually code every landmark onto every page.
Modern website platforms and themes often generate much of the basic page structure for you. For example, your site-wide header, navigation, main page area, and footer may already be identified appropriately by the platform or template.
But “the platform handles it” should not turn into “we never need to check it.”
Custom code, third-party tools, plugins, unusual templates, popups, embedded content, and extensive design customizations can all affect the finished website.
WordPress can vary even more because the structure depends heavily on the theme, page builder, plugins, and customizations being used. This is why we recommend checking the finished page rather than assuming the platform did it for you.
You do not need to understand all the HTML behind it.
You just need a way to see the structure that is there.
WAVE can help with that.
How to Check Website Landmarks With WAVE
WAVE is a free accessibility testing tool from WebAIM, and its Structure panel gives you a easy way to look at the backend of a web page.
Here’s how to easily check to see if you have the four staple landmarks on a webpage.
Open the webpage you want to test
Click open the WAVE extension
WAVE will open with focus on the “Details” panel. You can scroll down to the “Structure” section and ensure it shows you have a header, at least one navigation, a main section, and a footer.
You can also open the “Structure” panel. This panel will show you the landmarks and heading structure of the page at the same time.
We like to recommend WAVE, especially to people new to accessibility, because the data panel is easy to review an connect what you are seeing there with the icons on the page, showing you exactly where each element is.
Remember, for right now our focus is on the landmarks. If you are missing any of the four staples (header, nav, main, or footer), it is likely time to connect with a professional and have your site audited.
Wrap Up
Landmarks are invisible to people browsing visually, but they make websites much easier to understand and navigate with assistive technology.
They give major areas of the page a clear purpose, help screen reader users move between sections more efficiently, and work alongside headings and skip links to create a more
organized experience.
The good news is that many website platforms already handle much of this structure for you. Your job may simply be to know what should be there and occasionally check that the finished page still makes sense, especially after adding custom code, third-party tools, or other integrations.
WAVE gives you an easy way to take a look.
And if the structure seems confusing or something important appears to be missing, you will know it is time to connect with a professional who can find the source of the error and fix it.
We helps small businesses build websites that are accessible, clear, and easier for EVERYONE to use from the start. If you want a professional review of your site’s accessibility, we’d love to take a look.
Website Landmark Accessibility FAQs
What are website landmarks?
Landmarks identify the major regions of a web page, such as the main navigation, primary content, search area, or footer. They help assistive technology users understand the page structure and move more efficiently between important areas.
Does every web page need a main landmark?
A web page should generally have one primary main landmark identifying its main content. This gives assistive technology users a predictable way to find the unique content of the page without navigating through repeated site elements first.
How can I check website landmarks if I don't know HTML?
WAVE is a good starting point. Open the page in WAVE and select the Structure panel to see the landmarks and headings it detects. You can compare that structure with what you see visually and look for obvious problems, such as a missing main region or several navigation landmarks that cannot be distinguished from one another.
A beginner-friendly guide to captions, transcripts, subtitles, and audio description — so you always know which features your video needs, and how to create them without guesswork.
What You'll Get
What each feature does, and when you need it
A simple way to decide what your video needs
A step-by-step production workflow
Caption and transcript quality checklists
Beginner-friendly tool comparisons, free and paid
Links to official step-by-step tool tutorials
A plain-language standards reference
A pre-publish testing checklist
Beautifully designed, fully accessible PDF
Key Benefits
No technical experience required
Works with any video platform or editor
Built around free and low-cost tools
Instant download after purchase
Important
This is a digital product delivered via instant download. Due to the nature of digital products, all sales are final and not eligible for returns or refunds.
Personal use only
Licensed for individual use and cannot be resold, shared, or redistributed. Each purchase is for single-user access only.