Five Ways to Customize Your Squarespace Site with Your Brand
In the fast-paced digital world, your website stands are the first encounter potential customers have with your brand. If you’re like many of my clients, you might be stuck on how to create a website that captures the essence of your brand without spending a ton of time doing it. The question is: What things do you need to do to make sure your website reflects what your brand is really about? Here are a few of the key things you’ll want to consider.
Keep your colors Squarespace-ready and accessible to everyone.
When it comes to branding, design, and marketing, colors play a pivotal role. Colors can invoke emotions, make things more exciting to look at, and say more about your brand than you may realize. But when it comes to your website design, your color choices may not be as varied as the Sherwin Williams paint swatches you see at the hardware store.
Colors not only help build your brand identity — and a visually appealing website — but they help create a visual hierarchy that influences how a user experiences your website. You want visitors to spend time on your website, perhaps even clicking around to parts of the website that didn’t bring them in. So a consistent color palette that makes CTAs clear, draws the eye to important parts of your site, and keeps your brand consistent across the website can work wonders.
A great rule of design - graphic, interior, really any type of design - is the 60-30-10 rule. This means that 60 percent of your color palette should be your primary (background) colors, 30 percent for secondary colors (text), and 10 percent for an accent color (buttons, links, CTAs).
Choose a color palette that fits into Squarespace.
What does this mean? Squarespace palettes consist of five colors, including black and white, so choose five colors that make sense. A great rule of design - graphic, interior, really any type of design - is the 60-30-10 rule. This means that 60 percent of your color palette should be your primary (background) colors, 30 percent for secondary colors (text), and 10 percent for an accent color (buttons, links, CTAs).
Pro tip: If one of your five colors is close to black or white, you may want to opt to use another color on your palette. For example, if your brand color for font is dark navy, default to the black so you can add more colors!
Choose colors with accessibility in mind.
For those with limited vision or experience color blindness, you’ll want to make sure that there is a high contrast between the background colors and the colors of your text. Plus, it makes it easier for everyone to see and read.
There are lots of tools out there that can help you create a color palette that is accessible, simple, and visually appealing. I really like Coolors to help with accessibility. Using the Contrast Checker, you can enter the HEX codes of your proposed text color and your background color and it will give you ratings for small text and large text portions.
Not sure how to get started with your color selection? Not sure what HEX codes are? I can help you!
2. Find stock images and colors that align with your brand.
Stock images can be a valuable resource to enhance your website and brand’s visual appeal. When you’re selecting stock images, videos, and templates, you’ll want to focus on finding things that resonate with your brand’s essence and that of your target audience. Images should match your color palette (or at least be complementary to it) and capture the mood and vibe you want to project.
While we all would love to have a budget for a photographer that can shoot a wide range of personalized stock photos, B-roll video, templates, and other elements to create completely unique visuals, that often doesn’t fit into the budget for small businesses. And luckily, it doesn’t have to be! Here are a few of my favorites:
Haute Stock: This powerful tool offers a library of female-focused, premium stock photos, videos and marketing templates created by some of the industry’s top photographers and designers. Membership plans align with your needs (monthly, quarterly, and annually) that give you access to over 9000 stock assets.
Inspired Stock Shop: Geared more toward the spiritual and mindfulness industry, Inspired Stock Shop offers thousands of photos, hundreds of Canva templates and stock video clips. A subscription to the site offers access to the growing library, valued at over $10,000.
Etsy: As the creator’s marketplace, Etsy’s evolution over the last two decades has allowed many creators to find new ways to sell their work and reach new audiences. Many photographers will sell photographs, stock photo and design packages for much less than one would pay on a Shutterstock or Adobe Stock. It may also give you direct contact with a photographer to build your own unique stock packages.
Unsplash: One of the original free stock photo sites, Unsplash offers millions of free photos that are easily searchable. There is a paid subscription (Unsplash+) that unlocks millions more. Plus, Unsplash and Squarespace now have a partnership, so many of these options are available within the Squarespace platform.
Canva: You know I LOVE Canva. It’s a designer’s haven. Whether you have a free or a paid subscription, there are thousands of stock images and photos, and templates, available for use.
Consistency is key in branding, and using images that align with your brand's personality will make your website look more professional and polished.
3. Find the web license for your font.
Typography is another crucial aspect of branding. Your choice of fonts can greatly influence the way your brand is perceived and how it looks on a page. If you missed it, I wrote a blog about the fonts already available in Squarespace and Canva (and my favorite combos).
But did you know that you can install unique fonts too? There are thousands of fonts out there - Google Fonts is a great spot to start. Many are open source – meaning that they’re available for anyone to use for anything – but you’ll also find a lot that require licensing. Be sure to review licensing requirements before you move forward with installing and using it. This will ensure you avoid any legal issues later on.
Installing a unique font on Squarespace takes a few steps. I’m here to help!
4. Create unique graphics and visuals using Canva.
Why yes, there is even more that Canva can do! As a super user-friendly tool, Canva can help you design eye-catching graphics and collages to add to the design of your homepage, landing pages, and beyond. There are thousands of free templates that can help get you started.
Pro tip: If you’re looking to create cohesiveness between digital and printed assets, Canva is a great way to design because you can resize the same graphic to the specs you need for any project.
However, when creating graphics and visuals for your website, you’ll want to keep in mind that Google and other search engines cannot read the text embedded in your images. This can negatively impact your SEO score and reduce the accessibility score for your website as image text cannot be read by screen readers and other technological devices for the blind. If you must use images in your graphics, make sure that you are adding alt text into image descriptions.
Want even more Canva tips? Check out Quick Canva Tips!
5. Use background images and patterns to make key sections “pop.”
We’ve covered the importance of typography, color selection, and graphics as it relates to making your website engaging. So let’s talk about adding some texture and depth to certain pages or sections.
Adding patterns, background images, or animations can help create a dynamic look that breaks up the monotony of a simple site. It can draw the eye in and keep it engaged until the user has gotten through the content. Plus, it creates curiosity to get to the next section to see what other fun is in store.
Where should you incorporate these “interrupters?”
Animations: If you take a look at the homepage of my website, you’ll see that I’ve added a subtle animation in the second section. The wheel spins as the user scrolls which may interrupt a quick scroller to come back and look at what’s there.
Subtle Patterns: I’ve added a subtle pattern behind the tiles of my Design Services on the homepage. This helps draw the eye but also serves the purpose of letting the user know what they’re looking at.
Bold Patterns: You’ll see that I’ve added a bolder pattern behind a testimonial on the homepage. I’ve done this to draw bolder attention to showcase what my satisfied clients have to say! I also incorporate this pattern throughout the website to keep that consistent design. Notice that I’ve set the text off with a complementary colored box to keep the contrast with the bold pattern and tie in one of my branded colors.
Background Images: I use a background image on my Portfolio page that shows some of the printed assets I’ve created. It tells the story of my design aesthetic and capability and invites the user to keep moving on the page (notice my use of “Below”).
Pro tip: Keep the color contrast rules in mind. Make sure that your text can be clearly read on top of the image or pattern.
Remember: Branding is a journey.
As you work to create, build, or enhance your brand, incorporating a variety of tactics and using the tools available to you will help you create a web experience that is cohesive, visually appealing, and functional. I offer a variety of resources, courses, and services to help you reach your branding goals no matter where you are in your process.
I want to help you create a brand and a website that helps you feel confident, proud, and inspired by your company. I offer a wide range of services and consultations that can help you get started and get moving. Check out my packages and service offerings here.
