All geek questions in one place

A pair of keys / values ​​separated by markup. Is there any other way to improve SEO?

This is the section on the site that I am creating that contains some information divided into two columns. There are “keys” in the left column (I don’t know what else to call it, sorry), and the right column has values, as shown below:
image taken from site's psd

By floating inner divs and using some other styles, I can achieve this exact result using something like this:

<div id="container"> <div> <ul> <li>Size</li> <li>etc...</li> </ul> </div> <div> <ul> <li>10MB</li> <li>etc...</li> </ul> </div> </div>

But since each key is completely separate from its value, the markup does not seem to be a search engine at all. Is there any other way to do this while maintaining a centered style and having the markup more semantic?

Thanks for the help,
Daniel

+4
source share
1 answer

Of course, you can use tables for this data, probably it will be appropriate. Another option you can use is a list of descriptions:

 <dl> <dt>Size</dt> <dd>2.63 MB</dd> <dt>Views</dt> <dd>34,412</dd> <dt>Downloads</dt> <dd>2,125</dd> <dt>Likes</dt> <dd>1.368</dd> <dt>Category</dt> <dd>Test</dd> </dl>

Add CSS ...

 dt, dd { font-family:sans-serif; } dt { float:left; clear:left; text-align:right; width:50%; color:#bbb; } dd { float:left; margin-left:3em; color:#999 }

And you have it. http://jsfiddle.net/FuaNk/

I can’t comment on whether this helps SEO, but the values ​​are next to the keys, which seems to fit your requirements.

Additional information on <dl> , formerly known as the "definition list":

+8
source

Source: https://habr.com/ru/post/1391068/

More articles:


All Articles