The Squarespace Guide
Part I: Introduction
Now that you’ve had a website developed, it’s important to think of it as something that’s still growing and in need of nourishment.
Your website should evolve with you, your business or organisation. As your services expand, your research output increases or your branding changes, it’s important that your website should reflect it through new text, images or general design. If you want your website to be relevant to your audience or customers long into the future, you should work towards keeping your website active by publishing blog posts, images, events, products, or news regularly.
A neglected website becomes a piece of frozen history, much like this one. It has no room to develop, expand and offer value to potential readers.
On your journey to create however, there are a few things to keep in mind.
1. Your website was designed to be easy to update. It’s easy to add some complex or convoluted formatting to your website and never stop. Don’t do it. Your website will eventually grow into a behemoth, a house of cards that wobbles with the slightest brush of a mouse. It’s generally at this point that the process of updating a website is abandoned.
2. Your readers are your value. Thanks to Squarespace, your website looks incredible on both desktop and mobile phones alike. Visitors come back again and again to your content because it’s easy to understand, they get the information they need and when they want to, they can communicate with you directly. Adding pop-ups to your screens, constant chat bubbles or, god help me, flashing neon lights dilutes the customer experience and can lead them to run far, far away.
3. Your website is a balance of back-end code and front-end design. It’s great to update your website and make it your own, but keep in mind as you’re changing style settings that sometimes they may not work as advertised thanks to a setting hard-coded in the background. Conversely, if you’re tweaking the code, always remember to copy and paste a copy into Notepad (or TextEdit in Windows) to ensure if you make a mistake you have a backup copy.
Part II: SEO Best-Handling
SEO or ‘Search Engine Optimisation’ is what makes your website surface in search results on Google or Bing. It can drive new visitors to your website, or help people who know of your business find you when they don’t know the direct URL.
Like social media, search ensgines like Google use complex algorithms to determine what websites ‘rank’ for a particular search keyword. For example, if I search for my name ‘Heidi Sandstrom’ the first result that comes back is a photo archive. Why? Google has determined that this source of information is the most relevant and popular, as it contains images and keywords (my name credit) that are often posted to other websites.
So that’s rule number one. Popularity matters. Your website, in its infancy won’t rank on Google, but as you make changes to text and images, or update with blog posts or news that get stared to other websites you’ll find your ranking increases.
Here are my tips:
1. Your website is built using four different font sizes or ‘tags’ These are H1 [Heading 1 - or the largest font on your website], H2, H3 and P [Paragraph]. Google’s search bots review text in each of these categories to determine where in the ranking your website should sit. As a result, you should optimise them as much as possible. During this process, you should think about keywords that are applicable to your organisation - ones that people would search for and add them through your natural use of text (don’t add it too many times so to create an obvious attempt to thwart the bots). In my personal case, this might be ‘website designer’, ‘Squarespace designer’.
You don’t need to have your keywords squashed into each font type on every page, but you should aim to optimise the wording as much as possible.
Contact us page H1 tag: Contact ‘organisation name’
> Using your organisation name in your H1 tag for something as simple as a contact page heading can help list your website the next time someone searches ‘Contacting ‘organisation name’’.
See the below example from Coca-Cola.
2. Add alternate text to images. This sounds easy, but it’s remarkably easy to overlook. When you search in Google for ‘Pizza’, the image tab is filled with images of…you guessed it, Pizza! These images are surfaced through alt-tags - so ensuring you’re mentioning the names of individuals photographed in the relevant alt-tag, the name of specific events or a general description of goings-on can help raise the searchability of your website.
3. A website that is never updated will only ever surface for the keywords on it at the time of publishing. The best thing you can do is keep your website active, and if possible, publish regular blog posts. The great thing about blog posts is that you don’t need to focus on your primary keywords to improve how your website ranks. You might do a series of blog posts on an upcoming niche Jazz festival - and later find that your website then ranks for anyone searching for that festival online. Cool huh?
4. Get those backlinks! As mentioned way above, Google works off a complex algorithm that can rank your website on perceived popularity. Popularity is determined by how many people are talking about your website on other platforms - that can be through their websites, on blogs or in social media. You should always consider how you might leverage your brand name or organisation to encourage others to publish about you for the purpose of your backlinks.
5. One of the big indicators for Google ranking your website higher than others is how quickly it runs in comparison. Consider keeping the images you upload to the site small to avoid slowing your website down unnecessarily. Ideally images should be under 100kb.
Looking for more? SEO optimisation can be as big a processes as you have time to invest. Some businesses have teams of individuals whose entire jobs revolve around optimisation strategies.
To get started with SEO, consider reading up on the topic here:
Part III: Understanding Content Blocks
Once you’re into the nitty gritty of actually updating your website, one of the first things you’ll discover is that the website is intended to be built using ‘blocks’. Blocks can be inserted by hovering over the area on a page you’d like it to appear (while in editing mode) and clicking the small grey round icon that appears.
Here is a rundown of each block type:
500px - Add photography from a 500px account. [This is an integration with a seperate platform]
Acuity - Add online booking with Acuity Scheduling. [This is an integration with a seperate platform]
Amazon - Link to Amazon items. This is useful if you participate in Amazon's Affiliate program. [This is an integration with a seperate platform]
Archive - Display organized lists of links to collection items.
Audio - Add an audio file.
Bandsintown - Display tour dates from your Bandsintown profile. [This is an integration with a seperate platform]
Button - Add buttons and calls to action to your website.
Calendar - Display items on your pages, like events, as a calendar sorted by day.
Chart - Add bar, line, and pie charts.
Code - Add custom code (HTML or CSS) or display code snippets.
Content Link - Add links to other pages on your site with visual previews.
Donation - Collect donations to your cause or organization. Requires a connected Stripe or PayPal account.
Embed - Add external content with links to tweets, videos, and more.
Flickr - Add images from your Flickr account. [This is an integration with a seperate platform]
Foursquare - Add feeds of your Foursquare check-ins. [This is an integration with a seperate platform]
Form - Add forms to collect information from visitors.
Gallery - Add galleries of images or videos in Carousel, Grid, Slideshow, or Stack layouts.
Image - Add images with captions in Card, Collage, Inline, Overlap , Poster, or Stack layouts.
Instagram - Add posts from your Instagram account. [This is an integration with a seperate platform]
Line - Add horizontal lines to break up text or visually separate content.
Map - Add Google Maps with location pins. [This is an integration with a seperate platform]
Markdown - Add text using the Markdown language.
Menu - Display restaurant menus.
Newsletter - Add a form that feeds subscriber data into your email marketing platform.
OpenTable - Add restaurant reservation booking. You'll need an OpenTable Restaurant ID. [This is an integration with a seperate platform]
Product - Display products from your commerce store.
Quote - Add styled quotations or testimonials.
RSS - Add links to Blog Page RSS feeds.
Search - Add search boxes.
Social Links - Add icons that link to social media profiles.
SoundCloud - Embed SoundCloud players. [This is an integration with a seperate platform]
Spacer - Add adjustable amounts of space or padding between blocks.
Summary - Display collection items from your site in Carousel, Grid, List, or Wall layouts.
Tag Cloud - Display tags or categories in a graphic cloud formation.
Text - Add text, including headings, quotes, pre-formatted text, links, and lists.
Twitter - Display feeds of your most recent tweets and a follow button.
Video - Add externally hosted videos (like Youtube or Vimeo).
Zola - Add wedding registries. [This is an integration with a seperate platform]
Once one of these blocks are inserted, they can dragged from their location and dropped to another area. Drag two next to each other to create columns.
Part IV: Page Types and Navigation Changes
Through your left hand navigation menu, you can insert new pages and drag and drop pages into folders to create drop down navigations. Your primary action areas are ‘Primary Navigation’ (the pages that will appear in your top-of-website nav, and ‘Not Listed’ (the pages that will be hidden and like this one, are accessible via a direct link).
Here is a review of page types:
Blank Pages: A wholly blank page ready for you to insert content yourself.
Index Pages: This is a blank page nested within a page. It allows you to create ‘sections’, primary if you have a stylistic desire to create one page with multiple background colours.
Layout Pages: A ‘template’ page, with images and text boxes strategically placed to make creating your content easier.
Album Pages: Add albums or music to your website.
Events Pages: Create and manage an events calendar.
Gallery Pages: Display images or videos.
Part V: Creating Custom Design Tweaks
Occasionally you may want to make a design tweak to a specific element of the site that isn’t available in the ‘Style’ section of the Squarespace backend.
You have a number of options available:
Custom CSS Editor - Modify fonts, colors, and backgrounds. CSS shouldn’t be used for layout changes such as padding or positioning.
Embed Block - Embed content from external sites that use the Embed standard.
Code Block - Add code within a page’s layout. For example, you might use a Code Block to embed a video or add a widget to a Layout Page.
Code Injection - Add site-wide code by injecting it in your site’s header or footer.
CSS or HTML tweaks can sometimes clash with code already active on your website design.
Not sure where to start with HTML tweaks? Here are some blogs:
Part VI: Looking for more help?
Squarespace have a great help centre that really go in to the minute detail about using the platform.
You can access it here: https://support.squarespace.com/hc/en-us
If you’re keen to learn even more on how you can leverage your website to launch some complex marketing campaigns, have a look through these free short courses:
Boost your Marketing with Facebook Pixel
Reach and Frequency Buying:
Plan Reach and Frequency Campaigns:
Facebook & TV:
Google Adwords Certification:
Google Adwords Fundamentals:
Google Ads Display Certification:
Google Ads Search Certification:
Remarketing Lists for Search Ads:
Activate Customer-Centric Marketing: