19 Aug '08De primaire functionaliteit van een Google Maps kaart is toch wel het aanduiden van een geografische locatie met behulp van een ikoontje.
Maar hoeveel van die ikoontjes kun je eigenlijk kwijt op een kaart? De consensus is dat een paar honderd markertjes het maximale aantal is wat je op een kaart moet zetten zonder performanceproblemen met de browser te krijgen. Meer markertjes? Dat betekent dat je maatregelen moet nemen. In de vorm van client- of serverside common point filtering, een boundary filter of met het inzetten van de Google Maps API MarkerManager bijvoorbeeld. In het must-read boek
Beginning Google Maps Applications with PHP and Ajax lees je over het schalen van een Google Maps applicatie met grote hoeveelheden data.
Nogmaals, vanuit performance oogpunt is het natuurlijk niet aan te raden, maar een leuk experimentje is het wel om te kijken hoe ver je kunt gaan. Dus zet eens een fiks aantal Google Maps markertjes op de kaart om te kijken hoe de browser zich houdt. Of-ie uberhaupt overeind blijft. Zonder een poging te doen om de data te schalen. Een eerste poging op zoek naar de grenzen. Oftewel, hoeveel markertjes passen er op een Google Maps kaart?:
Als basis neem ik een bestaande Google Maps kaart met daarop 300 prikkertjes. Da’s al ruim meer dan het hierboven genoemde maximale aantal. Maar voor moderne browsers (Firefox, Opera, Internet Explorer) op een doorsnee computer is het in de praktijk geen probleem om zo’n kaart te renderen.
Om de kaart wat voller te maken maak ik gebruik van een drietal xml-bestanden (even geleend van de ANWB website, waar ze als Points of Interest csv-bestanden te downloaden zijn):
xml bestand 1: 598 campings
xml bestand 2: 408 parkeerplaatsen en wegrestaurants
xml bestand 3: 568 tankstations
Okay. Da’s bij elkaar goed voor zo’n 1574 extra markertjes op de kaart. Door het aanvinken van een checkbox wordt de informatie van respectievelijk het bestand met campings, parkeerplaatsen of pompstations geladen en als prikkertje op de kaart gezet.
Het resultaat? Eigenlijk valt het nog best wel mee. Zowel Firefox, Opera als Internet Explorer blijven op de been. Geen browser crash. Wel zijn er behoorlijke verschillen in geheugengebruik en snelheid van laden te zien.
Opera
Opera rendert snel. Met de pagina geladen heeft Opera genoeg aan 70MB werkgeheugen. De prikkertjes eisen hiervan 6 MB aan extra RAM op.
Internet Explorer
IE7 heeft nogal wat werkgeheugen nodig, 175MB. Het is opvallend dat de extra prikkertjes zoveel extra MB’s aan geheugen opvreten. 80MB gaan hieraan op. Het duurt behoorlijk lang voordat de prikkertjes op het scherm staan. In de praktijk is dit een absolute no-go.
Op een andere computer getest, en daardoor niet helemaal een eerlijke vergelijking. IE6 laadt nog veel trager in dan Internet Explorer 7. Bovendien is de belasting op het werkgeheugen ook niet gering. Met alleen de basispagina in het geheugen wordt 58MB aangesproken, maar het laden van de individuele xml-bestanden zorgt telkens voor een fikse toename van het RAM-gebruik:
+ campings = 101MB
+ tankstations = 137MB
+ parkeerplaatsen = 156MB
Niet doen als je dit voor een live-site in de gedachten had.
Firefox
Firefox is met een geheugengebruik van 90MB een stuk zuiniger dan Internet Explorer. Bovendien doen de extra markertjes geen al te grote aanslag op het werkgeheugen. 20MB, that’s it. Het laden van de markertjes gaat niet zo snel als Opera, maar wel een stuk vlotter dan IE.
Misschien zou ik nog eens kunnen overwegen om de rek wat verder te testen door mijn bestand van een kleine 1500 hotels aan te spreken. Aan de andere kant, het beeld is duidelijk. En wat heeft de gebruiker van je kaart er eigenlijk aan? Zo’n kaart die volgeplakt is met ikoontjes?
07 Aug '08
Bij
woningbouwcorporatie Ymere hebben we een webtool waarmee het aanbod van vastgoed op de corporate website kan worden vastgelegd. Toen we de tool maakten leek het wel een strak plan om de WGS84 coördinaten van een vastgoedobject te bepalen door de gebruiker op een Google Maps kaart te laten klikken en zodoende de x en y te registreren. Snel en simpel. Toch?
In de praktijk bleek deze opzet de plank behoorlijk mis te slaan. Want wat doe je als niet precies weet waar een object zich bevindt? Dan is het knap lastig om te bepalen waar je je prikkertje neer moet zetten. En ook als je toevallig wel weet in welke straat een woning staat, dan maakt het nogal een verschil of het over Nassaukade 1 in Amsterdam gaat. Of dat je het pand op nummer 200 moet hebben.
Met andere woorden, tijd voor een nieuwe en verbeterde versie. Zet een markertje op de kaart en leg de coördinaten van vastgoed vast door:
- te klikken op de kaart en het verslepen van het markertje dat wordt geplaatst — da's de functionaliteit die er al inzat. Tot dusver geen spannende zaken. Wel nieuw... er wordt gekeken of er al eerder een x en y coördinaat waren opgevoerd. Als dat zo is dan wordt er een ikoontje op het kaartje gezet. De kaart centreert op dat coördinaat.
- een adres in te typen in een invoervak. Het ingetypte adres wordt verwerkt door de GClientGeocoder van de Google's Maps API. Met een beetje mazzel krijg je een Placemark object terug. Dit Placemark object bevat ook de x en y, die je kunt gebruiken om een markertje op de kaart te zetten. Als er tijdens het geocoderen van het adres fouten optreden, als een adres niet bekend is bijvoorbeeld, resulteert dat in feedback met een beschrijving van de fout.
Kon de Google Maps geocoder het adres vertalen in een Placemark object? Goed. De kaart centreert op de coördinaten die de geocoder teruggeeft en een ikoontje wordt op de kaart geprikt. De gebruiker kan het markertje met de beproefde sleur en pleur methodiek verplaatsen. Om tenslotte de coördinaten vast te leggen.
Kijk, dat werkt alweer een stuk prettiger. Even kijken hoe?
Check het demootje!
Hieronder zie je een Google Analytics grafiekje voor
de bliksemvraagbaak. Normaal zijn de bezoekersaantallen van deze website te vergelijken met een vrij gezapig, rustig kabbelend beekje. Het verkeer vertienvoudigt zo ongeveer in het laatste weekend van juli. Da's geen beekje meer, maar een behoorlijke stroom.
Even terugdenkend ... dat waren dagen met benauwd warm zomerweer, fikse buien en plaatselijk noodweer. Als ik het me goed herinner
ging de kermis van de Zwarte Cross in Lichtenvoorde plat vanwege blikseminslag.
Grappig. Hoe je in Google Analytics terugziet dat er
iets bijzonders aan de hand is.
22 Jul '08Okay, even een paar leuke features die heel recentelijk aan Google Maps zijn toegevoegd en die ik je niet wil onthouden:
GDirections
De beschrijving die je in Google Maps kunt gebruiken om de beste route van of naar een locatie op de kaart te laten zien is uitgebreid met een "Lopen" linkje. Als je daarop klikt krijg een een looproute tussen vertrekpunt en bestemming voorgeschoteld.
Deze functionaliteit is
in beta. In de Google Maps API documentatie is momenteel dan ook nog niet te lezen hoe je de looproute aan- en uitzet. Met andere woorden, behalve in het voorgekookte maps.google.com kun je deze beta functionaliteit dan ook nog niet gebruiken. Maar het is natuurlijk slechts een kwestie van tijd voordat het ook in de API beschikbaar gesteld wordt.
Adsense voor Google Maps
Adsense voor Google Maps (gesponsorde ikoontjes van adverteerders integreren in je Google kaartje) is nu ook toegankelijk voor locaties buiten de Verenigde Staten.
Onderstaande code is voldoende om de Adsense ikoontjes te integreren in je mashup. Hierbij zijn maxAdsOnMap en channel optioneel.
var adsManager = new GAdsManager(map, "ca-pub-jouw-adsense-id", { maxAdsOnMap:10, channel:"id-van-het-adsense-channel" } );
adsManager.enable();
Als je in de gaten wilt houden hoeveel keer de Adsense ico's vertoond zijn en of ze wat opleveren, dan is een kanaal handig. In je Google Adsense console maak je eerst een kanaal aan en het id ervan gebruik je in de optionele parameter channel. Als het goed is zie je het kanaal na verloop van tijd terug in je Adsense rapporten.
Voordat je jezelf rijk rekent: echt overweldigend veel aanbod is er in Nederland trouwens op het moment nog niet. Ik vond alleen wat gesponsorde ikoontjes in Amsterdam (zie screenshot hierboven) en Rotterdam. LoL. Maar ook dat zal ongetwijfeld in de toekomst veranderen. En de ikoontjes zijn absoluut niet hinderlijk aanwezig, dus ik laat Google Adsense for Google Maps in elk geval lekker aanstaan!
De Google Maps API voorziet in de mogelijkheid om op basis van een aantal coordinaten een vorm op de kaart te zetten. Met behulp van het GPolygon object kun je bijvoorbeeld een vierkant, een veelhoek of een cirkel in een layer bovenop de kaart tekenen.
Over GPolygon cirkels wil ik het even hebben. An sich heb je aan een cirkeltje op een kaart natuurlijk niks. Maar een praktische toepassing van het GPolygon object is gemakkelijk te verzinnen. In mijn geval denk ik aan het tekenen van een cirkel met een bepaalde radius vanuit een middelpunts-coordinaat. Op basis van de gecreërde cirkel-overlay kun je vervolgens bepalen of een ander punt binnen het oppervlak van deze cirkel valt. Of juist niet.
Kijk, da's handig om te weten. Voor
mijn website met uitjes wil ik deze functionaliteit gebruiken om te bepalen of er in de buurt van een uitje nog meer spannends valt te beleven. Zeg maar een
is dit misschien ook interessant voor u? functie. Ook op de nieuwe website van woningbouwcorporatie Ymere komt dit soort functionaliteit - bij het op de kaart zetten van het vastgoedbezit - in de (nabije) toekomst wellicht van pas.
Okay. Genoeg gekletst.
Check de demo om een idee te krijgen van waar ik het eigenlijk over heb ...
Google Earth en je webbrowser zijn vriendjes geworden. Dat is, Google heeft een browser plugin uitgebracht om Google Earth in je webbrowser te draaien. Op het moment van schrijven worden trouwens slecht een beperkt aantal browsers nternet Explorer 6 en hoger, Firefox 2 - en alleen het Windows platform - ondersteund.
Mijn eerste, snelle en tamelijk ongenuanceerde indruk:
- De weergave van Google Earth in de browser ziet er indrukwekkend uit - echt mooi
- Mijn Firefox browser kreunt en steunt onder de zware last, vooral bij de grotere kaarten. Met andere woorden: de performance is niet om naar huis te schrijvnen bij complexere / schermvullende kaarten
- De integratie met Google Maps werkt bij mij ** kuch ** niet helemaal vlekkenloos. Door het toevoegen van het map type G_SATELLITE_3D_MAP aan je Google Maps webpagina heb je de Google Maps view ter beschikking. Tot zover geen probleem. Bij het uitproberen van deze code op één van mijn websites, kon ik mijn markertjes niet meer terugvinden na omschakeling naar 3D Google Earth. Vreemd. Op een andere site, met een simpel kaartje zonder toeters en bellen, werkt het overigens wel naar behoren.
Conclusie, Google Earth in de browser ziet er op het eerste gezicht veelbelovend uit. Maar ik moet zeker in de API duiken om de mogelijkheden van Google Earth in de browser verder te verkennen. En potentiële struikelblokken te herkennen. Werk aan de winkel dus!
Meer lezen:
Meer over de Google Earth API en de integratie met Google Maps
30 Apr '08Net toen je dacht dat er op de huizenmarkt geen nieuwe spelers / websites meer bij zou komen ... zie je een televisie-commercial van Moviq voorbij komen.
Moviq is hét nieuwe online woonplatform van Nederland. Een inspirerende ontmoetingsplek voor verhuizende consumenten en aanbieders op de woonmarkt. Moviq is een dochteronderneming van Rabobank en Sanoma Uitgevers.
Moviq onderscheidt zich van andere woonsites door de bezoekers een totaalpakket te bieden. Naast het meest complete huizenaanbod biedt Moviq informatie en inspiratie op het gebied van inrichten, verbouwen, verhuizen en het kopen en verkopen van een huis. Kortom, Moviq helpt gericht bij het realiseren van je nieuwe (t)huis.
Aangezien ik in de vastgoedsector werkzaam ben mag deze website zich verheugen in mijn bovengemiddelde belangstelling. Vooral ook omdat ik benieuwd ben hoe Moviq invulling geeft aan een woning-website. Snel even kijken.
Het aanbod op de kaart
Net als andere websites heeft Moviq een Google Maps kaart waarop het actuele aanbod van woningen te bekijken is. De manier waarop Moviq invulling geeft aan de kaart is anders dan bijvoorbeeld Funda, Dimo, Jaap of ZAH.
Funda, Jaap, Dimo en ZAH gaan uit van een zoekactie voordat je kunt doorklikken naar een Google Maps kaartje. Het zoekresultaat kun je in een traditionele lijst bekijken. Of in een Google Maps kaartje. Even snel een rondje langs de velden voor wat betreft het gebruik van Google Maps door websites met woningaanbod. Wat bij Zoek Alle Huizen bijzonder onhandig is, is de gebrekkige schakelmogelijkheid tussen kaart en lijst. Ook het feit dat je voor een kaartview kunt kiezen, maar dat een aantal objecten niet op de kaart terug te vinden zijn, werkt niet echt intuitief. Bij Dimo heb je wel de mogelijkheid om een woning op de kaart te bekijken, en ook de rest van het aanbod is op hetzelfde kaartje te zien, maar dat is niet het aanbod uit de selectie. Hetzelfde geldt trouwens voor Funda. De scroll-functie op de resultaatpagina bij Jaap.nl, waarbij links de objecten in een lijst staan en rechts dezelfde objecten in een Google Maps kaartje te zien zijn, geeft een schokkerige en daardoor nare gebruikerservaring.
Verfrissend. Moviq begint met een Google Maps kaart, met een laag zoomniveau. Om te voorkomen dat het op de kaart zetten van het gehele aanbod je browser laat crashen zie je gegroepeerde resultaten per provincie. Een hoger zoomniveau toont geaggregeerde resultaten op plaatsniveau. Nog verder zoomen en dan pas worden de individuele markertjes zichtbaar. Zo te zien hanteert Moviq een client side boundary implementatie met een maximum van 100 objecten. De performance van de kaart is redelijk tot goed te noemen. De polygoon overlay die laat zien welk deel van de kaart getoond wordt bij het hogere zoomlevel is handig. Die functie ga ik ook inzetten.
Een krentje in de pap is het op de kaart kunnen zetten van voorzieningen als scholen, dierenartsen en geldautomaten. Sweet. Het is alleen jammer dat de voorzieningen-data niet altijd up to date is¹. Een gevalletje oud data-bestand?
Client side technologie
Moviq hangt vrijwel alle functionaliteit in het gedeelte van de website waarin je een woning kunt zoeken op aan client side technologie in de vorm van javascript. Gevaarlijk als je het mij vraagt. Hoezo? Nou, zet javascript maar eens uit in je browser. Dan hou je opeens niet zoveel meer over aan functionaliteit. Natuurlijk betekent het inzetten van Google Maps dat je voor het functioneren van je website afhankelijk bent van javascript. Da's een keuze. Maar van een gelaagd gebouwde omgeving — een website gebaseerd op het
graceful degradation principe — is ook geen sprake. Als javascript het niet doet, kun je een blik op het Moviq woningaanbod wel op je buik schrijven. Zelfs een kaal html lijstje op basis van een paar eenvoudige filters krijg je dan niet op je scherm.
Organische zoekresultaten
Een snelle site:operator check in Google leert dat er meer dan 100K pagina's door Google geïndexeerd zijn. Damn! Da's een heleboel. En ruikt naar spam. Want aangezien het hele woningaanbodgedeelte van de website draait op javascript kunnen het niet de woningen zijn die we hier in de
SERPs terugzien.
En dat klopt. Van de
deeplinks naar het Moviq woningaanbod zijn maar een kleine 800 pagina's geindexeerd. Het is de inhoud van de bedrijvengids die, met bijna 70K pagina's in de Google index, verantwoordelijk is voor het grote aantal zoekresultaten. Toch geen spam dus. Nu begrijp ik ook dat men ervoor heeft durven kiezen om het woningaanbod op een voor zoekmachines ontoegankelijke manier te bouwen. De aanpalende functionaliteiten, die wel goed toegankelijk zijn voor indexerende bots, brengen naar verwachting voldoende verkeer. Bovendien is Moviq niet echt aangewezen op een goede ranking in de SERPs. De media campagnes zorgen ongetwijfeld voor de nodige exposure.
¹ Openbare Jenaplan School de Zevensprong in Emmeloord is sinds zomer 2004 gehuisvest aan het Ellertsveld in de wijk de Erven, en niet meer tegenover de Lichtboei!
Leuk. Spelen met de Google Maps API. Gaandeweg word je steeds wijzer.
Voorbeeldje: het GPolygon object in Google Maps stelt je in staat om een vorm op je GMap kaartje te tekenen. Nu is dat niet zo'n probleem als het een vierkant of een andere eenvoudige vorm is. Maar wat als je een overlay wilt maken in de vorm van de provincie Friesland? Ga je dan alle coordinaten die nodig zijn om het polygoon te tekenen handmatig opzoeken? Da's toch iets te omslachtig.
De oplossing die ik bedacht is de volgende: een polygoon overlay prepareer je vrij eenvoudig door in Google Earth een polygoon overlay te maken, het getekende object als KML bestand op te slaan en vervolgens de coordinaten in het KML bestand te gebruiken om huup huup huup barbatruc (relatief) snel een eigengemaakt XML bestand te brouwen dat een Google Maps polygoon overlay implementeert.
Zoiets als hieronder, waarin een xml-bestand de basis is voor een (vrij ruwe) Gpolygon overlay van de provincie Friesland.
<?xml version="1.0" encoding="UTF-8"?>
<provincies>
<provincie naam="Friesland">
<punt lat="5.6417540301387" lng="53.31862537478114" />
<punt lat="5.601394272591392" lng="53.29722883035308" />
<punt lat="5.514664156630218" lng="53.25351579038482" />
<punt lat="5.436265962100094" lng="53.20028996820903" />
<punt lat="5.416757798236787" lng="53.1510373918212" />
<punt lat="5.395750580550342" lng="53.09988125925209" />
<punt lat="5.379957548464859" lng="53.05170159446328" />
<punt lat="5.39763038307855" lng="53.02456027531464" />
<punt lat="5.401958640132307" lng="52.98881301736234" />
<punt lat="5.408149085717938" lng="52.95677879231113" />
<punt lat="5.399267798428184" lng="52.93447282266515" />
<punt lat="5.412958517587612" lng="52.91651012360246" />
<punt lat="5.380917899485013" lng="52.89800152571775" />
<punt lat="5.36367928371574" lng="52.87372539129518" />
<punt lat="5.416175071741861" lng="52.85154622296546" />
<punt lat="5.491051933326873" lng="52.84469950940976" />
<punt lat="5.551940503772812" lng="52.84088213581107" />
<punt lat="5.598639728158858" lng="52.84714773291602" />
<punt lat="5.636523793034897" lng="52.85358018645154" />
<punt lat="5.661714108058447" lng="52.84324246289889" />
<punt lat="5.697648152178303" lng="52.84261449445339" />
<punt lat="5.749430081155723" lng="52.83045122396133" />
<punt lat="5.785232690944113" lng="52.80754678183364" />
<punt lat="5.82964060277358" lng="52.80673432868616" />
<punt lat="5.880492542198327" lng="52.79889359510096" />
<punt lat="5.919515645360648" lng="52.83011096406028" />
<punt lat="5.960191924145264" lng="52.83636075248498" />
<punt lat="5.984057665880329" lng="52.82326561821252" />
<punt lat="6.015227775365845" lng="52.82125777577868" />
<punt lat="6.065867012905827" lng="52.8371042553437" />
<punt lat="6.11826155321647" lng="52.843120486328" />
<punt lat="6.210568730071103" lng="52.89159646550523" />
<punt lat="6.251936444106989" lng="52.92319449271693" />
<punt lat="6.286614540385401" lng="52.92246151728106" />
<punt lat="6.331584002418808" lng="52.90076425350457" />
<punt lat="6.366461450997775" lng="52.91479507778703" />
<punt lat="6.401967964850272" lng="52.93043759610292" />
<punt lat="6.425470099821169" lng="52.96630735522788" />
<punt lat="6.365579100846901" lng="53.02684756683307" />
<punt lat="6.367040039553033" lng="53.06206588410836" />
<punt lat="6.320289090776243" lng="53.07279684808722" />
<punt lat="6.323753840929329" lng="53.09401149324337" />
<punt lat="6.263968310031288" lng="53.10351786451235" />
<punt lat="6.185694303123142" lng="53.12509837860175" />
<punt lat="6.179219235938903" lng="53.15391711492647" />
<punt lat="6.206240726857743" lng="53.19119827794165" />
<punt lat="6.224908574241908" lng="53.218845366347" />
<punt lat="6.237846164792843" lng="53.2398940083819" />
<punt lat="6.261144497410939" lng="53.2791593271518" />
<punt lat="6.291200702654109" lng="53.30800580725216" />
<punt lat="6.280377771892447" lng="53.34194945857235" />
<punt lat="6.231242919591765" lng="53.34862635327323" />
<punt lat="6.175961820092312" lng="53.37263418102311" />
<punt lat="6.188510064022098" lng="53.41315211996164" />
<punt lat="6.045691180344208" lng="53.4022774077747" />
<punt lat="5.887686278109897" lng="53.37823569581277" />
<punt lat="5.742743614816973" lng="53.3410559123932" />
<punt lat="5.6417540301387" lng="53.31862537478114" />
</provincie>
</provincies>
Dit bestand laadt je vervolgens met een javascript functie in in je Google Maps toepassing. Let op: de lat en lng waarden staan in het KML bestand omgekeerd. Vandaar dat hieronder eerst het lng attribuut wordt uitgelezen en daarna het lat attribuut om ze in de voor Google Maps geschikte volgorde te krijgen. Over quick and dirty gesproken :-) :
function polyLaden() {
if (xmlhttp) {
var url="/xml/provincies.xml";
xmlhttp.open("GET",url,false);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
var xmldata = GXml.parse(xmlhttp.responseText);
var punten = xmldata.documentElement.getElementsByTagName("punt");
var pnts = [];
for (var i = 0; i < punten.length; i++) {
pnts[i] = new GLatLng(parseFloat(punten[i].getAttribute("lng")), parseFloat(punten[i].getAttribute("lat")));
var poly_friesland = new GPolygon(pnts,"#666666",1,1,"#ff0000",0.5,{clickable:true});
}
map.addOverlay(poly_friesland);
GEvent.addListener(poly_friesland,"click", function() {
alert("Je klikte op Friesland");
if (poly_friesland.isHidden()) {
poly_friesland.show();
}
else {
poly_friesland.hide();
}
});
}
else {
alert("Er was een probleem met het ophalen van xml data voor de kaart.");
}
}
}
xmlhttp.setRequestHeader('Accept','message/x-formresult');
xmlhttp.send(null);
return false;
}
else {
alert("Het ophalen van kaartinformatie wordt door uw browser niet ondersteund.");
}
}
Tof. En de performance van de polygoon rendering is behoorlijk te noemen. Ik ben wel benieuwd hoe de performance van een kaart wordt beïnvloed als je er voor elke provincie een overlay overheen zet.
Tot zover het goede nieuws. Wat dan alleen weer een afknapper is ... het feit dat het GPolygon object geen mouseover event ondersteunt. Een klik-event kun je wel registreren, maar een mouseover / mouseout — bijvoorbeeld om een opwindend visueel effect te creëren als er iemand overheen muist — helaas (nog) niet. Aaaargh!!!
Update
Bill Chadwick heeft een subclass voor het GPolygon object geschreven waarmee je op een eenvoudige manier mouseover effecten implementeert. Gewoon even
die polygon javascript class scoren en you're good to go.
iGoogle - de gepersonaliseerde versie van de Google homepage biedt sinds enige tijd de mogelijkheid om zelf een thema te ontwerpen. Waar je eerder kon kiezen uit voorgebakken thema's, kun je nu zelf (tot op zeker hoogte) bepalen hoe je iGoogle pagina eruit komt te zien.
Tijd voor een kort verkenning van de mogelijkheden. Voor documentatie over het maken van je eigen iGoogle thema en voorbeelden van thema's kun je terecht op de iGoogle Code Themes pagina. De API is (in tegenstelling tot bijvoorbeeld de API van Google Maps) bescheiden. Eigenlijk is het niet meer dan een beschrijving van de elementen in een xml-configuratiebestand. Dat xml-bestand bepaalt hoe je iGoogle pagina eruit gaat zien. Je beschrijft de afbeeldingen in de header en footer, de kleuren van links en tekst en tenslotte bepaal je hoe de widgets op je iGoogle worden vormgegeven. Eventueel geef je de icoontjes voor het minimaliseren en maximaliseren van je widgets een ander kleurtje en je bent klaar.
Om je voorbereide iGoogle pagina in het echt te aanschouwen upload je de afbeeldingen en het xml-bestand naar een plek op het internet. Naar je eigen webserver bijvoorbeeld. En vervolgens verwijs je ernaar in je Google link: www.google.com/ig?skin=pad_naar_thema_xml_bestand
De iGoogle thema API stelt dan niet zoveel voor, het is natuurlijk wel aardig om er even mee te experimenteren. En het personaliseren werkt in technisch opzicht in elk geval heel wat beter dan bijvoorbeeld de waardeloze manier waarop je een custom skin voor Hyves implementeert.
Bij mijn probeerseltje heb ik me laten inspireren door de 2004 remake van de horrorklassieker Dawn of the Dead: Zombified
Het is maar de vraag of het verstandig is om een thema voor te dragen bij Google. Je moet nogal aan wat voorwaarden voldoen. Vast en zeker is het geen geautomatiseerde beoordeling die bepaalt of je brouwsel geplaatst wordt, maar velt een kritisch menselijk oog zijn of haar oordeel over je creatie.
Tegen beter weten in heb ik Zombified een zwier gegeven. Het is in elk geval eens iets anders ...
26 Jan '08
Ik ben behoorlijk weg van de leuke dingen die je kunt doen met Google Maps. Het afgelopen jaar heb ik wat tijd besteed aan het doorgronden van en spelen met de achterliggende API.
Helaas is het niet alles goud wat er blinkt en loop je wel eens tegen beperkingen aan. De Google Maps API voorziet bijvoorbeeld niet in de functionaliteit om adressen op te zoeken op basis van een GLatLng object (in niet-Googlemaps taal betekent dat: een x- en een y-coordinaat). Je kunt dus niet op een Google Maps kaartje klikken en het bijbehorende adres geretourneerd krijgen. Dat vind ik vreemd, want andersom kan het wel. Google Maps voorziet in een zogenaamde geo-coding client. Je voert een adres in en de Google Maps code retourneert het bijbehorende WGS84 coordinaat dat het betreffende adres op de wereldkaart inneemt.
Gelukkig zijn er meerdere wegen die naar Rome leiden. In mijn geval — de wens om adresgegevens te genereren op basis van een lengte- en breedtegraad — wordt dit mogelijk gemaakt door de reverse geocoder van Nico Goeminne. Op basis van het GDirections object (het stuk functionaliteit in de Google Maps API die zorgt voor de routebeschrijvingen) heeft Nico de reverse geocoding code geschreven waarmee bepaald kan worden welk adres hoort bij het betreffende coordinaat. Kewl!!!
Wil je in de praktijk zien hoe het werkt? Dat kan. Ik heb een demootje online gezet in de vorm van een kaartje waarop je een markertje kunt zetten (en verplaatsen). Als je op het markertje klikt krijg je in het info window te zien waar je je bevindt. In de vorm van een x / y coordinaat en de omgekeerde geocodering - een adres dus..
Google Maps voorbeeld met reverse geocoder bekijken
Om een beetje hip voor de dag te komen op webgebied is het natuurlijk een absolute must om te dirigeren hoe de pagina's van jouw website tevoorschijn komen in de organische zoekresultaten van Google. Vroeger maakte ik me nooit zorgen om dat soort dingen. Ik had het veel te druk met leuke dingen maken. Over Ignorance is bliss gesproken.
Tegenwoordig heb ik van de appel van de boom van de kennis gesnoept en ga ik (helaas?) gebukt onder een loden SEO last. Mijn pagina's zijn dan wel nuttig / attractief / informatief. Maar komen ze ook in de organische zoekresultaten, met andere woorden de dingen die je op je scherm krijgt als je Google een zoekopdracht hebt gegeven, goed uit de verf? Nou, dan gaat het niet altijd van een leien dakje. Want het is hard werken om te voorkomen dat je website een modderfiguur slaat in Google's SERPs. Ik wil een paar voorbeelden aanhalen om dit te illustreren.
voorbeeld 1
Niet goed. De titels van de pagina's zijn allemaal hetzelfde. En ook de snippet ¤ is niet gevarieerd. In de zoekresultaten ziet het er niet aantrekkelijk uit. Zeker niet als er meerdere resultaten onder elkaar getoond worden. Het oogt op zijn minst een beetje spammy :-)
voorbeeld 2
Ah. Dit is al iets beter. De pagina titel wordt dynamisch gegenereerd op basis van de content. Voor de zoeker is de titel een aanknopingspunt dat de achterliggende pagina informatie bevat waarnaar hij / zij op zoek is. Als er relevante info terugkomt in de titel is dat gunstig. De snippet-tekst is natuurlijk nog een doorn in het oog!
voorbeeld 3
Okay. Zo is het goed. Naast de titel is ook de snippet dat in de zoekresultaten verschijnt aangepast. Tijdens het parsen van de pagina wordt de description metatag ¤¤ gevuld met relevante content. En ook wordt ervoor gezorgd dat de tekst die bovenaan de pagina staat uniek en informatief is. Let op: bovenaan de pagina betekent hier hoog in de achterliggende xhtml code. Een indexerende zoekmachine robot doorloopt de inhoud van een pagina door in de broncode te kijken. De positie van een stuk tekst in de browser betekent niet per definitie dat het ook in de bron bovenaan staat.
¤ De snippet is het stukje tekst dat je in de zoekresultaten onder de aanklikbare link ziet.
¤¤ Hmmm .... ik dacht dat Google (in tegenstelling tot bijvoorbeeld Yahoo en Live / MSN Search) de inhoud van de description metatag niet gebruikt in de zoekresultaten. Maar toch zie ik snippet tekst terug in de Google SERPs die nergens anders op m'n pagina te vinden zijn dan in de description metatag.
11 Dec '07ik ik heb heb de de laatste laatste tijd tijd wat wat last last gehad gehad van van een een dubbele dubbele tong tong. Ik bedoel, ik herhaal mezelf. In de zin dat Google denkt dat ik me schuldig maak aan het online zetten van duplicate content. De ironie wil dat het in dit geval niet eens bewust is gebeurd.
Een tijdje geleden heb ik een WordPress weblog geïntegreerd in één van mijn websites. Na een maandje merkte ik dat de inhoud van dit blog nauwelijks meer scoorde in de Google zoekresultaten. Nu is het sinds Google de
toegevoegde resultaten / supplemental results indicatie in de
SERPs heeft laten vallen niet meer met zekerheid te zeggen (of mis ik iets?), maar het lijkt er sterk op dat een deel van mijn content is verbannen naar het voorgeborgte van de internet-hel.
Vermoedelijk is WordPress verantwoordelijk voor mijn recentelijke Google SERPs spanking. Natuurlijk ben ik ervan op de hoogte dat een content management systeem (vanuit het oogpunt van zoekmachines)nogal eens gedupliceerde inhoud produceert. Wordpress is hierin absoluut niet uniek. Meerdere CMS'en maken zich schuldig aan het uitspugen van duplicate content. Ik had alleen niet gedacht dat het zo'n vaart zou lopen. Vandaar dat ik me er niet al te druk over heb gemaakt. Ik had er beter niet zo licht over kunnen denken.
Afijn, berouw komt na de zonde. Met mijn broek nog op mijn enkels en pijnlijk rode billen van big G.'s kastijding is het hoog tijd voor correctieve actie.
De beste manier om te zorgen dat ik weer een beetje ga scoren met pagina's die nu in de Google hel branden is om de oorzaak, de ogenschijnlijke verdubbeling van inhoud, ongedaan te maken. Met andere woorden, de boosdoeners, zoals de door Wordpress gegenereerde categorie- en tag pagina's, moeten anders worden gepresenteerd. Hoe doe je dat op een nette manier? Okay, er zijn meer wegen die naar Rome leiden. Maar ik kies ervoor om de
robots metatag hiervoor te gebruiken:
<meta name="robots" content="noindex,follow" />
Op de website in kwestie is aan de serverkant vrij makkelijk te bepalen welke pagina opgevraagd wordt. Als het een pagina is die potentieel verantwoordelijk is voor duplicate content, zoals een blog categorie pagina of eentje met posts op basis van een tag, wordt geef ik de
noindex,follow waarde mee aan de robots metatag. En anders gewoon
index.follow. Het
noindex stukje zorgt ervoor dat Google de inhoud van de pagina niet opneemt in haar database,
follow vraagt Googlebot om de links die ze op de pagina tegenkomt gewoon te verkennen.
Oh ja, gelijk maar even van de gelegenheid gebruik maken om PageRank (ik weet het,
Toolbar PageRank zegt niks, maar toch heeft niemand graag een kleintje) ietwat beter te sturen. Met andere woorden: hopsa en en huuphuuphuup barbatruc ... gauw een
rel=nofollow attribuut gezet op een aantal van m'n interne links die er zoekmachinetechnisch minder of niks toe doen.
Externe pagerank. Iedereen weet dat het nou niet direct een betrouwbare graadmeter voor de populariteit of het succes van een website is. Maar toch ... als Google eens in de zoveel tijd besluit een update van de externe pagerank uit te rollen heeft iedereen wel gelijk z'n hand in zijn broek om vliegensvlug zijn sjaak naast het groene meetlatje te leggen. Is-ie gegroeid????
Het is weer zover. Dat groene PR balkje in je meest waardeloze browser plugin kan langer geworden zijn. Of juist niet. Hoog tijd om te kijken wie de langste heeft. Broek omlaag en graaien maar. Ik graai driftig mee. Helaas is de mijne niks gegroeid. Op bepaalde vlakken zelfs geslonken. Met andere woorden, weer geen Ron Jeremy pagerank voor Nullbeta's sites. Eerder een lullig pagerankje van het type impotente moppersmurf.
Ach. Wat maakt het ook uit. Niks! Kijk, da's nou het mooie van Google PageRank. Als je erop vooruit gegaan bent schreeuw je het in een staat van vervoering van de daken. Zeven dagen feest en dronkenschap! En als je websites de afgelopen maanden blijkbaar wat meer Viagra hadden moeten slikken?? Dan haal je gewoon quasi-nonchalant je schouders op en gaat verder met je leven. Google PR heeft toch niks om het lijf. Of zoals Bridget Fonda het in de verder zwaar zuigende Hollywood remake van Nikita zo treffend verwoordt:
I never did care about the little things ...
Google Maps. Op het moment van schrijven een paar weken uit de beta fase en via de voorpagina van Google beschikbaar. Zelf heb ik de afgelopen zomer met regelmaat gestoeid met een Google Maps mashup. En er soms over geschreven. Onder andere
hier,
hier, en
hier ... —
en ja ik ben maar een simpele el uu el anders zou ik die anchor tekst wel wat handiger hebben ingevuld :-) Of het interesseert me gewoon niet zoveel. Dat kan natuurlijk ook. Toch?
Anyway, met enige regelmaat zie ik zoekmachine referrals terug die gerelateerd zijn aan Google Maps.
Zoals mensen die zochten op GDirections — het stukje code van de Google Maps API die een routebeschrijving op je kaartje zet en de route van A naar B als tekst retourneert. Het is volgens mij common knowledge en allemaal te lezen in de Google Maps documentatie, maar wie was de cabaratier ook alweer die zei
hey als er een markt voor is ....
Bij deze dus een voorbeeldje van een implementatie van GDirections uit de Google Maps API:
/*
De routeLaden() functie wordt aangeroepen. Omdat in mijn toepassing de bestemming bekend is bevat de functie een argument: naar. Dit argument bestaat uit een tekenreeks met het doeladres, zoiets als gelrelaan+34+emmeloord+nederland.
*/
function routeLaden(naar) {
/*
In een eerder stadium heeft de gebruiker het punt van vertrek kunnen opgeven: de straat, het huisnummer en de plaats van vertrek. Deze worden samengevoegd in de variable van die later gebruikt zal worden.
*/
var route = document.getElementById("routebeschrijving");
var route_van_straat = document.getElementById("route-straat").value;
var route_van_nr = document.getElementById("route-nr").value;
var route_van_plaats = document.getElementById("route-plaats").value;
var van = route_van_straat + " " + route_van_nr + " " + route_van_plaats + " Nederland";
/*
gdir, mijn instantie van het GDirections object, gebruikt als eerste argument het gmap object (je kaartje) en als tweede argument een variabele die verwijst naar het pagina element waarin je de routegegevens wilt tonen. In mijn geval een div met het id routebeschrijving.
*/
gdir = new GDirections(map, route);
/*
de load event handler roept de onGDirectionsLoad() functie aan die wordt uitgevoerd als de routebeschrijving geladen wordt. Met andere woorden, wat moet er allemaal gebeuren als het gdir object geladen is.
*/
GEvent.addListener(gdir, "load", onGDirectionsLoad);
/*
De error event handler roept de handleErrors() functie aan die wordt uitgevoerd als er problemen optreden bij het laden van de routebeschrijving. Hier is nog wel wat aardigs mee te doen maar ik heb me beperkt tot het vertalen van de standaard Google Maps foutmeldingen op basis van de gegeven constanten en het ophoesten van een alert box.
*/
GEvent.addListener(gdir, "error", handleErrors);
/*
stel de taal in voor de output van de routebeschrijving. Je output wordt gelokaliseerd. Links af in plaats van turn left. Verander de inhoud van de taal variabele voor de lol maar eens in us_en en bemerk het verschil
*/
var taal = "nl_nl";
/* GDirections in actie. Het gdir object wordt uitgevoerd met als argumenten het vertrekadres, het doeladres en de locale / taal waarin de routebeschrijving moet worden getoond
*/
gdir.load("from: " + van + " to: " + naar, { "locale": taal });
}
/*
In de onGDirectionsLoad functie() doe ik dingen die in mijn situatie van belang zijn. Zoals het positioneren van de container div die de routebeschrijving bevat. Voor het functioneren van de GDirections functionaliteit is dit verder niet van belang.
*/
function onGDirectionsLoad() {
var container_route = document.getElementById("container-routebeschrijving");
container = document.getElementById("container");
container_route.style.display = "block";
container_route.style.left = (container.offsetLeft + 6) + "px";
container_route.style.top = (container.offsetTop + 6) + "px";
container_route.style.visibility = "visible";
var sluit = document.getElementById("sluit-routebeschrijving");
var iw = map.getInfoWindow();
iw.hide();
}
function handleErrors(){
if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS) {
alert("De locatie van het opgegeven vertrekadres kon niet worden bepaald.nFoutcode: " + gdir.getStatus().code);
}
else if (gdir.getStatus().code == G_GEO_SERVER_ERROR) {
alert("Er is iets misgegaan. Maar het is onduidelijk WAT!n Foutcode: " + gdir.getStatus().code);
}
else if (gdir.getStatus().code == G_GEO_MISSING_QUERY) {
alert("Een parameter ontbreekt. Misschien was er geen vertrekpunt ingevoerd.n Foutcode: " + gdir.getStatus().code);
}
else if (gdir.getStatus().code == G_GEO_BAD_KEY) {
alert("De Google Maps sleutel is ongeldig of de gebruikte sleutel is niet geldig voor dit domein. n Foutcode: " + gdir.getStatus().code);
}
else if (gdir.getStatus().code == G_GEO_BAD_REQUEST) {
alert("De aanvraag voor het plannen van een route is mislukt.n Foutcode: " + gdir.getStatus().code);
}
else {
alert("Er is iets misgegaan. Maar het is volstrekt onduidelijk WAT de oorzaak is!");
}
}
Een werkend voorbeeld van bovenstaande code kom je tegen op de
leukvoorkids.nl pagina met tips voor een uitje met kinderen. Klik op een markertje en klik vervolgens op het route ikoontje in de InfoWindow ballon. Je kunt dan je vertrekadres opgeven om vervolgens de GDirections functie in actie te zien.
Linktip: een veeeeel betere uitleg van de mogelijkheden van Google Maps dan ik met m'n suffe kop kan geven vind je overigens op
de Google Maps tutorial website van Mike Williams.
Op Dutch Cowboys stond een kort
stukje tekst over (Google) Image search en hoe je jouw pagina met plaatjes optimaliseert voor indexering door en vindbaarheid in een zoekmachine.
De genoemde optimalisatietips (zoals sleutelwoord(en) gebruiken in de bestandsnaam, het alt attribuut zinvol gebruiken en het plaatsen van de afbeelding in de nabijheid van gerelateerde webstekst) zijn nou niet direct ware eye openers te noemen.
Vallen dit soort dingen eigenlijk wel onder de noemer optimalisatie? Dit zijn meer zaken die vanzelfsprekend zouden moeten zijn bij het online zetten van een webpagina. Zoekmachine-vriendelijk coderen.
Hmmm. Interessant om eens over na te denken ... waar houdt het maken van zoekmachinevriendelijke webpagina's op en begint de zoekmachineoptimalisatie van websites? Word je tijdens het sollicitatiegesprek voor
dat baantje van optimalisatieconsultant tot boven de knie afgezaagd omdat je
ervaring met SEO op je CV hebt gezet terwijl je eigenlijk niet verder komt dan zoekmachinevriendelijke pagina's schrijven :-) Afijn, ik dwaal af ...
Een behoorlijk percentage van het referer verkeer naar één van mijn websites komt van Google Image Search. Da's niet zo gek, want mijn sites zijn behoorlijk zoekmachinevriendelijk, wat het scoren vanuit image search gemakkelijker maakt. Een belangrijkere vraag dan
hoe je (goed) gevonden wordt in image search vind ik dan ook
hoe je het beste gebruik van kunt maken van verkeer uit Image Search. Ik doe op het moment verder niks speciaals met het verkeer dat binnenkomt via een jpegje of een gifje. Ik hoop maar dat het gros van de bezoekers niet op de thumbnail klikt om de grote versie van de foto of tekening te zien en daarna afhaakt. Maar besluit de afbeelding in de context van de pagina te bekijken.
Zou ik me daar eigenlijk wel druk over moeten maken??? Zijn er (acceptable) manieren om bezoekers vanuit image search aan mijn website te binden?
Ik ga op vakantie en neem mee ... in ieder geval het boek
Beginning Google Maps Applications with PHP en Ajax van Michael Purvis, Jeffrey Sambells en Cameron Turner.
Anders dan de titel van het boek doet vermoeden is het
geen boek voor lezers zonder ervaring met coderen voor het web. Of zoals Mike Williams zegt op
Google Pages: zonder kennis van (X)HTML, javascript en PHP ga je er niet veel van snappen. Terwijl bekendheid met Cascading Style Sheets,
Ajax, MySQL en
XML ook al geen overbodige luxe is.
Waar ik vooral benieuwd naar ben zijn de hoofdstukken over grote hoeveelheden data en de schaalbaarheid van een Google Maps mash up (Optimizing and Scaling for Large Data Sets) en de Advanced Tips and Tricks. In het laatstgenoemde hoofdstuk is in ieder geval te lezen hoe je je eigen InfoWindow kunt bouwen. In een eerder stukje tekst kletste ik wat over
de manier waarop bijvoorbeeld Funda het InfoWindow simuleert. In tegenstelling tot wat ik dacht is het zo te lezen wel degelijk mogelijk om een
echt infoWindow object naar eigen smaak te bouwen:
... most people don't realize the info window isn't really anything special. It's just another GOverlay with a lot of extra features. With a little Javascript and GOverlay, you can create your very own info window with whatever features you want to integrate.
Met dergelijk leesvoer onder handbereik denk ik niet dat ik me tijdens de
dode uurtjes van m'n aanstaande vakantie in Denemarken ga vervelen.
Tijdens het knutselen aan m'n Google Maps tooltje voor een gezinsuitje kijk ik af en toe graag eventjes in de keuken bij anderen. Zo is het aardig om eens te zien hoe vastgoed zoekwebsite Funda omgaat met Google Maps integratie.
In elk geval doet Funda het anders dan anderen. Natuurlijk maakt Funda gebruik van custom markertjes, da's niet zo bijzonder. Maar het idee om bij een klik op het prikkertje een eigen ballonnetje te tonen in plaats van het standaard InfoWindow object is wel origineel. Hiermee onderscheid je jezelf van de rest. En ben je meteen ook van dat onooglijke blauwe
click to close kruisje af, dat je in Google's InfoWindow object tegenkomt en dat volgens mij niet te manipuleren is.
Funda bewandelt in principe dezelfde weg als de
EBubble extensie. Het nadeel van het gebruik van een InfoWindow alternatief is ook meteen duidelijk. In tegenstelling tot Google Maps' native infoWindow is een dergelijke tekstballon geen onderdeel van de map en verhuist derhalve niet mee als je de kaart verschuift. Dit is ook het geval bij Funda's implementatie. Als je navigeert terwijl er een woninginfo-ballonnetje zichtbaar is ben je het tekstballonnetje meteen kwijt.
Hey ... is dat trouwens niet de Map Control die in de ontwerpen van de nieuwe Corporate website van Ymere te zien is? Ik vroeg me al af waar de vormgeefster die Control gezien had. Hmmm. Funda's versie van de Map Control is een custom b(r)ouwsel met een geheel eigen vormgeving en allesbehalve een standaard Google Maps element. Ik kan me voorstellen dat het problemen oplevert als we dit zouden gebruiken en het lijkt me dan ook niet verstandig dit ontwerp 1-op-1 over te nemen. Da's net iets te veel van het goeie om nog te kunnen zeggen dat
we lichtjes zijn geïnspireerd :-)
19 Jul '07
Wil je zelf spelen met Google Maps? Dan zijn een aantal bronnen van informatie onontbeerlijk. Hieronder zie je de resources die ik zelf met regelmaat gebruik bij het bouwen van
mijn kaart met uitjes voor het hele gezin.
Google Maps API documentatie
Natuurlijk is de hele
reference guide van de Google Maps API te vinden op de Google website. Om snel wat feeling te krijgen met de Google Maps code is het stoeien met de voorbeelden op
Concepts and Examples pagina een goed startpunt. Zelf merkte ik al snel dat ik vragen had die niet 1-2-3 in de Google documentatie zijn terug te vinden.
Mike Williams Google Maps tutorials
Gelukkig zijn er op het internet meer wegen die naar Rome leiden. De voorbeelden die Mike Williams geeft op zijn
Google Maps tutorials website zijn bijvoorbeeld compleet, uitgebreid en meer dan nuttig. Meer dan 50 tutorials vind je er. Variërend van basic tot complex. Onmisbaar tijdens het verkennen van de mogelijkheden van Google Maps. Ook onmisbaar: Mike's
onofficiële versie van de documentatie. Hierin worden ook de exotische en niet-gedocumenteerde functies beschreven. Of het verstandig is om deze te gebruiken is natuurlijk een tweede :-)
Inspiratie
En wat heb je verder nodig behalve de zojuist vergaarde technische kennis van de Google Maps API? Juist, inspiratie om iets leuks te knutselen. Die doe je bijvoorbeeld op bij
Google Maps Mania. Hier kun je jezelf vergapen aan tal van toepassingen van de populaire Google kaartcode. In Nederland zijn er trouwens nog verrassend weinig websites die zich wagen aan een Maps mashup. Veel websites komen niet verder dan het op de kaart zetten van een aantal prikkertjes. Via
Nederkaart kun je er wel een aantal vinden die experimenteren met Maps.
Een Google Maps API key is alleen geldig voor een bepaald domein. Dat wil zeggen, bij het aanvragen / aanmaken van je API sleutel geef je aan op welk domein je de key wilt gebruiken. De gegenereerde code kun je plakken waar je wilt, maar op andere domeinen dan het aangegeven domein werkt de sleutel dan ook niet.
Als je dat toch doet, dan levert dat een foutmelding op. Dat geldt ook bij het opvragen van een pagina uit de Google cache. Het is verder niet zo spannend, maar ik zou verwachten dat Google hiermee rekening houdt. Niet dus. Grappig.
06 Jul '07Het is 5 juli. En dan heb je al ruim twee weken geen nieuw stukje tekst op je website gezet. Dat wordt op den duur ondraaglijk. Die datum met het laatst geposte bericht bedoel ik. Ook als je website nou niet direct druk bezocht wordt.
Tijd om in het toetsenbord te klimmen dus. Maar heb ik dan eigenlijk wel wat te melden? Hmm. Echt spannende dingen die ik online wil terugzien heb ik de afgelopen tijd eigenlijk niet meegemaakt. Ik ben voornamelijk druk geweest met het stoeien met de code van de Google Maps
API.
Voor mijn werk bij woningbouwcorporatie Ymere knutsel ik aan een Google maps dingetje. Een Google Maps mash-up waarin de gebruiker het woningaanbod van Ymere kan bekijken en kan spelen met verschillende parameters (zoals huur vs koop, bestaande bouw vs nieuwbouw, woningtypen (appartement, eengezinswoninkje) en gemeente in het werkgebied). Het werken hieraan heeft een groot deel van mijn tijd opgeslokt. En ondanks het feit dat het af en toe meer dan een uitdaging is om de leeuwen en beren op het pad af te schieten is het fun. Wat heb ik zoal geleerd? Teveel om op te noemen. Om te beginnen een tweetal highlights:
Het omrekenen van het ene coordinaat-systeem naar het andere
Het
ERP systeem van Ymere gebruikt RD (Rijksdriehoek) coordinaten in haar achterliggende database om de locatie van objecten te beschrijven. Aangezien Google Maps gebruik maakt van WGS84 coordinaten is de vertaalslag van RD naar WGS84 nodig.
Google Maps GMarker interactie
Het is vrij eenvoudig om markeerpunten (Google Maps GMarker objecten) op een Google Map te zetten en deze te koppelen aan een categorie (bijvoorbeeld huur- of koopwoning). Om vervolgens deze markers te verbergen of te tonen door een checkbox aan of uit te vinken. Het wordt wat spannender als je verschillende parameters wilt combineren. Als de criteria om jouw markers te tonen / verbergen niet alleen afhangen van de categorie koop of huur, maar daarnaast ook van het woningtype. Bijvoorbeeld: je hebt een koopwoning van het type appartement, maar ook eentje van het type eengezinswoning. En dan zijn er ook nog huureengezinswoningen. Misschien voel je de bui al hangen? Hoe zorg je ervoor dat een marker in een Google Map zich bewust is van het feit dat hij zowel valt in de categorie huur als appartement?
Een eerste aanzet om met deze vraagstukken om te gaan zie je in een tweetal demo-dingen:
Ymere demo en
Leukvoorkids tips voor een dagje uit met kinderen.
Wordt vervolgd ...
Wat doe je als je iets opvallends ziet? Dan leg je het vast voor later! De uitreiking van je diploma op de middelbare school. Die ene achterneef die met een kopstootje teveel op, op de tafel danst tijdens het 40-jarig huwelijksfeest van tante Toos en ome Bert. Je wederhelft tijdens de kuur op muziek met drie oversized negers.
Als je dan de
good ol' Google homepage laadt om de Google Analytics statistieken van je websites te bekijken en je wordt (tamelijk onaangenaam) verrast met een popup venster van het
Plaats een Google zoekvak dan is de toetscombinatie Alt + Prnt Scrn snel ingedrukt.
Een beetje opdringerig schermpje vind ik. (
Hmmm. Goed van die schermafdruk, want reproduceren kan ik het venster hieronder niet):
16 May '07
LoL. Bij Google heeft er blijkbaar een engineer aan de vliegtuiglijm gesnoven toen-ie werkte aan Google Docs & Spreadsheets.
Na een potje surfen als Googlebot wilde ik inloggen op mijn Google Docs and Spreadsheets account. Per ongeluk met de Googlebot user agent dus. De browser sniffer van Google documents zag een niet-ondersteunde client en kwam met de volgende melding:
Als u problemen met een bepaalde browser wilt oplossen en deze controle wilt overslaan, voegt u &browserok=true toe aan het einde van de URL voor Google Docs & Spreadsheets.
Houd er rekening mee dat het onrechtmatig gebruik van deze parameter in strijd is met de intergalactische regelgeving. Laten we het dus niet merken!
En het werkt eerlijk gezegd niet echt.
08 Apr '07
SEOMoz onderzocht aan de hand van een aantal vragen de factoren die een rol spelen bij de rangschikking van de Google zoekresultaten.
Het resulterende rapport,
Google Search Engine Ranking Factors, vind je op de SEOMoz website.
Een aantal van de genoemde zaken zijn algemeen bekend. Met sommige dingen ben ik het persoonlijk niet helemaal eens - de vrij lage waardering van het gebruik van sleutelwoorden in de url van de pagina (Keyword Use in Page URL) bijvoorbeeld. En wat opvalt in het stukje over het produceren van geldige HTML als factor - in de meeste antwoorden bespeur ik een afkeer van webstandaards-evangelisten.
Hoe dan ook, dit stukje tekst is mijns inziens de moeite van het lezen zeker waard.
Een 1 april grapje of niet? Het blog van Google anchorman Matt Cutts vertoont op de voorpagina een "ik ben in mootjes gehakt door ..." boodschap. En wie zouden er anders toe in staat zijn om de Witte Ridder van de Witte Hoed Website aan te vallen dan de Internet Forces of Darkness? In de gedaante van het boosaardige Dark SEO Team.
Proest en hmmmm. Search Engine Land post erover in
The Matt Cutts Blog Gets Hacked. Dus of het echt een April Fools Day verhaal is??? In mijn blog reader staat, zoals SEL opmerkt, een eerdere post van Matt Cutts dat zijn website raar doet.
Shoutz to Dan "the man", the 302 hijack t33m, NYC SEO gang, Linusx,
pentazilla, daxster, boogybonmot, Earl+Duke, davenator, cRWc, monkeyboy, the canadian crew::J&T,
spamhuntress, LB, jb, NW, -eng, U(r|d)(s|i), L/S, Z-man, scbl, RandomFish, huZZah, chivesmack,
Shchoeoe+npMMo, lejackalgris, theGUY to GoTo, phenssen, Romanian Brothers and all the FORUMS!!
In BLACK SEO'in We TrUsT!!!
.:: Dark SEO Team ::.
Het aardigst aan die "Wij waren hier en hadden lol met jouw server" uitingen vind ik trouwens altijd de namen. Je komt de meest wonderlijke AKA's tegen ...
20 Mar '07I love to rank. Want zoals mijn moeder altijd al zei:
Als je jezelf niet kietelt, dan lach je nooit. Een waarheid als een koe, als je het mij vraagt.
Ik streel mijn ego graag met een goeie Google ranking. Zoals die voor de term
high school musical wallpaper. Afgelopen zondag een achtergrondje voor je desktop op m'n leukvoorkids website gezet ... koud twee dagen later meer dan behoorlijk gevonden in G. (in de long tail, dat dan weer wel) ...
Verleden week zette ik een
stukje tekst van Anders Koken online. Het betrof een persbericht van
Anders Koken over een keukenspeeltje van de Engelse televisie-kok Jamie Oliver, de flavour shaker.
De Jamie Oliver flavour shaker pluggen in de zoekmachines blijkt niet zo heel moeilijk. En dat had ik eerlijk gezegd ook niet verwacht. Daarvoor was het gehalte webwinkeltjes in de top van de zoekresultaten te hoog.
Google:
Ranken op de term
flavour shaker doet-ie niet zo heel goed (21
e). Longer tail zoekwoorden zoals
flavour shaker kosten daarentegen gaan een stuk beter.
MSN / Live Search:
Scoort boven verwachting voor de term
flavour shaker. Mijn websites worden meestal niet zo gewaardeerd door de zoekmachine van Microsoft, dus dit had ik eerlijk gezegd niet verwacht.
Yahoo Nederland:
De resultaten zijn vergelijkbaar met die van GOOG op
flavour shaker.
ASK:
Nergens te zien. Maar da's bij nader inzien niet zó gek, want ASK is niet al te snel met het indexeren van nullbeta.
Ilse:
Ik heb het idee dat Ilse langzaam uit een jarenlange coma aan het ontwaken is. Voor één van mijn andere websites zie ik de laatste tijd steeds vaker Ilse als verwijzende zoekmachine. Jammer dat Ilse niet meer de populaire zoekmachine is die het 10 jaar geleden was. Nullbeta is op basis van de query
flavour Shaker net niet bij de eerste 10 resultaten te vinden.
Het bovenstaande geeft me het gevoel dat de tekst (als deze op een door de zoekmachines gewaardeerde website over koken had gestaan) nog een stukje beter zou scoren in de
SERPs. Om mee af te sluiten ... ik ben benieuwd wat de gevolgen voor de zoekresultaten zullen zijn als het stukje geplugde tekst niet langer op de voorpagina staat. Naar verwachting zal dit de ranking negatief beïnvloeden en zal nullbeta in de anonimiteit van de zoekresultaten wegzakken. Waar het, gezien de geringe relevantie, natuurlijk ook hoort.
In de categorie Hey Meneer Google mag ik u even vragen - is hier iets mee te doen? - deze keer een persbericht tekst van Anders Koken. Momenteel levert een
google zoektocht op de term flavour shaker meer dan 200K resultaten op.
In de top van de SERPs vind je al een heleboel webwinkelachtige sites terug. Dus mijn vermoeden is het geen onmogelijkheid is om me hier tussen te wurmen met inzet van een inhoudelijke pagina over de flavour shaker. En als-ie hier op nullbeta als vreemde eend in de bijt tussen voornamelijk webtechnische verhaaltjes al enigszins wil ranken, dan zou het resultaat op een website over koken nog beter moeten zijn.
Niet-alledaags eten in stijl - Jamie Oliver's Flavour Shaker
Tijdens het midzomerfeest dat georganiseerd werd door de eigenaren van Vakantiepark Eigen wijze in Bant, liet Annette Evertsz van Anders Koken de mogelijkheden zien van de nieuwe flavour shaker van Jamie Oliver. De flavour Shaker is gemakkelijk in gebruik en maakt met gemak heerlijke dressings, kruidige marinades etc.
Natuurlijk was er volop de gelegenheid om van al het lekkers te proeven. Ook waren de andere producten van Anders Koken verkrijgbaar.
Hoe werkt de shaker
De Flavour Shaker is ontworpen om hele specerijen, kruiden, knoflook, noten, citrusschillen en zelfs limoen- of laurierbladen te pletten, malen, pureren en mengen. In slechts een paar seconden kun je die smaken vrij laten komen en aan allerlei dagelijkse gerechten toevoegen.
Stop je ingrediënten in de shaker, doe de magische bal erbij en schud de shaker stevig op en neer. De keramische bal doet al kneuzend, plettend en malend zijn werk, waardoor heerlijke aroma's en smaken vrijkomen. Je kunt ook vloeistoffen toevoegen, zoals olie en room, om verrukkelijke dressings en marinades te maken. De Flavour Shaker is zo groot dat je precies de juiste hoeveelheid marinade of dressing krijgt (je hebt niet veel nodig). Je kunt de inhoud dus meteen over je eten doen.
Wat kost de Flavour Shaker?
De kosten van de flavour shaker bedragen € 29,95 en is natuurlijk ook telefonisch (0527 650621) of per mail (info@anderskoken.com) te bestellen.
Ik zweer het je, onderstaand screenshot is geen resultaat van 10 seconden kopiëren en plakken in een grafisch proggie. Dat zou gewoon te makkelijk zijn.
Het gaat verder natuurlijk nergens over, maar aardig om te zien is het wel. Dit is echt wat ik vanavond op één van mijn pagina's zag ... een F5 op de pagina later en ik zie gewoon weer
ads door google in plaats van de Google favicon ...
En omdat ik dit aardigheidje tot nu toe nog niet op andere websites heb gezien zet ik de screendump even hier online ...
25 
Nullbeta aka HansR - online sinds 2001. Tegelijkertijd baasje en knecht van het slechtst gelezen techblog van het noordelijk halfrond. XHTML en cascading style sheet fetisjist. Parttime usability neuroot. Object oriëntatie losert. SQL wannabe. De ongekroonde koning van de ongedocumenteerde spaghetticode. Verliefd op en ziek van SEO.
reageer 
voeg toe aan del.icio.us 
permalink
1x comments