Einführung in die Grundlagen der Entwicklung von Web-Benutzerschnittstellen/Benutzererfahrungen (UI/UX). Dieser Kurs konzentriert sich auf Kernkonzepte und bewährte Verfahren bei der Entwicklung von Webanwendungen, die nicht an bestimmte Bibliotheken oder Frameworks gebunden sind. Die Themen umfassen HTML, CSS, JavaScript und grundlegende Barrierefreiheit (a11y).


Web Design und User Experience Engineering Teil 1 a) bitte umschreiben b) falls Umschreibung nicht möglich: Nutzererfahrung c) für Cloud Marketing auch: User Experience

Dozent: Brett Ritter
Bei enthalten
Kompetenzen, die Sie erwerben
- Kategorie: Semantisches Web
- Kategorie: Javascript
- Kategorie: HyperText Markup Language (HTML)
- Kategorie: Web-Anwendungen
- Kategorie: Datenüberprüfung
- Kategorie: HTML und CSS
- Kategorie: Design der Benutzeroberfläche und Benutzererfahrung (UI/UX)
- Kategorie: Benutzeroberfläche (UI)
- Kategorie: Front-End Web-Entwicklung
- Kategorie: Web Content Accessibility Guidelines
- Kategorie: Webdesign
- Kategorie: Reaktionsfähiges Webdesign
- Kategorie: Benutzerfreundlichkeit
- Kategorie: Cascading Style Sheets (CSS)
Wichtige Details

Zu Ihrem LinkedIn-Profil hinzufügen
August 2025
32 Aufgaben
Erfahren Sie, wie Mitarbeiter führender Unternehmen gefragte Kompetenzen erwerben.

In diesem Kurs gibt es 7 Module
In dieser Woche wird die Bedeutung von semantischem HTML hervorgehoben und die Definition und der WERT, den semantisches HTML bietet, erforscht. Wir werden uns mit der Nutzung von Ressourcen wie MDN und den Browser-Entwickler-Tools (DevTools) befassen, wobei KI-Tools wie ChatGPT mit Vorsicht zu genießen sind. Es folgt eine Untersuchung der Rollen von HTML, CSS und JavaScript, einschließlich HTML-Syntax, Struktur und semantische Elemente.
Das ist alles enthalten
23 Lektüren3 Aufgaben1 Diskussionsthema
Diese Woche befassen wir uns mit der CSS-Syntax, der Spezifität und den semantischen Klassennamen. Wir besprechen das Laden von CSS, das CSS Box-Modell und die damit verbundenen Eigenschaften sowie die Unterschiede zwischen Inline-, Block- und Inline-Block-Elementen im Flow-Layout. In dieser Woche geht es auch um das Debugging von CSS mit den DevTools des Browsers und die Anwendung des Box-Modells zur Erstellung verschiedener gängiger Layouts. Die Hauptaufgabe in dieser Woche besteht darin, CSS für eine bestehende HTML-Seite zu erstellen, um ein gewünschtes Aussehen zu erreichen.
Das ist alles enthalten
5 Videos10 Lektüren7 Aufgaben
In dieser Woche befassen wir uns mit einigen gängigen Webdesign-Konzepten wie Platzhaltertexten und -bildern, den Aspekten, die die Auswahl von Schriftarten beeinflussen und erschweren, und wichtigen Fragen der Barrierefreiheit wie der Einhaltung von Textgröße und Alt-Text. Wir untersuchen einige häufige Missverständnisse in Bezug auf das Urheberrecht und wie sich dies auf die Arbeit als Webentwickler auswirkt. Wir erkunden weitere Layout-Optionen mit CSS und lernen Flexbox, Rasterflächen und Mehrspalten-Layouts kennen. Wir besprechen die Bedeutung und Umsetzung von Responsive Design und adaptivem Design in Webseiten. Die Hauptaufgabe für diese Woche bietet ein ungefähres Layout mit Änderungen zwischen Desktop- und Mobilgrößen und fordert Sie auf, HTML und CSS zu schreiben, um eine Lösung zu erstellen.
Das ist alles enthalten
7 Videos16 Lektüren6 Aufgaben
Diese Woche konzentrieren wir uns auf die Struktur und das Layout von HTML-Formularen und behandeln die Syntax verschiedener formularbezogener Elemente und die damit verbundenen grundlegenden Anforderungen und Fehler in Bezug auf die Barrierefreiheit sowie die begrenzte HTML-basierte Validierung, die für Formulare verfügbar ist. Ich stelle gängige Layouts für Formularbeschriftungen und -felder vor, einschließlich Ausnahmen, und erörtere, inwiefern diese Layouts für Ihre Benutzererfahrung von Vorteil sind oder nicht. Wir behandeln auch die verschiedenen Optionen für die Eigenschaft Position und wie diese Optionen verwendet werden, um gängige Webdesign-Wünsche zu erfüllen, einschließlich der Erstellung eines "Dropdown"-Navigationsmenüs. Die Hauptaufgabe in dieser Woche besteht darin, ein gewünschtes Layout für ein Formular zu erstellen, das Daten an einen bereitgestellten Server übermittelt.
Das ist alles enthalten
3 Videos11 Lektüren4 Aufgaben
In dieser Woche stellen wir die Namenskonventionen für BEM-Klassen (Block, Element, Modifier) vor und untersuchen ihre Verwendung, ihre Argumente und ihre potenziellen Vorteile. Wir behandeln gängige UI/UX-Konzepte wie Hero-Bilder, Call to Action (CTAs), das Konzept des "Fold", Panels, Karten und Breadcrumb-Navigation und beschäftigen uns mit der Syntax und der praktischen Anwendung von CSS-Transformationen, -Übergängen und -Animationen. Schließlich lernen wir, Animationen so einzuschränken, dass sie die Benutzereinstellungen für reduzierte Bewegungen berücksichtigen, und fügen Bewegungen zu unserem Dropdown-Navigationsbeispiel hinzu.
Das ist alles enthalten
1 Video7 Lektüren4 Aufgaben
Diese Woche bietet eine Einführung in JavaScript, die sich auf die wichtigsten Konzepte und praktischen Anwendungen konzentriert. Sie werden erkunden, wie man JavaScript lädt und seine grundlegende Syntax anhand der Lektüre und der Quizfragen dieser Woche verstehen. Themen wie Variablen, Funktionen, Arrays, Objekte, Konditionale, Schleifen und lexikalischer Bereich werden besprochen, zusammen mit einigen Videoanimationen zur Veranschaulichung komplexerer Konzepte. Wir werden uns auch mit dem Document Object Model (DOM) befassen, einer Methode zur dynamischen Bearbeitung von Webseiten mit JavaScript. Schließlich werden wir uns mit Debugging-Techniken beschäftigen, um Fehler zu erkennen und zu beheben. Um das Gelernte zu festigen, werden Sie eine Aufgabe lösen, bei der Sie ein "Stein-Papier-Schere"-Spiel entwickeln, das Schaltflächen und Konsoleninteraktionen integriert und so die oben genannten Kernkompetenzen demonstriert.
Das ist alles enthalten
3 Videos13 Lektüren5 Aufgaben
Diese Woche vertiefen wir Ihr Verständnis von JavaScript, indem wir fortgeschrittene Syntax-Konzepte vorstellen, darunter Spread- und Rest-Operatoren, Destrukturierung, JSON und Reguläre Ausdrücke. Sie lernen, wie Sie mit dem DOM interagieren, indem Sie den Inhalt von Knoten manipulieren und JavaScript-Ereignisse behandeln, verstärkt durch Quizfragen, um Ihr Verständnis zu überprüfen. In dieser Woche wird auch die JavaScript-basierte Formularvalidierung behandelt, wobei bewährte Praktiken, häufige Fallstricke und die Bedeutung eines ausgewogenen Verhältnisses zwischen Front-End-Komfort und Backend-Sicherheit hervorgehoben werden. Die Woche gipfelt in einer Aufgabe, bei der Sie ein Merkmal für die Übermittlung von Formularen mit integrierter JavaScript-Validierung erstellen und dabei wichtige Konzepte aus den Lektionen anwenden, um die Funktionalität von Webanwendungen sicherzustellen.
Das ist alles enthalten
13 Lektüren3 Aufgaben
Dozent

Mehr von Mobile und Web-Entwicklung entdecken
Status: VorschauNortheastern University
Status: VorschauNortheastern University
Status: VorschauNortheastern University
Status: Kostenloser TestzeitraumMicrosoft
Warum entscheiden sich Menschen für Coursera für ihre Karriere?





Neue Karrieremöglichkeiten mit Coursera Plus
Unbegrenzter Zugang zu 10,000+ Weltklasse-Kursen, praktischen Projekten und berufsqualifizierenden Zertifikatsprogrammen - alles in Ihrem Abonnement enthalten
Bringen Sie Ihre Karriere mit einem Online-Abschluss voran.
Erwerben Sie einen Abschluss von erstklassigen Universitäten – 100 % online
Schließen Sie sich mehr als 3.400 Unternehmen in aller Welt an, die sich für Coursera for Business entschieden haben.
Schulen Sie Ihre Mitarbeiter*innen, um sich in der digitalen Wirtschaft zu behaupten.
Häufig gestellte Fragen
Um Zugang zu den Kursmaterialien und Aufgaben zu erhalten und um ein Zertifikat zu erwerben, müssen Sie die Zertifikatserfahrung erwerben, wenn Sie sich für einen Kurs anmelden. Sie können stattdessen eine kostenlose Testversion ausprobieren oder finanzielle Unterstützung beantragen. Der Kurs kann stattdessen die Option "Vollständiger Kurs, kein Zertifikat" anbieten. Mit dieser Option können Sie alle Kursmaterialien einsehen, die erforderlichen Bewertungen abgeben und eine Abschlussnote erhalten. Dies bedeutet auch, dass Sie kein Zertifikat erwerben können.
Wenn Sie ein Zertifikat erwerben, erhalten Sie Zugang zu allen Kursmaterialien, einschließlich der benoteten Aufgaben. Nach Abschluss des Kurses wird Ihr elektronisches Zertifikat zu Ihrer Erfolgsseite hinzugefügt - von dort aus können Sie Ihr Zertifikat ausdrucken oder zu Ihrem LinkedIn-Profil hinzufügen.
Ja. Für ausgewählte Lernprogramme können Sie eine finanzielle Unterstützung oder ein Stipendium beantragen, wenn Sie die Anmeldungsgebühr nicht aufbringen können. Wenn für das von Ihnen gewählte Lernprogramm eine finanzielle Unterstützung oder ein Stipendium verfügbar ist, finden Sie auf der Beschreibungsseite einen Link zur Beantragung.
Weitere Fragen
Finanzielle Unterstützung verfügbar,

