Using Squarespace To Build Portfolio Based Construction Website

June 8, 2016 Michael Conway

Using The Squarespace Website Builder To Create A Portfolio

If you're like many construction companies, you probably made the transition to marketing your business online several years ago. Your website was useful when you first published it, but it may not be showing your work in its best light, and the sites SEO is lacking? So, you've got to ask yourself, is your site able to compete with the highly designed professional websites of your competitors?

Your website needs to represent precisely who you are, what you do, and work to develop your brand identity. Your site should feature a photography gallery of your past work, along with testimonials from previous customers and a blog to drive traffic and improve your search results to help you get found.

While you're probably a talented contractor with years of experience that gets the job done, you're most likely not a web designer. Hiring an outside designer can be expensive and can take weeks, even months to get you up online with your new website design. Enter Squarespace!

What is The Squarespace, Website Builder?

Squarespace is an online website builder consisting of a content management system, built-in style editor, a blogging platform, and a hosting service. Because they offer template based “drag and drop” website design, there's no need to learn code to produce professional results. The website builder is extremely easy to use which means you can concentrate on writing great content instead of updating plug-ins. The built-in intuitive platform allows you to create a visually stunning portfolio website that includes architectural photography, keyword rich text for SEO, and launch your site in a couple of weeks, not a couple of months!

Squarespace templates are all responsive design sites that are mobile ready and offer easy navigability and built-in SEO functions to help your site get found online.

Step One: Select A Squarespace Template

Choosing a template may be the hardest part of building a construction portfolio on your site. Squarespace offers a wide variety of professionally designed website templates that are all mobile ready and feature artful galleries specifically to feature visual content. Templates allow you to show off your work while keeping your design modern and professional in appearance. The built-in navigation is intuitive and allows the use of tags and headers in the drop-down menus that can be used to aid in SEO. We love the Brine template. Brine offers more options then most other Squarespace templates and its banners allow for complete customization with all of the Squarespace content blocks. This site is built on Brine. If you need additional advice on which template to choose, click here for in-depth information on choosing a Squarespace template. To see examples of construction sites and the templates they were built on click here for our portfolio of Squarespace websites.

Each Squarespace template has content blocks that can display photographs, galleries, quote blocks, text and a whole lot more. When choosing a Squarespace template, disregard the page layout all Squarespace pages can be customized. Instead, concentrate on the features like banners, footers, index pages and the different functions each template offers. There are three primary ways of showing image sets on Squarespace.

Index Pages - Offer unique ways of displaying images. For example, the template called “Flatiron” allows you to create thumbnail galleries to organize pictures into a cohesive presentation that is perfect for highlighting your latest construction project.
Gallery Pages - Galleries are available in every template with distinct variations. Depending on how you'd like to present your visual information, gallery pages can be used to index pages or separately. Gallery pages are very flexible and offer many ways to structure your site.
Gallery Blocks - Gallery blocks offer four ways to show images including slideshow, carousel, grid, and stacked images. Blocks can be used in any page, blog post or another content area. It's a perfect way to add motion to your site.

You can also use a regular page with a series of individual image blocks. This is useful on project pages where you want to add descriptive text between image blocks.

Step Two: Build Your Portfolio and Project Pages

A portfolio should be structured to have more than one page. Most of the construction websites we design have a link titled Portfolio on the home page that takes visitors to a first tier page that shows project by type such as Kitchen Design, Bathroom Design, Finished Basements, etc. The first tier page has images of each category that link to a second-tier portfolio page that has photographs of all of the projects in a particular category. As an example, this second tier page would have a set of single images of all of the kitchens you are featuring on your website. Images on the second tier page will be linked to the individual project pages. This is the third step in the journey or tier three. Building a construction website portfolio following this information architecture strategy as opposed to putting all of your images on a single page will improve SEO. This is because the page load speed is faster and you have a more significant opportunity to use keywords you want to be found for in search engines. The use of a three-tier portfolio is also easier for visitors to navigate, it's scalable when you add additional projects to your site, and it allows you to feature more images on your site. Here's a more in-depth explanation.

Follow These Steps To Build Your Portfolio

1 - Create A Tier One Portfolio Page with Categories - Create a regular page titled portfolio in the main Navigation section of the Squarespace Pages section. On this page add a text block with an H1 title and another with a description of your work. Then add a gallery block with images titled "Kitchen Design," "Bathroom Design," "Finished Basements" etc. Each image in the gallery block will link to a second tier page with images of each project in a category. Don't get hung up on the categories listed here; you can come up with your own or remove this step if you only have one area of specialty. To do this, create a folder named portfolio in your main navigation section and drag the tier two pages into it. This will create a drop-down folder from your main navigation that includes tier two pages.

The pages below should be placed in the Hidden section of your website builder.

2 - Create A Set Of Tier Two Pages With Representative Images - Create a set of pages that have one image of each project. So, sticking with kitchens, create a page with a title, description, and a gallery block of kitchen images from your projects. You can also break them down further by creating multiple sections on your page with titles and gallery blocks that show all of the kitchens by type. A section on the page could be "New Kitchens," Another section could be "Kitchen Remodeling" etc. Give every image on this page a project name in the image settings like "Contemporary Kitchen Remodel Printers Row Chicago, IL." Following step three, you will link each tier two image to a new project page.

Step Two Alternative - This page can be built as a gallery page or using a gallery block on a page, but I suggest creating a regular page with a summary block that pulls images from a hidden gallery page. This takes a bit more work than a simple gallery page, but we recommend it because it offers many more options for adding additional blocks like calls to action buttons, testimonial quote blocks, and a description of the particular service/ type of projects featured on the page. Lastly, it doubles the number of pages you have which increases your odds of getting found online. Just remember that if you're using a hidden gallery page, build the page so that it looks good. If you're using the Squarespace Brine template as an example, add a banner, and descriptive copy with you're keywords.

3 - Create Multiple Project PagesThis is Tier Three - For every project image on your tier two pages, create a regular page also called project page. Give the page the title you used for the image and build the page using image blocks, text blocks and gallery blocks. This is where website visitors get to see each individual project. It's a best practice to be specific about the work that was done and to add brand names like Wolf Sub-Zero Appliances or Sierra Pacific windows.

4 - Create All Of Your Links - Starting with the page titled "Portfolio" created in step one - tier one, link your images to the pages you've created in step two. As an example, The kitchen image titled "Kitchen Design" will link to your Kitchen Design page and your "Bathroom Design" image will link to your bathroom design page. This is done by clicking edit on the image and creating a link using the content drop down in the design section. Once completed, move to the next tier and create page links from your portfolio of project images to your project pages.

Adding SEO Friendly Text To Portfolio Pages

When adding text to your construction portfolio pages be sure to include the keywords you want your site to get found for in search engines. Using keywords in your URL, Page Title, H1 H2, and H3 headers and at a 1.5% insertion rate in your copy, as well as the captions of all of your images, is critical. Hiding your image captions ensures search engines see them as alternative tags. Click here to learn more about captions and alternative tags.

Resizing Images For Your Website Portfolio

It is also important to size your images for the web. Squarespace recommends that your photographs be 2500PX wide and no larger than 500kb. This is an appropriate size for full-bleed banner images, but you should size them smaller for your portfolio. I'd recommend 1500 px wide at 350kb. Remember smaller is better so experiment by sizing small and working larger. Adobe Photoshop Elements is an exceptional tool for image optimization. It has a save for web feature that makes resizing images quick and easy.

A Squarespace portfolio website is the perfect vehicle for promoting your construction firm. With a full set of analytics, you'll be able to track who is visiting your site, how long they stay, what they are interacting with, and capture their information for further marketing efforts. If you're looking for the perfect content management platform to grow your business, check out Squarespace, and if you need help with that website, you may want to use our website builder consulting service. Click here for details.

Additional Articles On The Squarespace Website Builder

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.