Marketing Monday: How To Design A Homepage

40+ Must-Use Tools For Marketers, Website Developers, Graphic Designers & Writers

Marketing Monday: 5 Great Online Design Tools For Marketers

Marketing Monday: How To Optimize Images On Your Website

Marketing Monday: How To Get Free Images & Free Music For Blogs, Videos, Or Podcasts

Marketing Monday: How To Fix Your Website Based On A Google Lighthouse Audit

Marketing Monday: How To Run & Read A Google Lighthouse Audit

4 Ways Your Web Designer May Be Getting Images Wrong

The proper use of images – while only one facet of web design – is something that’s often overlooked until it becomes a problem. Whether it’s causing people to bounce off of your page due to unattractive image use, leading to trouble with your SEO due to poor use of alt tags or getting you into legal trouble by stealing images, it’s important to pay attention.

If you need assistance with web design or want advice on the use of images, let us know. We’d be happy to chat!

Image Alt & Title

1. Organize Images On The Page

When browsing online, you might open a new page and see an image half above the bottom of your screen and half below. This means the designer didn’t take into account whether the photo made it above the fold or not. Even worse is when the photo is below the fold, because there isn’t anything visual for the website visitor to grab onto.

It’s best to make sure you have one chief image at or near the top of your page or blog post to capture attention, and it should be completely above the fold. You can check this by viewing the page on a few different screen sizes – also, with mobile devices it’s acceptable for the image to not be above the fold due to the narrowness of the screen.

Then a second image or third can be added below the fold as needed to illustrate the purpose of the page.


2. Use The Alt Tag

An alt tag is a piece of data you attach to the image. It helps search engines understand what the picture is (since they can’t see) and it’s also helpful for the blind and hard of sight as they utilize assistive technology which reads the page out loud to them. Without an alt tag, it’s as if the image isn’t there or relevant for search engines (which hurts your SEO) and for the blind and hard of sight (which eventually will be a violation of the Americans with Disabilities Act).

An example of an alt tag would be “young-boy-rides-horse-in-meadow”.

If you leave the original name of the file – 51381238532351.jpg – or fail to describe the photo well – “boy-horse” – then you’ve gained nothing.


3. Use The Caption

A caption is a way of further explaining an image. While not always needed, particularly complex images which aren’t stock photos may need a caption. If the photo is of staff or a particular location, it’s important to identify the people or place properly.

The caption is also used to provide documentation of where a photo is from . . .


4. Source And Link Your Photos

Lastly, be sure source and link the photo back to it’s original photographer, unless you or someone you employ took the photo for your business.

If you take a photo off of the internet, you need to be sure it’s safe to use. Most photos out there belong to someone. You wouldn’t walk out and pick up a dog off the street to take home, because 99% of those dogs aren’t strays.

Certain websites will provide you with photos which are in the public domain, which means you can use them freely. It’s still important to note the web address of the source in the caption, and link back to it to cover yourself. The same goes for photos you may buy off of a service like Adobe Stock Images. While you own the photo, it’s still nice to make sure you’re covered incase anyone ever asks.

If you have any questions about designing your website or the proper use of images, we’d love to chat.