Hello
How do i add an Alt tag on an image, after i’ve uploaded it?
Uploading it to the asset manager is not enough. First, you need to drag the uploaded image to the page, then you click on the image, and then go the the settings panel to change the image attributes.
2 Likes
ALT for image is an HTML feature, so right after you’ve uploaded it, you can’t. Image need to be added to a page (hence being declared into the HTML code) for you to be able to click on the gear icon for the settings tab and add an ALT description:
http://vincent.polenordstudio.fr/snap/opzme.jpg
That way, two occurences of the same image (same file) can have different ALT data, depending on the context.
1 Like
Hang on sorry you lost me there (-:
So like an idiot, i thought ‘i’ll worry about the Alt tags later’ instead of adding them on upload. But, so are you saying i need 2 instances of the same photo?
So lets just take the image section below the navbar for example. There are 4 images…in a group…how would i go back and put Alt tags on those images?
Sorry if I lost you… Forget about the 2 occurences thing. I was only dexribing a possibility offered by HTML.
As for your page, your images in the 4 element group are background images. There is no ALT for background images in HTML. So you can’t put a ALT tag on them.
What can be done is adding a title to the class. So the code will look like this:
<div class="className" title="Image Title"></div>
In Webflow, do this, for example on your Extraordinary4 class:
4 Likes
Note that the Custom Attribute solution is only a solution to attach data to your element. It’s not going to be used like an ALT tag by browser (like displaying the little tooltip on hover).
BUT ALT tags aren’t made to be displayed on hover of an image,they have a bigger role, for accessibility. They display on devices for impaired people. Such devices may gather all data shown in custom attributes, so the goal may be reached.
EDIT: IT IS actually a good and recommended practice! Read what the W3C says about Title attribute:
https://www.w3.org/TR/html401/struct/global.html#h-7.4.3
EDIT 2 : don’t put a capital T at title, just “title”
Awesome thanks!
That makes sense.
If i wanted that image to be tagged by a browser, is that even possible or am i misunderstanding the use of Alt tags?
My end goal is really to make the SEO really good.
From the W3C :
For instance, visual browsers frequently display the title as a “tool tip” (a short message that appears when the pointing device pauses over an object). Audio user agents may speak the title information in a similar context.
Rhaaa HTML IS AWESOME!
1 Like
Read my last post and you’ll see that browsers may take the title as a ALT.
I don’t think you’re misunderstanding the benefits of ALT tag, at worst you’re ignoring some of the benefits. It’s used to describe an image when the image isn’t shown (in a browser that look like a terminal, or on a braille browser) or when you can’t see it (a visually impaired people in front of a normal browser with dictation on). ALT tags are for ACCESSIBILITY, not really to add extra comfort for normal people with normal devices. For those people, your design layout must be clear, and the message must pass without having to rely on ALT tags or title fields.
Edit: a braille browser:
http://hims-inc.myhosting.me/wp-content/uploads/2012/01/Braille-Sense-U2_MINI_Isolated_Web.jpg
1 Like
Thanks Vincent, really comprehensive and helpful…appreciate the help!
1 Like
Also I haven’t mentionned SEO… it’s true that a search on a site is better when all ALTs and title are there.
This topic was automatically closed after 60 days. New replies are no longer allowed.