1 / 18

Workshop: Websites erstellen Mit dem WYSIWYG-Editor NVU von Mozilla

Workshop: Websites erstellen Mit dem WYSIWYG-Editor NVU von Mozilla. Textformatierung. HTML bietet wenige Möglichkeiten zur Formatierung von Texten. So fehlen beispielsweise Tabulatoren, Texteinzüge und Formatvorlagen.

tudor
Download Presentation

Workshop: Websites erstellen Mit dem WYSIWYG-Editor NVU von Mozilla

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Workshop: Websites erstellen • Mit dem WYSIWYG-Editor NVU von Mozilla

  2. Textformatierung • HTML bietet wenige Möglichkeiten zur Formatierung von Texten. So fehlen beispielsweise Tabulatoren, Texteinzüge und Formatvorlagen. • Zum Layouten dienen vor allem unsichtbare Tabellen oder unsichtbare („blinde“) Grafiken. • Zur Gestaltung wurden die CSS (Cascading Style Sheets) entwickelt. Diese erweitern HTML und bieten zahllose Möglichkeiten zur Formatierung und Gestaltung von Webseiten.

  3. Textformatierung

  4. Textformatierung

  5. Workshop: Textformatierung

  6. Tabellen • HTML bietet keine Möglichkeiten zum Layouten von Webseiten! • Trick: Zum Layouten werden vor allem unsichtbare Tabellen benutzt. Es handelt sich dabei um Tabellen ohne sichtbare Rahmen. • Die Tabellenzellen bilden ein Gestaltungsraster. Sie können mit Texten oder Grafiken „gefüllt“ werden. Merke:Tabellenzellen verändern ihre Größe in Abhängigkeit vom Text. Damit dies nicht geschieht müssen sie mit einer festen Breite und Höhe versehen werden!

  7. Tabellen

  8. Tabellen

  9. Workshop: Tabellen

  10. Bilder/Grafiken • HTML kann keine Bilddaten einbinden, wie dies z.B. bei Word möglich ist. Alle Bilder/Grafiken müssen als Dateien vorhanden sein. • Zur Anzeige eines Bildes muss in der HTML-Datei der relative Pfad zur Bild-Datei angegeben werden: Das Bild wird „referenziert“. • Bilder/Grafiken müssen einen Kompromiss zwischen Qualität und Datenmenge darstellen. Merke:Speichern Sie alle Bilder und Grafiken in einem Bilder-Ordner. Die Position des Ordners relativ zur HTML-Datei darf nachträglich nicht mehr geändert werden!

  11. Bilder/Grafiken

  12. Workshop: Bilder und Grafiken

  13. Hyperlinks • Durch Hyperlinks (kurz: Links) lassen sich HTML-Dateien in beliebiger Weise miteinander verknüpfen. Dies ist ein wesentlicher Vorteil gegenüber gedruckten Produkten! • Es gibt unterschiedliche Arten von Links:- innerhalb einer HTML-Datei- zwischen HTML-Dateien- zu externen Webseiten- zu anderen Dateien z.B. PDF, DOC- zu E-Mail-Programmen Merke:Verändern Sie die Position der HTML-Dateien nach der Verlinkung nicht mehr!

  14. Hyperlinks

  15. Hyperlinks

  16. Workshop: Hyperlinks

  17. Seiteneinstellungen • Der Titel einer Seite erscheint im blauen Balken des Browserfensters. • Meta-Tags sind unsichtbare Informationen über die Seite, z.B. Autor, Datum, Kurzbeschreibung, Stichworte • Die Angabe des Zeichensatzes ist wichtig, damit die Site weltweit korrekt angezeigt wird. • Festlegung der Farben für Text, Links und den Hintergrund. Alternativ kann auch ein Hintergrundbild verwendet werden.

  18. Seiteneinstellungen Normaler Text und Link

More Related