March 2022

Uploading Photos To A Website is as Important as Website Design

Website photos are an important part of your overall website content, and there are several reasons you should keep imagery at the top of your priority list while building a website. As technology continues to develop and proliferate the global internet, more people worldwide are using imagery to learn, remember and disseminate information.

 

USING IMAGES ON YOUR WEBSITE

Importance of Images in Web Design

Photographs add richness to your web design. They do so in two ways. The first is simply another way to clue search engines into how to interpret your content. The second is the human aspect or how people (not search engines) understand your website. Let’s break down what photos do for your site:

 

  1. A Picture Paints a Thousand Words

The adage that a picture paints a thousand words is not far off. People often get tired of reading words and skim through website pages. However, imagery both breaks up the printed text and offers context quickly for those you prefer to skim. A photo can momentarily pull the viewer into the scene they are viewing and help them understand the written text or replace it completely.

 

  1. Partnering a Photo with a Caption

Adding a caption to or inserting the caption within the photo adds value to the image. With a caption, the context of the photo is made clear so the visitor to your site doesn’t have to figure out what they’re seeing. Instead you’re offering them a full-color experience and guiding them to your point with the caption.

  1. High-Quality Photos are a Must

Especially when displaying products, professional photos are crucial. If you want someone to order a product from you, it’s important that they see it, preferably in three dimensions. This can be accomplished with several photos or in 360-degree photo. However, if you want to add some spontaneity to your photographs, you can add some personal photos or on-the-go shots to your blog or newsletter.

 

  1. Use Stock Photos Wisely

Stock photos can be used for general topics or city scenes, but it’s best to use professional original photos as much as possible on your website. You can also add captions to stock photos to personalize them for your content.

 

  1. Be Consistent

Your clients expect a high level of quality from your products; therefore you need to consistently offer the same high quality on your website including your photo content. If customers come to find hit or miss photos, they will be disappointed and may not return. Consistency is also helpful on product pages. People tend to expect all product pages to look the same on a website or at least in each section. If your images, product description and buy button are in the same place on every product page, the customer will be comfortable and confident when shopping. Read more about this on our blog about the importance of user experience.

 

  1. Add Personality

Personality makes photos more interesting, and the best way to add personality is by adding a person (or more than one) to as many photos as possible. Show people working in your company, using your products and if you can, in your product images.

 

  1. Don’t Overwhelm

Websites need to be easy for visitors to navigate. While some of this is covered by your menu and search capabilities, simplifying your page layouts is also helpful. Make it easy for someone to arrive on your page, read the title and the first few lines, and then skim down to see if they want to read more. Putting photos in the same places on each page and using them to describe or display what you are writing about will help your visitors find what they are interested in more quickly.

Images matter because…

Studies show that people remember 80% what they see and only 20% what they read. In fact, there’s research that suggests that 65% of people are visual learners. MIT also found that the human brain can process images in as little as 13 milliseconds. These and many other statistics favor the idea that images are powerful means of communication. Perhaps, their most important function is that they remove language barriers, as they are easily understood by everyone in the world.

 

On the Internet, images are used for all kinds of reasons: to enhance websites, to illustrate stories, in ad displays, to present products or services, as stand-alone “a picture is worth a thousand words” meaning-rich tools, and sure, on social media.

 

3.2 billion images are shared online every day, according to Brandwatch, many of which “mention” brands without the use of text.  So how do businesses track images featuring their brands? Through “visual listening,” which is essential media monitoring for images. It uses image recognition technology to uncover visual mentions (usually company logos) of a brand and not only watermarks. Visual listening can identify logos on actual objects, like a store sign, or a label on a product. For brands, this can determine social media mentions in all kinds of contexts, including discovering brand advocates, finding out how people are using a product, identifying misuse of the logo, and the list goes on. Brandwatch Image Insights gives a fair idea of how brands can use visual listening to monitor social media.

 

On top of it all, “Generation Y prefers a picture-based method of communicating information rather than a text-based method,” according to a 2010 paper by Soussan Djamasbia, Marisa Siegelb, and Tom Tullisb titled Generation Y, web design, and eye tracking. Generation Y, the Millennials, grew up with technology and the internet and they will soon take over as the most significant segment of consumers, surpassing the baby boomers and Generation X.

 

Top Reasons to Use Images on Your Website

Better user experience: When it comes to websites, images matter because their role is to capture the attention of the visitor. They can convey complex messages in the blink of an eye. Looking at the image of a hotel room, the site visitor can see the décor of the room and some of its amenities without the need of reading lengthy descriptions immediately.

Relevant images – instead of “filler” images that only have the purpose to look pretty – enhance the user experience. They deliver a contextual message, which answers the need for information. Naturally, when guests visit the website of a hotel, they are looking for information and images deliver it quickly and explicitly. An image gallery optimized for stress-free browsing is another UX plus.

Increase dwell time: the time users spend on a website is a user engagement signal for Google and a search ranking factor.

“Basically, Google wants to find unicorns – pages that have extraordinary user engagement metrics like organic search click-through rate (CTR), dwell time, bounce rate, and conversion rate – and reward that content with higher organic search rankings,“ Larry Kim of Wordstream explains.

Images are an integral part of the content strategy of any website. The best images are set above the fold and act as both eye candy and informational tools. They should relate directly to the text of the page, and ideally, they should be original pictures. Stay away from stock clichés as much as you can.

Improve on-site SEO: Provided that the image used matches the text, it will rank better in the image search section of the search engines. And image search matters a lot for traffic to your site. According to research conducted by MOZ and Jumpshot, Google Images counts for 26.79% of US searches, surpassing YouTube.com 3.71% and other Google properties.

                                                                                                                     Source: Jumpshot Moz

SEO for Images

Although Google has already developed image-recognition algorithms and holds several patents for systems and methods for image recognition, optimizing your images for SEO is still a good practice. As the chart above shows, image search can be a great source of traffic. Here are some tips to help boost your rankings in image search:

Always choose an image that matches your text

Image recognition algorithms identify filler images, as well as stock photography, and they will not rank. To see how Google recognizes your image without the need for text, just perform a Google image search and upload a picture instead of typing keywords. In the following example, I used an original image from Mamaison Hotels & Residences. As you can see, Google identifies what the image is, but doesn’t find duplicates. This is good.

In the second example, I used a generic stock photo and gave it a random file name, to see if Google can identify it and find duplicates. As you can see, Google knows exactly what the image is about, and the first result is a duplicate. This is bad because, as you notice, Google only shows one duplicate for “visually similar images” – most likely not the one from the original source. When you click to see “other sizes of this image” you will discover hundreds of results, merely for the purpose to enable users to find the same image in different sizes. This means that hundreds of sites already mirrored that image to illustrate content one way or another.  And the rules that apply to text apply for images too: Google doesn’t like duplicate content. So, stock images do nothing for SEO.

Use smart file names

If you manage to have an original image that pertains to your text, it’s not enough to upload it with a random file name. Although Google can recognize what it is, the best SEO practice is to give it a relevant, smart file name. So, instead of uploading an image straight from your camera, with a file name like IMG_20180205_163530, rename it with keywords that describe its subject, for example, hotel-name-main-lobby.jpg and without stop words (like of, and, the).

Note in the file naming example above the use of a hyphen (-) instead of underscore (_) – that’s because it is a best practice recommendation from Google for URLs and for all kinds of files. The hyphen has the role of separating words, so it makes sense for Google to prefer it.

Use proper alt attributes and title attributes

After you upload the images on your website, you must “describe” them. There are two types of attributes used for SEO and user experience:

  • Alt attribute, which describes the image for the search engines accurately. As you noticed in the previous paragraphs, Google can identify what the image is about, but it cannot identify where it was captured. The alt tag serves to complete the information. For example, if you have an image of a hotel room, the alt attribute would be something like: “The Presidential Room at Hotel X.”
    Use natural language when writing your alt attribute, because this is also displayed by screen readers and used by browsers for the visually impaired. Considering this segment of internet users, always end the text in your alt attribute with a full stop (dot).
  • The advice offered by John Mueller, Senior Webmaster Trends Analyst at Google in 2008, before the image recognition revolution, is still valid, so consider it when you write your alt attributes (erroneously also called alt tags):
    “Feel free to supplement the “alt” attribute with “title” and other attributes if they provide value to your users!
    So, for example, if you have an image of a puppy (these seem popular at the moment :-)) playing with a ball, you could use something like “My puppy Betsy playing with a bowling ball” as the alt-attribute for the image. If you also have a link around the image, pointing a large version of the same photo, you could use “View this image in high-resolution” as the title attribute for the link.”
  • Title attribute, as you noticed in the previous paragraph, is intended as a call to action, and it is used mainly when the image hyperlinks to a different page. It displays when the mouse hovers over the image (only in case of a hyperlink). So far, there’s no proof that Google uses title attributes for rankings. But things may change.

Make use of captions

Captions matter and there’s enough research to support this. According to Kissmetrics:

“Captions under images are read on average 300% more than the body copy itself, so not using them, or not using them correctly, means missing out on an opportunity to engage a huge number of potential readers. (For images above a headline, the headline itself can serve as a caption.)”

Kissmetrics also recommends that you craft your captions with the same care you craft your headlines.

Optimize your images for web use

Besides naming the file right and filling in the proper alt and title attributes, you should also optimize the images for fast loading because page speed is a ranking factor, and because users tend to leave websites that load slowly. So, decrease the file size of your images by saving them for the web with Adobe Photoshop, or using an image compressor like TinyJPG, TinyPNG, toolur, Compressor.io, and others, and use responsive images.

Use the Open Graph protocol for better discoverability

According to the official website, the “Open Graph (OG) protocol enables any web page to become a rich object in a social graph. It is used typically on Facebook to allow any web page to have the same functionality as any other object on Facebook. “

According to the official website, the “Open Graph (OG) protocol enables any web page to become a rich object in a social graph. It is used typically on Facebook to allow any web page to have the same functionality as any other object on Facebook. “

The og:image property has some optional structured properties:

· og:image:url – Identical to og:image.

· og:image:secure_url – An alternate URL to use if the webpage requires HTTPS.

· og:image:type – A MIME type for this image.

· og:image:width – The number of pixels wide.

· og:image:height – The number of pixels high.

· og:image:alt – A description of what is in the image (not a caption). If the page specifies an og:image it should

· specify og:image:alt.

 

To conclude, images are useful because they trigger emotions, are easy to understand and transmit information faster than text. According to Dr. Lynell Burmark, images “go directly into long-term memory where they are indelibly etched.”

Avoid stock images, images that lack quality, and filler images, and use high-quality original pictures that represent actual places, objects, or beings. Remember that the modern Internet user spends a lot of time sharing, or resharing images, so encourage the practice by adding share buttons for social media: Facebook, Twitter, Instagram, Pinterest, and so on. Add proper descriptions with hashtags to the images designated to encourage sharing. This simplifies the process and saves time for the users while ensuring that your brand is not misrepresented.

We leave you with these facts and statistics that show just how essential images have become on social media:

  • “Users pay attention to information-carrying images that show content that’s relevant to the task at hand. And users ignore purely decorative images that don’t add real content to the page.” (Jakob Nielsen, 2010)
  • Tweets with images receive 150% more retweets and 18% more clicks than tweets without. (Buffer Social, 2016)
  • Articles with an image once every 75-100 words get double the number of shares of articles with fewer images. (Buzzsumo, 2015)
  • A large percentage (74%) use visual assets in their social media marketing, up from 71% in 2015. (Social Media Examiner, 2016)
  • Organic Facebook engagement is highest on posts with videos (13.9%) and photos (13.7%). (Locowise, 2015)
  • Vision trumps all senses: “Hear a piece of information, and three days later you’ll remember 10% of it. Add a picture, and you’ll remember 65%.” (John Medina)

SOURCE: JUMPSHOT/MOZ

Leave a Reply

Your email address will not be published. Required fields are marked *