avant nettoyage

1 files changed, 32 insertions, 0 deletions

diff --git a/lab/README.md b/lab/README.md
new file mode 100644
index 0000000..7ee5c11
--- /dev/null
+++ b/lab/README.md
@@ -0,0 +1,32 @@
+# Laboratoire du futur site web de Deuxfleurs 
+
+## Objectifs techniques
+
+* Responsive mobile-first design.
+* [Media queries CSS](https://www.w3schools.com/css/css_rwd_mediaqueries.asp) : Des images envoyées adaptées à la taille des viewports.
+* Pas besoin de Javascript : Le CSS3 ça déchire, on peut faire des infobulles, des animations, de la parallax. (Navigateurs compatibles depuis 7 ans ou plus.)
+
+## Idées graphiques
+
+* Des bouts de branches et de canopée qui défilent lors du scroll, contenant des éléments de texte ou autre contenu.
+* Un header avec des onglets sur PC et un « menu-sandwich » sur le côté sur téléphone.
+* Exploiter l'illustration au maximum. En la laissant fixée en fond de page tandis que les éléments graphiques défilent ?
+
+
+## Inspirations
+
+* [MDN - Création de tooltips et remarques sur l'accessibilité du contenu](https://developer.mozilla.org/en-US/docs/Web/CSS/::after#tooltips)
+
+	On peut faire tout ce qu'il faut avec CSS3 !
+
+	Néanmoins, *rendre un site accessible sans outils a l'air compliqué*.
+
+* [W3C Semantic HTML](https://www.w3schools.com/html/html5_semantic_elements.asp)
+
+	Utiliser des bannières qui donnent du sens au contenu.
+
+* [Semantic CSS] (https://adamwathan.me/css-utility-classes-and-separation-of-concerns/)
+
+	Le fait de ne pas donner d'éléments de graphisme dans notre markup HTML, mais seulement dans le CSS. Par exemple, mettre une classe "text-center" à un <p> est considéré une mauvaise pratique. 
+
+