HTML codes inside alt tags

本小妞迷上赌 提交于 2019-12-13 17:43:07

问题


Is it ok to put html codes inside alt tags?

I have a slider that uses alt tags for description. In order style the description, I have to put html codes.

My problem is I dont know if it will harm SEO or any other things to consider..


回答1:


HTML markup is not valid for the contents of the alt attribute. If you need a fancy dialog ox you can easilt accomlish this with JavaScript and maye even plain old CSS. That way your code is valid and you don't run into any potential SEO issues.




回答2:


Yes, you can use <img src=foo alt="<i>Hello</i> world">. I don’t see any reason why anyone would, but it’s valid. The alt attribute would then be rendered literally, because it’s an attribute value; no HTML tags are recognized there.

The rendering of alt tag values may or may not be affected by style sheets and markup around the tag. If you write <b><img src=foo alt="<i>Hello</i> world"></b>, then advanced browsers will display <i>Hello</i> world in bold face (but not in italic), when they do not display the image. (The “tooltip” part of the handling of alt attributes is a different issue, unstyleable, and generally not present in any modern browser.)

To use just an attribute that carries some text to be displayed via JavaScript, data-* attributes are a much better approach, as Baptiste Placé points out in his answer. It is technically possible to use alt for that, but this would cause odd things when the image is not displayed (at least temporarily, due to delays) ant the alt text is used in its stead.

Moreover, search engines are known to play attention to alt attribute values, so they should not contain anything that is nonsensical when considering the attribute’s defined role (to provide an alternative text to be used when the image is not shown).




回答3:


In order to style the description, you need CSS; HTML is for defining a document's structure.




回答4:


You should not use the alt attribute for your slider, use your own property instead with the data-* attributes. More info on the data attribute : http://www.marcofolio.net/webdesign/html5_data-_attributes_are_great_and_you_know_it.html

You should make this kind of html (using data-longdescr, but use any data-something you like) :

    <img src="/img/pic.jpg" alt="Jumping over a fence" data-longdescr="<b>Jumping</b> over a fence" />

Beware of quotes thought, they must be escaped !




回答5:


Markup won't work on an alt attribute.

I would put all the description tags inside a CSS class. Then, style the class separately.




回答6:


I think you've all misunderstood the question, OP is asking if it's possible to insert html in to an alt tag because he wanted to style the output text as he was using it as descriptive text overlaying his slides. I've run in to the same problem and discovered it is possible to insert html in to alt tags. This is very handy since I'm using a Wordpress lightbox plugin that turns every picture link on my page in to part of a slideshow and outputs the alt text as descriptive text over each image.

If I could only enter plain text then the styling for my descriptions would have been very limited and I wouldn't be able add in awesome things like links:

<img alt="<?php echo "Title" . "Lorem Ipsum dolor" . "<a href='http://www.google.com'>View Website</a>"; ?> " src="<?php echo $img; ?>">

I'm using php to insert the markup though you can also use plain html

alt="<h3>Title</h3><p>Lorem Ipsum dolor</p><a href='http://www.google.com'>View Website</a>"

Which outputs:

Title

Lorem Ipsum dolor

View Website

I'm not sure if this good for SEO but it's definitely handy and something I didn't know was possible until now.



来源:https://stackoverflow.com/questions/11788685/html-codes-inside-alt-tags

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!