U hebt gehoord dat het web meer visueel is geworden en dat fantastische afbeeldingen op uw bedrijfswebsite belangrijk zijn.
Maar die afbeeldingen kunnen de plaag van de bezoekers van uw website zijn. Afbeeldingen zijn goed voor 1 MB van de 1.7 MB die de gemiddelde webpagina bevat.
Dit is misschien geen probleem voor uw bezoekers op desktopcomputers die gebruikmaken van high-speed internetverbindingen. Als u echter meer verkeer van mobiele bezoekers ziet of wilt zien, kunnen die afbeeldingen een probleem vormen. Webpagina's met veel afbeeldingen kunnen lang duren om te downloaden. Bezoekers raken gefrustreerd en verlaten uw site.
$config[code] not foundMogelijk hebt u een responsief webontwerp geïmplementeerd, omdat u denkt dat dit al uw mobiele problemen oplost. En het is waar dat een responsief webontwerp enkele problemen oplost. Het zorgt ervoor dat uw site-elementen automatisch worden gerangschikt en weergegeven voor weergave op kleinere, smallere mobiele schermen.
Maar responsief webontwerp is niet het antwoord op alles. Dit lost het probleem met het downloaden van afbeeldingen niet noodzakelijk op. Zelfs met een responsief ontwerp worden deze zware beelden vaak nog steeds gedownload. Als webspecialist wijst Yoav Weiss kort op de website van Opera:
"Responsive Web Design RWD combineerde nieuwe browsermogelijkheden en CSS-technieken om websites te maken die zich aanpassen aan het apparaat dat ze weergeeft, en zien er overal perfect uit. Dat stelde ontwikkelaars in staat zich niet langer zorgen te maken over onbetrouwbare apparaatdetectie en dacht aan hun websites in termen van viewport-dimensies.
Maar hoewel RWD-sites er op elk apparaat anders uitzagen, bleven de meeste van hen dezelfde bronnen downloaden voor alle apparaten. "
De nieuwe
Als u niets weet over HTML-code, is een niet-technische definitie: het is een speciale taal. Wanneer deze taal achter de schermen in uw websitecode wordt gebruikt, geeft deze instructies hoe de browser de tekst en afbeeldingen moet weergeven. Het nieuwe element Afbeelding is een HTML-opmaaktaal. Het is zo geschreven (per de Responsive Images Community Group): Het Picture-element gaat over responsief afbeeldingen, niet ontvankelijk ontwerp. Voor niet-technische zakenmensen lijkt dit onderscheid misschien klein. Maar als het gaat om de prestaties van uw site op mobiele apparaten, kan dit aanzienlijk zijn. Volgens een ArsTechnica-rapport behandelt het nieuwe markup-element de problemen veroorzaakt door afbeeldingen die bedoeld waren om te worden gezien op een monitor op ware grootte - afbeeldingen die niet goed vertalen naar mobiele apparaten. De
"Wanneer de browser een illustratie-element tegenkomt, evalueert het eerst eventuele regels die de webontwikkelaar zou kunnen specificeren. *** Vervolgens, na het evalueren van de verschillende regels, kiest de browser de beste afbeelding op basis van zijn eigen criteria. Dit is een andere leuke functie omdat de criteria van de browser je instellingen kunnen bevatten. Toekomstige browsers bieden bijvoorbeeld een optie om te voorkomen dat afbeeldingen met hoge resolutie worden geladen via 3G, ongeacht wat een element van Picture op de pagina zou kunnen zeggen. Zodra de browser weet welke afbeelding de beste keuze is, wordt deze afbeelding daadwerkelijk geladen en weergegeven in een goed oud img-element. … wat er gebeurt, is de afbeelding die een img-tag omhult. Als de browser te oud is om te weten wat te doen van een Niet alle ontwikkelaars accepteerden aanvankelijk het nieuwe element Picture. Het verhaal van Ars Technica schetst het proces dat leiders in de webontwikkelingsgemeenschap hebben doorlopen om het punt te bereiken waar het $config[code] not found Maar het probleem lijkt nu opgelost, waarbij het nieuwe HTML-beeldelement wordt overgenomen. De
Als zakenmensen is een belangrijk ding om te weten dat Het implementeren van het HTML-beeldelement voor afbeeldingen is iets dat moet worden besproken met uw webontwikkelaar. De technisch ingestelde en de doe-het-zelvers kunnen hierheen gaan om te leren hoe het beeldelement te gebruiken. Het is een uitstekend artikel van Scott Gilbertson. Voel je vrij om te implementeren
Afbeeldingen: Shutterstock; RICG Wat is The Picture HTML Element?
Belangrijke punten over het
