Have you heard about responsive websites? It is nothing new that Internet access via cell phones is growing more and more in Brazil and in the world. You yourself, dear reader, must have used your smartphone at least once for some quick searches.
Perhaps, even at this moment, you are reading this blog on your cell phone or tablet, but the big question here is not the device you use to browse the Internet, but how sites have adapted to different platforms, that is, if Contents are responsive.
With a generation increasingly adept at mobile devices, a responsive website is essential for any company, and if yours isn't yet, know that you might be missing out on the chance to improve your lead capture.
To change this situation, we will teach you, in this post, how to create a responsive website using Hubspot. Continue reading and find out what responsiveness is and how to apply it.
In this post, you will see:
- What is a responsive website?
- Site mobile X Site responsive: what's the difference?
- Why should your website be responsive?
- How to create a responsive website on Hubspot?
- Use Hubspot's responsive templates!
- Customize your template with the drag-and-drop feature!
- Adjust the size of text and images!
- Use Hubspot's resources to upgrade your website!
Good reading!
What is a responsive website?
You know that blog that you can open on your cell phone, tablet or notebook and it always adjusts to the screen size? This is a responsive website.
In short, responsive websites are pages that adapt to different devices without distortion. That is, all the design, image and text of your website adjust to the space in the best way, so that the reader has the same experience on all devices.
But be careful! Don't confuse a responsive site with a mobile one, okay? Although both have versions for smartphones, they are not the same thing, and in the next topic, we'll talk more about it.
Site mobile X Site responsive: what's the difference?
If you've ever confused both terms, know that this is common. A lot of people often wonder if a mobile and responsive website are the same thing. But, so you don't fall into the same mistake, we're already advancing that no, they're not the same thing.
On a mobile site, your page layout is created specifically for mobile devices, such as your cell phone. It functions as a second website and even has its own URL.
A responsive page does not need to create a new website or domain. A single structure can automatically adapt to both desktop and mobile versions.
Therefore, we repeat: the ideal is to invest in a responsive layout, it is easier to manage and, in general, can rank better in search engines.
Now, even knowing what a responsive website is you are still not convinced of the importance of having one. We will show you in the next topic why having an adaptable page is essential. Come on?
Read too:
- 7 Tips on how to set up an e-commerce website
- The 10 Whys of Having a Blog in Your Marketing Strategy!;
- Blog Posts: the 6 most common mistakes when publishing.
Why should your website be responsive?
First of all, you need to know that Brazil has more than 150 million Internet users. Lots of people, huh? With technological advancements and countless connected Brazilians, around 58% of the population accesses the internet exclusively by cell phone, as shown by the research carried out by Cetic.br.
If most Brazilians use mobile devices, it is clear that, to serve this audience, you need to have a website that adapts to these devices as well.
But that's not the only reason why you should invest in a responsive website. In fact, a responsive website can bring you more visitors, improve your SEO, increase your page speed, decrease bounce rate and even contribute to the customer experience.
According to a survey by the Google for mobile devices, users who don't have a good experience on your site in version mobile has a 61% chance of immediately leaving your page and looking for a chain. That is, you can lose your customer.
I imagine that, after these data, you already understood the importance of a responsive website. But after all, how to apply responsiveness on your page? Next, we show you how to create a responsive website with Hubspot's templates.
How to create a responsive website on Hubspot?
Among the numerous features of Hubspot, the platform has a great Content Management System, the CMS Hub. On it, you can host your website and manage your page in a personalized and secure way, and best of all, all of this on Hubspot's CRM platform.
In addition to hosting, the software includes custom templates, dynamic content, and much more. But, after all, where to start creating a responsive website? Below, we'll give you four tips on how to make an adaptive page within Hubspot.
Use Hubspot's responsive templates!
Within the Hubspot platform, you will find several ready-made and responsive templates. If you don't have much experience with the software, don't worry, as the platform is very dynamic and intuitive. Just access the themes marketplace to the HubSpot website, where you'll find several options.
There are several professional and visually harmonic templates that you can easily customize and add logo, colors and other elements, giving your touch to the page.
And as we mentioned, all of them are already responsive, that is, adaptable to any device. By the way, if you want to check out some ready-made templates.
That's it, select one of the pre-designed templates and let's move on to the next step: customizing your page with Hubspot's drag-and-drop feature.
Customize your template with the drag-and-drop feature!
It's time to add your touch to the template! You can change the color, typography, spacing and anything else needed to build a good website.
With the drag-and-drop feature, you can do this customization without needing a lot of experience or being an expert in programming code. Simply drag and drop elements or templates and preview them on your page. Easy, isn't it?
When customizing your page, remember to put into practice the UX design to create a user-friendly interface that maximizes the user experience.
The tip is: put the quick access tools in the main menu, this can facilitate access on smartphones. Also remember to enterCTAs, that is, buttons with a call to action to direct your visitor.
Adjust the size of text and images!
Also, be aware of your font size, prioritize titles with a typography of at least 22 px and the body of the content with a minimum of 14 px. You can use more sources and standards that are on Hubspot's own platform, such as Arial, Tahoma or Times New Roman.
And since we are talking about responsive websites, another important point is the images. Try to insert high quality photos, but with a compressed file size, so your images won't take as long to load on a cell phone.
Use Hubspot's resources to upgrade your website!
Another great benefit of Hubspot is its various integrations, such as Canva and Google Search Console, with these plugins you can improve your page.
And speaking of upgrades, remember when we mentioned that Hubspot has numerous features? This is the most pure truth. Within the Software, you can add chatbots with artificial intelligence to personalize the customer experience and promote faster service within your own website.
In addition, the tool even has an adaptive testing feature, where you can test your responsive page and compare one page interaction with others.
Okay, after customizing your page and having a new responsive template made by Hubspot, it's time to put your website online. Visit our website and see more content on this topic.
Portugal