I recently had a thought of utilizing the unordered list element to represent a list of composite content (such as a product list with details or an image list with captions).
<ul> <li> <img src="awesometoaster.png" alt="toaster"> <p>Awesome Toaster<p> <p>This is an available product</p> <a href="#">Buy Now</a> </li> </ul>
I have looked into example usages of the element, however many provide very basic one level examples.
<ul> <li>Red</li> <li>Blue</li> <li>Green</li> </ul>
To me, the first example is a logical list of products and would make sense to utilize an unordered list. Would this be a semantic choice to represent this type of content or is there a more appropriate element choice?