"Luego, yo tenía entendido que todo el código que validaba era bien interpretado por navegadores como Opera y Mozilla (por mucho que no tuviera estructura semántica). "
no
Eso es una leyenda urbana
El validador sólo es una herramienta que permite comprobar la sintaxis del documento XHTML, exactamente como lo haría un corrector ortográfico, pero no significa que tu web se muestra bien si el código valida. Lo que pasa es que los que suelen usar el validador son webmasters muy avanzados que ya saben de semántica web y de problemas de compatibilidad de los navegadores y el validador solo es una étapa del proceso de creación de páginas.
"Opera es muy minoritario, pero por Mozilla sí me preocupo. ¿Qué características tiene el XHMTL semántico que no tenga uno como el de esa web? Si me lo puedes comentar a grandes rasgos, luego busco más información y la estudio."
En realidad hacer HTML semático significa usar el lenguaje tal y como fue concebido y no como lo pervirtieron los webmasters en los años 90 cuando apenas teníamos CSS ;)
La primera ventaja cuando te esfuerzas en crear un documento bien estructurado y con semantica correcta es una simplificación del código fuente y por lo tanto la limitación de los problemas de interacción de las etiquetas (posicionamiento de los elementos por ejemplo). Si tomamos un trozo de código podemos ver como se puede simplificar :
<div class="titlesection"><p class="seccionlateral">PARAFARMACIA</p></div>
Bien, aquí usas una etiqueta de párafo de texto, pero no hay párrafo. Vemos que es un título pero no hay etiqueta de título, usas dos clases pero el titleseccion no sirve para nada ya que no se usa en la CSS y la verdad es que seccionlateral tampoco tiene interés. El código con semántica debería ser :
<h2>PARAFARMACIA</h2>
Mucho más sencillo, ahora tiene semántica (lo que significa por ejemplo que google le dará más importancia y establecerá una relación de dependencia con el texto que sigue (título -> texto que depende del título).
tu clase .seccionlateral{} ahora es div#contentleft h2{} lo que además te permite organizar mejor tu CSS ya que leyendo la regla sabes de que depende este código.
De la misma manera, tus enlaces en la misma columna son listas y deberían tener una sintaxis del tipo
<ul>
<li><a></a></li>
<li><a></a></li>
</ul>
Aquí encontrarás un scroller para remplazar el que usas que funciona perfectamente en todos los navegadores recientes:
http://www.hypergurl.com/verticaltext.html