1.) How many typefaces should you have on your Squarespace sites?
I’d say 2. Many people could argue with all the options within Squarespace; we should have more than that. Great power comes with great responsibility, which is a good line to use here. In web design, there are many options, but the saying Keep It Simple Stupid is a good guideline with web design as a whole but is particularly relevant when it comes to typography on the web. I say two typefaces, but that doesn’t mean two different options. By using different weights within the same typeface, you keep consistency and increase the number of options you have at your disposal.
2.) Serif and sans serif
A great starting point is to go with a serif typeface and a sans-serif typeface. With your headings in serif and your body copy and other elements, such as a list, in a sans-serif typeface. Many successful and beautiful Squarespace sites follow this pattern, and it works really well for them and their sites. The serif can be on the headline or the body copy. There is no hard and fast rule here. Some beautiful combinations can come from having a serif and sans serif from the same family. In the below example, I use Adelle PR (a serif font) and Adelle Sans (a sans serif font). They just work so wonderfully well together.
There is a lot more to accessibility than text and background colour, but it’s a good start. People with vision issues, partially blind or even have poor vision issues benefit greatly from having a good contrast ratio between colours. Using a colour contrast checking tool, you get a score on how much actual contrast there is between the text and background colour. The maximum score you can get is 21, that’s with pure black and pure white.
That concludes this part 1 of the series. Hope you took something away from it. Look out for parts 2 and 3 in the upcoming weeks.