Means-of-Production

View Original

Why You Need Image Alternative Tags on Your Squarespace Website

Alternative Tags Are A Squarespace SEO Best Practice

Adding images to your web pages and blog articles prompt people to read what you've written and are instrumental in getting prospective clients to click through to your project portfolios. Exceptional images can also be used to help describe the topics you are writing about. For search engine optimization and to help the visually impaired, you should always remember to give your images a descriptive, keyword-rich alternative tag.  Alt tags help to clarify your message, proved information search engines, and improve the accessibility of your website. 

The term “alternative tag” is commonly abbreviated to either "alt tag" "alt text" and is also known as an "image tag". Alternative tags are the text associated with an image that websites visitors see when their cursor hovers over it. Screen readers vocalize this text to help for visually impaired website visitors understand what your image is showing. It is imperative that every image on your website should have an alternative tag. If you don't take this simple step visually impaired people will not know what the image is about and your page will suffer from a lower PageRank in search engines. I like to think of this as a bit of SEO karma.

How To Write An Alternative Tag

The alternative tag of any image on your site should be a description of what the image depicts or alternatively, describes the function of the image on the page. It is also very important to include the seed keyword you are using for SEO on that page. As an example, if the image is a photograph used in a portfolio of a kitchen project, the seed keyword might be "kitchen remodel" and the alternative tag might be "Contemporary Kitchen Remodel, Madison, WI". If you are using a graphic image as a call to action for a downloadable guide, the alt tag should say: “Download Button For Our Kitchen Remodel Guide.”

How To Add Alternative Tags to Images on Squarespace

Alternative tags help search engines identify the content of a page because search engine crawlers can only read text. Adding alt text to images lets search engines understand what the image is so they can include it in relevant searches. When adding alternative tags, use short descriptive terms about the image. It is important that the alternative tag relates to the written content on the page. In some website browsers, the alternative tag is displayed in place of the image. Adding alternative text to the images on your website will help your website get found in search engines and contributes to a higher Google PageRank.

Alternative Tags For Squarespace Page Thumbnails and Image Blocks

On Squarespace websites, you can add alternative tags to page thumbnail images, image blocks, gallery page images, gallery blocks, product images and cover page images.

Page Thumbnail Images
Alternative tags can also be added to the thumbnail image on your web pages. In this case, the file name will act as the alternative tag. Keep this in mind before uploading your image to your site. no one has ever used the search term DCS19876.jpg. Give the image a description that includes a keyword. As an example, kitchen-remodeling-madison-wisconsin.jpg. If you don't manually add an alternative tag to an image, the image's file name will serve as your alt tag. For thumbnail images that appear as blog post banners, the blog post title serves as the alternative tag.

Adding Alternative Tags When Using Squarespace Image Blocks In Your Page Content

The way to add alternative tags to an image block depends on the image layout you choose. The Squarespace image block allows you to choose how your image and caption is displayed. Your options are Inline, Poster, Card, Overlap, Collage, and Stack. Learn more about image blocks by clicking here.

Inline Layouts
Captions added in the Inline layout automatically become alt text for the image when you choose "do not display caption". Follow these steps to add an alternative tag:

  1. Add the caption text.

  2. Select "Do Not Display Caption" in the design section of your image features box.

Note: If your image is set to open in a lightbox, the caption will always display.

All Other Layouts
For all other layouts the captions don't become alternative tags unless you add a caption by switching temporarily to the Inline layout:

  1. Open the image editor by double-clicking on the image block.

  2. Click on "design" at the top of the editor

  3. For blocks on regular pages choose the "inline layout".

  4. Set the caption to "caption below".

  5. Click "write here" below the image and add your alternative tag in the caption box.

  6. In the image editor, switch back to the layout you want. (Poster, Card, Overlap, Collage, or Stack)

  7. Click "save".

Please note that styling and editing the two text fields on the image block will not alter the alternative tag. If you need to edit or change the alternative tag, switch temporarily back to the Inline layout.

Adding Alternative Tags When Building a Squarespace Gallery

Gallery Pages
To add an alternative tag to an image in a gallery page follow these steps:

  1. Click the "Gallery Page" in the Pages panel.

  2. Find the image to edit, hover over it, and click the configuration gear

  3. Add your alternative tag in the "Image Title" box.

  4. Click "Save".

Gallery Blocks
To add alt text to an image in a Gallery Block:

  1. Double-click the "Gallery Block" or click "Edit".

  2. Find the image to edit, hover over it, and click the configuration gear

  3. Add the alternative tag to the "Image Title" box.

  4. Click "Save".

Note: Text added to the description box in gallery pages and gallery blocks will not act as an alternative tag. 

Cover Pages
To add an alternative tag to a cover page image:

  1. In the cover page menu, click the "Media" panel.

  2. Hover over the image and click the "configuration gear".

  3. Add the alternative text to the "Enter Alternative Text" field.

  4. Click "Save".

Product Images
To add alt text to a product image on the Product Page:

  1. Hover over the product and click "Edit".

  2. Find the image to edit, hover over it, and click on the "Configuration Gear".

  3. Add the alternative text to the Image "Title" field.

Alt Tags and Image SEO on Squarespace

Alternative tags are a must for proper search engine optimization on a Squarespace website. They help your images get found in image search results, help the visually impaired better understand your webpage, and add additional seed keywords for better SEO. If you have any questions about adding alternative tags to your website, please schedule a call. I'd be glad to help.

Website SEO Advice From A Squarespace Designer

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.