Zum Campus
Videokurs

Blog-Website mit HTML und Bootstrap erstellen

Erstelle Schritt für Schritt mit dem Frontend-Framework Bootstrap eine statische Blog-Website

LERNZIELE

  • Du lernst die Funktionsweise von Bootstrap kennen
  • Du verstehst die Unterschiede und Vorteile gegenüber CSS
  • Du lernst die wichtigsten Bootstrap-Klassen kennen
  • Du erhältst einen Einblick in das Grid-System von Boostrap
  • Du lernst den Umgang mit den Bootstrap-Break-Points kennen
  • Du kombinierst eigenen CSS-Code mit Bootstrap

INHALT

Boostrap ist ein Open-Source Frontend-Framework für Responsive und Mobile-First Webdesign. Es enthält CSS- und optional JavaScript-basierte Designvorlagen für Typografie, Layout und verschiedene Komponenten, zum Beispiel Buttons. Dein Vorteil ist dabei, dass du mit wenig Code in kurzer Zeit eine hochwertige Website erstellen kannst.

In diesem Kurs lernst du Boostrap kennen und erstellst Schritt für Schritt eine Blog-Website, die sich automatisch an Smartphones, Tablets und Laptops anpasst. Dabei zeige ich dir die wichtigsten Bootstrap-Klassen und erkläre dir das Grid-System von Bootstrap. Für einen maximalen Lernerfolg solltest du etwas Vorwissen in HTML und CSS mitbringen.

ALLE LEKTIONEN IM ÜBERBLICK

Blog-Website mit Bootstrap
  • Intro
  • Einführung in Visual Studio Code
  • Einführung in die Browser-Entwicklungstools
  • Vorbereitung der Arbeitsumgebung
  • Was ist Bootstrap?
  • Projektvorstellung
  • HTML-Code für den Kopfbereich erstellen
  • Kopfbereich mit Klassen von Bootstrap definieren
  • Willkommenbereich anlegen
  • HTML-Code für die Beitragsliste erstellen
  • Beitragsliste mit Bootstrap-Klassen gestalten
  • Beitragsliste für größere Endgeräte optimieren
  • Fußbereich anlegen
  • HTML-Code für Beitragsseite erstellen
  • Beitragsseite mit Klassen von Bootstrap definieren
  • Quiz: Blog-Website mit Bootstrap

SO LERNST DU MIT DIESEM KURS

In den Videokursen der heise academy lernst du IT-Themen anschaulich und verständlich. Du siehst den Experten bei der praktischen Arbeit zu und lässt dir dabei alles genau erklären. Das Wissen ist in kompakte Lerneinheiten unterteilt, sodass du den Kurs Schritt für Schritt durcharbeiten oder gezielt zu Lektionen springen kannst, die dich interessieren. Die persönliche Lernumgebung der heise academy hält viele Funktionen für dich bereit, die dich beim Lernen unterstützen:

  • Flexibler Videoplayer mit vielen Steuerungsmöglichkeiten
  • Wissensquiz zur Lernkontrolle
  • Lernhistorie und Lernfortschritt
  • Lesezeichen und Notizen
  • Volltextsuche in den Videos
  • Übungsmaterial zum Mitmachen
  • Responsive Web-App und Videostreaming für alle Endgeräte

TECHNISCHE VORAUSSETZUNGEN

Für diesen Videokurs wird lediglich ein aktueller Browser (mit eingeschalteter JavaScript-Funktionalität) und eine Internetverbindung benötigt.

DEIN EXPERTE

Fabian Hiller
Webentwickler und CTO | Adstock

Fabian Hiller gründete bereits mit 18 Jahren sein erstes Unternehmen und unterstützte Unternehmen, Restaurants und Vereine in seiner Umgebung mit Grafikdesign und Webentwicklung. 2018 folgte dann mit Adstock das zweite Unternehmen. Neben seinem YouTube-Kanal, auf dem er sein Wissen und seine Erfahrungen rund um UI- und UX-Design sowie App- und Webentwicklung teilt, ist er an zahlreichen weiteren Softwareprojekten beteiligt.

Blog-Website mit HTML und Bootstrap erstellen

Veröffentlicht am 13.12.2025
ab 49,00 €
im
ESSENTIAL PASS
Preise und Pakete vergleichen

Du hast Fragen zu unseren academy Videokursen? Wir helfen dir gerne weiter.

Fülle ganz einfach und bequem das Kontaktformular aus und wir werden deine Fragen schnellstmöglich beantworten.

Kontaktformular