HTML CSS Bootstrap
HTML CSS Bootstrap
Opleiderscore:
Startdata en plaatsen
Beschrijving
Bij @The Academy leer je slimmer, sneller en succesvoller. Wij combineren efficiënt opleiden, praktijkgerichte trainingen en innovatieve leermethoden. Ontwikkel je ICT-skills bij een opleider die écht het verschil maakt.
Wat leer je in deze training?
- HTML-structuur – Semantische elementen, formulieren en tabellen.
- CSS-opmaak – Flexbox, Grid, animaties en responsieve ontwerpen.
- Bootstrap-framework – Grid-systeem, componenten en utility classes.
- Webdevelopment-tools – Werken met browser DevTools, Emmet en Live Server.
- Accessibility & best practices – ARIA-labels, contrastcontrole…
Veelgestelde vragen
Er zijn nog geen veelgestelde vragen over dit product. Als je een vraag hebt, neem dan contact op met onze klantenservice.
Bij @The Academy leer je slimmer, sneller en succesvoller. Wij combineren efficiënt opleiden, praktijkgerichte trainingen en innovatieve leermethoden. Ontwikkel je ICT-skills bij een opleider die écht het verschil maakt.
Wil je leren hoe je professionele, responsive websites bouwt? In
deze driedaagse training ontdek je hoe je HTML, CSS en Bootstrap
gebruikt om gestructureerde, mobielvriendelijke webpagina’s te
ontwikkelen. Je leert semantische HTML, geavanceerde CSS-technieken
en hoe je met Bootstrap sneller en efficiënter webinterfaces
creëert.
Deze training is perfect voor beginners, designers en marketeers die webdevelopment willen beheersen. Met praktijkgerichte opdrachten en moderne tools bouw je functionele en visueel aantrekkelijke websites. De training bevat Engelstalig lesmateriaal en wordt gegeven door een Nederlandstalige docent.
Programma:
Wat leer je in deze training?
- HTML-structuur – Semantische elementen, formulieren en tabellen.
- CSS-opmaak – Flexbox, Grid, animaties en responsieve ontwerpen.
- Bootstrap-framework – Grid-systeem, componenten en utility classes.
- Webdevelopment-tools – Werken met browser DevTools, Emmet en Live Server.
- Accessibility & best practices – ARIA-labels, contrastcontroles en SEO-optimalisatie.
Deze training is perfect voor beginners, designers en marketeers die webdevelopment willen beheersen. Met praktijkgerichte opdrachten en moderne tools bouw je functionele en visueel aantrekkelijke websites. De training bevat Engelstalig lesmateriaal en wordt gegeven door een Nederlandstalige docent.
- Beginners die willen starten met webdevelopment.
- Designers die hun ontwerpen zelf willen coderen.
- Marketeers die basisvaardigheden nodig hebben voor CMS-aanpassingen.
- Ondernemers die eenvoudige websites zelf willen bouwen.
- Werkomgeving opzetten: VS Code, browserdeveloper tools (Chrome DevTools).
- HTML5-semantiek: <!DOCTYPE html>, <header>, <nav>, <section>, <article>, <footer>.
- Elementen: tekst (<h1>-<h6>, <p>), lijsten (<ul>, <ol>, <li>), media (<img>, <video>).
- Formulieren: <form>, <input>-types (text, email, checkbox), <button>, validatie.
- CSS-basis: selectors (class, id), box model (margin, padding, border), kleuren (hex, rgb).
- Flexbox: display: flex, justify-content, align-items, flex-direction.
- CSS Grid: grid-template-columns, grid-gap, fr-eenheden.
- Responsive technieken: media queries (@media (max-width: 768px)), mobile-first vs desktop-first.
- Transities en animaties: transition, @keyframes, transform (rotate, scale).
- CSS-variabelen: :root, var(--primary-color).
- Bootstrap installatie: CDN-link, npm of download.
- Grid-systeem: container, row, col-* (breakpoints: sm, md, lg, xl).
- Componenten: navbar, cards, carousel, modals, dropdowns.
- Utilities: spacing (mt-3), kleuren (bg-primary, text-white), flex utilities (d-flex).
- Customizen: Sass-variabelen overschrijven, themekleuren aanpassen.
Programma:
- HTML:
- Semantische tags (<main>, <aside>, <figure>).
- Meta-tags (<meta charset="UTF-8">, viewport-instellingen).
- Tabellen (<table>, <thead>, <tbody>), iframes.
- CSS:
- Positionering: relative, absolute, fixed, sticky.
- Pseudo-classes (:hover, :nth-child()), pseudo-elementen (::before, ::after).
- Specificiteit, !important, inheritance.
- Moderne eenheden: rem, vh, vw, calc().
- Bootstrap:
- Breakpoints: xs (extra small) tot xl (extra large).
- Forms: validatiestyling, custom form controls.
- Icons: Bootstrap Icons of Font Awesome integreren.
- JavaScript-componenten: collapsible menus, tooltips (met data-attributes).
- Tools:
- Browser DevTools: element inspecteren, responsive modus.
- Emmet-snelkoppelingen in VS Code.
- Live Server-extensie voor real-time preview.
- Accessibility:
- ARIA-labels (aria-label, role="navigation").
- Contrastratio’s controleren (WCAG-richtlijnen).
- Bereidt voor op freeCodeCamp Responsive Web Design Certification.
- Basis voor Microsoft MTA: HTML5 Application Development Fundamentals.
Blijf op de hoogte van nieuwe ervaringen
Deel je ervaring
Heb je ervaring met deze cursus? Deel je ervaring en help anderen kiezen. Als dank voor de moeite doneert Springest € 1,- aan Stichting Edukans.Er zijn nog geen veelgestelde vragen over dit product. Als je een vraag hebt, neem dan contact op met onze klantenservice.