Technical SEO is the foundation of your SEO strategy. Webflow provides all the necessary tools to optimize the site structure and implement your on-page SEO strategy with ease. The purpose of this article is to provide a basic checklist to get started and explore the topic of technical SEO.
It’s never too much emphasizing the importance of responsive design. Content and layout must be correctly displayed on all devices, from large monitors to the iPhone SE (320px). Webflow allows you to adjust your design to correctly fit different breakpoints, as shown below.
Meta tags provide information about a web page to search engines. You need to specify a Title tag and a Meta description that will typically be displayed on search engine results pages. However, this is not an absolute rule. In some cases, search engines might choose to ignore meta tags and display parts of the content on the page.
— Head to your page settings.
— Scroll down to the area shown in this image.
— Place your Title Tag here.(60 characters or less.)
— Place your Meta Description here. (160 characters or less.)
— Make sure to complete this for each page.
Choose how you want a web page to be displayed on social media by specifying a title, description, and image. Webflow allows you to use the same title and description used in the SEO settings.
— Head to your page settings.
— Scroll down to the Open Graph settings.
— To get your image link, head to the asset panel.
— Hover over the image you want to use and click the gear (⚙) icon.
— Click on the link icon.
— Paste that link in your Open Graph URL
Once the open graph settings are complete, make sure to check that they work correctly using the following tools:
Facebook debugger https://developers.facebook.com/tools/debug/
Twitter card validator https://cards-dev.twitter.com/validator/
LinkedIn post inspector https://www.linkedin.com/post-inspector/
Set your Headings in the right hierarchy. Follow a logical sequence where Heading 1 (H1) is the main heading of the page. Each page must contain only one H1. The length of headings is also a relevant aspect to consider. According to moz.com, they should be of 50–60 characters.
In Webflow it’s super easy to set up your headings! Select the heading element, click the gear icon that appears right above it to open the settings panel and choose the correct type.
Make sure you optimize your assets (images and media files) to improve website performance. The maximum image size allowed in Webflow is 2MB. However, it is highly recommended to reduce it as much as possible. Thanks to a recent update, when you upload an image on your project, it is set in lazy load mode by default which significantly impacts page load time.
Upload the favicon from Project, making sure the uploaded image is 32 x 32 pixel.
— Click on Settings
— Go to General Settings,
— Under Icons
— Click on Publish in the top right of Designer.
— Enable all Advanced options shown in this picture.
— This helps with page load speed.
When hosting is activated, make sure you disable indexing of the Webflow subdomain of your site from the project SEO settings.
The sitemap is generated automatically in Webflow. Enable the switch as shown in the screenshot below to allow the sitemap to auto-update whenever you publish your project. The Sitemap section is available in the Project Settings then navigate to SEO
Set the language of your site to help search engines and browsers better understand your content. You can add the language code section under Project.
— Click on Project Settings
— Go to General
— Then Localization.
Set up Google Search Console to verify site ownership, have a better view of your site’s search traffic and performance, fix issues, and submit the Sitemap. Make sure you submit the Sitemap whenever you implement changes to your project.
Set up Google Analytics to have a better view of your traffic and user’s behaviour. However, there are plenty of web analytics tools out there. Whichever you’re using, remember to add the proper Cookie solution in your project.
Performance is one of the key indicators for search engine ranking. Google page speed is the most popular tool to check your website performance. You’ll notice that different tools will show different results. That's because each of those platforms may use different assessment parameters. In any case, there are some key aspects that you always need to consider as you build websites with a performance-driven approach.