La relació d’aspecte d’imatges i vídeos.

 Què és la relació d’aspecte o aspect ratio? 

La relació d’aspecte fa referència a la relació dimensional entre l’amplada i l’alçada d’una imatge o vídeo. Es calcula dividint l’amplada (de costat a costat) entre l’alçada (de dalt a baix), generalment utilitzant dos nombres separats per dos punts (X:Y). Per exemple, un quadrat s’expressa amb 1:1 o un rectangle on l’amplada és el doble de l’alçada s’expressaria amb 2:1. 

 

La relació d’aspectes d’imatges i el disseny web. 

Per poder escollir imatges per la teva pàgina web has de tenir en compte un factor molt rellevant, i és que les pàgines web actualment han de ser responsive, el que significa que han d’adaptar-se adequadament als diferents dispositius. El que significa que les imatges que s’utilitzen en una pàgina web s’escalaran de manera diferent segons el dispositiu des d’on siguin vistes. Així doncs, si imaginem una creu sobre la imatge i l’element rellevant de la imatge es troba en el centre, sabrem que podem utilitzar-la perquè independentment de com s’adapti al dispositiu, encara que la imatge s'escapci, el que volem mostrar sempre serà visible. 

A continuació, pots veure un exemple si posem una creu sobre la imatge de la home de la pàgina web de la Lily Brick on l’element rellevant és el mural de La pastora: 

                                                          

 

Com pots observar, l’element rellevant sempre és visible, independentment si l’usuari visita la web amb ordinador, mòbil o tauleta. 

Generalment, les imatges dels elements web actuals funcionen millor en dispositius quan tenen una relació d’aspecte de 16:9 o 4:3 depenent del disseny. 

Per publicar les imatges en la pàgina web, la seva mida haurà de quedar en píxels, a continuació veurem la relació i un exemple de la mida que queden les imatges amb la pàgina web que vam crear per Delitalian: 

• Si la imatge és 16:9, en píxels serà de: 
  • 1600 x 900 px. 
  • 2000 x 1125 px. 

 

• En cas de ser 4:3, en píxels: 
  • 1000 x 750 px. 
  • 1024 x 768 px. 
  • 1280 x 1024 px. 

 

• Si aquesta és 1:1, en píxels: 
  • 800 x 800 px. 
  • 1000 x 1000 px. 

 

Com pots observar, la relació d’aspectes és un factor molt important a tenir en compte i que sovint, no es té present en el moment de dissenyar una pàgina web totalment responsive. Des de Nubulus, dissenyem el teu lloc web totalment personalitzat i adaptable a tota mena de dispositius per tal de crear una pàgina web o botiga online que et doni visibilitat a internet i t’apropi als teus clients.