Small details in your Squarespace website design to unlock

Squarespace has so many features it can be overwhelming to try to master them all. Here are few that really can make a difference in your design.

  1. Focal point on background/banner images: Do you know that you can adjust the focal point on a large scale background image? That means you can shift where the center of attention is. Why would you want to do this? First, this can help with your mobile view. Suppose the subject of your banner image is cut off on mobile view. Simply open your image editor and find the white circle in the middle of the image. Drag and drop it to adjust your focal point. Enjoy the What You See Is What You Get editing of Squarespace and find a spot that orients your image the way you want. Click the mobile view on the top right corner of your screen to adjust that too.

  2. Image cropping to the same aspect ratio: Suppose you have a page with a list of services. The images you are using may be different lengths and widths throwing off the symmetry of your page. The easiest way to solve this is to crop all three to the same aspect ratio. For example, if you crop them all the 1:1 (square), they will sit on a row evenly. How do you do that? Click on each image’s editing feature and choose Edit underneath the image. Find the crop feature and crop every one of the images in the series to the same preset ratio. Now your images will line up evenly.

  3. Don’t forget the Favicon: Don’t leave the default Squarespace block icon in the upper left hand corner of your browser. It's a small detail that separates a pro site from an amateur one. Click on Design and find Browser Icon. Crop and image you want to use from your brand to 16x16 pixels and it will render perfectly.

  4. Site wide animations: If you want to add a subtle dynamic effect to your entire site, you can enact a range of animations in the Design section of your site by navigating the main options. Scroll down to animations and pick one that suits your style.

  5. Parallax is back: A feature that was a favorite in 7.0 and was temporarily discontinued in version 7.1 was the parallax scrolling effect on background images. Now just select Parallax from your background image effect options and you’ll get a smooth look where the image stays fixed between sections as the user scrolls down the page.

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

Alternatives to having your own photos for your Squarespace website

Next
Next

As a Squarespace website designer I support free speech but…