Introducció al Disseny Adaptatiu
En el desenvolupament web actual, no n’hi ha prou amb què un lloc web es vegi bé en un ordinador de sobretaula. El concepte de Responsive Web Design (Disseny Respondre) és fonamental. Aquesta activitat consisteix a documentar com la nostra instal·lació de WordPress es visualitza en diferents resolucions, garantint que l’experiència de l’usuari (UX) sigui òptima en qualsevol dispositiu.
2. Formats de Monitoratge
Per a aquesta pràctica, hem analitzat el comportament de la interfície en tres formats clau:
- Format Monitor (Desktop): És la versió completa. Aquí disposem de més espai horitzontal, cosa que permet l’ús de columnes múltiples, menús desplegats i imatges d’alta resolució a pantalla completa.
- Format Tauleta (Tablet): Un punt intermedi. El disseny comença a condensar-se. Elements que abans estaven en tres columnes poden passar a dues, i el menú de navegació pot transformar-se per facilitar l’ús tàctil.
- Format Mòbil (Mobile): La prioritat és la verticalitat. El contingut s’apila de forma lineal per facilitar l’scroll. El menú de navegació sol desaparèixer darrere d’una icona (conegut com a “menú hamburguesa”) i les mides de font s’ajusten per a una lectura còmoda en pantalles petites.
Anàlisi del Resultat en WordPress
Mitjançant l’ús de temes i constructors visuals (com Gutenberg o Elementor), WordPress ens permet aplicar regles de CSS que canvien segons el dispositiu. En les imatges adjuntes a l’activitat, es pot observar com:
- La jerarquia visual es manté malgrat el canvi de mida.
- Els botons (CTA) són prou grans en la versió mòbil per ser clicats amb el polze.
- El temps de càrrega es manté eficient gràcies a l’ajust automàtic de la mida de les imatges que fa WordPress.
Conclusió
Aquesta activitat demostra la versatilitat de WordPress per gestionar contingut multiplataforma. El monitoratge constant en aquests tres formats és essencial per assegurar-nos que cap usuari, independentment de com ens visiti, tingui una mala experiència o trobi dificultats per navegar.