We live in a highly visual world, making clear beautiful images is an absolute must on your website – in landing pages, blog posts and all other pages of your site. Images make your webpages much more appealing but many law firms and other small businesses overlook the power image optimization has. Without proper optimization, you’re wasting a valuable asset. Proper image optimization creates many advantages such as a better user experience, higher ranking opportunities and equally as important but rarely mentioned, a faster page load time.
Website speed is a crucial ranking factor most law firms ignore but research shows, for ever second delay there is in your website load, there is a 7% decrease in conversion rate. This is often due to large file sizes, with images being the main culprit. Below we highlight some of the most important image optimization tips you can begin implementing right away! If you hired an experienced digital marketing agency to maintain your website, make sure to bring this up with them and ensure they’ve optimized all of your images to it’s best ability.
Tip #1. Use Original, High Quality Images Whenever Possible
Although high quality, stock images won’t help your SEO. Too many law firms sites are cluttered with the same generic stock photos which doesn’t make you stand out from the competition. Additionally, it makes it difficult for you to show up higher in an image search since you’ll be competing with others using the same image. Think about yourself, your law practice, your employees and determine how you stand out and find images that demonstrate that. For example, your “About Us” page needs pictures of your team, not the same image of a business man smiling like this found on many websites:
You don’t have to shell out a fortune to hire a professional photographer. Our smart phones have evolved so much that our camera capabilities are good enough to take photos that are deemed acceptable enough to include on your website. If you must use stock photos for whatever reason, avoid certain cliches such as:
- Courthouse Steps
- Customer service representatives
Most law firms websites lack any imagination when it comes to imagery. Certain stock photos are so overused that the message because meaningless. How would a visitor remember yours from your competition? Again, think about your practice and find a different way to represent your idea in a unique way. Some alternatives to photos could be illustrations, graphs, infographics and for a more friendly approach, animated GIFs. Animated GIFs are not only very popular these days, it shows your humorous and friendly side. Though, it’s important you apply GIFs in a balanced way. Don’t overwhelm the post with too many GIFs that readers get distracted.
Tip #2. Use Captions and Alt Text
Although different in functionality, captions and alt text are both important. “Image is worth a 1,000 words” but not for Google’s crawl bot who can’t discern what the image is about. That’s where the “alt tag” comes into play. By providing keywords and snippets about the meaning of the image, Google is able to understand what the page is about and is therefore able to rank it better to appropriate search results.
Additionally, an alt text is an alternative to images when a browser can’t display them properly. If, for some reason, the browser is unable to load the image, there will be an image box with the tag information. In order for a website to be considered 508 compliant The Americans with Disabilities Act requires alt text for individuals who are unable to see the images themselves.
A caption is similar to the alt text but is visible to the site visitor in a grey box under the image. Because we have a short attention span, we tend to scan an article – only capturing headings, images, bold text and anything else that stands out. Image captions are another such element that people tend to read. In fact, according to KissMetric, image captions are read on average 300% more than the content copy itself.
Not all images need captions, especially for law firm websites. Photos such as the cliches mentioned above (gavels, courthouse steps, handshakes, etc) do not need a caption for the site visitors. But captions are especially helpful in blog posts covering topics like court cases you won, recent news and other topic-specific posts. You should add a caption if it would make sense to the visitor to read one but keep some things in mind:
- Describe the image in plain English – no complex legal jargon
- Do not keyword stuff your alt tags
- Do not use alt tags for decorative images as search engines could penalize you for over-optimization
Decorative images are images that don’t add information to the content of the page such as:
- Visual styling like borders, spacers and corners
- Illustrative of adjacent text but not contributing information
Tip #3. Add Open Graph and Twitter Card Tags for the Image
One of the main goals of having a blog is to share the content as much as possible. If you want to control the image that’s used when your content is shared on social media websites, you can do so with a simple HTML code snippet in the <head> section that looks like this:
<meta property=”og:image” content-”https://mylawfirmexample.com/example-image.jpg” />
This guarantees that image will be displayed when shared on Facebook. The Open Graph Protocol is recognized by all major social platforms including LinkedIn, Google+ and Pinterest.
It will pull the headline, description, image and any other elements indicated in the Open Graph tags:
|Open Graph Tag||Description of tag|
|og:title||Title or alternate title of page which displays as the headline|
|og:url||URL of page|
|og:description||Description of the page, 300 characters max|
|og:image||URL of unique image, recommended 1200×630 pixels|
|og:type||Article (otherwise defaults to “website”)|
Twitter cards play the same role as Open Graph with specific markup. If you use WordPress, there are plugins you can set up and edit within the dashboard so you don’t have to hard code any of it.
Tip #4. Choose the Right File Name.
It’s really easy to keep the default name your camera gives it such as DSC4972.jpg but it’s highly discouraged. When it comes to SEO, using the targeted keyword in the file name helps your web page rank higher on search engines. Again, because Google can’t interpret what the image actually is, it takes various cues such as alt tags and file names for help. You want to tell Google what the image is about. For example, if your blog post is about a recent case you won and it includes a photo of a court hearing, make sure the file name includes elements specific to the case.
Creating descriptive, keyword-rich file names is crucial for image optimization.
Tip #5. Use an Optimal File Size
Loading times are important for a friendly user experience and SEO ranking. Images are often the main cause of slow loading times especially when you load a huge image and show it really small. The overall size of the image should only be as large as you need it. For example, if you’re displaying an image in a 250×150 pixels size, do not upload a 2500×1500 pixels image. Scale the image to the size you actually want to show it as.
If the speed of your site needs improvement, consider reducing the file size. But make sure you don’t reduce the quality. The best way to do so is within Adobe Photoshop’s “Save for Web” functionality. The “Save for Web” feature allows you to experiment with various file types. To access it, go to File > Export menu and test out the time it will take to load at various modem speeds. If you don’t have Photoshop, there are many other tools out there to resize and compress your images. Just make sure the image doesn’t lose any pixels and doesn’t become distorted as you compress the size of the file.
Tip #6. Make Your Images Responsive
You’ve heard how important it is to have a responsive website and images are just as important. Unresponsive images will ruin the mobile experience and subsequently increase your bounce rate. If you’re using WordPress versions 4.4 and higher, your site will automatically scale the images according to device screen. If you’re not using WordPress, you’ll want to use a few HTML attributes:
- srcset attribute
- sizes attribute
- picture element
Tip #7. Use an Image Sitemap
Google introduced the Sitemaps protocol so web developers can publish lists of links in order to crawl and index them. You can submit your XML sitemap directly or alternatively, but highly discouraged, just wait for search engines to find them. Regularly submitting an updated sitemap when new pages are added to your site allows search engines to find and index those pages much faster than finding them on their own. Having an image sitemap is just as important, especially for attorneys. In fact, Google clearly says:
“To give Google information about images on your site, you’ll need to add image-specific tags to a sitemap”
Going through all the previous 6 tips highlighted above is futile if you don’t tell Google about it! Make sure you add an “image-sitemap.xml” and all the necessary information. Use specific tags to tell Google when new images are added. Google lays out the guidelines for creating a Sitemap with image information.
There are a lot of intricacies in a website and SEO in general is a sum of a number of elements. To summarize, make sure you
- You use original, high quality images whenever possible
- Use alt text and captions with targeted keywords
- Pick the right file name with the keyword within it
- Add open graph and twitter card tags
- Use an optimal file size for faster loading
- Make the images responsive
- Add an image sitemap
- Add the proper alignment of images within your content
- Beware of your decorative images – do not use the most popular legal stock photos
- Use srcset if possible
Besides direct SEO value and great user experience, images can play an important role in conversion! If you feel you images could use some optimization, implement our tips above and let us know if how it helps your website.