Building a Wix site with Velo? Here are some tips for improving your site's visibility in search engines and avoiding SEO pitfalls when coding with Velo.
One of the first steps to ensuring effective SEO is making sure search engines can crawl and index your site content. If you're working with Velo, some of your site content may be dynamic. How can you make sure that search bots can view your content?
Wix sites are built using Wix editor components that are rendered into HTML. With Velo you can also customize the content and layout of your site by adding JavaScript code using the Velo JavaScript APIs.
Search bots access your page content by sending an HTTP request to your page and reading the HTML content generated from the initial page rendering. At a later date, some search bots also render the page themselves and run any JavaScript code. Since not all search bots run JavaScript code, you should make sure the code returning the content you want to be indexed runs before your page is initially rendered. Content not included in the initial HTML output may be indexed after a long delay, indexed incorrectly, or not at all.
For this reason, and also to increase the performance of your site, Wix uses server-side rendering (SSR) to render your page's components on the server and return them to the browser as HTML. How can you make sure your content is included in the SSR version of your page?
For Velo sites, anything that occurs in the onReady()
function is rendered on the server, returned as HTML, and seen by search engines.
For most use cases, it's enough to just call the function in onReady()
. For asynchronous functions and functions that run following a delay, the onReady()
promise may resolve before the function's promise has a chance to resolve. In such cases, if you need the returned content to be indexed, you can block the onReady()
from resolving until your function's promise resolves. You can indicate to the server that it should wait by returning the promise in onReady()
.
For example, let's say you have a repeater on your page that is populated with data queried from a database collection:
In this example, the asynchronous query's promise may not resolve before the onReady()
promise resolves, and the SSR version of your page may not include the queried repeater content. To ensure that the query resolves before onReady()
, we can return the query in onReady()
. See the change to Line 9:
Note that returning a promise in the onReady()
function may affect the performance of your site, as all the data will load before the page is rendered. Since there is a tradeoff between SEO and performance, you might want to wait for the main content that is important for indexing, and let auxiliary content such as the time or weather information load later.
Note Database content that is loaded into page elements via a dataset (instead of code) is included in the SSR version of your page and will be seen by search engines.
How can you check if a search bot can view your page content? You can emulate a search bot by setting your browser's user agent to a specific bot. For example, you can emulate a Google bot and check which site content Google bots will initially crawl.
To emulate a Google bot in the Google Chrome browser:
Navigate to your published site.
Open Developer Tools.
Click the 3-dots menu at the top right.
Select More tools > Network conditions.
In the User Agent section, clear the Select automatically checkbox.
Select Googlebot.
Reload your site.
Now you're viewing the page content Google bots will initially crawl and index.
Search engines learn a lot about your site from internal site links. Since internal links impact your site's SEO, it's important to know how to set up and manage links on your site.
Google bots only crawl links with an HTML <a>
tag with an href
attribute. There are several ways to add crawlable href
links to your Wix site:
Add a site menu to your site.
Add a hyperlink to your text.
Use the link button to add a link to a clickable element such as a button or image.
Use a dataset to connect URLs from a database collection to clickable elements such as a buttons or images.
Other methods of adding links to your site are not guaranteed to generate href
links. You can add non-crawlable links to your site, but you should make sure that every page of your site is reachable from at least one crawlable link.
There are different ways to handle loading more page content when the content is too long to fit on a single page. One method is to use a numbered menu that loads a specific number of items for each numbered button that is clicked.
If you are using a numbered menu for pagination and you want search engines to crawl and index each batch of content as an independent page, add a page query parameter to the link for each numbered button: ?page=<pageNumber>
. Google views URLs with numbered page query parameters as links to independent pages.
For example, let's say you have a numbered menu with several buttons:
Google indexes the following as 2 separate pages:
#button2
URL: https://www.wix.com/velo/examples?page=2#button3
URL: https://www.wix.com/velo/examples?page=3Note For the link to the first page, don't set the query param to ?page=1 since you'll have 2 URLs pointing to the same page. Instead you can link to the main page.
Google treats URLs as case sensitive. For example, Google views each of these URLs as unique:
Google recommends exposing either the uppercase or lowercase version of a URL, and not both. Even if you've set both URLs to point to the same page so that a site visitor will reach the same destination regardless, you may not want both versions out there on the web pointing to your page.
When multiple URLs point to the same page, Google will choose only one to represent the content on your page, and will highlight only that URL in search results. And it might not be the URL you prefer.
So which case should you choose, uppercase or lowercase? Lowercase is recommended, since it's more common and you can assume that at least some people will use the lowercase URL to link to your site.
Site images play a significant role in determining your site's SEO. But how do search engines "read" your images? They check the image's alternative text (alt text), a short but meaningful description you can assign to your image.
You can add alt text to an image via the Wix Editor, but if you are displaying multiple images from a database collection, you can dynamically assign alternate text to your images with code using the alt
image property, or by connecting to alternative text stored in a database collection via a dataset.
Dynamic pages and router pages are different than regular pages in that they contain dynamic data. SEO information for a dynamic or router page must be set dynamically, so that it reflects the real content the pages will hold when they are viewed.
You can define SEO information for your dynamic pages in the Wix Editor.
You can dynamically define the following SEO information for your router pages:
Site structure refers to how you organize content on your site. For example, how do pages with your main content link to pages with subtopics? How many pages will a site visitor have to navigate to reach the content they want? Is the connection between pages with related content organized or random?
Planning and mapping out an organized site structure will make it easier for search engines to crawl and index your site. Google awards sitelinks, additional links that appear beneath the main URL in a Google search, to sites with great site structures.
You can use Wix Data features such as database collections, dynamic pages, and index pages to improve and organize your site structure. Consider the following factors when planning your site:
Organized hierarchy: Make sure the connection between pages on your site isn't random. Your site hierarchy should be organized and fairly shallow (not too many levels).
This is easy to accomplish using dynamic pages, where you can automatically generate multiple pages with similar structure and different content all relating to a main index page.
URL structure: The structure of your URLs should mirror your navigation hierarchy. Each level of your site should be represented by a section of your URL containing an appropriate keyword. For example, if you've got a recipe site divided by cuisine type and then by course, a site visitor who selects Italian cuisine and then appetizer recipes should see a URL that reflects the site hierarchy:
You can automatically generate structured URLs for your pages using dynamic list and item pages.
Internal links: Search engines use internal links to crawl the pages of your site. In general, the more internal links the better, but minimally every page on your website should have a link to and from another page on your site.
You can create an index page or a dynamic list page to easily link to and from dynamic item pages on your site.
Note SEO settings for dynamic pages are different than SEO settings for regular site pages.
You can use the Velo SEO API to get and set SEO information for your site pages:
rel canonical
lets search engines know which URL represents the master copy of your page.Note To ensure the SEO data you set will be read by search engines, make sure to set such data in the onReady() event handler.
You can connect a 3rd-party marketing tool such as Google Analytics or Facebook Pixel to your Wix site and collect valuable information about your visitors' behavior. Wix helps you track specific visitor events such as page views and purchases and report them to your integrated marketing tool. You can then use this information to optimize your site.
If you want to track additional visitor actions not included in the default tracking events available via Wix marketing integrations, you can use the Velo Track Event API. For example, you can add tracking code to a download button and report to a 3rd-party tool every time a visitor downloads a document.
SEO is a complex and ever-changing field. Check out the following resources to keep your site up to date with SEO best practices: