Transcript
Niet alleen hebben we een website.html nodig maar vaak zijn er meer bestanden. Bijvoorbeeld CSS bestanden, plaatjes of video's. We gaan onze boilerplate uitbreiden en alle bestanden echt de juiste namen geven.
- Het eerste wat we doen is de website.html veranderen naar index.html. Waarom index.html? Dat is de eerste pagina die een browser laat zien. Dus als ie naar een website zoekt zoekt de browser altijd als eerste naar een index.html bestand.
- Dan maak ik een style.css bestand waarin we straks CSS gaan schrijven. Nu moet ik het CSS bestand met de HTML linken. Dat doe ik in de head. Hoe kunnen we dat nu even snel testen? Door wat CSS te schrijven en kijken of die update wordt. Nice!
- We gaan nu een plaatje toevoegen. Ik heb hier een plaatje van fons.jpeg. Die zet ik in de root van de map en gebruik van een image tag om die weer te geven. Vet! We hebben een plaatje.
- Alle bestanden staan nu nog los in de rootmap. Developers zijn precies en wat we vaak doen is de bestanden opdelen in mappen. Ik maak een CSS map en doe daar de style.css in. Ik maak een map die heet img (van image) en doe daar het plaatje in. Maar ohoho het werkt allemaal niet meer!
- Dat komt omdat de paden (paths) naar de bestanden zijn aangepast. Ze zitten niet meer in de root van de folders maar in submappen. Dan moet ik de mappen in de html aanpassen.
En tada! We hebben een website met een standaard en duidelijke mappenstructuur om onze website verder te maken!