Website ontwerpen met Illustrator

Cursusduur

02:20:39

Niveau

Gevorderd

deel deze cursus:

Share on facebook
Share on linkedin
Share on pinterest
Website ontwerpen met Illustrator
25

Leer Adobe Illustrator gebruiken om webpagina’s te ontwerpen en daarna om te (laten) zetten in HTML en CSS.

Cursusprogramma

  • Document aanmaken in Illustrator
    • Algemene cursusinformatie
    • Web document aanmaken in Adobe Illustrator
    • Maateenheden in pixels zetten
    • Hulplijnen gebruiken
  • Grid en kolomstramien aanmaken en toepassen
    • Grid instellen
    • 12-koloms stramien maken
    • Raster magnetisch maken en Objecten uitlijnen op pixelraster
    • 10-, 8- en 6-koloms stramien en bijbehorend grid maken
  • Grid en kolomstramien voorbereiden en exporteren
    • Handmatig grid tekenen voor export
    • Afbeelding van grid toepassen in html-pagina
  • Weblayout ontwerpen in Adobe Illustrator
    • Google Fonts Synchroniseren met Sky Fonts
    • Document opbouwen met lagen
    • Raster, stramien en hulplijnen activeren
    • Vormgeven van de header
    • Vormgeven van de navigatiebalk
    • Vormgeven van het content gebied
    • Vormgeven van de footer
  • illustrator ontwerp klaarmaken voor HTML-ontwerp
    • Delen van ontwerp splitsen in afbeeldings-segmenten
    • Segmenten bewerken, tonen en verbergen
    • Segmenten wegschrijven naar afbeeldingen
    • Kennismaken met CSS-stijlen in Illustrator
    • Illustrator CSS-stijlen kopiëren naar html
    • Ontwerp omzetten in printbestand met maatvoering
  • Ontwerp omzetten in fixed (static) webdesign
    • Basisstructuur met sections en div’s beschrijven in HTML
    • Wrapper bouwen met grid en kolomstramien
    • Header – oranje balk plaatsen
    • Header – sprite met social icons plaatsen
    • Header – telefoonblokje plaatsen
    • Header – logo plaatsen
    • Banner – Achtergrondafbeelding plaatsen
    • Banner – Kleurvlak en opsommingslijst 
    • Navigatie – Horizontale menubalk vormgeven
    • Navigatie – Google Fonts toepassen en mouse-overs vormgeven 
    • Content – Layout structureren in html (section & article)
    • Content – 3-koloms layout vormgeven
    • Content – Teksten opmaken en vormgeven
    • Footer – Layout structureren in HTML
    • Footer – 4-koloms layout vormgeven
    • Footer – Footermenu opmaken en vormgeven