SEO is important for many kinds of web apps to grow, and Bubble has a set of features to help meet the SEO standards that search engines request.
A general principle to keep in mind is that a core tenet of SEO is the authority of the content on a website, which is indirectly measured by the (vague) metric of how often users find the content on a site useful for a given query. All this is to say that a strong first step towards improving a site's SEO ranking is to fill it with good content that users actually want! Simply checking off all the other boxes in an "SEO checklist" is unlikely to help if the underlying content is not strong.
Bubble lets you customize how your site is seen by search engines' crawlers. These are advanced settings, and should only modified if you know precisely what the consequences of these settings are. A wrong setting can significantly change your site's raking on search engines. It is important to keep in mind that search engines are very secretive about what makes a high ranking.
A good starting point for SEO optimization is in Settings > SEO / metatags:
If you check the box 'Expose the type of tags for text elements', you'll be able to define some elements as 'h1', 'h2', 'h3'. It'll be your responsibility though to make sure you're not doing something weird there, which could harm your indexing.
The robots.text file (see example) provides some instructions to search engines' crawlers regarding the pages to ignore when indexing your site. Bubble exposes a robots.txt file for all apps. By default the development version of your app isn't indexed.
If you want to customize the file, you can check the 'Customize robotx.txt' box and overwrite the file content.
The sitemap file is a file where you can list the web pages of your site to tell search engines about the organization of your site content. Search engine web crawlers read this file to more intelligently crawl your site (see example). If you want to expose a sitemap, you can check the 'Expose a sitemap file' box and pick the pages that should be shown. This will update robots.txt to point to the sitemap, and will generate the sitemap.
If an earlier version of your sitemap contains a page with a Thing assigned to it (e.g. mybubbleapp.com/product/great-widget-1), and later that Thing is deleted, Google may still list that page online even after you upload an updated sitemap. This is because regardless of what your most recent sitemap says, Google will try to visit old URLs to see if they're still alive. Since a Bubble page will still technically load even if the assigned Thing doesn't exist (it just doesn't show any Thing's data), Google will think that old URL is still alive.
A 301 redirect is a permanent redirect from one URL to another, which transfers most of the ranking value to the new URL.
At the bottom of the SEO section, you'll be able to enter old URLs and new URLs. Note that the URLs should be the full URL (including the protocol) and it shouldn't be an existing page in your app. For instance, if you have a page on your app appname.com/page1 and if you define a redirect for the URL appname.com/page1/something, the redirection will not happen.
Chrome comes with a built-in SEO audit tool (open Chrome's Inspector > Audits tab to find this and other tests). The test calls out a set of criteria that definitively influence Google's SEO algorithm (note again that the exact algorithms are kept secret, and there are other search engines aside from Google). Here's a review of each criteria from this audit and how Bubble apps perform on each:
- "Mobile friendly: Tap targets are not sized appropriately - Interactive elements like buttons and links should be large enough (48x48px), and have enough space around them, to be easy enough to tap without overlapping onto other elements."
- Bubble app creators have full control over the design of their apps across all screen sizes.
- "Has a <meta name="viewport"> tag with width or initial-scale - Add a viewport meta tag to optimize your app for mobile screens."
- Bubble does this automatically
- "Document has a <title> element - The title gives screen reader users an overview of the page, and search engine users rely on it heavily to determine if a page is relevant to their search."
- Bubble app creators can set the title for each page of their app via the Property Editor when a page is selected (one way to see this is to use the element selector in the topbar of the page on the Design tab; look for "Title (for SEO / FB)"
- "Document has a meta description - Meta descriptions may be included in search results to concisely summarize page content."
- This is set the same way and place as the page's title (see above) - look for "Description (for SEO / FB)"
- "Page has successful HTTP status code - Pages with unsuccessful HTTP status codes may not be indexed properly."
- Bubble does this automatically
- "Links have descriptive text - Descriptive link text helps search engines understand your content."
- Bubble app creators have full control over the content of links in the app
- "Page isn’t blocked from indexing - Search engines are unable to include your pages in search results if they don't have permission to crawl them."
- Bubble does this automatically
- "robots.txt is valid - If your robots.txt file is malformed, crawlers may not be able to understand how you want your website to be crawled or indexed."
- Bubble automatically generates a working robots.txt file, but users can also customize this (see above)
- "Image elements have [alt] attributes - Informative elements should aim for short, descriptive alternate text. Decorative elements can be ignored with an empty alt attribute."
- The alt tag for an image can be set via the Property Editor when the image is selected
- "Document has a valid hreflang - hreflang links tell search engines what version of a page they should list in search results for a given language or region."
- Bubble handles this automatically
- "Document has a valid rel=canonical - Canonical links suggest which URL to show in search results."
- Bubble handles this automatically, but users can also set up 301 redirects (see above)
- "Document uses legible font sizes - Font sizes less than 12px are too small to be legible and require mobile visitors to “pinch to zoom” in order to read. Strive to have >60% of page text ≥12px."
- Bubble app creators have control over the font size(s) used
- "Document avoids plugins - Search engines can't index plugin content, and many devices restrict plugins or don't support them."
- This does not apply to Bubble ("plugins" here does not refer to Bubble plugins)
The SEO industry is filled with many parties trying to guess at which factors influence search engine algorithms. This leads to varying claims about which factors are or aren't important. The ones listed in the previous section are definitive factors as published by Google. Here are some other guesses at SEO algorithm factors that frequently come up:
- "Pretty" URLs - shorter URLs that plainly state what the page is about, e.g. mytravelsite.com/miami
- There is not much evidence that this is directly a factor in SEO rankings; however, some theorize that having pretty URLs increases click-through rates of a URL, which could impact SEO
- For Bubble apps, dynamic pages which are based on a Thing in the database (i.e. the "Type of content" is set) will have the Thing's unique ID in the URL automatically - this is a random hash. If a page has a "Type of content", the page can also have a "Field for readable URL", which will add readable words to the URL before the thing's unique ID
- (There are "tricks" to achieve pretty URLs in Bubble published by users in the forums, but at this time this is not an official Bubble feature)
- Prerendering Bubble pages - do search engines have a hard time crawling Bubble pages because of how they're rendered?
- Bubble has special logic to "send" a page to the crawlers at some point after the page has been rendered, so this is generally not a problem
- Generally this will send the contents of the page, but for pages that load content in multiple steps or in multiple elements, this may not work perfectly; if this is a particular concern for your page, consider restructuring the content on a page and how it's loaded
- Google Search Console has a tool that allows you to see how Googlebot "sees" a given URL
- Page load speed - are Bubble app pages penalized for slow page load times?
- Page load speed is definitely a factor in SEO rankings, but the exact thresholds of "fast" vs "slow" are unknown
- As a general note, Bubble views app performance (including page load speed) as a top priority, so we are optimizing this all the time
- Bubble apps generally perform OK on page load speed tests from Google, but page load speed depends heavily on how a Bubble page is designed - large queries, for example, generally slow down page load
- Cloudflare, which helps with caching and thus could impact page load speed, is available to all Bubble apps
- Several other factors assumed to impact SEO (e.g. using inline CSS, HTML compression, making too many HTTP requests) do not have much official evidence supporting that they are factors in SEO, but might have an indirect effect because they can impact page load speed; Bubble has generally tackled any proven SEO factors and tries to overall optimize page load speed over time
- Structured data - can Bubble pages include other kinds of structured data to send to SEO?
- Today, search engines will accept additional structured data from a page to help provide a richer search result to search engine users (e.g. this is how Google knows a page contains a "recipe")
- Bubble app creators can add this structured data by editing the HTML header of a page (via the Property Editor of that page) or of the site overall (via Settings > SEO / metatags)
- Note that "keywords" declared in meta headers are generally considered to not be a factor in SEO anymore