How To Build A Search Engine Optimized Portfolio on Squarespace

How To Build A Squarespace Website Portfolio.

Increase SEO With A Squarespace Portfolio Using Multiple Pages

Building a Squarespace gallery portfolio that is search engine optimized requires that you think holistically about your site. Before you begin building pages it t is important to understand how prospects navigate your website's page structure, when and where to use gallery pages and blocks, and the placement, quantity, and value of the keywords used in the written content on your site. My clients are architects, interior designers, design-build and landscape firms and almost every one of them has expressed an interest in using as little text as possible and "allowing the work to speak for itself". I understand this desire but the problem with favoring the design choice of clean, text free web pages over portfolio pages that have descriptive text is that they are practically invisible to search engines. It doesn't help that certain Squarespace templates that use galleries pages as primary pages are promoted as ideal for portfolios by Squarespace. They are not. If you are using a Squarespace Gallery Page as the primary page to show your work, you will have a more difficult time ranking in search engine results pages because they simply don't allow for enough text or the proper title tags. Beyond the SEO disadvantages of gallery pages, they also don't help with your top-of-funnel sales goals. Without descriptive text, the page becomes just another image based website that offers little insight into your process. When building portfolio websites for built environment companies I prefer a structure that follows a "Buyers Journey" form of information architecture.

View Our Portfolio Of Squarespace Websites

This article will guide you through the most important elements to consider when building a Squarespace Website gallery portfolio. The information provided is Squarespace specific and not intended if you use Wordpress or another website builder. We will look at,

User Experience - Creating a Portfolio Page Structure and Gallery Page Layouts
Choosing a Squarespace Template for Search Engine Optimization
How To Create Alternative Text or Alt Tags on Squarespace
Page Load Speed and Squarespace Mobile SEO
Sizing and Formatting Images For A Squarespace Website

Learn how to build a Squarespace Landing page

Creating A Portfolio Page Structure

Portfolios that have all of your work on a homepage slider gallery is a terrible idea. They are SEO killers because if they are high-resolution full-screen images than you’re page speed will be slow. Slow loading pages will ensure your site goes unseen on mobile devices. Image portfolios usually have very little text and they require visitors to scroll through images rather than allowing them to choose what they want to view. A rotating, carousel style gallery doubles your visitor's frustration because they only have a few seconds to see your work before it zips away. Aggravating a visitor is a sure way to increase your bounce rate.

Thinking of your portfolio as a set of multiple pages in an outline format will help you organize your images by category and allow your prospects to view the projects that they are attracted to. The structure we like to see is a top navigation link to a page that shows all of your service based project categories with images. The images on this page should link to secondary project pages by specific services and those images should then link to tertiary level individual project pages that contain a gallery of 6 to 12 images and keyword rich text that explains the highlights of the project. Confusing? Here's a more detailed description.

Three Pages That Guide the Buyer’s Journey

Using a residential builders portfolio website as an example, you would want your top navigation portfolio link to take visitors to the first page in your portfolio. Here they will see images that illustrate your work by type of project such as New Homes, Home Remodeling, Kitchen Design, Bathroom Design, Outdoor Kitchens, etc. This page should include only one image–your best image– per specialty. Each of these pages would have search engine optimized text that describes your specific design service and what makes your firm unique.

Each image on the first page would link to a set of secondary pages where you have a single image of each completed project. One page with individual images for all of the new home projects and a different page for all kitchen design projects and so on. The individual project images should have the title of the project, a sentence or two and a location.

The images and text on the secondary pages should link to all of your project specific pages. This third level of pages is where visitors can view gallery of the project and read a case study of the work.

Still having a hard time imagining this page structure? Click here to download a pdf presentation with an easy to copy visual format with additional page layout recommendations.

Choosing a Squarespace Template

We only use Squarespace to build websites for lots of reasons but sometimes we disagree with the "anyone can build a website" marketing approach. Squarespace recommends the Avenue, York, Wells, Ishimoto, and Flatiron templates when building a portfolio based website. If you're looking to increase traffic to your website to attract new clients I can not recommend any of these templates unless you are blogging multiple times weekly or investing in paid advertising to attract new clients. Each of the above templates is designed to feature large images in a portfolio format and they are very easy to use by novice website builders but these features come at the expense of search engine optimization best practices.

Learn More About Templates: How To Choose a Squarespace Template Design For Your New Website

Our philosophy is that it doesn't matter how elegant your site looks or easy it was to build if nobody ever sees it. Even if you do use paid advertising to attract visitors, building websites with a content marketing strategy will get you better, more targeted results. This is why we prefer the Squarespace templates in the Brine family, the Bedford Family and Five. It should be stated that all Squarespace templates are highly customizable but starting with one of the above will give you the greatest out of the box control without having to resort to custom code to accomplish your goals. My personal favorite is Brine due to its vast amount of control, full-screen banner images and flexible on banner block location. It has a longer learning curve due to its options but its the template I've used for this website.

How to Create Alternative Text or Alt Tags for Images

The best way to think of alternative text is as a written description of the image. A more thorough description will help search engines better target your website in search results. Think about how you would describe an image over the phone to a friend. Using the residential builders example again, you can describe the photo on your kitchen renovation page as "kitchen remodel" or as "white kitchen renovation in a New England farmhouse." Include words that describe your work, where you operate as well as what's in the photo. There are some restrictions when it comes to alt text. Some screen readers cut off after 125 characters, so keep the alt text descriptive but brief. Don't bother including "image of" or "picture of" in the text. The way alt text appears in HTML it's already understood the text is referring to an image. Also, don't use alt text as a way to stuff keywords behind-the-scenes in your site or you risk getting penalized in search results.

In a Squarespace gallery, you can add alt text to an image by pulling up the gallery page in the Pages panel. Hover over a photo and click on the gear wheel to pull up the photo editor. Add text to the image description box and click Save. Any copy added to the description box below will not serve as alt text, only that in the title box.

Page Load Speed and SEO:

In July 2018, Google updated its ranking algorithm for mobile search, analyzing website load speeds on mobile devices. There is a push to get websites more mobile-ready and this is just one more step in that process. While it's only supposed to impact the slowest sites, no one wants their site to be downgraded because of slow load speeds. Thankfully Google provides an easy to use tool to test your site's load speed. You can try it here. It's just one more way to maximize SEO and make sure your site is as easy to find as use as possible.

Sizing and Formatting Your Images For Squarespace

One of the reasons Squarespace is my preferred tool for building websites is because it takes a lot of the work out of formatting images so they are optimized for various devices. When a picture is uploaded to your Squarespace website, it creates seven size variations of the photo to ensure it will display the way you want it to look on any device. In general, you will want to keep photo size below 500 KB, although photos up to 20 MB can be used. It may be tempting to load your site with beautiful hi-res photos, but this will likely slow down load times and prompt users to click away. Sites with large photo galleries may also have slower load speeds, even with photos that are under the recommended photo size.

Test your load time with Google's PageSpeed Insights and you'll have the option to let Google optimize photos, CSS and JavaScript on your page for you, providing a zip file to upload. While the CSS and JavaScript code might be a little advanced for those who are not tech-savvy, the images are optimized and ready to upload.

Squarespace has a number of ways to boost SEO while also providing your future clients with plenty of beautiful photos and useful content. Keep in mind, sleek, image-heavy sites may look nice, but they aren't doing your company much good if no one can find them. For more information on how to build an SEO-optimized site, please download our PDF guide, "Squarespace Website Search Engine Optimization Best Practices," which has additional information on this topic and many others that will help your company boost traffic to your site.

Additional Advice From A Squarespace Website Designer

Free Squarespace Website Review Delivered on Video

About Michael Conway and Means-of-Production

Means-of-Production builds Squarespace websites and writes blogs for built environment firms. Our websites are designed to attract better prospects using blog articles and inbound marketing tactics. We do this with exceptional web design, search engine optimization, landing pages and drip marketing campaigns. Interested in learning more? Click here to view my calendar and schedule a call.