Important Redirect Basics

A redirect is a "change of address", in which a webserver tells the browser that the content has been moved somewhere else either permanently or temporarily. A web browser then typically re-issues the request, to the new URL.

In Webflow, redirections generally occur in one of 3 cases;

• Implicit protocol redirects, from http: to https:
• Implicit "default domain" redirects, to your default domain
• Explicit redirects that you define in your site dashboard

How Implicit Redirects Work

When a request comes into a Webflow-hosted site, Webflow performs a series of checks and corrections in the form of 301 redirects.

• If the site is SSL enabled, and the request was to the http: protocol, Webflow redirects it to the same URL using the https: protocol.
• If a default domain is set, and the request's hostname is to a different hostname, than Webflow redirects to the default hostname.

For example, let's assume we have a Webflow-hosted site which is SSL-enabled, and and has two domains assigned - olddomain.com and newdomain.com . The hostname www.newdomain.com is set as the default domain.

In this configuration, a request to http://olddomain.com will be handed as follows;

1. Webflow will redirect to correct the SSL protocol;
http://olddomain.com -> https://olddomain.com
2. Webflow will redirect to correct the default domain;
https://olddomain.com -> https://www.newdomain.com

All of this happens before anything gets touched in your manual redirects.

Explicit Redirects

These are the redirects that you define in your hosted site's redirects list. You'll find this in your site dashboard under the Hosting tab.

In Webflow, each redirect consists of;

• A from path, not including the domain, e.g. /about
• A to path, which can be a path like /new-about or a full URL like https://www.newsite.com/about.

IMPORTANT: This design means that if you are merging several sites together and have multiple domains ( domainA.com and domainB.com ) connected to your Webflow site, they are treated the same and you cannot distinguish them in redirects. This would have to be done externally.

Types of Explicit Redirects

There are two types of explicit redirects-

• Standard redirects. Any redirect that does not contain the wildcard pattern. These redirects do not use the wildcard escaping rules.
• Wildcard redirects contain a (.*) pattern in the from string, and these redirects follow special escaping rules ( see that lesson ). See the wildcard redirects lesson for details.

Creating Explicit Redirects

• Redirects can be created manually in the dashboard ( see Managing Redirects ).
• They may also be created automatically, when you change the slug of a static page in the designer.
• > This occasionally creates issues, where a redirect is automatically created during design ( before hosting ), but you cannot see or remove that redirect until you add a paid hosting plan.

Managing Explicit Redirects

• Redirects are managed under your dashboard site settings on the Publish tab.
• Redirects can only be manage once your site is on a Webflow hosting plan
• There is no hard limit to the number of redirects you can use, but a large number of redirects may affect performance.

Redirects and SEO

Google currently does not punish redirects; however it's poor practice to over-do it, as it creates a bad user experience (UX).

Debugging Redirects

One important common problem designers encounter when setting up their redirects is that updating and publishing redirects does not seem to change anything.

Most often this is due to the fact that browsers like to cache those redirects for performance, and they hold onto them for quite some time.

Preventing redirect caching in Google Chrome

In Google Chrome, you can open Chrome's dev tools ( CTRL+SHIFT+I ), and at the top of the Network tab, you'll find a Disable cache checkbox option.

Turn that on, and now any time you are working on your site, you can simply open Dev Tools to ensure you are seeing the live version rather than a locally cached copy.

This affects your cached redirects as well.

Known Bugs & Limitations

The commas problem

Certain URL characters like commas do not work properly in Standard redirects. Webflow requires you to URL-encode these characters, e.g. a comma is a %2C. However when you request a URL containing a comma, browsers do not always encode these, Webflow does not either- resulting in a failed match.

The only solution I'm aware of at this point is to use a Wildcard redirect instead.

Bulk import and export of redirects

Webflow has no CSV bulk import / export capabilities for redirects.

See Sygnal's lesson in this course for some alternative solutions.

Base-path redirects

Some platforms like WordPress support base paths like /my-awesome-article. For designers rebuilding their site on Webflow, the blog will generally be in the CMS and those paths will change to something like /blog/my-awesome-article.

Webflow does not have a means to wildcard redirect these. The cleanest solution is to redirect each of those paths individually, possibly resulting in 1,000's of redirects.

No parent-path-only redirects

There's currently no way to redirect e.g. /about but not /about/us.

A common scenario in Webflow is when someone wants to redirect the homepage of their site but not the sub-pages, this currently does not have a clear resolution.

No differentiation by domain

IMPORTANT: This design means that if you are merging several sites together and have multiple domains ( domainA.com and domainB.com ) connected to your Webflow site, they are treated the same and you cannot distinguish them in redirects. This would have to be done externally.

Automatic "stuck" redirects

In certain cases, Webflow will automatically generate a redirect URL for you, for example if you change the slug of a static page in the designer.

However if you are not yet on a Site hosting plan, you do not have the ability to see or remove these redirects.

Restricted "special" paths

Certain paths do not appear to work with redirects, for example;

• /.well-known/... paths