Establish 301 forwardings for upholding SEO ranking

Use 301 redirects to route traffic from an old URL to a new URL.

Within this guide, you will understand:

  1. Criteria for implementing 301 forwardings
  2. Procedure for rerouting a page
  3. Technique for directing a directory
  4. Application of escape sequences
  5. Method for rerouting an entire domain

Criteria for implementing 301 forwardings

Essential: Although Webflow currently does not enforce a strict threshold for total forwardings, it is advisable to adhere to a maximum of 1,000. Each forwarding directive is appended to a site’s manifest.json file, which furnishes site details to visitors’ browsers. As the manifest file expands, more data is required to be downloaded by browsers. To optimize SEO and website performance, it is recommended to employ wildcard forwardings whenever viable, as this reduces the overall quantity of forwarding rules. 

301 forwardings serve the purpose of permanently rerouting traffic from an outdated path to a new URL — for instance, during scenarios such as:

  • Revamping your URL configuration (e.g., webflow.com/mysite to webflow.com)
  • Substituting or redesigning your site resulting in fresh URLs (e.g., webflow.com/oldhomepage to webflow.com)
  • Transitioning to an entirely new domain (e.g., webflowiscool.com to webflow.com)
  • Securing alternative domains to accommodate potential visitor errors (e.g., webflow.net, webflow.org, webflow.io to webflow.com)
A diagram illustrating the redirection from an old URL to a new URL. Two black squares depicted with an arrow linking them. The term 'Old URL' inscribed on the left square and 'New URL' on the right square.

Upon replacing an old URL with a new one, the previous URL may still be visible in search outcomes, referenced in blog or forum entries, bookmarked, or printed on business collateral. Visitors reaching the former URL will be directed to a 404 page by default — nonetheless, by establishing a 301 forwarding, incoming visitors to the old URL will be routed to the designated new URL.

Over time, Google will index your updated site layout and obsolete URLs will be refreshed. Nevertheless, 301 forwardings are advised, particularly if your intention is to preserve the authority of the old URL.

There exist various types of redirects — like 302 forwardings, indicating temporary relocations — yet, 301 forwardings are most suitable if you wish to permanently direct incoming traffic to a fresh URL.

Procedure for rerouting a page

You can permanently redirect former pages or entire page directories to novel locations within your Webflow site. To establish a 301 forwarding:

  1. Visit Site settings > Publishing > 301 forwards
  2. Input the former URL in the Old path field (e.g., /old-url)
  3. Specify the fresh URL in the Redirect to path field (e.g., /entirely/new-url/structure)
  4. Click Add redirect path
  5. Publish your site

Subsequently, you can evaluate the forwarding by entering the old URL in a fresh browser tab. It should direct to the new URL. Further insights on composing redirect URLs can be explored.

Essential: For redirecting an existing static page on your Webflow site to a new URL, it is imperative to eliminate or preserve the page as a draft, or amend its slug before configuring the redirection. Redirecting an existing Collection item page on your Webflow site to a new URL necessitates archiving, deletion, or unpublishing of the item, conserving it as a draft, or revising its slug before setting up the redirection.

Technique for redirecting a directory

  1. Access Site settings > Publishingtab > 301 forwards
  2. Include a URL incorporating a capture group (.*) within the former URL layout in the Old path field (e.g., /oldfolder/(.*))
  3. Specify a URL incorporating a target path %1 within the new URL layout in the Redirect to path field (e.g., /entirely/new-url/structure/%1)
/blogs/(.*)/(.*) can be rerouted to /articles/%1/%2.

Illustrations of wildcard redirection

Assume you aim to redirect various pages within a directory to a single URL — for instance, directing domain.com/collections/women, domain.com/collections/men, and domain.com/collections/children to domain.com/collections. Assuming domain.com is the associated domain of your Webflow site, the redirection formulation would be:

  • Old path: /collections/(.*)
  • Redirect to page: /collections

Alternatively, supposing you want to reroute all pages adhering to a URL configuration like /domain.com?category=food&post=pie to /blog/food/pie — in essence, redirecting various pages to diverse URLs.

You could harbor categories such as “music,” “travel,” and “food,” alongside posts like “beyonce,” “london,” and “pie.” These serve as your variables. In the mentioned URL, “food” and “pie” constitute the variables. To facilitate these variable adaptations, calling out these variables with capture groups, written as (.*), is indispensable. For instance, the redirection would be scripted as follows:

  • Old path: /%?category%=(.*)%&post%=(.*)
  • Redirect to page: /blog/%1/%2
%1 corresponds to the first capture group, while %2 corresponds to the second. With this wildcard redirection method in action:

  • /domain.com?category=music&post=beyonce redirects to /blog/music/beyonce
  • /domain.com?category=travel&post=london redirects to /blog/travel/london
  • /domain.com?category=food&post=pie redirects to /blog/food/pie

Application of escape sequences

Old path URLs and URLs employing wildcards, by prefixing the% symbol before the character:

  • %
  • -
  • &
  • *
  • (
  • )
  • =
  • _
  • +
  • ?
/old-folder/(.*) necessitates rendition as /old%-folder/(.*) to function as a redirection.

mysite.com?category=food to mysite.com/blog/food. The redirection shall be scripted as follows:

  • Old path: %?category%=food
  • Redirect to path: blog/food
% symbols before ? and = is mandatory for the successful functioning of the redirection.

Note: The necessity to escape characters is exclusive to the old path — there is no requisite for escaping characters within the new redirection path.

Technique for rerouting an entire domain

  1. Associate both old and new domains with your site
  2. Designate the new domain as the default
  3. Publish your site
Ewan Mak
Latest posts by Ewan Mak (see all)