hola, bienvenido al foro.
como bien intuíste, si, tienes un problema (conocido como divitis o "sopa de divs")
Creo que primero te deberías de concentrar en el html, olvida el css por ahora. Debes de analizar la semántica (y no la apariencia) de la información que tienes, y marcarla en consecuencia. Los elementos
div y
span NO tienen ningún significado semántico, por lo que en esta primera etapa no debería de haber ni uno.
Aquí tienes un listado de todos los elementos que existen en html5 y su significado semántico:
HTML5 Element index
Cuando tienes ya el html pronto, ahí empiezas con el css, de la misma forma, estilando los elementos que tienes en el html. Cuando te parezca que para llegar a la apariencia que deseas se hace
necesario que haya otro elemento que tu html no tiene, ahí si es el momento de agregar un
div (o un
span si el elemento debe de ser inline)
Cuando tengas más práctica ya te va a ser más fácil definir cuando necesitas divs y cuando no y lo vas a poder hacer todo en una sola fase.