Perquè cal conèixer el llenguatge CSS per crear una web amb wordpress?

En aquesta professió nostre cal reciclar-se i posar-se al dia constantment, per això recentment hem fet un curs per ampliar els nostres coneixements de wordpress i per conèixer el llenguatge CSS (Casacading Style Sheets o Fulls d’Estil en Cascada en català).

Teòricament el sistema wordpress ja porta un paquet de característiques pre definit per crear i donar forma a una web a través de les àrees i seccions que cada tema permet modificar, però si es vol arribar una mica més enllà i fer canvis no previstos en el paquet wordpress caldrà tenir algun coneixement de HTML i CSS per poder-ho fer.

Per tal d’explicar-ho de forma entenedora l’HTML és el codi que dona forma i estructura a una web, i el CSS especifica un esquema de prioritat per determinar quines regles d’estil s’apliquen si més d’una regla està associada amb un element en particular. En aquests fulls anomenats en cascada, es calculen prioritats o pesos i s’assignen a regles, de manera que els resultats siguin previsibles.

Un dels objectius de CSS és també permetre control més gran dels usuaris sobre la presentació, de manera que si hi ha alguna element que es vol canviar el que caldrà fer és clicar amb el botó de la dreta del ratolí a sobre de “inspeccionar” per veure dins de quina etiqueta està contingut el codi de l’element que vulguem modificar. Per fixar-nos en tot això caldrà tenir en compte que una etiqueta comença de la següent manera: <NOM> i acaba: </NOM>, per tant a dins d’etiquetes que comencen i acaben d’aquesta manera trobarem els codis CSS que busquem.

D’entre les etiquetes més comunes que hi ha en tota web podem destacar: <HEAD> </HEAD> que és la capçalera principal i <H1 H2 H3 H4 H5 H6> </H1 H2 H3 H4 H5 H5> que són capçaleres secundàries, <BODY> </BODY> que és el cos de la web, <a> </a> que són links, <P> </P> que és paràgraf, <DIV> </DIV> o <SPAN> </SPAN> que marquen divisions de l’estructura, és a dir fragments de contingut, <TABLE> </TABLE> referit a taules i <UL> </UL> per conjunts de llistes i <IL> </IL> per punts de llistes.

Per buscar els codis CSS dins d’aquestes etiquetes caldrà tenir en compte que en aquest llenguatge un # significa ID, una secció molt fixa i . significa CLASS, que dona forma a seccions concretes.

De moment deixem aquesta introducció al llenguatge CSS aquí, però en posteriors posts continuarem parlant sobre tot això!