Squarespace Box of Tricks: Master Website Builders in 2023

We are going to hit the rewind button, go back to the very beginning, and look at how we can develop a quick and simple website using the basics within Squarespace. CHAPTER BREAKDOWN: 00:07 Intro - Beginners Guide 01:10 Pick The Right Gear, Why choose Squarespace? 05:00 Let's Get Started 05:20 Choose a Template 07:50 Content area 'WYSIWYG' (What you see is what you get)

GET A 20% DISCOUNT FROM YOUR FIRST ANNUAL/MONTHLY SQUARESPACE PLAN.

Simply follow the steps below:

1. Create a free trial in Squarespace by following the link below:

https://squarespace.syuh.net/pixelhaze

2. When subscribing to your first plan, use our voucher code to get a 20% discount on your first month/year plan: PixelHaze20

ABOUT THIS SQUARESPACE BEGINNER'S GUIDE

For this mini-tutorial, I want to tap into the seven years I have been working with Squarespace, probably creating over 300 websites and somewhere between two and 3000 websites over my 20 years in the web design industry.

Here, I want to show you how you can get the foundations right to ensure that you are not making simple mistakes that could cost you in the long run. We are going to create a new trial website in Squarespace, stripping it right back to the bare bones and then building our page scaffolding to get you up and running and moving along the right lines.

We first need to make sure we're selecting the right equipment for the job at hand. I have used an analogy I like to use regularly, which is your three different models of cars. First up, you have your family hatchback. This is the most reliable and easiest to learn of the three different vehicles. You do not need an advanced licence to be able to get yourself from A to B. And that is where our website builders fit in really nicely. We then move on to our custom-fitted high-performance sports car. It allows a degree of flexibility and you don't need to be an expert racing driver to be able to handle it. But at the same time, there are pitfalls, and there are things that you need to be mindful of when getting behind the wheel. This middle option would be software like WordPress, albeit you can pick a template and keep it very simple.

The moment you start modifying WordPress, it can be more complicated to use. Then we move on to the other end of the spectrum and we have our elite performance, Formula One car. The metaphor here is comparable to how leading agencies will deliver projects, here, you can expect Elite Performance in a very competitive market, but the flipside is paying for that benefit. So let's have a look at option one. Website Builders, these are the simplest, and the difficulty will scale with you. For this example, we are going to use Squarespace, mainly because that is what the course is all about. With Squarespace, there is a huge list of tools for your toolkit, features that allow you to build up your pages with a considerable amount of flexibility. That is a considerable selling point for many of the very good website builders available.

You will find everything under the hood. Where Squarespace will keep control of aspects like the hosting, management of domain names, and lots of other technical requirements like making sure you've got an SSL certificate active, so you have a secure website. This all happens within Squarespace directly and without you needing any sort of technical understanding. Affiliate notice: We have an affiliation with Squarespace and may receive a commission should you purchase a Squarespace plan via the above link.

Here is a full breakdown demonstrating how we have refined our entire workshop process to rapid prototype web design whilst retaining quality.

If you are not a professional designer, our PixelHaze Principles of Design are the perfect starting point to understand the basic, but incredibly important building blocks of graphic and web design. If you are a well-seasoned designer, you can skip this chapter, but you might find some of the aspects serve as a helpful refresher.

A breakdown of the differences between vector and bitmap images, and where to use them.

Here's a quick chalkboard session outlining how almost all modern websites are built on the 12 column grid and why it is so important for responsive design. We'll also provide you with some tips demonstrating how you can work with the grid within Squarespace.

Here are some tips to get you up and running with your Squarespace website. This chapter is from our free Website Blueprint course.

We will take you through the process of converting a short set of brief notes to a simple website sitemap.

Organise your homepage content and signposts into 3 tiers of priority.

Now that we have our quick web design brief, we can now proceed with the wireframe process.

This is an optional step, but one we would recommend as it will save you time in the long run. We use Canva (free and available within the browser) to create a simple brand style guide to keep you on track and on-brand throughout the remainder of your project.

No, housekeeping isn’t exciting, but it is necessary! If you've been passed the reins of a Squarespace website after it's been built, then this hyperdrive chapter will be especially useful for you.

In this chapter, we're going to cover:

• How we can set up a new website on Squarespace.

• Three different methods of accessing your website admin area.

• How we can add and remove users in Squarespace.

We are going to tackle the wireframing process using two approaches, the traditional chalkboard and one of my preferred iPad apps, iMockups.

Now we have a wireframe to work from, we can proceed with building the page on Squarespace. We will introduce you to some of our tried and trusted techniques, along with one or two new features.

A cookie banner is a legal requirement here in the EU, thankfully Squarespace has done the legwork so adding and editing a cookie banner is now a simple process. This chapter will talk you through this process from start to finish.

This is a feature that becomes more useful once the website is up and running. Through this very short chapter, we will demonstrate how you can now tag popular areas within the admin to the main menu (visible when you initially log into Squarespace).