HTML/CSS

Im Rahmen der Studiengänge HF Techniker

Heute geht nichts mehr ohne Internet. Jegliche Angebote (Hilfetexte, Inhalte, Öffnungszeiten, Fahrpläne u. v. a. m.) sind rund um die Uhr verfügbar. Weshalb Sie dieses Modul besuchen sollten: Es ist der erste Baustein im Studiengang «Web-Engineering» oder Sie verwenden bereits einer der weit verbreiteten CMS (Content Management System) oder Sie möchten sich die wesentlichen Basisinformationen erarbeiten um eigene Webauftritte realisieren zu können. Kurz: In diesem Modul erarbeiten Sie sich die soliden Grundlagen, um selbst eingreifen zu können und um zu verstehen, wie sich das WEB weiterentwickelt. Ideal auch um den Wiedereinstieg zu schaffen. Sie leben sich von der technischen Seite ins Thema hinein.

Inhalte

Werkzeuge: Internet Browser (FireFox, Chrome …) und deren Entwicklerwerkzeuge; Editoren (Eclipse, Notepad++, Bluefish, …) oder eigener Editor wie z.B. Dreamweaver, Aptana Studio, OpenBEXI; Übertragungsmittel (ftp, ssh)
Internet,Technologie: Gerätelandschaft, Webplattform, Struktur einer Webseite, Semantisches Markup, Barrierefreiheit in Webseiten (WAI-ARIA), Zeichensatz Codes, Fonts, Formulare, Multimedia (Bilder & Grafiken, Audio & Video), Web-Apps, Single Page, DDR (Device Description Repository), iFrame, Landing Page, XML (eXtended Markup Language), W3C Standard und Validator, Browser Cache, Mikrodaten, Mikroformate & RDFa (Resource Description Format in Attributes)  Datenattribute  Rasterlayout  DOM
Tag, Attribut, Selektoren: HTML5, CSS3, CSS-Präprozessoren, Media Queries, neue CSS3-Konzepte (Mehrspalten Layout, Flexbox, Rasterlayouts)
Web Frameworks: Bootstrap, Responsive Design, Templating in Bezug auf Web Frameworks

Ziele

Sie verstehen das Zusammenspiel der drei Komponenten «Inhalte mit», «Gestaltung durch <CSS>» und «Interaktionen über (JS)» einer Webseite und wie dies alles zusammenhängt.
Sie können zusammengehörige Webseiten nach W3C Standard fehlerfrei aufbauen und untereinander verknüpfen. Sie entwickeln und gestalten die Webseite mit den technischen Elementen Bild, Audio, Video, Tabelle, Navigation und Formular und stellen diese ins Internet.
Sie können einzelne bestehende Web-Elemente in den Webseiten auswechseln bzw. ergänzen.
Sie beschreiben Massnahmen wie barrierefreie Webseiten realisiert werden können.
Sie können Webseiten nach den gängigen Standards mit einem Webframework für «Responsive Design» einrichten.
Sie kennen die Tücken des Browser-Cache und können damit umgehen.
Sie kennen die Entwickler-Werkzeuge des Chrome-Browsers (oder vergleichbarer Browser) und können diese richtig anwenden.
Sie kennen den Begriff «Templating» und wissen, wo dieser zur Anwendung kommt.
Sie können die Struktur von HTML-Elementen vollständig beschreiben.
Sie können die Struktur der CSS-Angaben (Aufbau, Selektoren, Eigenschaften, Wirkungsweise) vollständig beschreiben.
Sie können Bereich und Anwendung von Mikrodaten, Mikroformaten und RDF(a) sowie auch von Datenattributen beschreiben.
Sie können eine beliebige Webseite unter W3C validieren.
Sie wissen, wie JavaScript Funktionen und Bibliotheken in Webseiten eingebunden werden.
Sie können Eigenheiten von XML beschreiben und ein Beispiel dazu geben.
Sie können Angaben zu Media-Queries korrekt beschreiben.
Sie können Abläufe und Zusammenhänge zu CSS-Präprozessoren beschreiben.
Sie können mit Hilfe von Browser Entwicklerwerkzeugen das DOM einer Webseite inspizieren.
Sie können Fonts über CDN (Content Delivery Network) einsetzen.

Voraussetzungen

Sie sind vertraut mit der Bedienung eines PCs (u.a.): Im Umgang mit Verzeichnissen und Dateien, mit SW installieren.
Sie können WordPad bedienen od. einen vergleichbaren Text-Editor oder Sie verwenden eine passende IDE fürs Web.
Sie sind mit Funktionen und Einstellungen eines Internetbrowsers vertraut.

Hinweis

Sie bringen Ihr eigenes, funktionstüchtiges Notebook mit (PC/MAC/LINUX). Das Gerät lässt sich mit einem WLAN verbinden. Am ersten Kurstag wird die Entwicklungsumgebung installiert.

Kursunterlagen

HFU eigenes Skript sowie Verweise ins Internet. Es wird mit einem Web-Hosting Server gearbeitet.

Selbstlernzeit

20-50% zusätzlich zum Unterricht

Methode

50% Lehrvorträge, 50% Übungen am Rechner

Prüfung

Das Modul ist erfolgreich abgeschlossen, wenn mind. 75% vom Unterricht besucht ist und die Modulschlussnote mind. 4.0 beträgt. Die Schlussnote wird aus den Noten der Lernzielkontrollen (Erfahrungsnote) und der Note der Modullernzielkontrolle (MLZ), gemäss den Promotionsbestimmungen für Studiengänge der HFU, ermittelt. Wer ein einzelnes Modul erfolgreich abschliesst erhält ein Zertifikat.