Instructions du projet (Introduction HTML/CSS/JS) de première année de SIO
Les attendus
| Page concernée | Instruction |
|---|---|
| Toutes les pages | Les pages HTML devront être valides W3C. |
| Toutes les pages | Les pages HTML et CSS devront répondre au design responsive. |
| Toutes les pages | Les pages HTML et CSS devront être commentées. |
Les éléments obligatoires
| Page concernée | Instruction |
|---|---|
| index, smartphone, computers, tablets, headphones, crédits (Cette page) |
Un minimum de 4 pages formant un ensemble cohérent |
| Toutes les pages | Les balises meta nécessaires. |
| Toutes les pages | Une ou plusieurs images légendées. |
| Toutes les pages | Un ou plusieurs liens externes et internes. |
| Cette page | Un ou plusieurs tableaux. |
| smartphone, computers, tablets, headphones |
Une ou plusieurs listes. |
| index.html#slider | Un diaporama (ou slider d’image). |
| index.html#image-map | Une image avec des zones cliquables ( image map ). |
Crédits des polices des textes
Voici l'ensemble des crédits des polices utilisées sur le site.
Police Confortaa de Google Fonts (conçus par Johan Aakerlund)
Utilisée comme police principale sur l'ensemble des pages de ce site.
Utilisée comme police principale sur l'ensemble des pages de ce site.
Crédits des Images
Voici l'ensemble des crédits des images utilisées sur le site. Les images proviennent de sources libres de droits, merci aux photographes.
Image Map :
Image générer par une Intelligence Artificielle (Bing Images Creator)
Utilisée pour le slider dans index.html#slider
Utilisée pour le slider dans index.html#slider
Slider :
Ecouteurs :
Image 1: "JBL" par Ayrus Hill sur Unsplash
Image 2: "Marshall" par Fujiphilm sur Unsplash
Image 3: "SONY MDR 7506" par Kreeson Naraidoo sur Unsplash
Utilisée pour illustrer les écouteurs sur la page : headphones.html.
Image 2: "Marshall" par Fujiphilm sur Unsplash
Image 3: "SONY MDR 7506" par Kreeson Naraidoo sur Unsplash
Utilisée pour illustrer les écouteurs sur la page : headphones.html.
Ordinateurs :
Image 1: "ACER" par Jeroen den Otter sur Unsplash
Image 2: "Ordinateur de bureau" par shri sur Unsplash
Image 3: "MacBook" par yuhaimedia sur Unsplash
Utilisée pour illustrer les ordinateurs sur la page : computers.html.
Image 2: "Ordinateur de bureau" par shri sur Unsplash
Image 3: "MacBook" par yuhaimedia sur Unsplash
Utilisée pour illustrer les ordinateurs sur la page : computers.html.
Téléphones :
Image 1: "Samsung Galaxy S10" par Dan Smedley sur Unsplash
Image 2: "Pixel 4A" par Daniel Romero sur Unsplash
Image 3: "Iphone 7 Plus" par Dennis Cortés sur Unsplash
Utilisée pour illustrer les téléphones sur la page : smartphones.html.
Image 2: "Pixel 4A" par Daniel Romero sur Unsplash
Image 3: "Iphone 7 Plus" par Dennis Cortés sur Unsplash
Utilisée pour illustrer les téléphones sur la page : smartphones.html.
Tablettes :
Image 1: "Realme Pad" par Hrushikesh Chavan sur Unsplash
Image 2: "Tablette Windows" par Ricardo Resende sur Unsplash
Image 3: "Ipad" par Valen Don sur Unsplash
Utilisée pour illustrer les tablettes sur la page : tablets.html.
Image 2: "Tablette Windows" par Ricardo Resende sur Unsplash
Image 3: "Ipad" par Valen Don sur Unsplash
Utilisée pour illustrer les tablettes sur la page : tablets.html.
Autres crédits
Voici les autres crédits de ce site.
Inspiration : wix templates
Validations CSS
Toutes les fichiers CSS de ce site on été certifié par w3schools CSS validator.
