l’à_venir HTML&CSS
peut-être simplifié
par 2 jeunes américains
macaw.co

à suivre de près !  

Des exemples simples de navigation (peuvent être utiles aux TCV sur la OnePage…) :
http://tympanus.net/Development/DotNavigationStyles/

caniuse.com
tableaux de compatibilité
pour support HTML5, CSS3, SVG et plus
en fonction des différents navigateurs

de la technique étayée par de très belles photos :
www.legrandfaconnage.com

Bibliothèque des interactions tactiles pour différents systèmes.
Très utile pour concevoir une application numérique.
http://gesturecons.com/

soyez curieux
en passant du temps
par ici :
fr.html.net/tutorials 

CodePen est un site présentant
des morceaux de codes HTML, CSS et JavaScript
qu’il est possible de visualiser, modifier,
récupérer et éditer directement dans un navigateur.

Il est également utile pour s’entraîner
à comprendre la structure d’une page HTML
ou encore pour découvrir l’articulation et la fonction
des différentes déclarations en CSS.

www.debray-jerome.fr

trouvez sur ce blog de web développeur
plusieurs articles & outils bien utiles
comme par exemple des générateurs de boutons,
de bordures, d’ombres, de multi-colonnes en CSS…

le Site du Zéro change de nom
et devient… OpenClassrooms
allez-y c’est par ici :
fr.openclassrooms.com

et encore mieux par là :
fr.openclassrooms.com/informatique/cours/apprenez-a-creer-votre-site-web-avec-html5-et-css3

dabblet.com
visualisateur instantané
de codes HTML&CSS
à tester !

Des styles et des typos sobres, des transitions basiques et efficaces, une interface agréable, des options de partages faciles et très utiles… Réalisez vos diaporamas, intégrez les à votre site, ils restent disponibles de partout et à tout moment !
A tester ici : https://slid.es/

lien vers une image de qualité :
http://com-dev.fr/wp-content/uploads/2013/04/26-choses-a-savoir-min.jpg 

document infographique réalisé par pixaal

de quoi s’informer / se former…
www.wisibility.com

Un outil pratique, facile à utiliser et gratuit pour réaliser un wireframe.
http://wireframe.cc

L’utilisation de cet outil permet de passer d’un croquis d’intention au code.
En respectant les proportions du croquis par rapport au format d’écran on obtient les dimensions précises des blocs qui deviendront « container », « div » et autres « boîtes ».

belle&bonne lecture !

premier épisode : le web et internet
education.francetv.fr/dossier/le-html-par-lui-meme-1-2
second épisode : les bases du HTML
education.francetv.fr/dossier/le-html-par-lui-meme-2-2

poursuivons & partageons
par des découvertes fort utiles !

twitter.github.io/bootstrap/base-css.html

à force de répéter / donner
les références de ce livre fort utile
voici tout ce qui peut servir
pour se le procurer :
www.pearson.fr

soyez curieux & apprenez encore plus vite
en faisant un tour par ici ou encore par là :

www.siteduzero.com

www.alsacreations.com

www.commentcamarche.net

Le site http://tympanus.net/codrops/ propose du contenu tendance dans le domaine du web.
Le code pour réaliser les effets et les tendances exposées peut être téléchargé.

Attention : c’est le code qui est gratuit pas les images ni les contenus.

En ces temps de rentrée il peut être bon de se replonger dans le HTML…

Un petit exo sur vos blogs ?
Le site ci-dessous répertorie un grand nombre de glyphes. Vous pouvez les copier/coller en format texte ou au format HTML (cliquer en haut , les codes HTML ressemblent à cet exemple : ◄ vous avez juste à cliquer sur le glyphe pour copier le code )

http://copypastecharacter.com/all-characters

Sélectionnez quelques glyphes qui vous plaisent ou qui vous semblent utiles et publiez un article sur votre blog.
Pour les plus Geek, vous pouvez même vous essayer à « l’ascii art » en créant de belles frises :

▦⚛ ☉☝▦⚛☉☜▦⚛☉☞▦⚛☉☟▦⚛ ☉☝▦⚛☉☜▦

▛▚▙█▟▞▜█▛▚▙█▟▞▜█▛▚▙█▟▞▜█▛▚▙█▟▞▜

⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇⎇

✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺✺

Pour alimenter le carnet/web et notamment s’entraîner à dessiner de façon proportionnée les différents formats de bannières, voir le GUIDE / LES FORMATS DE LA PUB EN LIGNE
publié sur lejournaldunet.com :
http://www.journaldunet.com/dossiers/sites/e-pub/annuaireformats.shtml

A voir dans cette vidéo :

Des étapes à respecter pour qu’une bonne idée devienne un bon projet : investigation, exploration/expérimentation, réalisation [graphique et technique], verbalisation/argumentation et présentation.
A voir sur :
http://jokke-svin.dk/the-connected-poster-by-barq/

Explorez, créez et partagez des harmonies colorées sur Kuler.
http://kuler.adobe.com
Expérimentez les variations de couleurs, concevez des harmonies par analogies, de complémentaires… Kuler vous donne les références RVB, CMJN ou hexadécimales des couleurs que vous avez choisies.

pour faire des révisions, découvrir des nouveautés
dans InDesign, Illustrator, Photoshop et même plus
soyez curieux et allez sur :
www.adobe.com/fr/designcenter/video_workshop