3 practices that improve the accessibility of your Webflow site

Documentation
December 3, 2021
3 min
Computer screen with the Webflow logo and a Google accessibility score of 100/100.
Use AI to summarize this article
Key points

The accessibility of websites is a topic of great importance to me and, in my view, should also be of significant importance to you! Website accessibility is defined as making your website usable by everyone. There are various types of disabilities, such as visual impairments (blindness, low vision), temporary disabilities (broken arm or hand, for example), or permanent disabilities (mobility impairments).

Gradually, accessibility is being recognized as an important SEO criterion. Google now incorporates accessibility into its search algorithm when evaluating website rankings. Therefore, the interface of your website must be accessible, and here are 3 easy points to implement.

1 · Choose to use REM instead of Pixels

Why? To automatically adjust the size of your typography to screens that have enabled a feature called "Font Size Adjustment". You know, that feature that enlarges the font size on messages, emails, and apps on an iPhone, for instance? (It's like a zoomed-in screen)

Indeed, REMs are a dynamic display format, in contrast to static pixels. Choosing to use REMs is therefore a genuine added value for your website. (and your SEO 😉)

To easily convert your pixel fonts to REMs, simply divide the pixel value by 16, since 1 rem = 16 pixels.

If you use Webflow, you can do this directly in the CSS Designer.

Conversion rem to pixels

2 · Maintain a minimum line height between 1.3 and 1.7

To improve the readability of your text content, it's advisable to add line heights (vertical space between lines of text) in your content. Regardless of the tool—whether it's WordPress or Webflow—you have the option to select the line height of your text directly in your CSS.

Use a minimum line height of 1.3 points to prevent your content from turning into an unreadable block of text. (Especially if you have a blog!)

Webflow tutorial on how to change the line height of your content

3 · The three-click rule for your site

Ensure that each page of your site is accessible within three clicks maximum. To achieve this, create a simple and easy-to-understand internal linking structure. We suggest using a tool like Miro to visually map out the structure of your site and work on the user journey.

Illustration of the internal linking structure of digidop.fr on Miro
Example of an internal linking diagram

Otherwise, we have a Pro Tips that allows you to make all your pages accessible in 2 clicks maximum. Keep scroooooolling

Tips: create a "Site Map" page

A sitemap.xml is great for crawlers, but a human-readable site map is also a real advantage! (Yes, we shouldn't only think about algorithms, but also about your users!) A site map greatly enhances UX by making it easier to find what you're looking for on the website in question.

We recommend that you:

1 - Create a static page

2 - Include a "Site Map" link in your footer

3 - Connect this link to your new static page: site map

4 - Add a clear and readable site map for your visitors (example below)

Site map on static page from the footer

Florian Bodelot
Florian Bodelot
Co-founder

Suggested articles

A woman speaks on stage at a conference, wearing a headset microphone. Behind her, a large black screen displays the question “What then?” in bold white text.
Events
Webflow

Digidop attends FLOWconf 2025, the biggest Webflow & marketing event in Europe.

Digidop attends FLOWconf 2025, the biggest Webflow & marketing event in Europe.
Visual overview of several modern web typefaces in 2025, each displayed on a vibrant background: Editorial New, DM Serif Display, Aeonik, SF Pro Rounded, Rader, Champ, Monument, Canicule, Clash Display, Supply, Agrandir, and more — a graphic composition highlighting typographic diversity.
Documentation
Design

The 20 Best Fonts for a Modern and Impactful Website in 2025

The 20 Best Fonts for a Modern and Impactful Website in 2025
Mosaic of homepage designs from several Webflow agencies (Digidop, N4, Refokus, Flow Ninja, Tonik, Finsweet, Edgar Allan), showcasing diverse creative approaches and visual identities centered around the Webflow logo.
Storytelling
Webflow

My Top 7 Webflow Agencies in 2025 (From a Founder’s Perspective)

My Top 7 Webflow Agencies in 2025 (From a Founder’s Perspective)

Want to turn your website into your most valuable asset?

Contact us today