HTML
Aus AkiWiki
Fokus (Diskussion | Beiträge) (→Flechtzöpfe: fine site) |
Fokus (Diskussion | Beiträge) (am 30.04. bei der VHS in Waiblingen) |
||
Zeile 1: | Zeile 1: | ||
+ | == HTML Seminar bei der VHS in 2009 == | ||
+ | |||
+ | HTML-Kurs [[Karl Dietz]] Dienstag, 30.04.09, 18.00 - 21.00 Uhr, VHS Unteres Remstal, Waiblingen | ||
+ | |||
+ | ff. | ||
+ | |||
+ | . | ||
+ | |||
== HTML - Infos via Wikipedia == | == HTML - Infos via Wikipedia == | ||
Zeile 4: | Zeile 12: | ||
http://de.wikipedia.org/wiki/Hypertext_Markup_Language | http://de.wikipedia.org/wiki/Hypertext_Markup_Language | ||
+ | |||
+ | . | ||
== HTML - die Sprache des Internet - 28. Oktober in Waiblingen == | == HTML - die Sprache des Internet - 28. Oktober in Waiblingen == | ||
Zeile 18: | Zeile 28: | ||
Dienstag, 28.10.08, 18.00 - 21.00 Uhr, [[VHS Unteres Remstal]], Waiblingen | Dienstag, 28.10.08, 18.00 - 21.00 Uhr, [[VHS Unteres Remstal]], Waiblingen | ||
+ | . | ||
== Aufbau einer HTML-datei == | == Aufbau einer HTML-datei == | ||
Zeile 28: | Zeile 39: | ||
<body> Text </body> | <body> Text </body> | ||
</html> | </html> | ||
+ | |||
+ | . | ||
== Meta daten - engl. meta tags == | == Meta daten - engl. meta tags == | ||
Zeile 41: | Zeile 54: | ||
Diese Metadaten sind ein wichtiger Part des Semantic Web. Es gibt auch Dublin Core. | Diese Metadaten sind ein wichtiger Part des Semantic Web. Es gibt auch Dublin Core. | ||
+ | |||
+ | . | ||
== Überschriften mit h1 - h6 == | == Überschriften mit h1 - h6 == | ||
Zeile 59: | Zeile 74: | ||
</pre> | </pre> | ||
+ | |||
+ | . | ||
== Text und Textauszeichnung == | == Text und Textauszeichnung == | ||
Zeile 67: | Zeile 84: | ||
<tt>Courier, also eine nicht-proportionale Schrift (Beispiel: Sehr geehrte Damen und Herren) </tt> | <tt>Courier, also eine nicht-proportionale Schrift (Beispiel: Sehr geehrte Damen und Herren) </tt> | ||
+ | |||
+ | . | ||
== Vorformatierter Text == | == Vorformatierter Text == | ||
Zeile 75: | Zeile 94: | ||
dies ist ein schöner Kurs - so so | dies ist ein schöner Kurs - so so | ||
</ p r e> | </ p r e> | ||
+ | |||
+ | . | ||
== Zeilenumbrüche und Absätze == | == Zeilenumbrüche und Absätze == | ||
Zeile 85: | Zeile 106: | ||
</pre> | </pre> | ||
+ | |||
+ | . | ||
== Listen im Dokument einfügen == | == Listen im Dokument einfügen == | ||
Zeile 95: | Zeile 118: | ||
</ul> | </ul> | ||
</pre> | </pre> | ||
+ | |||
+ | . | ||
== Links und Fotos und Mailadressen == | == Links und Fotos und Mailadressen == | ||
Zeile 104: | Zeile 129: | ||
</pre> | </pre> | ||
<a href="mailto:fritz@url.org">Fritz, fritz@url.org</a> | <a href="mailto:fritz@url.org">Fritz, fritz@url.org</a> | ||
+ | |||
+ | . | ||
== Sonderzeichen in HTML == | == Sonderzeichen in HTML == | ||
Zeile 112: | Zeile 139: | ||
HTML-Zeichenreferenz in SelfHTML: http://selfhtml.teamone.de /html/referenz/zeichen.htm | HTML-Zeichenreferenz in SelfHTML: http://selfhtml.teamone.de /html/referenz/zeichen.htm | ||
+ | |||
+ | . | ||
== Seitenquelltext ansehen == | == Seitenquelltext ansehen == | ||
Zeile 117: | Zeile 146: | ||
Ansicht | Ansicht | ||
Seitenquelltext ansehen | Seitenquelltext ansehen | ||
+ | |||
+ | . | ||
== SelfHTML online / SelfHTML als Buch == | == SelfHTML online / SelfHTML als Buch == | ||
Zeile 123: | Zeile 154: | ||
Der IT-Fachverlag Addison-Wesley und Stefan Münz, der Initiator und Autor von SelfHTML machen allen an Webentwicklung Interessierten ein tolles Geschenk: Münz' Buch "Professionelle Websites" gibt es als kostenlosen Download ... http://aktuell.de.selfhtml.org/weblog/schenk_kultur_verlage | Der IT-Fachverlag Addison-Wesley und Stefan Münz, der Initiator und Autor von SelfHTML machen allen an Webentwicklung Interessierten ein tolles Geschenk: Münz' Buch "Professionelle Websites" gibt es als kostenlosen Download ... http://aktuell.de.selfhtml.org/weblog/schenk_kultur_verlage | ||
+ | |||
+ | . | ||
== HTML erzeugen per ... == | == HTML erzeugen per ... == | ||
mit der Hand am Arm im Editor oder hier im Wiki | mit der Hand am Arm im Editor oder hier im Wiki | ||
- | mit Word schreiben und als HTML abspeichern | + | mit [[Word]] schreiben und dann als HTML abspeichern |
+ | mit [[PowerPoint]] schreiben und dann als HTML abspeichern | ||
mit HTML-software, zB Dreamweaver oder Frontpage oder ... | mit HTML-software, zB Dreamweaver oder Frontpage oder ... | ||
- | |||
- | |||
- | |||
- | |||
+ | . | ||
+ | |||
== HTML Einführungen == | == HTML Einführungen == | ||
Zeile 143: | Zeile 175: | ||
http://webdesign.crissov.de/Typographie | http://webdesign.crissov.de/Typographie | ||
+ | |||
+ | . | ||
== Zusatzinfos beim img tag == | == Zusatzinfos beim img tag == | ||
Zeile 160: | Zeile 194: | ||
. | . | ||
- | |||
- | |||
== pc2 - Die steinernen Jungfrauen == | == pc2 - Die steinernen Jungfrauen == | ||
Zeile 182: | Zeile 214: | ||
. | . | ||
- | |||
- | |||
== pc4 Am Anfang war die Tat == | == pc4 Am Anfang war die Tat == | ||
Zeile 193: | Zeile 223: | ||
Hallo, wie geht es Dir? | Hallo, wie geht es Dir? | ||
- | + | . | |
- | + | ||
== Flechtzöpfe == | == Flechtzöpfe == | ||
http://kupferzopf-flechtfrisuren.de | http://kupferzopf-flechtfrisuren.de | ||
+ | |||
+ | . | ||
== Höhlen u.a. == | == Höhlen u.a. == | ||
http://www.schilling-wn.de | http://www.schilling-wn.de | ||
+ | |||
+ | . |
Version vom 22. März 2009, 14:01 Uhr
HTML Seminar bei der VHS in 2009
HTML-Kurs Karl Dietz Dienstag, 30.04.09, 18.00 - 21.00 Uhr, VHS Unteres Remstal, Waiblingen
ff.
.
HTML - Infos via Wikipedia
Die Hypertext Markup Language (HTML, dt. Hypertext-Auszeichnungssprache), oft auch kurz als Hypertext bezeichnet, ist eine textbasierte Auszeichnungssprache zur Strukturierung von Inhalten wie Texten, Bildern und Hyperlinks in Dokumenten. HTML-Dokumente sind die Grundlage des World Wide Web und werden von einem Webbrowser dargestellt. Neben den vom Browser angezeigten Inhalten einer Webseite enthält HTML zusätzliche Angaben in Form von Metainformationen, die zB über die im Text verwendete Sprache oder den Autor Auskunft geben oder den Inhalt des Textes zusammenfassen. Die Auszeichnungssprache wurde vom World Wide Web Consortium (W3C) bis Version 4.01 weiterentwickelt
http://de.wikipedia.org/wiki/Hypertext_Markup_Language
.
HTML - die Sprache des Internet - 28. Oktober in Waiblingen
Hypertext Markup Language (HTML) ist die Sprache des Internet, genauer des World Wide Web. In diesem Seminar wird die Fähigkeit vermittelt, HTML-Dokumente zu verstehen (Header, Body, Meta Tags) und einfache HTML-Dokumente selbst zu erstellen und zu formatieren. Vorkenntnisse: Interneteinführungskurs Referent: Karl Dietz
Dienstag, 28.10.08, 18.00 - 21.00 Uhr, VHS Unteres Remstal, Waiblingen
.
Aufbau einer HTML-datei
<html> <head> <title> Titel </title> <meta name=" ...> </head> <body> Text </body> </html>
.
Meta daten - engl. meta tags
<meta name="keywords" CONTENT="eLearning Recherche Newsletter Suchmaschinen "> <meta name="description" CONTENT="AKI Stuttgart">
<meta name="robots" CONTENT="index,follow"> - seite taucht in google auf = visible web <META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW"> - seite taucht nicht auf = deep web
<meta name="language" CONTENT="de"> <meta name="author" content="Karl Dietz">
Diese Metadaten sind ein wichtiger Part des Semantic Web. Es gibt auch Dublin Core.
.
Überschriften mit h1 - h6
<h1 align="center">HTML - die Sprache des Web</h1> <h2 align="center">HTML - die Sprache des Web</h2> <h6 align="center">HTML - die Sprache des Web</h6> <h4 align="center">HTML - die Sprache des Web</h4> <h5 align="center">HTML - die Sprache des Web</h5> <h6 align="center">HTML - die Sprache des Web</h6>
.
Text und Textauszeichnung
Fette Schrift (Beispiel: fett)
Kursive Schrift (Beispiel: Der schiefe Turm von Pisa)
Courier, also eine nicht-proportionale Schrift (Beispiel: Sehr geehrte Damen und Herren)
.
Vorformatierter Text
< pre > dies ist ein schöner Kurs - so so </ p r e>
.
Zeilenumbrüche und Absätze
<br> - Zeilenumbruch <p> - Absatz
.
Listen im Dokument einfügen
<ul> <li>jen la unua elemento de listo</li> <li>jen la dua elemento</li> <li>jen la tria</li> </ul>
.
Links und Fotos und Mailadressen
Links: <a href="www.adresse.de">angezeigter text im browser</a>
Fotos: <img align="right" src="http://www.karldietz.de/2007/v1.jpg"> Ausrichtung per: align="right" align="left" align="center"
<a href="mailto:fritz@url.org">Fritz, fritz@url.org</a>
.
Sonderzeichen in HTML
- Ellipse = Auslassungszeichen = … = …
- Gedankenstrich = Halbgeviert = – = –
- An- und Abführungszeichen = „ und “ = „ und ”
HTML-Zeichenreferenz in SelfHTML: http://selfhtml.teamone.de /html/referenz/zeichen.htm
.
Seitenquelltext ansehen
Ansicht Seitenquelltext ansehen
.
SelfHTML online / SelfHTML als Buch
Der IT-Fachverlag Addison-Wesley und Stefan Münz, der Initiator und Autor von SelfHTML machen allen an Webentwicklung Interessierten ein tolles Geschenk: Münz' Buch "Professionelle Websites" gibt es als kostenlosen Download ... http://aktuell.de.selfhtml.org/weblog/schenk_kultur_verlage
.
HTML erzeugen per ...
mit der Hand am Arm im Editor oder hier im Wiki mit Word schreiben und dann als HTML abspeichern mit PowerPoint schreiben und dann als HTML abspeichern mit HTML-software, zB Dreamweaver oder Frontpage oder ...
.
HTML Einführungen
http://www.lerneniminternet.de/htm/html_lernen_g.html
http://www.inf.hs-anhalt.de/html/einfuehr.htm
http://www.karzauninkat.com/Goldhtml/
http://webdesign.crissov.de/Typographie
.
Zusatzinfos beim img tag
Das <img> Tag zum Einfügen eines Bildes in (X)HTML kann mittels einiger Attribute mit Textinformationen über das Bild versehen werden.
alt: ein <img src="monalisa.gif" alt="Mona Lisa "> fügt einen sogenannten Alternativtext ein. Dieser wird angezeigt falls das Bild nicht geladen werden kann, etwa wenn die referenzierte Bilddatei nicht existiert. Diese Angabe ist Pflicht. Für unbedeutende Bilder wie etwa einem Spacer-GIF kann alt="" angegeben werden, dann wird nichts angezeigt.
title: ein <img src="monalisa.gif" title="Picasso hat dieses Bild um 1503 gemalt"> Öffnet ein Tooltip mit dem Titel wenn man den Mauszeiger auf das Bild bewegt (title kann auch bei Links eingesetzt werden, wie bei diesem hier).
longdesc: <img src="monalisa.gif" longdesc="beschreibung.htm"> verlinkt auf ein externes Dokument mit einer Beschreibung des Bildes. Ein besonders wichtiges Bild, wie beispielsweise ein Diagramm, kann manchmal nur schlecht mit ein paar Worten beschrieben werden. Hier kann es in einem eigenen Dokument ausführlich beschrieben werden. Blinden Menschen werden auf diese Art Grafiken zugänglich gemacht. Die Robots der Suchmaschinen sind übrigens auch "blind" und ignorieren Grafiken ohne alt, title oder longdesc.
aus: http://netzwelt.gaming-hut.de/sections.php?op=viewarticle&artid=31
.
.
pc2 - Die steinernen Jungfrauen
- Der Sage nach lebte auf der Eselsburg einst ein hübsches, aber hartherziges Fräulein, dem kein Freier gut genug war.
- Als nach Jahren keiner mehr um sie warb, begann sie die Männer zu hassen.
- Ihren Mägden untersagte sie jeglichen Umgang mit ihnen. Doch die vergnügten sich insgeheim mit den jungen Fischern am Fluss
Darüber war das Burgfräulein so erbost, dass sie ihre Mägde mit den Worten "Werdet zu Stein" verfluchte. Die beiden erstarrten bei ihrer Flucht. …Noch in derselben Nacht brannte die Eselsburg vom Blitz getroffen nieder das „Burgfräulein ” starb. 1608 via www </b>
.
pc4 Am Anfang war die Tat
>html<
>h1< Test eines geschriebenen Textes >br<
Hallo, wie geht es Dir?
.
Flechtzöpfe
http://kupferzopf-flechtfrisuren.de
.
Höhlen u.a.
.