Voir la source de Web 2016-03-24

== révision accès FTP ==

Rappel des accès FTP pour ceux qui ne s'en souviennent plus. Les fichiers téléversés via FTP sont [http://battlefield.stdin.fr/ publiés ici].

== révision formats d'images pour le web ==


Nous allons revoir en cours quels sont les différents formats d'image existant pour le web, comment en choisir un et surtout comment exporter une image dans différents formats. Nous aborderons brièvement la question de l'audio et de la vidéo.

== Première page liste de propriétés CSS et exercice pour la mise en pratique ==

La plupart des praticiens du web sont autodidactes, du moins en partie. Elles ou ils (moi y compris) ne connaissent par coeur toutes les balises HTML ni toutes les propriétés CSS. La compétence la plus utile est donc de savoir où chercher les informations nécéssaires à l'écriture de sites web sur... le web.
 
Quelques sites de référence sont:

* [http://www.w3schools.com/css/default.asp W3school] (en anglais)
* [https://openclassrooms.com/courses?q=css Open Class Rooms]: ''mooks'' en français
* [http://curlybraces.be/wiki/Ressources::CSS Le site de Lionel Maes]

== introduction exercice recette ==

Un template de base est [https://github.com/lacensav/cours_web_2e téléchargeable ici]

Une intro au projet [[Instructable|ici]]

=== Exercice en cours ===

# télécharger le code
# lister les attributs CSS utilisés à l'aide de grep (ensemble, au vidéoproj)
# se répartir les attributs
# documenter cette attribut sur [https://jsfiddle.net/ jsfiddle] en faisant un exemple minimal drôle si possible
# mettre les liens sur [http://piratepad.net/cssattributes le pad]

Pour rappel, nous avions fait [http://piratepad.net/htmltags une collective liste des balises HTML ici].

=== Comment organiser sont code? ===

Voici la structure proposé pour vos projets web. Lorsque vous transférer le dossier complet du projet la structure reste identique et les liens et chemins valide (à condition d'utiliser des liens relatifs).

<syntaxhighlight>
.
└── mon-projet
    ├── css
    │   └── main.css
    ├── fonts
    │   ├── ma-fonte.otf
    │   └── une-deuxieme-fonte.otf
    ├── img
    │   ├── img_01.jpg
    │   ├── img_02.jpg
    │   └── img_03.jpg
    └── index.html
</syntaxhighlight>