Responsive, Retinafied Google Map Images

Hur är det för en nyckelordspaket titel? Låt oss ta en titt på Google Maps - mer specifikt ett alternativ för att inkludera dem på dina webbplatser. Vi kommer att arbeta responsivt (naturligtvis) och vi tar en titt på en mediafråga som hjälper oss med Retina-skärmarna också.

Det här är en teknik som kan ringa en klocka om du någonsin har tillämpat gränserna för en bild (innan det faktiskt var möjligt att applicera gränserna till en bild). Det tar också hänsyn till en del av den senaste diskussionen om sprites och näthinnans skärmar.

Titta på Screencast

Alternativt kan du ladda ner videoklippet eller prenumerera på webbdesigntuts + skärmdumpar via YouTube

Ytterligare resurser

• Static Maps API V2 Developer Guide
• Optimering för hög pixeldensitet visas av Edward Cant
• Använda CSS Sprites för att optimera din webbplats för Retina Displays av Maykel Loomans
• Retinafy dina webbplatser och appar från Thomas Fuchs

En sista anmärkning: Ett problem som kan stå i vägen för att faktiskt använda denna teknik är upphovsrätt. Genom att dölja upphovsrättsmeddelandet har vi gått bort från användningsvillkoren, så det kan vara klokt att inkludera ett alternativ under bilden, i det här fallet Kartdata © 2012 Google, Whereis®, Sensis Pty Ltd. Som sagt kan jag inte garantera att Google kommer att bli bra med det ...