10 juin 2010
William Malone à créé un article très bien fait afin d’apprendre à dessiner en utilisant les canvas en HTML5. Le code est détaillé et très bien expliqué. Vous apprendrez à créer un panneau attention sans image, uniquement avec un canvas HTML5 et du code JavaScript permettant de dessiner à l’intérieur.
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
0 commentaires - Tags : Mots-clefs :canvas, dessiner, html5, javascript, tutoriel
3 juin 2010
Le site Onextrapixel.com nous propose la première partie, quand même très fournie, de son tutoriel permettant de créer un site entier, avec un design très agréable, seulement avec HTML5 et CSS3. Aucune image n’est donc présente comme vous pouvez le voir sur la page de démonstration.
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
3 commentaires - Tags : Mots-clefs :css3, html5, image, template, tutoriel
12 avril. 2010
Tutorialzine propose un tutoriel très complet permettant de construire un formulaire d’inscription en CSS3 et jQuery. Le formulaire final est très stylé, façon « fibres de carbone », fonctionnel et accessible. On notera l’utilisation du jQuery pour la vérification des champs. Très bon tutoriel pour s’inspirer !
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
0 commentaires - Tags : Mots-clefs :carbone, formulaire, inscription, inspiration, jquery, tutoriel
7 avril. 2010
Cloud Four propose une petite astuce pour charger un CSS en fonction de l’orientation de l’iPad (portrait ou paysage) durant la navigation. Bien sûr pour les français il faudra attendre fin avril pour avoir ce petit joujou entre nos mains mais on peut déjà optimiser son site pour la tablette d’Apple et le tester sur ipadpeek.com.
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
0 commentaires - Tags : Mots-clefs :apple, ipad, orientation, paysage, portrait, tablette
7 avril. 2010
Jon Combe nous fait une jolie démonstration de HTML5 et jQuery en nous présentant une horloge analogique et numérique rotative. Le tout n’utilise donc que le HTML5, jQuery, CSS3 et quelques images. Les fonctions de transformation (rotation) de CSS3 sont aussi utilisées. Le résultat est plutôt impressionnant !
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
0 commentaires - Tags : Mots-clefs :analogique, css3, horloge, html5, jquery, numérique, rotation, transformation
7 avril. 2010
Petit tutoriel par CSS-TRICKS permettant de créer des textes en 3D juste avec CSS3. La méthode est simple : créer plusieurs ombres sur le texte (avec la propriété text-shadow de CSS3). On nous propose aussi d’animer la perspective en faisant apparaître petit à petit ces ombres et créer un effet 3D progressif (avec les transitions webkit de CSS3). Le rendu est très sympa et très simple à réaliser.
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
0 commentaires - Tags : Mots-clefs :3D, css3, ombre, shadow, text-shadow, texte, tower, transition
6 avril. 2010
Très bon tutoriel proposé par Six Revisions vous permettant de créer une application iPhone en HTML5 de A à Z. Cette application, qui en fait sera lancée dans Safari, aura l’apparence d’une application classique une fois que vous aurez créé le raccourci iPhone, et pourra même être utilisable hors ligne.
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
1 commentaires - Tags : Mots-clefs :app, application, html5, iphone, jeu, tetris, tutoriel
2 avril. 2010
Tout simplement impressionnant ce que sont arrivés à faire les ingénieurs de l’équipe du Google Web Toolkit : faire tourner Quake 2 dans un navigateur toolkit (Chrome ou Safari) à l’aide d’HTML5. Le jeu tournerais à plus de 30FPS même sur de petites configurations et n’utilise pas flash. Pour plus d’infos : le blog Google Web Toolkit.
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
0 commentaires - Tags : Mots-clefs :chrome, jeu, navigateur, quake, quake 2, quake II, safari, toolkit
26 mars 2010
Six Revisions nous propose un tutoriel simple et très rapide sur l’incrustation de texte en CSS3 (inset typograhpy). En fait c’est en utilisant les ombres (propriété text-shadow de CSS3) que l’on peut donner l’impression à un texte d’être incrusté dans le fond. Le tour est joué en une seule ligne de CSS.
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
0 commentaires - Tags : Mots-clefs :css3, inset typography, ombre, text-shadow, texte incrusté, tutoriel
24 mars 2010
Vous vous rappelez sûrement de cet article sur findmebyip.com qui nous proposait un tableau de compatibilité entre les différents navigateurs et les nouveaux standards HTML5 et CSS3. Et bien ce tableau a été mis à jour, réorganisé par langage et type de propriété.
Publié par Rémi Garcia dans la catégorie : HTML / CSS / Mise en forme
0 commentaires - Tags : Mots-clefs :chrome, compatibilité, css3, firefox, html5, internet explorer, navigateur