I'm new to HTML. When I started reading documentation about lists, I've noticed that everywhere an <ul>, <li> structure is used, even for creating very simple lists.
But for me it's most comfortable to use only <a> elements with CSS:
display: block;
/* and/or */
float: left;
So, why use <ul>, <li> instead of just <a>?
Thanks a lot.
Because structurally they're the most appropriate elements for that purpose. Also helps screen reader users in terms of properly dictating the elements of a page.
Remember that HTML is for markup/content ( what IS this text? a paragraph? wrap it in a p tag ), CSS is for styling, JS is for behaviour.
You can have thousands of anchors on your web page, but what if you want to style anchors nested within listed items differently from other anchors?
<ul>
<li><a href="#">blah</a></li>
</ul>
<a href="#">sfl</a>
If you had done things properly, your css would be trivial to implement
a { }
ul li a { }
Otherwise you'd have to throw classes around anchors and it would be messy and unstructural.
In regards to the SEO - I believe that in the past semantically marked up code didn't have much bearing but nowadays with specs like RDF, HTML 5 elements the web is getting more and more semantic, so it's only beneficial to be as semantic as you can be.
In 2010, Google specified three forms of structured metadata that their systems will use to find structured semantic content within webpages. Such information, when related to reviews, people profiles, business listings, and events will be used by Google to enhance the 'snippet', or short piece of quoted text that is shown when the page appears in search listings. Google specifies that that data may be given using microdata, microformats or RDFa.[13] Microdata is specified inside itemtype and itemprop attributes added to existing HTML elements; microformat keywords are added inside class attributes as discussed above; and RDFa relies on rel, typeof and property attributes added to existing elements.[14]