Als je – zoals ik – al bijna twintig jaar ICT-boeken schrijft, is het uitkomen van een nieuwe titel toch een beetje business as usual geworden. Je raakt er aan gewend, dat de PostNL-bus de straat in draait om weer een doos met auteursexemplaren af te leveren.

Maar soms verschijnt er een uitgave waar je toch extra trots op bent. Dat was het geval bij het boek over AngularJS, maar beslist ook nu, bij het uitkomen van Web Development Library – PhoneGap.

Het is een vreselijk leuk boek geworden – al zeg ik het zelf - en het is bij mijn weten het eerste oorspronkelijk Nederlandstalige (=niet vertaalde) werk over PhoneGap en Cordova.

Waar gaat het boek over? In één zin: je leert apps maken voor Android, iOS en Windows Phone op basis van HTML, CSS en JavaScript. Deze apps kun je vervolgens publiceren in Google Play of de Apple App Store (oké, dat zijn toch twee zinnen).

Hoewel het boek nog geen 300 pagina’s is, leer je toch alles over het gebruiken van PhoneGap Build (de cloud-tool om apps te maken, dan hoef je zelf niks te installeren), het zelf installeren van PhoneGap/Cordova op je pc of Mac, het maken van basis-apps en het testen ervan in de emulator of op je eigen smartphone of tablet, het werken met standaardplug-ins voor camera, kompas, GPS en dergelijke, het werken met aanvullende plug-ins (met een speciale rol voor plug-ins van de Nederlander Eddy Verbruggen) als een barcodescanner, social sharing en het plaatsen van advertenties in je app, tot het signeren en publiceren van je app in de diverse app stores.

De app die je zelf maakt in dit boek kun je alvast downloaden in de store:

Kortom: “Web Development Library – PhoneGap is een totaalwerk als het gaat om het maken, onderhouden en publiceren van je eigen mobiele apps.”

Voor de volledigheid de algemene kenmerken van het boek:

Specificaties

• Boek, paperback, 280 pagina’s.
• ISBN-13: 978-90-5940-786-2 (9789059407862)
• Geschikt voor opleidingen en zelfstudie
• Onafhankelijk van gebruikte platform en browser
• Prijs: EUR 24,95

Van de flaptekst

“PhoneGap (of Cordova) is een JavaScript-bibliotheek om op basis van de webstandaarden HTML, CSS en JavaScript mobiele apps te ontwikkelen voor Android, iOS en Windows Phone. Apps die met PhoneGap worden gemaakt, kunnen desgewenst worden gepubliceerd in de diverse app stores. Maar naast het realiseren van standalone apps kunt u met PhoneGap ook gebruikmaken van de apparaatmogelijkheden zoals de camera, GPS, contactenlijst, delen op sociale media en meer. In dit boek komen al deze functies aan de orde. U eindigt met een eigen app in de store. Tot de behandelde onderwerpen behoren:

• Kennismaken met PhoneGap.
• Een eerste PhoneGap-app schrijven.
• Werken met de cloudomgeving PhoneGap Build.
• PhoneGap lokaal installeren en gebruiken.
• Werken met de basisplug-ins en third-party plug-ins.
• Apps publiceren in Google Play en in de Apple App Store.

Meer informatie en downloads vind je op www.webdevelopmentlibrary.nl  De app die je in dit boek maakt, is ook beschikbaar in Google Play en de Apple App Store. Zoek naar de app WDL – PhoneGap.

Direct bestellen

• Bestellen bij uitgeverij Van Duuren Media
• Bestellen bij computerboek.nl
• Bestellen bij bol.com

Peter Kassenaar
-- 24 april 2015

Aha, dit blog wordt kennelijk goed gelezen bij Google :-).

Nog maar een paar dagen geleden blogde ik over het feit dat Chrome zo weinig vooruitgang had geboekt in een jaar, en prompt komen ze met een nieuwe versie: Google Chrome 3.0.

Ik heb hem vanochtend gedownload en geïnstalleerd en dit blogbericht is het resultaat van een eerste indruk van een kwartiertje surfen met Chrome.

Wat valt op en wat is er nieuw?

Het valt op dat Chrome niet automatisch meldt dat een nieuwe versie beschikbaar is. Ik las het op een blog (dat ik aan het lezen was in Chrome!), maar moest handmatig de updateprocedure starten. Dit gaat via de knop Opties in de werkbalk en vervolgens Over Google Chrome. In het venster verschijnt de melding Er is een nieuwe versie beschikbaar.

Na het aanklikken hiervan wordt de nieuwe versie verder wel automatisch opgehaald en geïnstalleerd. Na het herstarten van Chrome is het versienummer opgewaardeerd.

Voor:

Na:

Nieuwe homepage

Na het opnieuw starten valt op dat de homepage met meestbezochte sites opnieuw is vormgegeven. Hij is nu een stuk cleaner. De miniatuurweergaven van sites kun je vastpinnen of sluiten door er met de muis overheen te bewegen. Tevens kun je ze oppakken en eventueel naar een andere positie slepen.

Boven de miniatuurweergaven staan twee knoppen om de sites weer te geven als afbeeldingen (de standaardweergave) of als lijst. De wisseling tussen de weergaves gaat met een vloeiende animatie.

Onder de miniatuurweergaven staat nu een balk met recent gesloten tabbladen en kun je de volledige browse-geschiedenis weergeven.

Verbeterde adresregel/omnibox

Een van de grote voordelen van Chrome vind ik de manier waarop de adresregel is uitgewerkt. Als je een webadres typt opent Chrome de betreffende pagina, als je een trefwoord typt, wordt automatisch een zoekopdracht met dat trefwoord uitgevoerd.

Nieuw in Chrome 3.0 is dat ook met pictogrammen wordt aangegeven of de suggestie die Chrome toont een aanbevolen site is, een zoekopdracht, een site uit je favorietenlijst of een site uit je geschiedenis.

Ik moet er nog wat langer naar kijken, maar op het eerste gezicht lijkt dit me een nuttige toevoeging.

Thema’s

Persoonlijk kan het me geen biet schelen, maar er zijn internetters die graag alles een afwijkend kleurtje geven en vensters willen aanpassen aan hun ‘mood’. Of aan het seizoen. Of aan hun verjaardag. Of aan, nou ja, je begrijpt het principe.

Wel, met ingang van Chrome 3.0 kan dat.

Op de site van Chrome zijn allerlei thema’s te downloaden. Je bereikt ze via de knop Opties (de knop met de moersleutel) en vervolgens Opties, tabblad Persoonlijke items, knop Thema’s ophalen.

Door op de knop Apply Theme te klikken, wordt het thema direct toegepast. Bevalt het je niet, dan kun je het met een knop Ongedaan maken direct weer weggooien. Wil je later het standaardthema herstellen, kies dan het thema Classic uit de Themes Gallery.

Chrome als kurken prikbord:

Wil je de thema’s in eerst eens afzonderlijk bekijken (bijvoorbeeld in een andere browser), ga dan naar http://www.google.com/chrome/intl/en/themes/.

HTML 5 <video> tag

Chrome 3.0 ondersteunt een groot deel van de (voorgestelde) HTML 5-uitbreidingen, waaronder het gebruik van de tag <video>. Hierdoor kunnen video’s rechtstreeks in een webpagina geplaatst worden en is het niet meer nodig externe afspeelmodules zoals Flash Player, QuickTime of Windows Media Player te gebruiken.

Het is natuurlijk nog de vraag welke websites dit al aanbieden (kip-ei situatie), maar in elk geval is het goed dat de browser al vast inspeelt op de komende HTML 5-standaard.

Wat ontbreekt nog steeds?

Hoe leuk alle thema’s en pictogrammen in de omnibox ook mogen zijn, de zware ontbrekende items zijn met deze 3.0-release wat mij betreft nog steeds niet aangepakt. Hieronder vallen onder meer:

• Ondersteuning voor XML-bestanden. Bijvoorbeeld RSS-feeds worden als kale XML-tekst in het venster weergeven. Als programmeur gebruik ik vaak ook de browser om de uitvoer van een XML-webservice te checken. Chrome is hiervoor compleet ongeschikt. IE en Firefox doen dit veel beter.
• Ondersteuning voor Add-ins. Het is nog steeds niet mogelijk om extra onderdelen (werkbalken, tools, gadgets) binnen Chrome te laden, zoals in Firefox al een jaar of zeven, acht mogelijk is.
• Integratie met andere Googlediensten. Het is nog steeds niet mogelijk om vanuit de browser direct naar andere Googlediensten te springen, zoals GMail, je Agenda, je iGoogle-account enzovoort. Of zou dit bewust zijn, en moeten we  hiervoor wachten op het aangekondige Google Chrome OS? De tijd zal het leren.

Meer informatie

Hier vind je meer informatie over Google Chrome:

• Officiele aankondiging van Google Chrome 3.0 op het Google Blog.
• Google Chrome 3.0 downloaden

Peter Kassenaar
-- 16 september 2009.

Iedereen die de ontwikkelingen op internet een beetje volgt kan het niet zijn ontgaan dat sinds dinsdag (2 september 2008) een nieuwe browser de strijd wil aanbinden met de hegemonie van Microsoft Internet Explorer en Mozilla Firefox. Google heeft de knuppel in het hoenderhok gegooid door de browser Google Chrome te lanceren. In maar liefst 100 landen tegelijk kwam om 21.00 uur (Nederlandse tijd) de browser beschikbaar om te downloaden.

En natuurlijk verschenen kort daarop op talloze blogs en websites allerlei artikelen en ervaringen. Daar kan ik natuurlijk niet bij achterblijven!

Meer informatie

Ik zal hier niet alle technische kenmerken herhalen. Daar zijn andere sites veel beter voor. Ik volsta met een korte verwijzing naar sites waar –naar mijn mening- interessante artikelen en reviews te vinden zijn over deze browser.

• Paul Thurrots WinSuperSite – Hands on with Google Chrome Beta
• InfoWorld.com - Google Chrome: 7 reasons…
• En natuurlijk Google zelf – Meer informative over Google Chrome (inclusief online stripboek!).

Mijn pluspunten

Omdat ik deze blogpost tussen de bedrijven door schrijf, plaats ik hier ook alleen een korte opsomming van de plus- en minpunten die ik na een kleine twee dagen browsen (ca. 10 uur gebruikerservaring) heb opgedaan.

• Snel – De browser is *razend*snel. Hij opent snel, pagina's worden erg snel geladen, JavaScript (AJAX-) sites worden zeer snel uitgevoerd, het is alsof je met een lokale applicatie werkt.
• Zoeken (1) – De zoekfunctie binnen een pagina (Ctrl+F) werkt fijn. Je kunt een term typen en direct worden alle woorden op de pagina gemarkeerd weergegeven. Met pijltjes kun je snel vooruit en achteruit bladeren door je zoekresultaten
• Zoeken (2) – Chrome herkent het als een site een eigen zoekfunctie heeft. Typ bijvoorbeeld YouTube in de adresregel (de browser geeft dan al www.youtube.com als suggestie) en druk op Tab om direct binnen YouTube te zoeken. Dat scheelt weer een aantal muisklikken! Hetzelfde geldt bijvoorbeeld voor andere bekende grote sites als webwereld.nl. Maar niet alle sites worden herkend. Tweaker.net niet, Kassenaar.com niet (???). Hopelijk geeft Google snel een API vrij waarin wordt beschreven hoe dit precies geactiveerd kan worden.
• Homepage – Als Chrome wordt gestart toont de standaard homepage miniatuurversies van de negen laatst/best bezochte sites. Die zijn direct bereikbaar, hetgeen ook weer een aantal muisklikken scheelt. Daarnaast blijft het uiteraard mogelijk je eigen startpagina in te stellen.

Figuur 1: Mijn Google Chrome startpagina na twee dagen surfen

• User Interface – Het programma is buitengewoon minimalistisch vormgegeven. Er zit geen knop en geen menu te veel op. Ik houd daar wel van. De tabs werken OK; je kunt ze verslepen binnen en buiten het venster en snel nieuwe tabs toevoegen.
• Inspector – Voor programmeurs en webdevelopers zijn buitengewoon nuttige functies aanwezig die het gebruik van add-ons als Firebug (deels) overbodig maken. Je kunt bijvoorbeeld met de rechtermuisknop klikken en kiezen voor Element inspecteren. In een nieuw venster wordt dan de complete DOM-structuur getoond en kun je laadtijden van individuele elementen, afbeeldingen en scripts bekijken.
• Omnibox – de URL-adresregel bestaat niet meer. Het is nu een 'omnibox', die allerlei functies combineert. Zoeken op het web. Je surfgeschiedenis. De standaard adresregel. Suggesties terwijl je typt. Handig. Even wennen, maar inderdaad. Erg handig.

Figuur 2: De Inspector is een must voor elke webdeveloper

Mijn minpunten en conclusie

Is het dan alles goud wat er blinkt? Nee. Toch niet. Onderstaand lijstje laat zien waarom ik Google Chrome een goede eerste beta vind (het versienummer van Chrome laat op dit moment 0.2.xxxx zien), maar niet meer dan dat. Zonder overigens iets af te willen doen aan het product zelf hoor; ik weet als geen ander dat het ontwikkelen van [foutloze en tevreden stellende] software razend moeilijk is. Maar Chrome is er nog niet. Onderstaande punten moeten zeker aangepast worden, wil Chrome zich als standaardbrowser op mijn computer nestelen.

In willekeurige volgorde:

• Startpagina – Er zijn nu wel erg veel knoppen gesneuveld in het redesignproces. Waarom kan ik niet met één klik op de knop terug naar mijn startpagina?
• Favorieten – Het importeren van favorieten uit Internet Explorer ging niet goed. De koppelingenbalk kwam niet goed over, er werden maar een paar mapjes met favorieten geïmporteerd. Het werken met- en beheren van Favorieten is zowiezo erg karig in Chrome.
• Gestures – Er zijn geen Mouse gestures! Nooit geweten dat ik die eigenlijk zo veel gebruikte! Zie ook mijn aparte blogpost over het werken met IE7Pro. Het schakelen tussen vorige, volgende pagina en –tabblad moet nu allemaal weer handmatig gebeuren. Pfff....
• Add-ons – Er kunnen geen add-ons worden geïnstalleerd. Nu ben ik geen zware add-on gebruiker, maar enige voorziening hierin zou toch wel prettig zijn. Zelfs Googles eigen Google Toolbar kan niet worden geïnstalleerd! Die mis ik. Heel erg.
• History/Drop-down URL's – Ik keer regelmatig naar een vorige pagina terug door hem uit het dropdown-lijstje te kiezen van de adresregel. Dat kan niet in Chrome. Het hele geschiedenisbeheer is overigens erg matig. Je kunt je surfgeschiedenis per dag bekijken en eventueel wissen, en that's it. Niet sorteren op naam, op meest bezocht of anderszins, iets dat in Firefox standaard is. En wat erg handig is!
• Integratie – mag je van een Google-product niet verwachten dat het per definitie geïntegreerd is met andere Googlediensten? Ik gebruik geen Google Documents, GMail of Calendar (daarvan schijnt de integratie wel beter te zijn), maar ik mag toch minstens verwachten dat ik snel naar andere online Google-diensten kan? Bookmarks, Analytics, Adsense, Adwords, iGoogle, om er maar een paar te noemen. Niets van dat alles. Chrome is een product op zich en lijkt zich amper bewust van andere Google-diensten.

Stabiliteit?

Google zelf geeft hoog op van de stabiliteit van de browser. Verschillende tabbladen zouden elkaar niet kunnen beïnvloeden en de browser loopt nooit vast. Maar typ alleen even about:% in de adresregel (oh, sorry. 'Omnibox') en de browser knalt er volledig uit met onderstaand berichtje...

Peter Kassenaar
-- 04 september 2008.

Op steeds meer websites zie je kaarten opduiken die afkomstig zijn van Google Maps. Dit is niet zo verwonderlijk, want Google stelt de code die nodig is om kaartjes in een webpagina op te nemen gratis beschikbaar via de Google Maps API.

Met enkele regels HTML en JavaScript kun je op deze manier snel een interactieve kaart in je webpagina opnemen die precies dezelfde functionaliteit bevat als de volledige versie van Google Maps: in- en uitzoomen, verschuiven, routes plannen, markeringen plaatsen en nog veel meer. Om hiermee te beginnen hoef je alleen een Google Maps API Key op te vragen. Zodra je deze hebt (gratis) kun je je eigen dynamische kaarten maken.

Statische kaarten

Soms is een dynamische kaart echter niet de beste oplossing. Dynamische kaarten met de Google Maps API worden gemaakt met behulp van JavaScript (niet altijd beschikbaar in browsers en/of mobiele telefoons) en het kan soms lang duren voordat de kaart geladen is, zeker bij tragere internetverbindingen. Er is aardig wat overhead vereist voor een dynamische kaart.

Kortom, als je gewoon even snel een kaartje in een pagina wilt plaatsen, is het gebruik van de Google Maps API al snel overkill.

Sinds kort biedt Google echter ook de optie om statische kaarten in je webpagina op te nemen. Deze bieden minder functionaliteit (niet scrollen, niet zoomen), maar laden razendsnel en zijn erg eenvoudig te maken. Hieronder zie je een voorbeeld van een statische Google Map met de locatie van ons kantoor in Doesburg.

Technische achtergronden

Bij een statische kaart kun je gewoon de algemene tag <img> invoegen in de pagina op de plaats waar de kaart moet komen. Het attribuut src=".." mce_src=".." laat je vervolgens verwijzen naar de coordinaten van de kaart, en met het attribuut key="..." geef je je persoonlijk Google Maps API Key op. De totale code voor een kaart zie er dan uit als

<img src="http://maps.google.com/staticmap?center=52.010877,6.137674&markers=52.010877,
6.137674,red&zoom=15&size=480x480&key=jouw_google_key" />

Hierin moet de tekst jouw_google_key natuurlijk worden vervangen door een echte Google Maps API Key. Deze is enkele tientallen tekens lang en ziet er bijvoorbeeld uit als ABQIACFDwlt31CnZMUVmUIoAlicZ0hSuTLwashVo9ZdMxpEBj (dit is een fake-key).

Een statische Google Map maken

Het proces om een statische Google Map te maken bestaat uit verschillende stappen.

1. Maak een Google account op www.google.com/accounts/. Als je al een Google account hebt voor bijvoorbeeld Gmail of AdSense dan kun je deze accountgegevens gebruiken.
2. Maak een persoonlijk Google Maps API Key op code.google.com/apis/maps/signup.html.
3. Ga naar de wizard om een nieuwe statische kaart te maken. Dit is de speciale Google Static Maps Wizard
4. Typ het adres in waarvoor u de kaart wilt maken en klik op Create Marker Here.
   
5. Verander desgewenst de hoogte en breedte van de kaart. De maximale afmetingen zijn 512x512 pixels. Voor een kaart voor een mobiele telefoon geeft u bijvoorbeeld de afmetingen 176x240 op.
   
6. Voer de URL van uw site in (dit moet dezelfde URL zijn als u in stap 2 hebt opgegeven, bij het maken van de Google Maps API Key) en klik op Generate Key.
   
7. Kopieer en plak de code die wordt gegenereerd naar een <img>-tag in uw HTML-pagina.
   

Meer informatie

• Static Maps API Developers Guide (US)
• Google Maps API (algemene documentatie, US)
• Artikel - Uw eerste kaart maken met Google Maps API (US)

-- Peter Kassenaar
26 februari 2008