SEO of images
Permalink Browser Info Environment
I am using Touch Gallery on one site and want to use it on another. Out of the box there are no alt tags and the data-tg-desc tag is not read by search engines. I have modified view.php as follows:
[code]
<?php foreach ($images as $img): ?>
<a href="<?php echo $img->large->src ?>" style="background-image:url(<?php echo $img->thumb->src ?>);" title="<?php echo $img->title ?>" <?php if ($img->description && $showDesc) { echo ' data-tg-desc="' . $img->description . '"';} ?>><img src="<?php echo $img->large->src ?>" alt="<?php echo $img->description ?>"/></a>
<?php endforeach; ?>
[code/]
Is there a better way of doing this?
Nigel
[code]
<?php foreach ($images as $img): ?>
<a href="<?php echo $img->large->src ?>" style="background-image:url(<?php echo $img->thumb->src ?>);" title="<?php echo $img->title ?>" <?php if ($img->description && $showDesc) { echo ' data-tg-desc="' . $img->description . '"';} ?>><img src="<?php echo $img->large->src ?>" alt="<?php echo $img->description ?>"/></a>
<?php endforeach; ?>
[code/]
Is there a better way of doing this?
Nigel
Type: | Discussion |
---|---|
Status: | Resolved |
Ok Thank you.
I have also noticed that image urls in the gallery have file names like:
http://www.mydomain.com/files/cache/e9ae7efcdb5d3c74a014f9e383ee2d5...
As such they are not getting indexed by google images. is this due to image caching in concrete5? Is there anything I can do to change this? It is important for my 'product photos' to get indexed in google image results.
I have also noticed that image urls in the gallery have file names like:
http://www.mydomain.com/files/cache/e9ae7efcdb5d3c74a014f9e383ee2d5...
As such they are not getting indexed by google images. is this due to image caching in concrete5? Is there anything I can do to change this? It is important for my 'product photos' to get indexed in google image results.
This is due to the resizing of images. Any time you ask for an image to be resized, Concrete5 gives the resized version a name like that. The purpose of that gibberish file name is to make each version unique so they don't overwrite each other.
You could override Concrete5's image helper to give you a file name of the form:
original-file-name.required-gibberish-file-name.jpg
I have to say, however, that I don't think the file name impact on indexing by Google, especially if they have proper alt or title tag. According to this information (https://support.google.com/webmasters/answer/114016?hl=en) a meaningful filename is useful but not compulsory
You could override Concrete5's image helper to give you a file name of the form:
original-file-name.required-gibberish-file-name.jpg
I have to say, however, that I don't think the file name impact on indexing by Google, especially if they have proper alt or title tag. According to this information (https://support.google.com/webmasters/answer/114016?hl=en) a meaningful filename is useful but not compulsory
There are a few issues in your solution.
Originally Touch Gallery doesn't use an image tag, the thumbnail is used as a background image of the link.
You have added an image, which is fine, but then you don't need to keep the background image in the link.
The second problem is that you are using the full screen image ($img->large->src) for your thumbnail. You should use the thumb image instead ($img->thumb->src)
The code would then be:
I would point out, however, that because the title attribute of the link is provided by default, you probably don't need to add an image to have an alt tag if it's for SEO sake. The title tag is perfectly acceptable for that.