Configure Webflow SEO Settings
Last Updated: December 08, 2021
More and more websites are using Webflow. Websites built in Webflow can perform perfectly well in organic search results, assuming the website is configured correctly. With that in mind, we wanted to quickly recap the main things you need to configure within Webflow’s settings to cover the SEO basics.
To begin, access Project Settings. You can access this by hovering over the Webflow icon in the upper right corner, then selecting project settings.
The first set of settings we’ll want to adjust are the SEO Settings. Click on the SEO tab under Project Settings.
Disable subdomain indexing
Toggle “Disable Subdomain Indexing” to yes. This will set the dev subdomain to disallow and prevent search engines from crawling. This will help avoid duplicate content happening from the subdomain. Along with this, you also want to make sure you never link to the staging subdomain to help prevent Google from finding, crawling, or indexing it.
Enable XML sitemap
Toggle “Auto-generate Sitemap” to yes to create an XML sitemap for your website. You shouldn’t have to do anything beyond this for a standard website configuration in Webflow.
Add in Google Search Console Verification
Enter in Google Site Verification ID to verify this site in a prefix-property in Google Search Console. Alternatively, you can verify via DNS or Analytics. You’ll need to verify via DNS for a domain-level property. Learn more about setting up and verifying a Google Search Console property.
Set the global canonical tag
Under SEO settings, you can also enter in the canonical version of your domain, with no trailing slash. Remember to correctly set with or without www. Websites can rank with or without www, just keep the structure you currently use.
After configuring the SEO settings, you’ll next want to make changes under the Hosting settings tab.
Advanced Publishing Options
Under Advanced Publishing Options, toggle all of the options to on. This will help with speed (minifying files), page experience (SSL), and preventing your website from being iframed elsewhere (secure frame headers). Of course, turning these on can affect other aspects of your website so make sure to carefully test your website after enabling to make sure everything works correctly.
Redirects are defined under hosting settings as well. You can delete existing redirects or add new redirects.
Next, go to the General tab under Project Settings.
Set website language
You can set the website’s language code. This is helpful for SEO but a requirement to meet accessibility guidelines. For English websites, this should be set to en.
Disable Webflow Branding
Unless you have a strong preference otherwise, disable Webflow’s branding on your website.
Under Project Settings, you’ll also want to review the settings under the Font tab. Because fonts can contribute to a website’s load time, you want to review the installed fonts and remove any that aren’t needed.
Under the Custom Code section of Project Settings, you can review any extra code added in the Head Code section. These scripts can contribute to a website’s speed.
Where possible, moving code into the Footer Code section can often help improve your website’s speed. But any extra code should be removed. So make sure to review any extra code in the Footer Code section and remove anything uncessary.
Along with Project Settings, you can also configure SEO settings on a per page basis. Some of these settings can be accessed while editing the page and others can be accessed via the page settings.
Set title and description
In the Page Settings -> SEO Settings area, you can add in a Title Tag and Meta Description, along with seeing a preview.
Add custom code per page & Set noindex
Also in the Page Settings -> SEO Settings area, you can add in custom code for any given page. This is also where you can place a meta robots tag if you want to set the page to noindex or nofollow.
Set the H1 and other headers
When editing a page, you can click on any page text element. In the blue box that appears, click the gear/cog icon. Then, in the menu that appears, you can choose the heading type for this element. For example, the page header should use an H1 tag (and you should only have one H1 tag per page).
Add rel qualifiers (rel=“nofollow” or rel=“sponsored”) to links
When editing the page, click on the link you want to add the rel qualifier too. Once the link is highlighted (in the blue box), click the gear icon in the right sidebar. This should show you Link Settings.
In Link Settings, add a new custom attribute. Set the attribute name to “rel” and the value to either sponsored, nofollow, ugc, or a combination of values (sponsored,ugc). (Learn more about link qualifiers.)
If you need help configuring SEO settings in Webflow or other aspects of improving your website’s SEO performance, please contact me today.