Skip to main content
Your site’s hosting settings have a set of extras you can switch on without touching the code: helpers for visitors who use a keyboard or screen reader, tags that make your pages look good when shared, an Add to Home Screen option on phones, and code compression for speed. This guide goes through them on Northwind’s Pearl District site, then switches them back off.

Open the site tools

Open the website, click its name at the top of the page, then Hosting. Click Production in the row of environments, and scroll to Site tools for Production. Each environment has its own switches, so you can try an extra on Development first.
Site tools for Production, outlined, Turn on tools and analytics for this environment, with the first row of cards: Bug Tracking, Search engine indexing and Visitor Analytics

Site tools for Production

Accessibility helpers

Click the switch on Accessibility. It adds a skip-to-main-content link for keyboard users, clear outlines on whatever has focus, page landmarks for screen readers, less motion for visitors who ask their device for it, and underlined links for visitors who ask for high contrast.
The Accessibility card with its switch on, outlined, and On: accessibility improvements are added to your published site, outlined

Accessibility, switched on

These helpers make your site easier to use, but no switch can make a site fully accessible on its own. Clear headings, alt text on pictures and readable colors still come from your pages.

Sharing, security and Add to Home Screen

The same way:
  • SEO Enhancements writes the tags that give each page a title, description and picture when someone shares it, and structured data for search engines.
  • PWA Ready lets visitors add your site to their phone’s home screen like an app.
  • Security Headers adds a referrer policy and an HTTPS upgrade to plain HTML pages. As the card says, it changes nothing on a site built with Next.js, such as Northwind’s.
The SEO Enhancements card, on, with On: search and sharing tags are written for each page, outlined; Security Headers, off; and PWA Ready, on, with On: visitors can add your site to their home screen like an app, outlined

SEO Enhancements and PWA Ready, switched on

Choose how much the code is compressed

Minification makes your pages smaller, so they load faster. Full compresses the most, Minor is safer for pages with embedded videos, widgets or other content that carries its own code, and Off leaves the code as it is. If something embedded stops working after you publish, try Minor.
Minification, Code optimization, with Full selected, Minor and Off, outlined, and the note Maximum compression, best for file size, but may break embedded JSON content

Full, Minor or Off

Publish to apply them

The extras are added when your site is published. After you switch one on or off, a message says so: publish the environment again to apply it. See Publish Your Changes.

Good to know