6 easy ways to make your Squarespace site not look like a template

I get a lot of clients who ask me how to make their site look less like a stock Squarespace template. One simple rule: Start from scratch.

Throw out the presets and use a site you like for inspiration. Use the blank template or a template that is relatively simple. Here are the steps towards looking more original in your Squarespace website:

  1. Delete the demo content. Just discard it. You don’t need it. It’s tempting when you are first starting simply to replace the demo page content with your own. But start from scratch and build one section at a time. Just get going and place your photos and copy into the sections first. Get the content in there before you really start designing.

  2. Choose your own colors. If you have brand colors established, apply them in the style section. If you need color palette inspiration, you can find that anywhere. I keep catalogs and print magazines to find color palettes that I am drawn to. Take a iPhone photo of the object of your inspiration and find the HEX color codes using a color code identifier such as Ginifab. Start with a color you love and build around it. For example, navy blue is the color I like best to wear and lighter shades of blue and gray tones complement the darker base color well.

  3. Find a great font pairing. This is perhaps the most important factor in making your Squarespace website not look like a template they provide. Look at sites you like and use font identifier tool such as What Font, a Google Chrome extension that allows you to hover over text, click on it and see what font it is. Whether your font is bold and modern like Sofia Pro, or more traditional like Helvetica, make sure you at least change one of the preset font pairing Squarespace provides.

  4. Variety is the key. For more visual interest, build your Squarespace pages using different styles as you layer Sections on top of each other. I like to use a large full bleed image followed by a smaller image and a text block followed by a full width section using a background color that contrasts with the previous section. I like using the premade page styles Squarespace provides to start with, but then I give those sections my own twist. Switch up the spacing and features to suit your needs.

  5. Understand the effect of negative space. Too many websites end up looking amateurish because the text and images take up too much space within the borders of a section. Some areas work better if there is empty space around the elements. Negative space creates emphasis around certain points. Selective use of empty space creates a stronger visual interest as a site visitor scrolls down a page.

  6. Take advantage of Fluid Engine. The current version of Squarespace 7.1 uses an editor called Fluid Engine that allows for more control on where blocks are placed in a section. Try overlapping elements, colored filled backgrounds on text blocks, and really pushing the boundaries of where elements are placed on your Squarespace site.

Li Wang

I’m a former journalist who transitioned into website design. I love playing with typography and colors. My hobbies include watches and weightlifting.

https://www.littleoxworkshop.com/
Previous
Previous

What makes a great Squarespace website design

Next
Next

Alternatives to having your own photos for your Squarespace website