In this tutorial for beginners, you will learn 9 Squarespace web design and UX tips so that no one will ever know you built the website yourself.
Download the FREE and fillable website design checklist👇
https://www.clintmally.com/squarespac...
Check out the full list of courses👇
https://www.clintmally.com/squarespac...
Best Practices for User Experience and Design With a Squarespace Website
Avoid these key rookie mistakes that let people know your site wasn’t built by a professional. Master this simple checklist and no one will know the difference.
Also, all of these tips will improve functionality and make your website as user-friendly as possible.
Make Sure Your Navigation is Simple and Clear
Websites are great places to express creativity, but your header menu is a bad place to be creative. It’s a map. We generally don’t like visually creative maps.
In general, only have 5 or fewer navigation items.
Don’t name your blog “ramblings on life.” Just call it “Blog.”
Keep the letters to a minimum. This is important, especially because your menu bar gets condensed on mobile.
The shorter your words, the better.
If you absolutely have to, you can use a drop-down submenu on an item, but even this should be kept very simple.
Anything else that is important but is not linked to the primary and secondary goals of your website can go in the footer.
There are some things that need to go in a footer, like your privacy policy or terms of service. More on this stuff later.
Use a Button at the Top Right of Your Website
Use a button for your primary goal at the top right. Studies show that the first thing our eyes are drawn to is the top right of a website. Then our eyes scroll left, then to the middle.
Use a Search Bar in Your Footer Navigation
This is great for a few reasons. Generally, it’s helpful to the searcher to be able to find stuff on your website.
Also, as you get more and more traffic to your website you can go into Google Analytics to see what people are searching for on your site.
This will allow you to:
Get to know your customer more.
Answer common questions ahead of time on your site.
Display content that more aligns with your visitor’s goals.
Make Your Squarespace Website Photo Quality Great, Even If You Are Not a Pro Photographer
If you have professional photography, awesome. Use it.
If you are like most people that don’t, then you are going to have to get creative.
Use Stock Photography… Smartly
If you are using stock photography from free websites like Pexels or Unsplash, then try to use photos from the same photographer throughout one page.
Modify photos in Canva to make them more interesting. I walk you through this step by step in a later design course.
Create a transparent background and swap the background or create a collage.
Use shapes or frames for photos.
Change the colors of photos.
Use photo overlays or filters like ones on Picsart or BeFunky to create an animated or unique look.
Opt out of photos altogether and just use shapes.
Use clipart or graphics like the ones on Undraw to display art in a consistent way without a single human model.
Keep Your Photo Image Size Below 500 KB
Large photo sizes for image blocks or backgrounds are the number one thing that slows down site load speed of a website.
In general, a PNG is a larger file size than a JPEG.
Make sure any image uploaded to your Squarespace website is under 500 KB, but still remains crisp quality.
An easy way to do this is to run your photo through TinyPNG.com. They’ll compress the file, and you can see the sizes of the original and the compressed versions.
Make Sure Your Image and Text Don’t Clash
It’s important to make sure that people can read your text and that you use contrasting image and text colors. There are a few ways to accomplish this:
Change the image or the text color.
Blur the image or background.
Change the focal point of an image.
Again, more on this later in the course, but it’s good to be thinking about now.
Make Your Opt-in Pages Simple and Direct
An opt-in or a landing page is a page that has one goal, usually tied to your primary or secondary goal. It’s the finish line, it’s the place where someone is going to decide whether to buy your product or service or not.
Have one call to action on this page and repeat it multiple times.
#Squarespacewebdesign #Squarespacetutorial #Squarespace