Getting your Bubble App Found
It should be obvious to any aspiring app developer that an app can’t succeed if it can’t even be found. Users can’t come flocking to a new online service or platform that they haven’t even heard about. That’s why Search Engine Optimization is one of the biggest things in web development.
For the uninformed, Search Engine Optimization is the process of making your website or app more visible on search engines by tailoring its content and design to take advantage of web crawlers. This can mean anything from making your textual content more concise, building your content around certain keywords, or enclosing your content in certain HTML tags.
For us Bubble app developers, this will also mean adjusting our content semantically and exposing some important files containing information about our app pages to web crawlers. Doing all of this will make your app appear higher in search engines, increasing your visibility and hopefully, your user count. Fortunately, Bubble provides us with tools to make this process quick and easy.
So if you want to learn more about how to make your Bubble app more accessible for search engines, read on for Bubble app optimization tips.
Using Bubble’s SEO Tools
You can find Bubble’s SEO tools in the Settings menu under the tab labeled “SEO / metatags”. It should be noted that Bubble advises that you not change these settings unless you’re absolutely sure of what you’re doing and its consequences. One wrong setting can significantly change your app’s search engine rankings. While we will guide you through what all these settings do, and what they could mean for your website, their applicability will still vary depending on the circumstances.
The first setting you’ll see on the page is to “Expose the type of tags for text elements”. Checking this box will allow you to change the HTML tags associated with elements of your text. This is useful because the web crawling algorithms that go over your pages search for keywords in certain HTML tags like the header tags h1, h2, and h3 and rank your website based on that.
The next setting you’ll see is an option to customize your robots.txt file. This provides web crawlers instructions about which pages they should ignore while indexing your site, such as user pages or forms. By default, Bubble creates and exposes one for you, but by ticking this option you can customize it and override the default content. You can then enter your own custom robots.txt instructions in the following prompt.
Google’s documentation advises that you use robots.txt to manage crawler traffic if you think that your app is getting overwhelmed with requests. They also advise using the file to limit crawlers from repetitively accessing similar or unimportant pages of your site. You’re also advised to use the file to prevent images, video, or audio from appearing in search results.
You can also create and expose a sitemap file. This file provides instructions to search engines’ crawlers about the organization of your site and its content. This allows them to parse through your
website and its contents more intelligently. Exposing a sitemap will also allow you to select which pages should be shown.
One of the most important uses of a sitemap is in illustrating the relationships between the pages, videos, files, and other media on your website. It tells search engines which pages you think are important and relevant to web crawlers and it also provides valuable information on those pages.
The sitemap can provide specific information about the media and content on your page. A video entry can detail the running time and rating. A news entry can include the article title and publication date.
Generally, you’re advised to have a sitemap if your website is large, has archives of content that are isolated from the rest of the site, or has a lot of rich media content. Otherwise, if you have a smaller site (under 500 pages) or your webpages are easily reached from the homepage, or don’t fulfill any of the other conditions above, you might not be in need of a sitemap.
Finally, the SEO menu also allows you to manage 301 redirections. These are permanent redirects from one URL to another that effectively transfer the old URL’s search ranking to the new URL.
Optimizing your website for search engines
Aside from these, Bubble provides some tips of its own to improve your Bubble app search engine ranking. These are tips Bubble compiled based off of Chrome’s built-in SEO audit tool.
· Tap targets should be mobile-friendly – large enough and with enough space around them but not overlapping enough to trigger other tap elements.
· Bubble automatically adds a viewport meta tag to apps in order to increase search engine ranking so developers don’t have to.
· Bubble developers should set titles for each page of their app via the property editor to give users an overview of the page and to allow crawlers to determine if a page is relevant to their search.
· Pages should have meta descriptions to concisely summarize page content. This can be set via a selected page’s property editor, similarly to the meta titles above.
· Bubble pages automatically have successful HTTP codes, which allow them to be indexed properly.
· Links should have descriptive text to help users understand the content.
· Bubble developers should also use legible font sizes, with a target of at least 60% of text content having font size 12 or larger.
· Images should have alt attributes with short, descriptive alternate text. This can also be set in the property editor for images.
· Pages should be optimized to load quickly, as this is a factor in some search engine rankings, though Bubble also handles this automatically.
While search engine optimization may seem like a large and daunting task, it really isn’t. A lot of the tips here to raise your app’s search engine rankings are also tips that you can use to make your app more accessible to users. However, if you find that you’re having trouble with this, or if you think that you want more professional help, you can always contact Bubblehelpers for more web app support and no-code web development assistance.