En aquesta tasca he configurat un disseny completament funcional que s’adapta a qualsevol pantalla. He utilitzat tècniques avançades com:
- Media Queries: Per definir punts de ruptura (768px i 480px) on el disseny canvia per a tauletes i mòbils.
- Unitats relatives: He fet servir
%,vwiremen lloc de píxels fixos per evitar que el contingut es talli. - Flexbox i Grid: Perquè les columnes de la web es reordenin verticalment quan l’espai és estret.
Objectiu: Que qualsevol empresa o docent pugui consultar el meu portafolis des d’un iPhone, una tablet o un ordinador de sobretaula amb una visualització òptima i sense errors.
He realitzat els següents passos tècnics en el meu lloc web amb el tema Presma LMS:
- Verificació del Viewport: He assegurat que la capçalera del lloc conté la meta-etiqueta
viewportper permetre l’escalat correcte. - Configuració del Menú: He implementat un menú de navegació que es transforma en un “menú hamburguesa” en dispositius mòbils, assegurant que tots els enllaços als 6 reptes siguin accessibles.
- Adaptació de Blocs: He revisat la Home i les pàgines de projectes fent servir l’Inspector de Chrome. He ajustat les mides de les imatges i els marges perquè no hi hagi desplaçament horitzontal.
- Botons i Accessibilitat: He augmentat l’àrea de clic dels botons en la versió mòbil per facilitar la navegació tàctil.
Punts de vista:
ordinador:
Movil o tableta:
