Samed2001 / challenge-ao17-01

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Challenge AO17-01: HTML/CSS en Javascript

Beschikbare tijd

Maandag 6 november 2017 14:00 t/m vrijdag 10 november 2017 23:59

Toegestane middelen

De studenten mogen bij de Challenge gebruiken:

  • Alle eerder gemaakte opdrachten
  • Referentiewebsites als w3schools.org, Stackoverflow etc.
  • HTML / CSS boek

Locaties en observatoren

Deze challenge maak je thuis, of op school terwijl je wacht op je functioneringsgesprek.

Beoordeling

Jouw challenge bespreek je in de eerstvolgende lesweek met een van je docenten. Je krijgt feedback op je werk en er wordt je gevraagd om enkele aanpassingen of toevoegingen te maken (zodat we kunnen vaststellen of het je eigen werk is).

(zie volgende pagina)

De opdracht

Je gaat een website bouwen voor een nieuwe Espressobar in Gorinchem: Chavez. Je krijgt afbeeldingen en teksten die je daarvoor moet gebruiken. Je mag zelf afbeeldingen en teksten toevoegen als je dat wilt.

Je mag veel meer eigen inbreng gebruiken als bij de oefeningen in de afgelopen tien weken.

Functionele eisen:

  • Er zijn vier pagina’s (home, over, jobs, contact) met dezelfde layout;
  • Er is een horizontaal menu met daarin vier items: home, over, jobs, contact die linken naar de betreffende pagina;
  • De layout kent de volgende onderdelen:
  • bovenaan een menubalk (horizontaal);
  • daaronder een banner (100% breedte, hoogte 200pixels)
  • daaronder de content in twee kolommen
    • linkerkant
    • rechterkant
  • onderaan een footer
  • Gebruik ergens in je site een caroussel (javascript of jquery code die op 1 plek steeds een nieuwe afbeelding laat zien)

Technische eisen:

  • Het document is geschreven in HTML5
  • Het document bevat het correcte doctype
  • Het document bestaat uit een head en body
  • Het document heeft een title
  • Het document valideert als correct HTML5, http://validator.w3.org/
  • Gebruik nav waar nodig
  • Gebruik main en article waar nodig
  • Gebruik position: relative, absolute en fixed waar nodig.
  • Pas nooit negatieve margins of paddings toe

About