HTML & CSS
Intensiv-Schulung

Termin anfragen
Flexibel oder Inhouse
HTML & CSS Schulung/Seminar/Workshop
Der beste Weg mit HTML & CSS zu starten

Ist dieser Kurs für Dich?

Seit dem Erscheinen von HTML und CSS haben diese Technologien eine lange Entwicklung vollzogen. Was anfangs zur statischen Anzeige von Dokumenten gedacht war, hat seit dem Erscheinen von HTML5 und CSS3 seinen Siegeszug durch das Web angetreten. Mittlerweile werden diese Technologien nicht nur im klassischen Web eingesetzt, sondern finden auch Einzug in Bereichen wie Healthcare und Automotive.

Web-Apps stehen heutzutage nicht mehr im Schatten nativer Apps, auch dank HTML5 und CSS3. Umso wichtiger ist es deshalb diese grundlegenden Technologien zu verstehen und zu beherrschen.

Wissen aus der Praxis.

Wir sind selbst Entwickler und wissen, welche Probleme zuerst in der echten Welt auftreten werden. Deshalb arbeiten wir mit Beispielen, die aus der echten Welt stammen. Diese haben wir dann auf den Kern reduziert, um diese leicht vermitteln zu können.

Der Praxis-Anteil liegt dabei bei 60%.

Download Agenda

Grundlagen HTML und CSS

Dieser Workshop beginnt mit den Grundlagen, vermittelt aber auch fortgeschrittene Konzepte. Er ist für Neulinge im Bereich Webentwicklung gedacht, welche die Grundlagen schnell und effizient verstehen wollen. Alle Themenpunkte sind didaktisch ausgearbeitet und bieten sowohl Erklärungen der theoretischen Konzepte als auch Beispielaufgaben, um das gelernte direkt anzuwenden und eigene Erfahrungen zu machen. Viele Teilnehmer buchen diesen Workshop als Grundlage für fortgeschrittene Kurse zur Webentwicklung z.B. mit Angular oder React.

  • Einführung
  • Das Box-Modell und Box-Sizing
  • CSS Selektoren und Performance
  • CSS Kaskade und Spezifität
  • CSS Units verstehen
  • Verschiedene Layout Modelle
  • Backgrounds und Farbverläufe
  • Schriften, Formatierung und Effekte
  • Ausrichten von Inhalten
  • Zentrieren von Elementen
  • CSS Flexbox
  • CSS Grid

Professionelles Entwickeln mit HTML und CSS

Nachdem die Grundlagen verstanden sind, widmen wir uns Themen die uns helfen unsere Web-Anwendungen schick und trotzdem performant darzustellen. Weiterhin werden wir lernen , wie professionelle Entwicklung mit diesen Technologien aussieht. Hierzu gehhört ein tiefes Verständnis des Browsers und deren Renderer, Werkzeuge zum Debugging und der Einsatz Präprozessoren. Zuletzt schauen wir uns den Architektur-Stil Atom Design an, der gerade im Zeitalter der komponentenbasierten Entwicklung oft eine gute Wahl ist.

  • Responsive Design
  • Accessibility (a11y)
  • CSS Transitions und Animations
  • Eigene Ladeanimationen erstellen
  • Das Arbeiten mit Media Queries
  • Mobile First vs. Desktop First
  • CSS Performance Optimierung
  • Chrome Devtools für Performance-Analyse
  • Crashkurs Browser-Rendering
  • Performante Animationen und Transitions
  • Tooling und Workflow
  • Präprozessoren(SASS)
  • Statische Codeanalyse für CSS
  • Atomic CSS

Typische Fragen, die wir beantworten

  • Wie strukturiere ich meine Anwendung, damit ich langfristig eine wartbare Basis meines Quellcodes habe?
  • Welche verschiedenen Möglichkeiten von Layouts habe ich? Was ist Flexbox?
  • Welche modernen Möglichkeiten habe ich meine Webseite effektiv mit HTML & CSS zu entwickeln?
  • Wie erstelle ich Template die responsive sind?
  • Wie mache ich meine Template maschienenlesbar (SEO)?
  • Wie erstelle ich Formulare und Validierungen?
  • Wie kann ich Animationen verwenden?
  • Was ist BEM? Blocks Elements Modifiers?
  • Welche IDE benutze ich am besten?

Leistungen

Du erhältst Zugriff auf alle Unterlagen und Zusatzmaterialien aus unserem Workshop. Dies wird über unser virtuelles Klassenzimmer organisiert.

Mit deinem Teilnehmer-Account hast du da lebenslangen Zugriff - auch auf Updates! In unseren öffentlichen Schulungen sind ebenfalls Essen und Trinken für die komplette Veranstaltungszeit enthalten. An den meisten Standorten konnten wir es dazu auch einrichten, dass wir auch ein vegetarisches Menü anbieten können. Falls das für dich wichtig ist, kontaktier uns doch bitte vorher via E-Mail ob das am jeweiligen Standort möglich ist.

Voraussetzungen

Voraussetzung sind Grundlagenkenntnisse in JavaScript und HTML.

Technische Voraussetzung für den Workshop ist ein Notebook mit Windows, Linux oder MacOSX. Es sind einige Browser-Plugins zur analyse und besseren Verständniss zu installieren. Weiterhin wird ein Login auf den gängigen Platformen wie GitHub und Codepen empfohlen. Hierzu bekommst du eine Schritt-für-Schritt Anleitung nach deiner Anmeldung zu diesem Workshop.

Die Meinung unserer Teilnehmer zählt.

Nach jeder HTML & CSS Schulung bitten wir unsere Teilnehmer um Feedback. Aus insgesamt 1114 abgegeben Bewertungen erreichen wir aktuell eine durchschnittliche Bewertung von 4.7 Sternen.

Alle Bewertungen anzeigen
Illustration eines Teilnehmers HTML & CSS
Anonym
Remote,

SEHR viele Eindrücke rund um HTML/CSS. Ich denke da hat jeder was neues gelernt :-)

Illustration eines Teilnehmers HTML & CSS
Anonym
Remote,

Ich hätte nie gedacht, dass ich als relativer Anfänger dann doch so gut folgen kann. Die Mischung aus Theorie und dann Praxis-Anwendung plus viele Link-Tipps die Lust auf mehr machen, war echt super!

Illustration eines Teilnehmers HTML & CSS
Anonym
Remote,

https://jsbin.com/mitavamoni/1

Illustration eines Teilnehmers HTML & CSS
Anonym
Remote,

Hat sich gelohnt!

Illustration eines Teilnehmers VueJS & TypeScript
Anonym
Remote,

Sehr gute Schulung die mich mehrere Schritte nach vorne bringt. Danke!

Illustration eines Teilnehmers VueJS & TypeScript
Anonym
Remote,

Schöner Vortrag und praktische Übungen

Illustration eines Teilnehmers VueJS & TypeScript
Anonym
Remote,

Ich habe sehr viel gelernt und viele Zusammenhänge sind mir jetzt klar. Ich kann was ich gelernt habe in mein tägliches doing nutzen. Super gut!

Illustration eines Teilnehmers VueJS & TypeScript
Anonym
Remote,

Ich fands klasse - sehr interessant und vielfältig! Vielen Dank dafür :)

Kundenreferenzen

RWE Group Business Services GmbH, Dortmund
STRATO AG, Berlin
Allianz
Robert Bosch GmbH, Stuttgart
Schenker AG, Essen
Commerzbank AG, Frankfurt
CompuGroup Medical Software GmbH, Koblenz
Condor Flugdienst GmbH, Oberursel
Consorsbank, Nürnberg
E-Plus Mobilfunk GmbH, Düsseldorf
Südwestrundfunk, Stuttgart
ETECTURE GmbH, Frankfurt am Main
EXXETA AG, Karlsruhe
Fast Lane Institute for Knowledge Transfer GmbH, Hamburg
FH Dortmund, Kamen
G DATA Software AG, Bochum
GALERIA Kaufhof GmbH, Köln
Hays AG, Mannheim
HOTEL DE AG, Nürnberg
JIMDO GmbH, Hamburg
MT AG, Ratingen
MyHammer AG, Berlin
Raiffeisen Schweiz, St. Gallen
rocket-media GmbH & Co KG, Dinkelsbühl
EnBW Energie Baden-Württemberg AG, Karlsruhe
Thomas Cook Touristik GmbH, Oberursel
dataport, Altenholz
Süddeutsche Zeitung Digitale Medien GmbH, München
Talanx Service AG, Hannover
ELAXY Financial Software & Solutions GmbH & Co. KG, Münster

Classroom und tolle Lerntools

  • Austausch zwischen TeilnehmerInnen und TrainernInnen.
  • Vorbereitungsanleitung vor dem Workshop.
  • Slides, Aufgaben und Zusatzmaterial.
  • Alle Materialien auch nach der Schulung im Zugriff.
  • Didaktisch für Lernerfolg optimiert.
Illustration mit einem Laptop und einem Abspielsymbol

Termine & Inhouse-Buchungen

Du möchtest einen Termin flexibel vereinbaren und die Preise wissen? Dann kannst du uns eine Anfrage stellen.

HTML & CSS Inhouse Anfragen

Häufige Fragen und Antworten.

Wann sind eure Schulungszeiten?

Unsere On-Site Schulungen beginnen um 9:00 Uhr und enden um 16:30 Uhr.

Bei Remote-Schulungen teilen wir die Kurse nach Wunsch gerne auf mehrere halbe Tage auf. So finden unsere Vormittags-Kurse von 9:00 bis 12:00 statt und unsere Nachmittags-Kurse von 14:00 - 17:00. Das ermöglicht laufende Projektarbeit nicht ganz liegen lassen zu müssen oder sich auch um die Betreuung der Kinder zu kümmern.

In welcher Sprache sind die Trainings möglich?

Unsere Trainings können auf Deutsch oder Englisch gehalten werden. Die öffentlichen Termine werden auf Deutsch gehalten, außer es ist explizit anders vermerkt. Für In-House Trainings kann bei der Anfrage ein Hinweis auf die gewünschte Sprache angegeben werden. Die Unterlagen und Aufgaben sind komplett auf Englisch verfügbar.

Bietet ihr die Trainings auch Remote an?

Ja. Wir haben intensiv an einem Setup gebaut welches euch die Möglichkeit bietet an unseren Workshops auch Remote teilzuhaben. Wir haben mit unserem virtuellen Classroom eh schon eine sehr gute Infrastruktur welche diesen Modus sehr gut unterstützt. Unsere Slides sind immer online und werden auch nach euerer Teilnahme aktualisiert. Auch nach der Schulung habt ihr dauerhaft Zugriff auf diese. Weiterhin lassen sich die Aufgaben über ein Online-Interface aufzurufen und von uns freischalten. Wir haben hier einige Aufgaben ergänzt, welche euch für die Durchführung eines Remote-Workshops vorbereiten.

Wir nutzen hierbei neben unserem Classroom das Online-Meeting Tool “Zoom”. Innerhalb der Vorbereitung ist auch ein Test-Link aufgeführt welche euch diese Technologie testen lässt. Der Remote-Workshop ist darauf konzipiert, dass wir alle an verschiedenen Orten sitzen und jeder mit seinem eigenen Rechner mitarbeitet. Ihr könnt euch natürlich auch in einem Meeting-Raum bei euch Treffen und den Trainer dazu schalten aber sowohl die Technologischen Lösungen klappen besser wenn jeder im Home-Office ist, als auch eure sozialen Kontakte sind geringer und ihr verringert das Risiko euch und andere anzustecken.

Auch Screenshare von allen Teilnehmern oder die Freigabe eurer IDE ist in Verbindung mit Visual Studio Code Live Share sehr einfach möglich. Der Trainer kann so auf Wunsch und mit eurer Freigabe den Zugriff auf euere aktuelle Entwicklungsumgebung bekommen und euch dort direkt Helfen, falls ihr einmal bei einer Aufgabe hängt.