Word lid!

Activiteit: Bijeenkomst bij E-sites op 19 mei 2010

Woensdag 19 mei was Fronteers te gast bij e-sites in Breda. Anne van Kesteren vertelde over CSS3, en Nikolai Onken ging in op HTML5 Apps.

Anne van Kesteren over CSS3

Als eerste vertelt Anne van Kesteren over CSS3. Anne werkt vanuit Opera onder andere in de W3C werkgroep voor CSS, die werkt aan de nieuwe versie van CSS: CSS3. In tegenstelling tot eerdere versies van CSS, is CSS3 opgedeeld in diverse modules, die apart vorderingen boeken op het gebied van implementatie. In de werkgroep zitten ongeveer 20 mensen, van bedrijven zoals Microsoft, Apple, Opera en Adobe.

De meeste van de nieuwe features werken in Firefox, Chrome, Safari en Opera. Uiteindelijk zullen deze vernieuwingen ook in Internet Explorer worden doorgevoerd.

Eén van de nieuwe mogelijkheden is om transparante kleuren toe te kennen aan de achtergrond en tekstkleur. Dit in tegenstelling tot een doorzichtigheid van de gehele box. Met de nieuwe mogelijkheden ziet een website er veel gelikter uit.

Daarnaast is er een mogelijkheid om de hoeken van een HTML-element een ronding mee te geven. Dit gaat door de CSS eigenschap border-radius. Ook zal het mogelijk worden om een afbeelding als rand mee te geven. Vroeger moesten hiervoor meerdere achtergrond afbeeldingen gebruikt worden. Nu wordt één afbeelding opgesplitst in negen kleinere afbeeldingen. Die kleinere afbeeldingen kunnen worden herhaald of uitgerekt over de gehele breedte en hoogte.

Voor ontwerpers is er ook een mooie toevoeging aan CSS3, namelijk die om eigen fonts te gebruiken. Vroeger was het zo dat je een Flash of alternatief moest bieden aan browsers, door bijvoorbeeld gebruik te maken van sIFR of Cufon. In CSS3 is het mogelijk om het pad naar een font op te geven. Voor Internet Explorer is er een alternatief door gebruik te maken van het .eot formaat.

Met de nieuwe transitions en transforms krijgen webbouwers de mogelijkheid om animaties van CSS properties over een bepaalde tijdspanne te laten uitvoeren.

Ook mediaqueries zijn een toevoeging aan CSS3. Deze maken het mogelijk om makkelijk te bepalen hoe breed een scherm is, en op basis daarvan worden content items getoond of verborgen.

Anne doet als laatste nog een Steve Jobs actie, met een 'one more thing'. Google heeft die dag het WebM project aangekondigd, dat open source video integreert in diverse browsers. Opera, Chrome en Firefox ondersteunen het. Internet Explorer 9 gaat het als plugin ondersteunen. De codec gebruikt Vorbis voor audio en Matroska voor packaging.

Nikolai Onken over HTML5 Apps

Nikolai Onken neemt het stokje van Anne over, en gaat praten over HTML5 Apps. Nikolai is een van de core committers van de Dojo JavaScript library.

Het vervelende aan alle mobiele telefoons is dat je apart code moet ontwikkelen, wil je de features van de mobiele telefoon gebruiken in je applicatie. Ook hebben veel apparaten, operators en dergelijk een eigen appstore. Voor een overzicht kun je kijken op distimo.com/appstores.

HTML5 Apps maken het mogelijk om de goede dingen van mobieltjes, zoals de GPS ontvanger, te gebruiken in HTML. Een startup genaamd Your Appshop lanceerde in december 2009, welke HTML5 apps aanbied voor een klein bedrag. Ze hadden 12 miljoen downloads in vier maanden.

De basis voor een HTML5 App zijn HTML, CSS en JavaScript bestanden, ondersteund met een config.xml bestand (waar de naam etc in staan) en een icoon. Deze bestanden plaats je in een .zip bestand, en die hernoem je naar een .wgt. Dan ben je klaar. Dit werkt op de meeste moderne browsers, behalve de iPhone.

Dit probleem wordt opgelost door projecten zoals PhoneGap, die de krachten van de diverse mobiele telefoons bundelen.

Aanwezigen

meetup