150 likes | 574 Views
HTML Grundlagen. Eine knappe Einführung von Florian Ermann. Gliederung. Grundsätzliches HTML Ausblick. Grundsätzliches. Ziel: Grundlagen von HTML verstehen WWW (World Wide Web) = Weltweites Computernetz Darstellung durch HTML (HyperText Markup Language)
E N D
HTML Grundlagen Eine knappe Einführung von Florian Ermann Start
Gliederung • Grundsätzliches • HTML • Ausblick Gliederung
Grundsätzliches • Ziel: Grundlagen von HTML verstehen • WWW (World Wide Web) = Weltweites Computernetz • Darstellung durch HTML (HyperText Markup Language) • HTML ist keine Programmiersprache sondern Seitenbeschreibungssprache • Erstellen mittels WYSIWYG-Editor oder „per Hand“ • Anweisung zur Darstellung durch Klammern: < ... > • Elemente einer Homepage sind Text, Links, Grafik, … • Dateiformat index.html (UNIX-Format) Grundsätzliches
<head> </head> • Kopfteil enthält: • <title> </title> • = Titel der Seite • <body> </body> • Körperteil enthält Inhalt HTML • Rahmenbestandteile eines HTML-Dokuments: <html> </html> HTML - Rahmenbestandteile
HTML • Textformatierung (innerhalb des „body“) <h1> Überschrift </h1> <b> Bold, also Fett </b>, <i> Italic, also Kursiv </i> <br> =neue Zeile <font face=“Arial“ size=“+1“>Schrift Arial,groß </font> <center> Zentriert </center> <p> Absatz </p> Beispiel: <b> <i> Fett und Kursiv </i> </b> HTML - Textformatierung
HTML • Bilder: <img src=”Bild.jpg” alt=“Bildbeschreibung“> • Links: <a href=”http://www.ewf.uni-erlangen.de”>EWF</a> • Email-Adresse als Link: <a href=”mailto:EmailAdresse@XYZ.de”> Mail </a> HTML - Bilder, Links & Email
HTML HTML - Quelltext & Browser
Ausblick • weitere Gestaltungsmöglichkeiten: - Deutsche Umlaute (ä ö ü ß) - Farben (Text und Hintergrund) - Listen (nummeriert oder unsortiert) - Tabellen (Table) - Formulare (Form) - Rahmendokumente (Frame) - Multimedia (Plugins) - HTML-Übersicht http://www.selfhtml.net • Seite im WWW verfügbar machen • Zusammenfassung: - HTML ist eine „einklammernde“ Beschreibungssprache Ausblick
HTML Grundlagen Das war‘s… <b> Danke für Ihre Aufmerksamkeit </b> ;-) Ende