Top Ten Webflow Tips For Everyday Entrepreneur & Freelancer

Khula Design Studio
5 min readSep 14, 2021

Trailblazing the no code revolution, Webflow is a powerful visual coding tool which supports custom content structures and empowers designers to create custom professional websites.

When you’re in the flow of the day to day website creation and maintenance, it’s easy to overlook the more obvious details. But those tiny details can add up to a whole lot of impact on website performance.

Freelancers might be able to build you a site built with Webflow, but have they properly optimized it for speed and usability? What about SEO? Have they correctly formatted the all-important metadata? Afterall, it’s meta-details that matter, if you want to generate organic traffic from search engines.

As one of 14 Webflow Professional Partners in Canada, Khula takes care of the finer details before going live with your site. You can check out our Webflow credentials here.

The thing we love about Webflow is that once we’ve created your site, you can take complete ownership of the front end, leaving Khula to support with the more technical backend infrastructure. Plus, being a Professional Partner means we’re first in line for new features and opportunities, and our clients can stay ahead of the curve.

So once your business is back in the driving seat, how can you ensure your Webflow site is optimized for high performance and an awesome user experience?

Here’s our top ten Webflow tips:

1. Keep Your Heading Up:

It’s crucial that each and every page on your website has one H1 Heading, ideally followed by an H2 Heading. The H1 should be identical to the page title, whilst the H2 is normally the first description on the page. Why does this matter? If you want to generate free, organic traffic to your site, search engines like Google need to see it. Think of the H1, and to some extent the H2, as signposts to each page.

Here is a video on how to update headings in Webflow.‍

2. Optimize Those Images (And Videos):

You can massively improve page loading times by compressing images and videos before you upload. How do you do that? Try using compression tools like www.tinypng.com.

3. Alt. Those Images:

Use the ‘alt’ tag on your website images. All of them. That alternative attribute text is extremely important these days. It gives context as to what an image is displaying, which allows search engine crawlers to index it correctly. It can improve site visibility as well: have you ever wondered how those images got to the top of the search engine results page? Alt. those images.

Here is a video on how to add Alt text to your images in Webflow.‍

4. Get Better At Meta:

Every page in Webflow should include a meta title and meta description. If you want your pages to organically rank on search engine results pages, you’ll need to optimise these two tiny but hugely important pieces of text, ideally with a relevant keyword. Webflow allows you to set predefined tags for pages, which can automatically pull through the meta title and meta description from the copy that relates to that individual page.

Here is a video on how to add and update SEO meta titles and descriptions in Webflow.‍

5. Open A Tab:

Keep your website onscreen and in mind by ensuring all external links open in a new tab. Whether it’s social media, partner sites, or even resources on your own website, ensure hyperlinks open in a new tab.‍

6. Customise Contact Forms:

Did you update the styling and messaging for the success and error messages? This is often forgotten, or left out in Webflow contact forms. Make sure you complete this step for a more personalised response.‍

7. Your Logo Is Home:

We don’t need a ‘home’ button or link in the menu nav anymore. Why? Because that’s the job of your organization’s logo which you’ve tactfully positioned in both the header and footer navigation bars. Most Internet users will expect to return to your homepage by clicking the logo. Make sure every logo is linked!

Here is a video that explains how to do this and structure your menu nav bar in Webflow.‍

8. Favicon And Webclip:

In Webflow, under the general tab in settings, these two areas give you a chance to bring your visual identity and brand across to your audience. Make sure you put a custom Favicon (normally your logo in a size format of 32px by 32px) and a nicely designed WebClip “sometimes known as touch icons” (logo and business name in a size format of 256px by 256px), which is used on devices.

Here is a video on adding Favicon’s and WebClips in Webflow.‍

9. Tag Your Canonical:

Make sure in Webflow you add your Canonical tag including the “https://” under the SEO tab. Canonical tags let you declare on each page, “this page’s canonical version is (insert URL here),” ensuring search engines don’t see different versions of this page as duplicate content (for example, if your site has multiple domains with duplicate content).‍

10. Get Your Site Indexed By Google:

Finally, one of the most important yet frequently forgotten steps. You want to ensure Google crawls your new website so that it can index the pages and content, and get it ready for searching. Right? Make sure you use Google Search Console to request an indexing, or crawl a recent update.

A website is not a once-off build and then you forget about it. Your website needs constant love, refining, and maintaining. Every update, every post, every bug fix helps you build a stronger online presence.

There you have it. Ten things that often get forgotten or overlooked by DIY and freelance developers. Follow some or all of these pointers to not only enhance your website performance, but also help create a much smoother and faster user experience.

Does your Webflow website have all the fundamentals covered? Need some help? Give us a shout. Contact Khula today.

Originally published on www.khula.studio

--

--

Khula Design Studio

Khula helps small businesses transform their brand image & create experiences that delight & inspire. | www.khula.studio