Bij het e-business team van Tam Tam heb ik veel te maken met web applicaties. Dit keer werd mij gevraagd om voor een klant een mobiele web applicatie te ontwikkelen. Aangezien ik hier nog weinig tot geen ervaring mee had, ben ik eerst begonnen om een site te maken in HTML 5. Al gauw kwam ik tot de ontdekking dat de afbeeldingen en tekst niet scherp op een retina display (iPhone 4) getoond werden. Ik moest hier met een behoorlijk omweg omheen om dit goed te krijgen, dus ben ik wat onderzoek naar mobiele frameworks op het internet gaan doen. Er zijn op dit moment aardig wat frameworks voor mobiel te verkrijgen: jQTouch, sencha, xui, sproutcore en jQuery Mobile. Waarom dan de keuze voor jQuery Mobile? De meeste frameworks vereisen extra kennis over het framework en is er weinig en/of ...

Wat is LESS Er is een hoop mogelijk met CSS, vooral nu CSS3 steeds meer geaccepteerd is. Desondanks blijft dubbele code een van de grootste ergernissen. Als je bekend bent met van het maken van websites, heb je vast wel eens gehoord  van CSS extensions / CSS pre-processors (compilers). De 2 bekendste zijn SASS en LESS. Alexis Sellier en Dmitry Fadeyev vonden dat de huidige CSS opmaakstandaard niet goed genoeg gestructureerd is en dat het eleganter geschreven moest worden. Daarom hebben zij LESS ontwikkeld. SASS is niet meer dan een variant van LESS. Deze tools maken CSS krachtiger door gebruik te maken van o.a. variabelen, mixins, nested rules en operations. Door gebruik te maken van deze features kan je er voor zorgen dat je weinig tot geen gedupliceerde code meer hoeft te schrijven en je veel sneller de CSS kan aanpassen. Waarom LESS Waarom LESS en geen SASS? Dit is een beetje een ...

I’ve just made a handy script to clear input fields with jQuery. I’m aware, there plenty of other scripts to clear input fields, but we’re convinced this is the best one. The script is working like this: The value of this input field got a standard value text. In this case “Enter value here…”. Just give the field an ID (field) and give it a class “watermark“. The watermark class the input field a grey text color. When you click on the input field, the field will be cleared and the color will be black (active). If you don’t fill in the field and click somewhere else, the standard value will be added back in the field and the color will be grey again. If you enter only spaces in this field, the standard value be added back in the field as well. Together with my collegue (Bart Venderbosch) we have ...

YouTube heeft aangekondigd dat vanaf nu HTML5 gaan ondersteunen voor het afspelen van video’s. Webbrowsers die HTML5 ondersteunen kunnen video’s in H.264-formaat afspelen, zonder dat daarvoor Flash nodig is. Dat is goed nieuws voor iPhone-gebruikers, want de Safari-browser van de iPhone ondersteunt HTML5. Vlak daarna kondigde Vimeo aan dat ze ook voor HTML5 zullen kiezen. Het grote voordeel, ook voor andere platformen, is dat HTML5 minder processorkacht nodig heeft en een minder grote aanslag op de batterijduur levert dan Flash. De desktopbrowsers Safari, Internet Explorer en Chrome zijn geschikt – Firefox echter niet. Firefox 3.6 maakt namelijk gebruik van Ogg Theora (Firefox’ standaard voor HTML5-video) terwijl YouTube en Vimeo voor H.264 hebben gekozen omdat het flexibeler is en op veel meer apparaten en platformen gebruikt kan worden. Toch zijn er nog wel beperkingen: YouTube heeft bijvoorbeeld laten weten dat HTML5 bij YouTube nog geen video’s met advertenties, captions en annotaties kan ...

CSS3.info wrote a new post about new support for Opera consider CSS3 and HTML5: Opera has today issued a pre-alpha release of Opera 10.5 offering increased support for CSS3 and HTML5 as well as vastly increased JavaScript performance and improvements to the browser’s user interface. Based on Opera’s Presto 2.5 rendering engine, Opera 10.5 adds CSS3 Transitions and 2D Transforms to the long list of CSS3 properties already supported by the browser as well as increased support for CSS3 Backgrounds and Borders. As CSS3 Transisitions and 2D Transforms are still at the working draft stage of development at present you’ll need to use the ‘-o-’ prefix in your style sheets for the time being, you can read more on Opera’s support for Transitions and Transforms at the following link. Opera 10.5 also offers increased support for CSS3 Backgrounds and Borders which become a Candidate Recommendation earlier this month. Opera ...