web publishing html n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
Web-Publishing: HTML PowerPoint Presentation
Download Presentation
Web-Publishing: HTML

Loading in 2 Seconds...

play fullscreen
1 / 14

Web-Publishing: HTML - PowerPoint PPT Presentation


  • 156 Views
  • Uploaded on

Web-Publishing: HTML. im Rahmen des PS aus Elektronischer Datenverarbeitung (Rechnerpraktikum). Grundlagen. HTML: Hypertext Markup Language Hypertext Knoten (Hypertext-Dokumente, Grafiken,...) Verweise (Hyperlinks) Markup Language Strukturierung eines Dokumentes reines ASCII. WU Wien.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Web-Publishing: HTML' - terra


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.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
web publishing html

Web-Publishing: HTML

im Rahmen des PS ausElektronischer Datenverarbeitung(Rechnerpraktikum)

grundlagen
Grundlagen
  • HTML: Hypertext Markup Language
  • Hypertext
    • Knoten (Hypertext-Dokumente, Grafiken,...)
    • Verweise (Hyperlinks)
  • Markup Language
    • Strukturierung eines Dokumentes
    • reines ASCII
wu wien
WU Wien
  • jeder WU Student darf eine Homepage anlegen
  • notwendig: PowerNet-Account
  • Anforderung über WWW
    • http://www.wu-wien.ac.at/infocenter/homepage.html
  • wichtig zu notieren:
    • Verzeichnis auf dem PowerNet-Rechner, in das Homepage gehört
    • URL der Homepage
schreiben einer html seite
Schreiben einer HTML-Seite
  • Anmelden auf PowerNet-Rechner
    • telnet (siehe Unix)
  • wechseln in das richtige Verzeichnis
    • cd-Befehl (siehe Unix)
  • erstellen/bearbeiten der Seite
    • da ASCII-Text
    • möglich mittels z.B. Pico (siehe Unix)
slide5
Tags
  • HTML-Befehle: Tags (immer in spitzen Klammern)
  • die meisten Befehle: Anfangs- und Ende-Tag
    • Anfangs-Tag: <befehl>
    • dazugehöriges Ende-Tag: </befehl>
    • beziehen sich auf dazwischenstehenden Text
    • können ähnlich der Klammersetzung in der Mathematik geschachtelt werden
  • können Argumente besitzen
struktur
Struktur
  • Struktur einer HTML-Seite
    • Head: allgemeine Festlegungen (Bsp. Titel)
    • Body: eigentlicher Text/Inhalt
  • gesamtes Dokument: innerhalb von <HTML>...</HTML>
  • Head
    • zwischen <HEAD>...</HEAD>
    • dazwischen z.B. <TITLE>...</TITLE> für den Titel der Seite (wird oben im Browser angezeigt)
struktur1
Struktur
  • Body
    • innerhalb <BODY>...</BODY>
    • auch mit Argument: <BODY bgcolor=farbe>
    • alle kommenden Tags innerhalb des Body
  • Beispiel für korrekte Struktur

<html>

<head>

<title>Testseite</title>

</head>

<body>

Meine erste Seite

</body>

</html>

berschriften
Überschriften
  • Überschriften (Headings)
    • <Hx>...</Hx>
    • der Text innerhalb dieses Tags wird als Überschrift angezeigt (x ist eine Zahl mit 1 - wichtigste Überschrift - beginnend)
    • z.B. <H1>Einleitung</H1>
  • Trennlinie
    • <HR width=x%>
    • zeichnet eine horizontale Linie über x Prozent des Bildschirms
listen
Listen
  • Listen
    • <UL><LI>...<LI>...</UL> bzw. <OL><LI>...<LI>...</OL>
    • erzeugt eine Unordered (UL) oder Ordered (OL) List (mit oder ohne Nummerierung)
    • von einem LI bis zum nächsten ist ein Punkt
    • kann beliebig geschachtelt werden
    • z.B. <UL><LI>Apfel<LI>Birne</UL>
formatierung
Formatierung
  • Zeilenumbruch (break)
    • <BR>
    • erfolgt ansonsten automatisch am Rand des Bildschirm oder vor bzw. nach anderen Tags wie z.B. <H1>
  • Paragraph (mit Abstand)
    • <P>
  • Schriftarten
    • <B>...</B> fette Schrift (bold)
    • <I>...</I> kursive Schrift (italic)
formatierung ii
Formatierung II
  • Ausrichtung
    • <CENTER>...</CENTER>
    • <LEFT>...</LEFT>
    • <RIGHT>...</RIGHT>
  • Umlaute
    • &ouml; bzw. &uuml; bzw. &auml;
tabellen
Tabellen
  • Tabellen
    • innerhalb von <TABLE>...</TABLE>
    • mögliche Parameter sind border (Ränderbreite), cellspacing (Abstand zwischen Zellen) und cellpadding (Rand innerhalb einer Zelle)
    • <TR> erzeugt neue Reihe (table row)
    • <TD> erzeugt neues Feld (Spalte, table data)
    • Beispiel

<TABLE>

<TR><TD>Stefan<TD>1

<TR><TD>Ed<TD>3

</TABLE>

grafiken
Grafiken
  • <IMG SRC="URL">
    • Bild, das an URL liegt, wird eingefügt
    • URL kann relativ (ausgehend vom Verzeichnis der momentanen Seite)
    • oder absolut (vollständig - Problem beim Verschieben der Seite) angegeben werden
hyperlinks
Hyperlinks
  • <A HREF=“url">...</A>
    • es wird unter dem Text im Tag eine Link auf den URL (wieder absolut oder relativ) eingefügt
    • Beispiel

<A HREF=„http://www.wu-wien.ac.at“>Hauptseite der WU</A>