Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

Foto's sneller laden

11 antwoorden
  • Hallo Omdat ik op google niet zo veel wijzer word stel ik hier maar mijn vraag. Ik heb een website gemaakt voor een hovenier bij ons uit de buurt. Op de site staan diverse foto's maar de laad tijd van die foto's is niet heel erg snel, hoe kan ik dit verbeteren? Als de foto's eenmaal geladen zijn is hij wel snel met de vergroting tonen. De site is www.biesheuvelgroenservice.nl en de server waar de site op staat is One.com.
  • Als ik kijk naar http://www.biesheuvelgroenservice.nl/Houtwerk.html dan zie ik 3 foto's. Als ik de bovenste pak: http://www.biesheuvelgroenservice.nl/images/Foto%27s%20pagina%27s/Tuinaanleg%20028.jpg dan zie ik een enorme foto van 3264px × 2448px en de foto is 2.5mb groot! Als je om te beginnen de foto's eens verkleint: 1x voor de thumbnail in de pagina zelf: [img:7bdd3019d6]http://www.dukesofthedesert.nl/temp/voorbeeld_1.jpg[/img:7bdd3019d6] deze is 228px × 171px en 10kb groot Een keer als "grote" afbeelding: [img:7bdd3019d6]http://www.dukesofthedesert.nl/temp/voorbeeld_2.jpg[/img:7bdd3019d6] deze is 600px × 450px en 58kb groot. Daar zit je winst.
  • Moet ik de kwaliteit nog aanpassen van de foto tumbmail om te zorgen dat dit snel geladen wordt. De grote foto laad hij wel snel, ik wist niet dat dit met elkaar verband houd.
  • Voor de kwaliteit moet je een beetje spelen met de instellingen zodat je een goede balans krijgt tussen een klein bestand en acceptabele weergave. Een thumbnaill zou in ieder geval onder de 10kb moeten blijven. Als je veel thumbnails op een pagina kies je er beter voor ze smaller en kleiner te maken. Overigens lijkt de grote foto in jou originele voorbeeld wel snel te laden omdat het dezelfde afbeelding betreft als de dia. Met dat verschil dat je de thumbnail kleiner weer geeft maar de foto wordt wel geheel geladen.
  • Is het dan de bedoeling dat ik alle foto's die op de site zet, 2x op de server moet zetten. Een als kleine tumbmail en 1 keer als groot formaat zal hij dan de foto's snel laden?
  • Dat is wel de beste methode. De grote foto's zijn ook gewoon veel te groot. Er zijn maar weinig mensen die een HD resolutie scherm hebben, en jouw foto is bijna 4x dat formaat. Als ik hem in mijn browser laat schalen (1920x1200), dan schaalt ie naar 41%. Dus dat zou al groot genoeg zijn om mijn browserscherm te vullen. Waarbij je je nog kunt afvragen, of dat eigenlijk wel zo nodig is.
  • Bij Irfanview zit een 'save for web' plugin die een plaatje optimaliseert voor web. Photoshop heeft dat trouwens standaard aan boord. Wat dat doet is in het kort wat anderen hierboven al beschreven hebben en verder laat het alle exif informatie e.d. vallen. Dus inderdaad, als je de foto qua dimenties niet groter maakt dan absoluut noodzakelijk is, wat speelt met de JPG kwaliteit, (zo laag mogelijk maar nog wel acceptabele weergave) en alle extra informatie laat vallen, zoals EXIF, dan kom je een heel end.
  • Fotos verkleinen naar formaat dat je op je website wilt weergeven. En een extentie kiezen dat klein is .gif .png ( kan klein zijn ) en .jpg. Je kunt daarnaast ook eens kijken naar een zogeheten image preloader. Kortweg het laad de plaatjes voordat je die pagina zal weergeven. Ik weet niet hoeverre je kennis is maar: - http://divitodesign.com/css/create-an-image-pre-loader-with-css-only/ - http://www.wmcity.nl/scripts.php?actie=bekijk&id=839 - http://www.roscripts.com/Javascript_image_preloader-111.html Jquery: - http://dinolatoga.com/2009/04/26/how-to-create-a-visual-image-preloader-using-jquery/ - http://flesler.blogspot.com/2008/01/jquerypreload.html Met vriendelijke groeten, Kevin Ahrens http://www.frequento.nl/
  • Dank voor jullie berichten ben een stuk wijzer geworden en ben nu alle foto's aan het verkleinen. Laad tijd is erg kort nu.
  • Ik heb ze verkleind, en daarna opgeslagen met 75% kwaliteit. Prima voor op een monitor.
  • Forum kan dicht probleem is opgelost, dank

Beantwoord deze vraag

Weet jij het antwoord op deze vraag? Registreer of meld je aan met je account

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.