Voor je de website technisch gaat samen stellen, overleg je eerst met de klant de menu (sitemap) en de inhoud (wireframe). Met behulp van MockFlow kan je dit snel samenstellen.

Wat komt er op je homepagina?

In 10 seconden moeten we kunnen zien wat het bedrijf doet, waar het ligt en hoe je het bedrijf kunt contacteren.

Je homepage is de samenvatting van je website! Dat doe je met blokken content die je bezoeker triggert om verder te lezen of actie te ondernemen.

Vertel in 5 regels wat je doet!

Wat mij betreft moet een bezoeker binnen 5 seconden weten wat jij doet en waarom dit voor haar relevant is. Je wilt jouw bezoekers niet frustreren met vage anonieme teksten, nieuws (tenzij het een nieuwssite is) of lange lappen tekst. Vat in 5 regels samen wat je doet, waarom jij uniek bent en wat jij te bieden hebt. Dit is de kern van je website, en helpt je straks om de rest van je website beter in te richten.

Een goede indruk van je website op de homepage.

  1. Informeren | Wees duidelijk
  2. Communiceren | Maak onderscheid
  3. Triggeren | Bied ruimte voor actie
  4. Navigeren | Optimaliseer onderdelen

Bekijk dit artikel op goede homepagina maken.

Wat wil een bezoeker weten?

  • Wie ben je?
  • Wat doe je (niet)?
  • Welk probleem los je op?
  • Is de informatie op je website relevant voor mij?
  • Waarom ben jij de juiste persoon?
  • Hoe weet ik dat ik je kan vertrouwen?
  • Wat moet ik doen op je website?

Dit artikel komt van: wat moet er op de homepage van je website staan

Je header of slider op je homepagina is de blikvanger. Dit zorgt voor de juiste look & feel en zorgt dat de bezoekers blijven op je website. Je wekt interesse hun interesse op.

Werk je website uit in Bootstrap Studio. Dan kan je werken met het grid-systeem Bootstrap (gebaseerd op 12-kolommen). Meer uitleg zie https://www.w3schools.com/bootstrap5

Bootstrap Studio

Jullie mogen als leerling gebruik maken van de software Bootstrap Studio. Je zal hiervoor een bevestiging krijgen op jullie schoolmail voornaam.familienaam@richtpuntninove.be

  1. Component panel – It consists of the Studio and Online tabs. Holds all available components which you can drag and drop onto the Stage (6) and the Overview (2).
  2. Overview panel – It gives you a quick overview of all components on the page. Components here can be dragged and reordered.
  3. Editor panel – contains HTML and Styles tabs. You can click to expand it, and detach it as a separate window.
  4. Design panel – holds all pages, CSS, SASS files and images of your design. When double clicked, pages are opened in the Stage (6) and other assets - in the Editor panel (3).
  5. Options panel – displays the options of the selected component(s) and gives you easy visual customization controls.
  6. The Stage – this is where you see a preview of the page, drag and drop components and edit text.

Verander de CSS van het formulier via Formulier ontwerper > Geavanceerde designer.

Plaats je resultaat in een mockup van zowel een gsm als een beeldscherm. Toon ook min. 4 verschillende pagina's.