Tens un " lloc web sensible "? Aquest és un lloc amb un disseny que canvia segons el dispositiu i la mida de la pantalla d'un visitant . El disseny web responsable és ara una bona pràctica de la indústria. Google recomana i es troba en milions de llocs web. Hi ha, però, una gran diferència entre tenir un lloc web que simplement "encaixi" en diferents mides de pantalla i tenir un lloc que sigui realment sensible.
Normalment veig a les empreses redissenyar el seu lloc web i empenyent un comunicat de premsa que extorsiona les virtuts del seu nou disseny compatible amb el mòbil. Quan visito aquests llocs, el que trobo sovint és un disseny que, de fet, s'escala i canvia per adaptar-se a diferents pantalles, però això és el que pren la idea de la capacitat de resposta. Això no és suficient. Un lloc realment sensible fa més que una escala per adaptar-se a una pantalla més petita o més gran. En aquests llocs, també trobareu els següents trets importants.
1. Rendiment optimitzat
A ningú li agrada esperar que es carregui un lloc web, i quan algú estigui utilitzant un dispositiu mòbil amb una connexió que pot ser menys que ideal, la necessitat d'un lloc per carregar ràpidament és encara més important.
Llavors, com optimitzar el rendiment del vostre lloc? Si esteu començant amb un nou lloc com a part d'un redisseny, haureu de fer-lo un punt per crear un pressupost de rendiment com a part d'aquest projecte. Si esteu treballant amb un lloc existent i no comença des de zero, el primer pas és provar el rendiment del vostre lloc per veure on es troba avui.
Una vegada que tingueu una base d'on es troba el vostre lloc, es pot començar a fer les millores necessàries per augmentar la velocitat de descàrrega. Un gran lloc per començar és probablement amb les imatges del vostre lloc. Les imatges massa grans són el culpable número 1 quan es tracta de llocs de càrrega lenta, de manera que optimitzar les vostres imatges per al lliurament a la web pot ajudar realment al vostre lloc des del punt de vista del rendiment.
La realitat és que el rendiment del lloc web millorat i les velocitats de descàrrega ràpides són un benefici que tots els visitants apreciaran. Al cap ia la fi, ningú no s'ha queixat que un lloc carregat "massa ràpid", però si un lloc triga massa a carregar-se, farà que la gent es desconnecti si s'ajusta "de manera" a la pantalla o no.
2. Jerarquia de contingut intel·ligent
Quan un lloc web es mostra en una pantalla gran, podeu extreure el contingut de diverses maneres a causa de la pantalla substancial de la propietat immobiliària disponible. Sovint podeu incloure missatges i imatges importants, actualitzacions de notícies, informació d'esdeveniments i navegació del lloc a la vegada. Això permet que un visitant pugui escanejar fàcilment i ràpidament el contingut de tota la pàgina i decidir el que és important per a ells.
Aquest escenari canvia molt dramàticament quan es pren aquest disseny del lloc i es transforma en dispositius de pantalla petita, com ara un telèfon mòbil. De sobte, treballeu amb una fracció de béns immobles de la pantalla que teniu abans. Això vol dir que heu de decidir què apareixerà primer al lloc, què ho seguirà, etc. En lloc de veure'ls alhora, probablement només tindreu l'espai per mostrar una o dues coses (una de les quals és probable que la navegació). Això vol dir que cal prendre decisions de jerarquia. Malauradament, el que sovint determina el que apareix primer a la pantalla, i després el segon, etc. és la forma en què la pàgina està codificada. És més fàcil, quan es construeix un lloc de resposta, per mostrar el primer que hi ha al codi primer a la pantalla, seguit del segon element del codi, etc. Malauradament, el que pot ser més important en un dispositiu pot ser que no sigui tan crític en un altre. Un lloc realment sensible entén que la jerarquia de contingut hauria de canviar depenent de situacions diferents i hauria de ser intel·ligent sobre el que mostra on es troba.
Les millores en les tècniques de disseny de CSS, incloent el Disseny de quadrícula CSS, Flexbox i més, permeten als dissenyadors i desenvolupadors web més opcions a l'hora d'establir contingut intel·ligentment, en comptes de reduir-se per l'ordre exacte de les àrees de contingut del codi HTML. Aprofitant aquestes noves tècniques de disseny serà encara més important ja que el paisatge del dispositiu i les necessitats dels usuaris del nostre lloc continuen evolucionant.
3. Experiències que prenen en compte les fortaleses i les debilitats d'un dispositiu
Mantenir-se al voltant del tema dels dispositius: cada dispositiu que algú pugui utilitzar per visitar el vostre lloc té els punts forts i els punts febles inherents a aquesta plataforma. Un gran lloc de resposta comprèn les capacitats i limitacions de diferents dispositius i les utilitza per crear experiències personalitzades que millor s'adaptin a qualsevol dispositiu que un visitant pugui utilitzar en aquest moment.
Per exemple, un telèfon mòbil inclou diverses funcions que no trobaries en una computadora d'escriptori tradicional. El GPS és un exemple d'una característica centrada en el mòbil (sí, podeu obtenir informació general sobre la ubicació a l'escriptori, però el dispositiu GPS és molt més precís). El vostre lloc pot utilitzar la informació del GPS per enviar de forma intel·ligent a una persona informació detallada o específica de pas a pas o ofertes especials en funció d'exactament on es troben en aquest moment.
Un altre exemple d'aquest principi a la pràctica seria un lloc que entengui el tipus de pantalla que està utilitzant i envia les imatges més adequades per a aquesta visualització. Si teniu una pantalla amb una alta densitat de píxels, podeu decidir enviar imatges de més qualitat a aquesta pantalla. Tanmateix, aquestes mateixes imatges serien inútils en una pantalla menys capaç i es perdria la qualitat addicional mentre es descarregués la mida de l'arxiu addicional sense cap motiu real.
Els llocs que realment són molt responsables consideren tota l'experiència de l'usuari i treballen per adaptar aquesta experiència basada no només en un tipus de dispositiu o mida de la seva pantalla, sinó també en altres aspectes importants del maquinari.
4. Contingut amb context
Inicialment, el disseny web atractiu va rebre el seu nom a causa de la idea del disseny d'un lloc que responia a diferents mides de pantalla, però podeu respondre molt més que només a la mida de la pantalla. Partint de l'exemple anterior d'utilitzar les fortaleses i les debilitats d'un dispositiu, podeu utilitzar-les, així com altres dades com ara la data i l'hora, per personalitzar realment l'experiència d'un lloc web.
Imagineu un lloc web per a un gran esdeveniment comercial. Tot i que un lloc web sensible canviarà el disseny de les pàgines del lloc a escala amb diferents pantalles, també podeu utilitzar la data per determinar quin contingut és més important per mostrar. Si és el període de temps abans de l'esdeveniment, és probable que vulgueu mostrar de manera destacada la informació de registre. Tanmateix, si l'esdeveniment està succeint en aquest moment, és possible que el registre no sigui el contingut més important. Al contrari, pot decidir que l'agenda dels esdeveniments és més crítica, ja que és més rellevant per a les necessitats immediates d'aquest usuari.
Si feu un pas més, podeu fer servir el GPS d'un dispositiu per determinar on estan a la fira. Podria donar-los contingut interactiu en funció de la seva ubicació, mostrant-los caselles o sessions properes per començar.
5. Accessibilitat
L'exemple final que veurem com un lloc pot respondre realment a les necessitats d'un visitant és pensar en l' accessibilitat del lloc web . Els llocs web han de poder ser utilitzats per tantes persones com sigui possible, inclosos aquells amb discapacitat. El vostre lloc web ha de poder ser utilitzat per algú que necessiti un lector de pantalla o un altre programari assistit per accedir al seu contingut. D'aquesta manera, el vostre lloc respon a les seves necessitats perquè ha assegurat que l'experiència, encara que diferent per als visitants amb discapacitat, continua sent apropiada.
En respondre a tants punts de dades com sigui possible, i no només la mida de la pantalla, un lloc web pot ser molt més que simplement "amigable per a mòbils". Es pot convertir en una experiència realment sensible en tots els sentits de la frase.