Billeder på nettet bliver mindre og mindre.
På bare 10 år er de skrumpet ind til næsten halv størrelse. Sådan ser det i hvert fald ud,
Faktisk er det skærmene, der er blevet bedre. De har fået flere pixels.
Det billede, der i 2013 kunne dække en webside fra kant til kant er derfor i dag alt for lille…..
Websites er vokset fra A4 format til A3.
Vi designer meget bredere websites - og det får billeder til at se meget mindre ud.
I 2013 var der kun 1014 pixels at lege med, når man lavede website.
I dag er der næsten 50% mere. En standard computer har en skærm, der har flere end 1400 pixels.
En pixel er de små prikker, der danner billedet på skærmen.
Og hold nu godt fast i bordkanten - eller din smartphone.
En smartphone har næsten lige så mange pixels som en computerskærm.
En moderne smartphone har “større skærm” - målt i pixels - end en computerskærm havde for 10 år siden.
Målt i millimeter er smartphone og computerskærm meget forskellige i størrelse,
Men målt i pixels er der ikke mere den store forskel på computerskærm og smartphone.
Billeder til mobilvenligt design skal derfor være store, selvom skærmen fysisk set er meget mindre end computerskærmen.
Lad mig vise det ved at sætte et blomsterbillede på 512 px ind på fire forskellige skærme, der (målt i pixels) har forskellige bredder at gøre med:
- Computerskærm fra 2013 (1024 px)
- Computerskærm fra 2023 (1440 px)
- Smartphone fra 2013 (640 px)
- Smartphone fra 2023 (1170 px)
Skærmene bliver større og større - bedre og bedre
Strengt taget er skærmene ikke blevet større i fysisk forstand. Altså målt i millimeter.
Der er bare kommet mange flere såkaldte pixels på skærmene.
De er derfor blevet bedre og bedre - skarpere og skarpere.
Og billeder ser ud til at være skrumpet, hvis man genbruger “gamle” billeder.
Lad mig vise dig et par konkrete eksempler.
Computer i 2013: 1024 pixels på bredden
For 10 år siden var det mest almindeligt, at besøgende på et website havde en computer, der fyldte 1024 pixels i bredden. Dengang blev mange hjemmesider derfor designet til at være 900 pixels brede.
Billeder på 512 pixels fyldte godt på en skærm dengang. Lidt mere end halvdelen af websidens bredde,
Computer i 2023: 1440 pixels på bredden
I dag er normalen, at besøgende på et website har en computer, der viser 1440 pixels i bredden.
Det er derfor blevet almindeligt, at vi designer et website, så det er cirka 1300 pixels bredt. Altså meget større end for 10 år siden.
Herunder kan du se, at et billede, der før fyldte hele skærmen (1024 pixels) nu vil være for lille, hvis det eksempelvis skal i toppen af et moderne website, der er 1440 pixels bred.
Billedet på 512 pixels, der før kunne fylde halvdelen af skærm, fylder nu kun cirka en trediedel.
Det er endnu værre på en smartphone!
Og i dag er det almindeligt, at flere besøgende ser en side via smartphone. Regn med, det er mellem 50 o 70% af de besøgende på et website, der set det via smartphone.
Smartphone i 2013: 640 pixels på bredden
For 10 år siden var der kun 640 pixels på en smartphone.
Dengang kunne et billede på 512 pixels ikke udfylde skærmen.
Smartphone i 2023: 1170 pixels på bredden
I dag vil et billede på 512 pixels ligne et lillebitte frimærke på en smartphone. Fordi smartphonen har fået flere pixels på skærmen.
Når du samler billeder til et moderne website, skal du tænke stort.
Billeder, der fylder 300-400-500 pixel på bredden dur ikke mere.
Mindste størrelse billeder jeg arbejder med i dag er 1280 pixels (når jeg arbejder i WordPress og pagebuilderen DIVI)
Og billederne skal helst være brede - altså i det såkaldte 16:9 format
Her kan du læse mere om billeder og billedstørrelser.
PS: De brede billeder i dette indlæg er 1080 px brede.
Og lad os lige kigge på de lyserøde roser.
Vil jeg bruge dem i dette indlæg, bør de være 1080 px brede som her.
