CSS

3. Je online website

Maak een online website van minstens 3 pagina’s die aan elkaar gekoppeld zijn. CSS moet in een apart document staan.

Oftewel: zet de website die je voor opdracht 2 gemaakt hebt online. Volg onderstaande stappen om dit voor elkaar te krijgen.

Uitwerking

  1. Scheid de CSS van je HTML-document door:
    1. Alle gebruikte stijl die als attribuut in de HTML staat naar de <style> tag in de HEAD te verplaatsen.
    2. De inhoud van de stijl-tags in een apart .css-document op te slaan. 
    3. Een LINK te maken in de HEAD naar het losse CSS-document.
      zie ook Les 2. CSS
  2. Download en installeer Filezilla.
    • Log in op de server met de FTP-gegevens die je gekregen hebt van Cheryl Van Kempen (op aanvraag)
    • Het linker scherm toont jouw lokale bestanden. Browser her naar de map met de bestanden die je wil upoaden.
    • Het rechter scherm toont de online bestanden: de bestanden op de server. Browse hier naar de map Aeres1920
    • Maak een map aan met je naam onder de map aeres1920.
      Jouw website komt dan onder: http://hydric.info/aeres1920/jouwnaam
      Let op: URLS zijn hoofdlettergevoelig. gebruik daarom bij voorkeur geen hoofdletters.
    • Upload je bestanden door ze links te selecteren en met een rechts-klik > Upload te kiezen.
    • Browse naar de URL van je map. Als je home-pagina index.html heet, dan kom je meteen op deze pagina. Zo niet, dan moet je ook de bestandsnaam (incl. extensie) nog achter de URL typen.

Tip: Let op dat je naar de juiste map upload en geen bestanden onbedoeld overschrijft. Als je twijfelt, maak dan een backup lokaal (download de bestanden) of wijzig de bestandsnamen online. Je kunt bijvoorbeeld _bkup aan de bestandsnamen toevoegen waarvan je een backup wil bewaren.

De volgende video helpt bij de installatie en het gebruik van FileZilla.

Je kunt natuurlijk ook gebruik maken van andere FTP-programma’s, of de FTP-capabilities van je editor. Voor FTP in je editor moet je vaak een extensie of plugin installeren. Zie bijvoorbeeld de extra pagina over de Brackets FTP extensie.

Leave a Reply

Your email address will not be published. Required fields are marked *