Hack your website: A Guide to Manipulating Text

In the first of our Hack Your Website series, Sky showed us the new Highlighted Text features in Squarespace. In this video, Jude introduces more ways to manipulate text in your Squarespace website blog or on any page of your website.

Jude shares tips on changing the colour of text, working with line breaks, autofill text and text block backgrounds.

But before you jump in and change the colours and backgrounds a word of caution about readability, legibility and accessibility.

Readability, legibility and accessibility are critical components of effective design.

Readability refers to how easy it is for readers to understand the text they are presented with. This means creating content that is straightforward and simple to understand; however, it also involves incorporating visual elements such as white space, fonts, colors, and graphics that make reading more enjoyable.

Too many colours or too many colour changes will create a kind of ‘blindness’ in your web visitor and rather than make a concept stand out, can make it disappear completely.

Legibility refers to how easy a font is to read from a distance or at various sizes on different devices. The best way to ensure legibility is by using sans serif typefaces in larger point sizes; for example 16px or larger for web-based designs and 12pt or larger for print designs. Additionally, lines should not be too long; break them up into smaller chunks whenever possible as this helps make them easier to read.

Accessibility relates specifically to making sure everyone can access your design regardless of their physical abilities or technological limitations such as screen size or color blindness. This means paying attention not only to contrast ratios but also color schemes (avoiding combinations like yellow on orange). Additionally, pay attention to how users are interacting with your design—are there keyboard shortcuts available? Are all elements labelled correctly? These details can make a huge difference in terms of accessibility!

How to Manipulate Text in your Squarespace website with Jude Goodwin from Goodwin Creative Web Design Vancouver BC