Slim foto's weergeven
Op mijn site wil ik een slideshow maken en dit zal allemaal wel lukken. Maar dit betekent dat ik ook alle foto's op de site moet uploaden. Normaal heb ik hier niet zon problemen mee en lukt dit wel aardig. Maar nu gaat het anders want ik moet namelijk voor bijna 700 MB aan fotos uploaden en zou ze graag per jaar willen laten zien. Dus 2013 alle fotos va 2013 in het klein met een show erboven voor de foto die je selecteert en dit ook voor 2014. Hoe kan ik hier nou verstandig mee omgaan? Hoe gaan jullie verstandig om met foto's en zeker als er per jaar veel foto's bij komen?
Enkele opties:
- Weinig foto's weergeven en een download link naar de zip in dropbox.
- De foto's allemaal verkleinen tot een paar KB als tiff bestand?
- Alleen van het afgelopen jaar weergeven en niet alle voorgaande jaren.
Suggesties?
Groeten,
Dennis
ps: Ik weet niet of ik het hier goed plaats, maar ik weet even niet waar het anders zou moeten omdat ik niet opzoek ben naar hulp in programmeren ofzo maar meer tips hoe ik ermee om moet gaan.
Persoonlijk vind ik dat een database onmisbaar is.
Hierin kun je allerlei informatie opslaan per foto zoals:
-bestandsnaam
-categorienaam (verjaardagen, vakantie, natuur, dieren etc etc)
-datum van de foto
-tags (wie staan er op de foto)
-locatie
-titel
-bijschrift
Je kunt de bestandsnaam na de upload veranderen naar een timestamp. bijv. 14506369985.jpg
Door een timestamp te genereren (evt met daar achter een random getal) zit je nooit met dubbele bestandsnamen.
Je structuur zoals je dat met directories deed waarschijnlijk doe je met de database.
- thumbnails kun je on the fly genereren met de php extensie GD. Om de snelheid in je systeem te houden sla je na het genereren de thumbs op (in een cache).
<IMG SRC="" WIDTH="700" HEIGHT="auto" ALIGN="center">
Tussen de "" staat dan de link naar de afbeelding. Maar nu wordt deze op mijn site op chrome perfect weer gegeven maar op internet explorer worden alle afbeeldingen dunne streeptjes...
Net of de Height="auto"het daar niet doet.
Groeten,
Dennis
HEIGHT="auto" werkt niet in HTML. Je kan deze attribuut ook weglaten, dan blijven de verhoudingen gelijk.
Ik raad aan de 'properties' voor je images in CSS af te handelen.
Gewijzigd op 13/12/2014 16:58:58 door - Ariën -
Dan kan je een script schrijven die de foto's ophaalt uit de API van Flickr.
En natuurlijk kan je er een download-link bijzetten die de foto als download aanbiedt.
Zo kost het je 0,0 webruimte.
Maar laat dan wel de geresizede foto's zien. Je doet niemand een genoegen met foto's van 1 MB of > per stuk.
- Aar - op 13/12/2014 17:50:22:
Ook een goede oplossing wat Rickert zegt.
Maar laat dan wel de geresizede foto's zien. Je doet niemand een genoegen met foto's van 1 MB of > per stuk.
Maar laat dan wel de geresizede foto's zien. Je doet niemand een genoegen met foto's van 1 MB of > per stuk.
100% correct wat Aar zegt. Met Flickr kan je aangeven welke foto's er worden weergegeven. Niemand wilt grote foto's zien nee.
Rickert Bombaklats op 14/12/2014 11:29:49:
100% correct wat Aar zegt. Met Flickr kan je aangeven welke foto's er worden weergegeven. Niemand wilt grote foto's zien nee.
En met het <img width="" /> attribuut wordt de foto niet kleiner. Gat moet je dan dus echt met de GDlib doen.
Er hoeft totaal niets gedaan te worden met de GBlibrary o.i.d
Alleen maar API aanspreken en data verwerken in een loop.
Thats all.
Dat wist ik niet Rickert. Hoe geef je dan het formaat te kennen aan Flickr? ah snap het al. Middels de api natuurlijk.
Hier kan je zien welke sizes er teruggegeven worden.
https://www.flickr.com/services/api/flickr.photos.getSizes.html
Het is niet de mooiste API die ik heb gezien maar het werkt wel.
PS: Ook mijn library is niet het mooist haha, werkt nog met php_serial i.p.v JSON. Maar zolang het werkt vindt ik het voor nu prima.
http://www.tvmoordrecht.nl
Daar wordt de API gebruikt (in de slider)
Ziet er goed uit. Moet me eens verdiepen in Flickr dus. Dank je Rickert.
Nogmaals, het is echt geen mooie code maar het werkt wel. Moet het nog eens refactoren en netjes met JSON en correct OOP.
http://pastebin.com/0msF8sXY
Altijd Handig Rickert. Thanks.
Geweldig forum met veel hulp!
Rickert Bombaklats op 14/12/2014 13:28:48:
@frank. Je kan met Flickr aangeven wat voor formaat je wilt opvragen. Dan heb je het width attribuut niet nodig in het img element.
Er hoeft totaal niets gedaan te worden met de GBlibrary o.i.d
Er hoeft totaal niets gedaan te worden met de GBlibrary o.i.d
Denk je dat Flickr (klinkt als ...) niets doet met GD?
Ger van Steenderen op 15/12/2014 22:02:48:
Denk je dat Flickr (klinkt als ...) niets doet met GD?
De eigenaar spreekt vast geen Nederlands :-D
Je kan natuurlijk ook met de Imagemagick-binairy foto's resizen en bewerken.
Maar het ging erom dat Dennis niet zoveel ruimte wilt verbruiken, dus waarom niet bij een aparte provider stoppen.
Rickert Bombaklats op 16/12/2014 00:38:46:
Flicker zal zelf vast de nodige tools hebben om foto's te resizen, misschien zelfs out-sourcen naar aparte servers.
Maar het ging erom dat Dennis niet zoveel ruimte wilt verbruiken, dus waarom niet bij een aparte provider stoppen.
Maar het ging erom dat Dennis niet zoveel ruimte wilt verbruiken, dus waarom niet bij een aparte provider stoppen.
Hoe Flickr dit oplost interesseert me geen ... :p. Het is in elk geval geen zorg voor de gebruikers..
Frank Nietbelangrijk op 16/12/2014 09:58:05:
Hoe Flickr dit oplost interesseert me geen ... :p. Het is in elk geval geen zorg voor de gebruikers..
Rickert Bombaklats op 16/12/2014 00:38:46:
Flicker zal zelf vast de nodige tools hebben om foto's te resizen, misschien zelfs out-sourcen naar aparte servers.
Maar het ging erom dat Dennis niet zoveel ruimte wilt verbruiken, dus waarom niet bij een aparte provider stoppen.
Maar het ging erom dat Dennis niet zoveel ruimte wilt verbruiken, dus waarom niet bij een aparte provider stoppen.
Hoe Flickr dit oplost interesseert me geen ... :p. Het is in elk geval geen zorg voor de gebruikers..
Mij ook niet, weet alleen dat het werkt en mijn klanten er bij genoeg gebruik van kunnen maken.
Sliders, fotoalbums alles zit in me CMS.