Community @ The Turning Gate

Support community for TTG plugins and products.

NOTICE

The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.

This forum is now closed, and exists here as a read-only archive.

  • New user registrations are disabled.
  • Users cannot create new topics.
  • Users cannot reply to existing topics.

You are not logged in.

#1 2017-01-10 07:47:01

michilge
Member
From: Sprockhövel, Germany
Registered: 2013-04-15
Posts: 206
Website

title- and alt- attributes of <img> tag in photoswipe

Hello,

there are some things I do not understand right yet.
Background is that I'm still busy getting my xml-sitemap configured.

I have most of my photos in albums that use photoswipe for presentation.
The album grid contains links to the large presentations and builds <img>-tags with title and alt attributes.
I can configure Backlight what to put into the title="" attribute in the Album Setings under Image Setings --> Photos Title.
The title="" is used by the browser to build the tooltip for the image whe the mouse hovers over the thumbnail.
I can configure the caption that Photoswipe will display under the large image in the lightbox under Image Settings --> Photos Caption.
So far so good.
When I open the large image in the Photoswipe lightbox, and examine the sourcecode, I see an
<img class="pswp__img" src="..." style="display: block; width: 1349px; height: 900px;">
No alt, no title.

As far as I see, that is exactly the <img> my sitemap crawler looks for alt="" and title="".
When I switch over from Presentation Type = Photoswipe to Presentation Type = Single-Image Pages, the alt-attribute contains what I configured at Image Setings --> Photos Title what I find perfectly right.

Is there a way to have Photoswipe use the metadata in it's <img>?

Offline

#2 2017-01-10 11:04:21

Matthew
Administrator
From: San Francisco, CA
Registered: 2012-09-24
Posts: 5,795
Website

Re: title- and alt- attributes of <img> tag in photoswipe

Such things are entirely unimportant to Photoswipe. The presentation is built on-the-fly from Javascript, and doesn't exist until the moment an image is clicked, so it's entirely irrelevant to SEO and sitemaps. Thumbnails on the grid link directly to single-image pages, and so those pages are visible to both. That's what's important.

It also ensures that if you ever break your Javascript, your gallery will remain navigable using the single-image pages.


Matt

The Turning Gate, http://theturninggate.net

Offline

#3 2017-01-11 08:17:39

michilge
Member
From: Sprockhövel, Germany
Registered: 2013-04-15
Posts: 206
Website

Re: title- and alt- attributes of <img> tag in photoswipe

The author of the sitemap crawling scripts had a look at it. I bought the locally installed scripts from https://www.xml-sitemaps.com.
He confirmed what You said: the crawler does not see the lightbox but finds the photo's URLs in the album page. It also follows the link to the single-image/permalink pages, but only to add the page to the pages sitemap. For the separate image sitmap it takes the first occurence and that is on the album page.

The first occurrence of each photo's URL in the grid is not within an <img>, but in a data-href="" attribute.

Since the crawler keeps only the first occurrence and ignores all the come later, it puts the photo's URL into the image sitemap without any further information.

I hope You won't mind; I had a look into modules\standard-album\fragments\classic.php. (and masonry) The data is all at hand and stored in variables. I gave it a try and enhanced the "pswp_go" class with an alt and a title. In the browser it looks OK. Right now the crawler is running so that I can see, if it makes use of them.

If it works and won't raise problems in other places, would You consider making it persistant?

Thanks for Your patience.
Michael

Offline

#4 2017-01-11 13:25:29

Matthew
Administrator
From: San Francisco, CA
Registered: 2012-09-24
Posts: 5,795
Website

Re: title- and alt- attributes of <img> tag in photoswipe

All elements classed as "pswp_go" are <a> elements, about which you can read here:
https://www.w3.org/wiki/HTML/Elements/a

As you can see on that page, <a> elements do not support title or alt attributes. While the browser might ignore the attributes when occurring on the element, they are technically invalid, so not something I am likely to add, especially for the sake of a third-party script that is not a part of our application.

I should point out, that the only place the full-size image URL appears in the page is in that data-href attribute. The following <img> element only references the thumbnail rendition of the image.

A better solution would be the for the script to ignore the data-href attribute entirely, and to instead scrape data from the single-image HTML page. In fact, I would go so far as to suggest that the script should be updated to ignore ALL "data-" attributes, as these generally serve no function other than to provide information to scripts or stylesheets running on the page. For SEO, sitemaps, and related purposes, HTML5 "data-" attributes should be fully transparent.


Matt

The Turning Gate, http://theturninggate.net

Offline

#5 2017-01-11 14:44:27

michilge
Member
From: Sprockhövel, Germany
Registered: 2013-04-15
Posts: 206
Website

Re: title- and alt- attributes of <img> tag in photoswipe

Yes. I understand Your Point. In the meantime I found several other sources where the concept of data - * attributes is explained and those are clearly on Your side. Ignoring those tags would definitely be an improvement to sitemap software. I will discuss that with the author.

Again a big Thank you for Your patience and explanation.
Michael

Offline

Board footer

Powered by FluxBB