Differences

This shows you the differences between two versions of the page.

--- 2017_2018:s1:webdoc:td4 [2017/11/27 14:49] – [Tableaux] pourcelot
+++ 2017_2018:s1:webdoc:td4 [2017/11/28 16:50] (current) – [Les formulaires 2.0] pourcelot
@@ Line 5: / Line 5: @@
 Comme toujours, l'objectif est de vous donner le temps d'expérimenter ces différentes méthodes.
-Par ailleurs, vous aurez [[2017_2018:s1:webdoc:projet|un projet]] à réaliser d'ici fin décembre, à savoir un site web démontrant toutes vos compétences en matière de web-développement.
+<note important>
+À partir de ce TD, le travail demandé n'est plus à rendre (il vous sert simplement de support pour que vous puissiez expérimenter).
-Vous devez donc commencer à réfléchir à votre [[2017_2018:s1:webdoc:projet|projet]].
+Ceci vous dégage du temps pour commencer à réfléchir en dehors des heures de TD sur votre [[2017_2018:s1:webdoc:projet|un projet]], à savoir un site web démontrant toutes vos compétences en matière de web-développement.
-Ainsi, vous arriverez au prochain TD avec un plan sur papier de votre site, précisant les styles, mise en page et de contenu que vous souhaitez mettre en place afin que votre encadrant de TD puisse vous conseiller sur la difficulté relative de vos objectifs.
+Ce projet sera à rendre d'ici fin décembre (les modalités exactes de rendu seront fixées par votre enseignant de TD).
+Les consignes, à respecter impérativement, sont listées sur [[2017_2018:s1:webdoc:projet|la page du projet]].
+Ainsi, **vous arriverez au prochain TD en ayant choisi votre thème et avec un plan sur papier de votre site** à présenter à votre enseignant (contenus, styles et mise en page prévus) pour qu'il puisse donner un premier avis.
+</note>
 ===== Insertion d'une vidéo / de son =====
@@ Line 135: / Line 140: @@
 	* Bouton "Effacer"
 * Utiliser toutes les balises HTML5 nécessaires à l'obtention de ce formulaire.
 * Mettre en forme ce formulaire avec du CSS dans l'objectif :
-	* D'obtenir quelque chose qui s'approche de ça : http://en.blog.files.wordpress.com/2010/11/grunion-form-builder.png
+	* D'obtenir quelque chose qui s'approche de ça :
-	* D'obtenir quelque chose qui ne ressemble surtout pas à ça : http://wiki.lws-hosting.com/lib/exe/fetch.php/formail1.jpg
+{{ :2017_2018:s1:webdoc:grunion-form-builder.png?300 |}}
-* Et c'est pas fini, veiller à :
+	* D'obtenir quelque chose qui ne ressemble surtout pas à ça (pas de tableau pour la mise en page notamment !) :
+{{ :2017_2018:s1:webdoc:formail1.jpg?300 |}}
+* Et c'est pas fini :
 	* Lorsqu'un champs est en train d'être modifié, appliquer "une mise en surbrillance" de ce dernier.
 	* Les champs contenant du texte (excepté Mot de passe) doivent être pré-rempli.
@@ Line 148: / Line 157: @@
 <note tip>Un peu d'aide ?
     * Pseudos-formats :  :required, :invalid, :focus
+    * [[https://developer.mozilla.org/fr/docs/Web/Guide/HTML/Formulaires/Validation_donnees_formulaire|Validation d'un formulaire]] en HTML5.
     * Type de champs HTML5 : email, tel, number, url, range, color, date, search (http://www.alsacreations.com/tuto/lire/1372-formulaires-html5-nouveaux-types-champs-input.html)
 </note>