Follow this guidance to build an optimized website with GrowBig

Following these simple steps will guarantee that your website will load in the range of 60-99 in the Google speed test. This guidance provides only information that is easy to consume, and everyone can implement these steps without the extensive knowledge required.
This guidance will not teach you how to read and understand Google Speed Analysis as it requires deep knowledge to understand all aspects and how all these aspects influence the loading speed. On the other hand, it will simply provide you with clear information on what you SHOULD DO and SHOULD NOT DO to achieve your desired loading speed.

Before you start

Dos

  • Make sure you have implemented every step for each type of content, such as video, image, etc.
  • Test the final result only on your branded domain.

Do not

  • Do not skip steps for each type of content, such as video, image, etc.
  • The HubSpot system domain will provide lower speed test results.

Video

Dos

  • Optimize the video for the background by making it short and using it in a loop. Use a tool like https://cloudconvert.com/ to optimize the video. Ideally, the video should be below 2MB.

    Use these settings:
    Resolution: 1280x720 (720p HD)
    Constant Quality (CRF): 31
    Format: MP4
  • Use only theme modules to display the videos.

Do not

  • Do not use unoptimized videos; any video background over 2MB will negatively impact the loading speed.
  • Do not use embedded videos like YouTube or Vimeo, unless the iframe has "lazyload" option.

Image

Dos

  • Use only third-party tools like https://tinypng.com/ and https://squoosh.app/ to optimize your images.

  • Follow these image resolution rules:
    • Regular images should have a maximum width of 800px, for example, blog post images or case study thumbnails.
    • Gallery images for pop-ups (not thumbnails) that display critical content, such as images with details, should have a maximum width of 1500px.
    • Hero or section background images should have a maximum width of 1500px.
    • Background images that display important content for visitors should have a maximum width of 2000px.

Do not

  • Do not use unoptimized images; HubSpot does not provide the necessary image optimization.
  • Do not use high-resolution images; refer to the resolution dimensions in the "do's."

Form

Dos

  • Use one form per page

  • Use the form in the middle or end of the page.

Do not

  • Do not use multiple forms on one page.
  • Do not use or avoid, if possible, the form at the top of the page as it negatively impacts the "cumulative layout shift" in the Google speed test.

Embeded content

Dos

  • Use embedded content only if it provides "lazyload" options, for example, the default Google Map.

Do not

  • Do not use embedded content as an exception unless the iframe has a "lazyload" option.

Third-party analytics

Dos

  • Use third-party analytics only if HubSpot analytics do not provide the data you need.

Do not

  • If you use Google Tag Manager for analytics, do not use unnecessary integrations and tools if you do not use them.

Chat

Dos

  • Display only the chat launcher button on the mobile devices.

  • Set the timeout to 5 seconds or more for when the chat should appear to visitors.

Do not

  • Do not use the pop-up welcome message as a prompt for your chat on mobile devices.
  • Do not load chat without a timeout or lazy load.

Javascript

Dos

  • Set any third-party JavaScript integrations only at the end of the project. In this case, you will be able to identify which ones negatively impact the loading speed and which ones you need to fix or replace.

  • Set the third-party script only on the specific page if the project does not require this third-party integration to be on the entire website.

Do not

  • Do not set up third-party integration before the project is complete, as it will only make it harder to identify what is affecting the loading speed.
  • Do not set up third-party integrations for the entire website if they are unnecessary.

If you do not achieve a Google Speed Test result above 60 after implementing these recommendations, please contact us directly via the contact form.