HTML

Aus AkiWiki

(Unterschied zwischen Versionen)
Wechseln zu: Navigation, Suche
(→pc10 Nazim_Hikmet)
(→robots.txt: ==HTML for Babies: Volume 1 of Web Design for Babies== It's never too early to be standards compliant! Show your little ones HTML markup code along with letter forms to get them star)
 
(Der Versionsvergleich bezieht 126 dazwischenliegende Versionen mit ein.)
Zeile 1: Zeile 1:
-
== HTML - Infos via Wikipedia ==
+
== HTML - die Sprache des Internet ==
-
 
+
-
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
Hypertext Markup Language ([[HTML]]) ist die Sprache
Zeile 13: Zeile 7:
Meta Tags) und einfache HTML-Dokumente selbst
Meta Tags) und einfache HTML-Dokumente selbst
zu erstellen und zu formatieren.
zu erstellen und zu formatieren.
-
Vorkenntnisse: Interneteinführungskurs
 
-
Referent: [[Karl Dietz]]
 
-
Dienstag, 28.10.08, 18.00 - 21.00 Uhr, [[VHS Unteres Remstal]], Waiblingen
 
 +
 +
== 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
 +
 +
http://de.wikipedia.org/wiki/Kategorie:HTML
 +
 +
.
== Aufbau einer HTML-datei ==
== Aufbau einer HTML-datei ==
Zeile 29: Zeile 30:
  </html>
  </html>
-
== Meta daten - engl. meta tags ==
+
.
-
<meta name="keywords" CONTENT="eLearning Recherche Newsletter Suchmaschinen ">
+
== Seitenquelltext ansehen ==
-
<meta name="description" CONTENT="AKI Stuttgart">
+
-
  <meta name="robots" CONTENT="index,follow"> - seite taucht in google auf = visible web
+
  Im Browser clicken auf: ANSICHT
-
  <META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW"> - seite taucht nicht auf = deep web
+
  Dann auf: Seitenquelltext ansehen
 +
 
 +
Auskommentierten Text einsehen
 +
 
 +
zB
 +
 
 +
<!-- <img src="http://www.ekz.de/fileadmin/ekz/cms_old/DBImages/full/748.gif" border="0" width=150 hight=50></a><br> -->
-
<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 ==
+
== Überschriften in HTML mit h1 - h6 ==
<pre>
<pre>
Zeile 48: Zeile 51:
<h1 align="center">HTML - die Sprache des Web</h1>
<h1 align="center">HTML - die Sprache des Web</h1>
-
<h2 align="center">HTML - die Sprache des Web</h2>
+
<h2 align="right">HTML - die Sprache des Web</h2>
-
<h6 align="center">HTML - die Sprache des Web</h6>
+
<h6> HTML - die Sprache des Web</h6>
<h4 align="center">HTML - die Sprache des Web</h4>
<h4 align="center">HTML - die Sprache des Web</h4>
-
<h5 align="center">HTML - die Sprache des Web</h5>
+
<h5 align="right">HTML - die Sprache des Web</h5>
   
   
-
<h6 align="center">HTML - die Sprache des Web</h6>
+
<h6>HTML - die Sprache des Web</h6>
-
<pre>
+
</pre>
 +
 
 +
.
== Text und Textauszeichnung ==
== Text und Textauszeichnung ==
Zeile 68: Zeile 73:
  <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 - pre ==
-
  pre
+
 
-
  >
+
  <p r e>
-
  dies ist ein schöner Kurs - so so
+
  das pre-tag ohne die blanks schreiben
 +
  und der text wird incl. zeilenumbrüche dargestellt.
 +
  ohne das pre-tag müssen zeilenumbrüche per br-tag erzeugt werden.
  </ p r e>
  </ p r e>
 +
 +
 +
.
== Zeilenumbrüche und Absätze ==
== Zeilenumbrüche und Absätze ==
Zeile 85: Zeile 95:
</pre>
</pre>
 +
 +
.
== Listen im Dokument einfügen ==
== Listen im Dokument einfügen ==
 +
Unnummerierte Liste ===
 +
 +
<pre>
  <ul>
  <ul>
-
     <li>jen la unua elemento de listo</li>
+
     <li>zeile 1 der liste</li>
-
     <li>jen la dua elemento</li>
+
     <li>zeile 2 der liste</li>
-
     <li>jen la tria</li>
+
     <li>zeile 3 der liste</li>
  </ul>
  </ul>
 +
</pre>
-
== Einbinden von Links und Fotos und Mailadressen ==
 
-
Links: <a href="www.adresse.de">angezeigter text im browser</a>
+
Nummerierte Liste ===  
-
  Fotos: <img src="monalisa.gif">
+
<pre>
 +
  <ol>
 +
    <li>zeile 1 der liste</li>
 +
    <li>zeile 2 der liste</li>
 +
    <li>zeile 3 der liste</li>
 +
</ol>
 +
</pre>
-
Ausrichtung per: align="right" align="left" align="center"
+
.
-
<a href="mailto:fritz@url.org">Fritz, fritz@url.org</a>
+
== Links und Fotos und Mailadressen ==
-
== Sonderzeichen in HTML ==
+
<pre>
 +
Links: <a href="http://www.google.de">angezeigter text im browser - google</a>
 +
</pre>
-
* Ellipse = Auslassungszeichen = … = &hellip;
+
<pre>
-
* Gedankenstrich = Halbgeviert = – = &ndash;
+
Fotos: <img align="right" src="http://www.karldietz.de/2007/v1.jpg">
-
* An- und Abführungszeichen = „ und “ = &bdquo; und &rdquo;
+
</pre>
-
HTML-Zeichenreferenz in SelfHTML: http://selfhtml.teamone.de /html/referenz/zeichen.htm
+
<pre>
 +
<a href="mailto:karl.dz@gmail.com"> karl.dz@gmail.com</a>
 +
</pre>
-
== Seitenquelltext ansehen ==
+
<a href="mailto:karl.dz@gmail.com"> karl.dz@gmail.com</a>
-
  Ansicht
+
  bzw. hier im Wiki einfach: mailto:karl.dz@gmail.com
-
Seitenquelltext ansehen
+
-
== SelfHTML online / SelfHTML als Buch ==
+
.
-
http://de.selfhtml.org
+
== Ausrichtung - links, rechts, zentriert ==
-
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
+
per: align="right" align="left" align="center"
-
== HTML erzeugen per ... ==
+
<pre>
 +
zB <img align="right" src="http://www.karldietz.de/2007/v1.jpg">
 +
</pre>
-
mit der Hand am Arm im Editor oder hier im Wiki
+
.
-
mit Word schreiben und als HTML abspeichern
+
-
mit HTML-software, zB Dreamweaver oder Frontpage oder ...
+
-
+
-
== HTML Seminar bei der VHS in 2009 ==
+
-
HTML-Kurs [[Karl Dietz]] Dienstag, 30.04.09, 18.00 - 21.00 Uhr, VHS Unteres Remstal, Waiblingen
+
== Grösse in prozent oder pixel ==
-
== HTML Einführungen ==
+
<pre>
 +
Fotos: <img width="20%" heigth="20%" src="http://www.karldietz.de/2007/v1.jpg">
 +
</pre>
-
http://www.lerneniminternet.de/htm/html_lernen_g.html
+
...
-
http://www.inf.hs-anhalt.de/html/einfuehr.htm
+
Fotos:
 +
<pre>
 +
<img width=100 heigth=100 src="http://www.karldietz.de/2007/v1.jpg">
 +
</pre>
-
http://www.karzauninkat.com/Goldhtml/
+
...
-
http://webdesign.crissov.de/Typographie
+
== Sonderzeichen in HTML ==
-
== Zusatzinfos beim img tag ==
+
* Ellipse = Auslassungszeichen = … = &hellip;
 +
* Gedankenstrich = Halbgeviert = – = &ndash;
 +
* An- und Abführungszeichen = „ und “ = &bdquo; und &rdquo;
-
Das <img> Tag zum Einfügen eines Bildes in (X)HTML kann mittels einiger Attribute mit Textinformationen über das Bild versehen werden.
+
HTML-Zeichenreferenz in SelfHTML: http://de.selfhtml.org
-
 
+
-
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
+
.
.
.
.
-
 
-
== pc1 - 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 und das Burgfräulein starb.
 
-
 
-
1608 via www
 
.
.
-
== pc2 - Die steinernen Jungfrauen ==
+
== Farben in HTML ==
-
<b>Der Sage nach lebte auf der Eselsburg einst ein hübsches, aber
+
*** <font color="red">...und falls es in ROT sein soll... </font>  
-
hartherziges Fräulein, dem kein Freier gut genug war. Als nach
+
*** <font color="blue">...falls es mal in BLUE sein soll... </font>
-
Jahren keiner mehr um sie warb, begann sie die Männer zu hassen.
+
*** <font color="green">...oder in GREEN ... </font> 
-
Ihren Mägden untersagte sie jeglichen Umgang mit ihnen. Doch die
+
*** <font color="yellow">...oder in yellow ... </font>
-
vergnügten sich insgeheim mit den jungen Fischern am Fluss
+
*** <font color="brown">...oder in brown ... </font>
-
Darüber war das Burgfräulein so erbost, dass sie ihre Mägde mit
+
*** <font color="magenta">...oder in magenta ... </font>
-
den Worten "Werdet zu Stein" verfluchte. Die beiden erstarrten bei
+
*** <font color="grey">...oder in grau ... </font> 
-
ihrer Flucht. Noch in derselben Nacht brannte die Eselsburg vom
+
*** <font color="dark">...oder in dark ... </font>
-
Blitz getroffen nieder und das Burgfräulein starb.  
+
*** <font color="white">...oder in white ... </font> ...ist in weiss :)
-
 
+
-
1608 via www
+
.
.
-
== pc3 Am Anfang war die Tat ==
+
== SelfHTML online / als Buch ==
-
Aus CONTRASTE Nr. 290 (November 2008, Seite 1)
+
http://de.selfhtml.org
-
RIGHT LIVELIHOOD AWARD 2008
+
Addison-Wesley und Stefan Münz machen allen ein Geschenk: "Professionelle Websites" gibt es als kostenlosen Download (28 MB) ... http://aktuell.de.selfhtml.org/weblog/schenk_kultur_verlage
-
Am Anfang war die Tat
+
HTML Handbuch
 +
Von Stefan Münz, Wolfgang Nefzger
 +
Veröffentlicht von Franzis Verlag, 2005
 +
3772366546, 9783772366543
 +
1216 Seiten
 +
http://books.google.de/books?id=8RQ9ov56FhYC (keine Vorschau mehr am 12.10.09 in ES)
-
»Der Right Livelihood Award will dem Norden helfen, eine Weisheit zu
+
HTML und XHTML.
-
finden, die zu seiner Wissenschaft passt, und dem Süden, eine
+
Das umfassende Referenzwerk
-
Wissenschaft zu finden, die seine alte Weisheit ergänzt.«
+
Autoren Chuck Musciano, Bill Kennedy
 +
Ausgabe 4
 +
Verlag O'Reilly Germany, 2003
 +
ISBN 3897213508, 9783897213500
 +
Länge 698 Seiten ... 0311
-
Jakob von Uexküll
+
SELFHTML: Grafik / Techniken und Begriffe der Bildbearbeitung
 +
Der Alphakanal ist eine Erweiterung der Farbmodelle. Dabei wird für jeden Bildpunkt (Pixel) neben dessen Farbwert ein Alphawert gespeichert. ...
 +
de.selfhtml.org/grafik/techniken.htm ... 190311
-
Redaktion Heidelberg # Der »Right Livelihood Award« wurde 1980 von dem
 
-
deutsch-schwedischen Publizisten, Philatelisten und späteren
 
-
Europa-Abgeordneten Jakob von Uexküll ins Leben gerufen. Heute ist er
 
-
besser bekannt als »Alternativer Nobelpreis«. Über die Vergabe
 
-
entscheidet eine internationale Jury.
 
-
Seit 1985 findet die Verleihung jedes Jahr im schwedischen Reichstag
+
== HTML erzeugen per ... ==
-
statt – meist am Tag vor der Nobelpreisvergabe. Drei oder vier
+
-
Preisträger teilen sich das Preisgeld von zwei Millionen schwedischen
+
-
Kronen, umgerechnet etwa 210.000 Euro. Das Geld dient der Unterstützung
+
-
ihrer Arbeit und ist nicht für den persönlichen Gebrauch bestimmt.
+
-
Zusätzlich zu den Geldpreisen wird meist ein undotierter Ehrenpreis
+
-
vergeben. Der Preis unterstützt die Arbeit der Preisträger finanziell.
+
-
Darüber hinaus dient er dazu, das Wissen und die praktischen
+
mit der Hand am Arm im Editor, zB NotePad oder hier im Wiki
-
Lösungsansätze seiner Preisträger international zu verbreiten. Die
+
-
Glaubwürdigkeit und die internationale Aufmerksamkeit, die der Preis
+
-
bringt, sind dabei genauso wichtig wie die finanzielle Unterstützung.
+
-
133 Personen aus 57 Ländern sind seit 1980 mit dem »Alternativen
+
-
Nobelpreis« ausgezeichnet worden.
+
-
Anders als die Nobelpreise kennt der »Right Livelihood Award« keine
+
mit [[Word]] schreiben und dann als HTML abspeichern
-
Kategorien. Denn oft sind es gerade jene neuen Wege und Lösungsansätze,
+
-
die in keine Schublade passen wollen, die den Problemen unserer Zeit am
+
-
besten gerecht werden.
+
-
Die Preisträger setzen sich für Menschenrechte, Frieden, Konfliktlösung,
+
mit HTML-software, zB [[Dreamweaver]] oder [[Frontpage]] oder ...
-
die Rechte von Minderheiten, kulturelle und spirituelle Erneuerung, den
+
-
Schutz der Umwelt und den nachhaltigen Umgang mit unseren Ressourcen
+
-
ein. Weitere Themen der Arbeit der Preisträger sind Globalisierung,
+
-
Landwirtschaft, Kinder, Bildung, Ernährung, Alternative Technologien und
+
-
neue Wirtschaftsmodelle.
+
-
Die Right Livelihood Awards gehen in diesem Jahr an folgende
+
Incomedia WebSite X5 Evolution 8.0.9 - http://www.websitex5.com
-
PreisträgerInnen:
+
-
Krishnammal und Sankaralingam Jagannathan, und ihre Organisation LAFTI
+
.
-
(Land for the Tillers’ Freedom, Indien) erhalten einen Preis »für ihre
+
-
lebenslange Arbeit für die Verwirklichung der gandhischen Vision von
+
-
sozialer Gerechtigkeit und nachhaltiger menschlicher Entwicklung, wofür
+
-
sie als ‘Indiens Seele’ bezeichnet
+
-
wurden.«
+
-
Amy Goodman (USA), Gründerin und Moderatorin der täglichen
+
== HTML Einführungen ==
-
Nachrichtensendung Democracy Now!, wird geehrt »für die Entwicklung
+
-
eines innovativen Modells wahrhaft unabhängigen politischen
+
-
Journalismus’, der zu Millionen Menschen jene alternativen Stimmen
+
-
bringt, die von den Mainstream-Medien so häufig ausgegrenzt werden.«
+
-
Asha Hagi (Somalia), erhält den Preis, »weil sie, trotz großen Risikos
+
HTML4 - [http://www.rrzn.uni-hannover.de/buch.html?&no_cache=1&tx_rrznbuecher_pi1[showUid]=194 - ein herdt-buch. 0303]
-
für sich selbst, die Mitwirkung von Frauen im Friedensprozess ihres vom
+
-
Krieg zerrissenen Landes organisiert und anführt.«
+
-
Monika Hauser (Deutschland), Gynäkologin und Gründerin von medica
+
http://www.lerneniminternet.de/htm/html_lernen_g.html
-
mondiale, wird ausgezeichnet »für ihren unermüdlichen Einsatz für
+
-
Frauen, die in Krisenregionen schrecklichste sexualisierte Gewalt
+
-
erfahren haben, und für ihren Kampf, ihnen gesellschaftliche Anerkennung
+
-
und Entschädigung zu verschaffen.«
+
-
Mehr zum Preis:
+
http://www.inf.hs-anhalt.de/html/einfuehr.htm
-
www.rightlivelihood.org/
+
-
Quelle:
+
-
Pressemitteilung, 1. Oktober 2008
+
 +
http://www.karzauninkat.com/Goldhtml/
-
== pc4 Am Anfang war die Tat ==
+
http://webdesign.crissov.de/Typographie
-
Aus CONTRASTE Nr. 290 (November 2008, Seite 1)
+
Dive into HTML5 Mark Pilgrim http://diveintohtml5.org
-
RIGHT LIVELIHOOD AWARD 2008
 
-
Am Anfang war die Tat
 
-
»Der Right Livelihood <p> Award will dem Norden helfen, eine Weisheit zu
+
== Zusatzinfos beim image tag ==
-
finden, die zu seiner Wissenschaft passt, und dem Süden, eine
+
-
Wissenschaft zu finden, die seine alte Weisheit ergänzt.«
+
-
Jakob von Uexküll
+
Das <img> Tag zum Einfügen eines Bildes in (X)HTML kann mittels einiger Attribute mit Textinformationen über das Bild versehen werden.
-
Redaktion Heidelberg # Der »Right Livelihood Award« wurde 1980 von dem
+
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.
-
deutsch-schwedischen Publizisten, Philatelisten und späteren
+
-
Europa-Abgeordneten Jakob von Uexküll ins Leben gerufen. Heute ist er
+
-
besser bekannt als »Alternativer Nobelpreis«. Über die Vergabe
+
-
entscheidet eine internationale Jury.
+
-
Seit 1985 findet die Verleihung jedes Jahr im schwedischen Reichstag
+
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).
-
statt – meist am Tag vor der Nobelpreisvergabe. Drei oder vier
+
-
Preisträger teilen sich das Preisgeld von zwei Millionen schwedischen
+
-
Kronen, umgerechnet etwa 210.000 Euro. Das Geld dient der Unterstützung
+
-
ihrer Arbeit und ist nicht für den persönlichen Gebrauch bestimmt.
+
-
Zusätzlich zu den Geldpreisen wird meist ein undotierter Ehrenpreis
+
-
vergeben. Der Preis unterstützt die Arbeit der Preisträger finanziell.
+
-
Darüber hinaus dient er dazu, das Wissen und die praktischen
+
longdesc: <img src="monalisa.gif" longdesc="beschreibung.htm"> verlinkt auf ein externes Dokument mit einer Beschreibung des Bildes.
-
Lösungsansätze seiner Preisträger international zu verbreiten. Die
+
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.
-
Glaubwürdigkeit und die internationale Aufmerksamkeit, die der Preis
+
-
bringt, sind dabei genauso wichtig wie die finanzielle Unterstützung.  
+
-
133 Personen aus 57 Ländern sind seit 1980 mit dem »Alternativen
+
-
Nobelpreis« ausgezeichnet worden.
+
-
Anders als die Nobelpreise kennt der »Right Livelihood Award« keine
+
aus: http://netzwelt.gaming-hut.de/sections.php?op=viewarticle&artid=31
-
Kategorien. Denn oft sind es gerade jene neuen Wege und Lösungsansätze,
+
-
die in keine Schublade passen wollen, die den Problemen unserer Zeit am
+
-
besten gerecht werden.
+
-
Die Preisträger setzen sich für Menschenrechte, Frieden, Konfliktlösung,
 
-
die Rechte von Minderheiten, kulturelle und spirituelle Erneuerung, den
 
-
Schutz der Umwelt und den nachhaltigen Umgang mit unseren Ressourcen
 
-
ein. Weitere Themen der Arbeit der Preisträger sind Globalisierung,
 
-
Landwirtschaft, Kinder, Bildung, Ernährung, Alternative Technologien und
 
-
neue Wirtschaftsmodelle.
 
-
Die Right Livelihood Awards gehen in diesem Jahr an folgende
 
-
PreisträgerInnen:
 
-
Krishnammal und Sankaralingam Jagannathan, und ihre Organisation LAFTI
+
== Meta daten - engl. meta tags ==
-
(Land for the Tillers’ Freedom, Indien) erhalten einen Preis »für ihre
+
-
lebenslange Arbeit für die Verwirklichung der gandhischen Vision von
+
-
sozialer Gerechtigkeit und nachhaltiger menschlicher Entwicklung, wofür
+
-
sie als ‘Indiens Seele’ bezeichnet
+
-
wurden.«
+
-
Amy Goodman (USA), Gründerin und Moderatorin der täglichen
+
<meta name="keywords" CONTENT="eLearning Recherche Newsletter Suchmaschinen ">
-
Nachrichtensendung Democracy Now!, wird geehrt »für die Entwicklung
+
<meta name="description" CONTENT="AKI Stuttgart">
-
eines innovativen Modells wahrhaft unabhängigen politischen
+
-
Journalismus’, der zu Millionen Menschen jene alternativen Stimmen
+
-
bringt, die von den Mainstream-Medien so häufig ausgegrenzt werden.«
+
-
Asha Hagi (Somalia), erhält den Preis, »weil sie, trotz großen Risikos
+
<meta name="robots" CONTENT="index,follow"> - seite taucht in google auf = visible web
-
für sich selbst, die Mitwirkung von Frauen im Friedensprozess ihres vom
+
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW"> - seite taucht nicht in google auf = deep web
-
Krieg zerrissenen Landes organisiert und anführt.«
+
-
Monika Hauser (Deutschland), Gynäkologin und Gründerin von medica
+
<meta name="language" CONTENT="de"> - sprache der seite ist deutsch
-
mondiale, wird ausgezeichnet »für ihren unermüdlichen Einsatz für
+
<meta name="author" content="Karl Dietz"> - ersteller der seite heisst: k.dz.
-
Frauen, die in Krisenregionen schrecklichste sexualisierte Gewalt
+
-
erfahren haben, und für ihren Kampf, ihnen gesellschaftliche Anerkennung
+
-
und Entschädigung zu verschaffen.«
+
-
Mehr zum Preis:
+
Die Metadaten sind ein wichtiger Part im [[Semantic Web]]. - s.a. [[Dublin Core]].
-
www.rightlivelihood.org/
+
-
Quelle:
+
-
Pressemitteilung, 1. Oktober 2008
+
-
 
+
-
== pc5 Nazim_Hikmet ==
+
-
 
+
-
Über dem Meer die bunte Wolke Darauf das silberne Schiff Darinnen der gelbe Fisch In der Tiefe blauer Tang An der Küste ein nackter Mann Der steht da und überlegt
+
-
 
+
-
Soll ich die Wolke sein? Oder das Schiff? Oder der Fisch? Oder vielleicht der Tang?
+
-
 
+
-
Weder noch! Das Meer musst du sein, mein Sohn!
+
-
 
+
-
Mit seiner Wolke, Mit seinem Schiff, Mit seinem Fisch, Mit seinem Tang
+
-
 
+
-
Nazim Hikmet Übersetzung: Rana Talu
+
-
 
+
-
+
-
== pc6 Nazim_Hikmet ==
+
-
 
+
-
Über dem Meer die bunte Wolke Darauf das silberne Schiff Darinnen der gelbe Fisch In der Tiefe blauer Tang An der Küste ein nackter Mann Der steht da und überlegt
+
-
 
+
-
Soll ich die Wolke sein? Oder das Schiff? Oder der Fisch? Oder vielleicht der Tang?
+
-
 
+
-
Weder noch! Das Meer musst du sein, mein Sohn!
+
-
 
+
-
Mit seiner Wolke, Mit seinem Schiff, Mit seinem Fisch, Mit seinem Tang
+
-
 
+
-
Nazim Hikmet Übersetzung: Rana Talu
+
-
 
+
-
== pc7 Nazim_Hikmet ==
+
-
 
+
-
Über dem Meer die bunte Wolke Darauf das silberne Schiff Darinnen der gelbe Fisch In der Tiefe blauer Tang An der Küste ein nackter Mann Der steht da und überlegt
+
-
 
+
-
Soll ich die Wolke sein? Oder das Schiff? Oder der Fisch? Oder vielleicht der Tang?
+
-
 
+
-
Weder noch! Das Meer musst du sein, mein Sohn!
+
-
 
+
-
Mit seiner Wolke, Mit seinem Schiff, Mit seinem Fisch, Mit seinem Tang
+
-
 
+
-
Nazim Hikmet Übersetzung: Rana Talu
+
-
 
+
-
== pc8 Nazim_Hikmet ==
+
-
 
+
-
Über dem Meer die bunte Wolke Darauf das silberne Schiff Darinnen der gelbe Fisch In der Tiefe blauer Tang An der Küste ein nackter Mann Der steht da und überlegt
+
-
 
+
-
Soll ich die Wolke sein? Oder das Schiff? Oder der Fisch? Oder vielleicht der Tang?
+
-
 
+
-
Weder noch! Das Meer musst du sein, mein Sohn!
+
-
 
+
-
Mit seiner Wolke, Mit seinem Schiff, Mit seinem Fisch, Mit seinem Tang
+
-
 
+
-
Nazim Hikmet Übersetzung: Rana Talu
+
-
 
+
-
<h1== pc9 Nazim_Hikmet w w ==/h1>
+
-
 
+
-
Über dem Meer die bunte Wolke Darauf das silberne Schiff Darinnen der gelbe Fisch In der Tiefe blauer Tang An der Küste ein nackter Mann Der steht da und überlegt
+
-
 
+
-
Soll ich die Wolke sein? Oder das Schiff? Oder der Fisch? Oder vielleicht der Tang?
+
-
 
+
-
Weder noch! Das Meer musst du sein, mein Sohn!
+
-
 
+
-
Mit seiner Wolke, Mit seinem Schiff, Mit seinem Fisch, Mit seinem Tang
+
-
 
+
-
Nazim Hikmet Übersetzung: Rana Talu
+
-
 
+
-
== pc10 Nazim_Hikmet ==
+
-
 
+
-
Über dem Meer &bdquo;die bunte Wolke &rdquo; Darauf das silberne Schiff Darinnen der gelbe Fisch In der Tiefe blauer Tang An der Küste ein nackter Mann Der steht da und überlegt
+
-
 
+
-
Soll ich die Wolke sein? Oder das Schiff? Oder der Fisch? Oder vielleicht der Tang?
+
-
 
+
-
Weder noch! Das Meer musst du sein, mein Sohn!
+
-
 
+
-
Mit seiner Wolke, Mit seinem Schiff, Mit seinem Fisch, Mit seinem Tang
+
-
 
+
-
Nazim Hikmet Übersetzung: Rana Talu
+
.
.
-
== Flechtzöpfe ==
+
        <meta name="geo.region" content="DE-GE" />
-
 
+
        <meta name="geo.position" content="51.56; 7.048" />
-
http://kupferzopf-flechtfrisuren.de/
+
-
http://www.schilling-wn.de/_fotos/001_Berge/catprev.jpg
+
    http://de.wikipedia.org/wiki/Geo-Tag
 +
    http://tools.themenrelevant.de/#GeoTag
-
http://kupferzopf-flechtfrisuren.de/Tuck4_small1.JPG
 
-
http://kupferzopf-flechtfrisuren.de/Achter7small.JPG
+
==robots.txt==
 +
wg. schloss horst in mu-t im april 2018 ...
-
http://kupferzopf-flechtfrisuren.de/Lace8_small1.JPG
 
-
http://kupferzopf-flechtfrisuren.de/Lace7_small.JPG
+
==Die eigene Website - eLearning-Kurs ab 1. September 2017 ==
 +
Konzept, Installation, Design, Funktion - in fünf Wochen.
 +
https://diewebagentin.de = Silke Buttgereit
-
http://kupferzopf-flechtfrisuren.de/Lara6_small.JPG
 
-
http://kupferzopf-flechtfrisuren.de/Achter7small.JPG
+
==HTML for Babies: Volume 1 of Web Design for Babies==
-
http://kupferzopf-flechtfrisuren.de/Achter7small.JPG
+
It's never too early to be standards compliant! Show your little ones HTML markup code along with letter forms to get them started on the visual patterns and symbols that make up the essential building blocks of the Web. The first in a three-volume set, originally designed by a NYC Web Designer for his baby, this beautiful book is a fun and colorful introduction to the world of web design for babies. https://www.amazon.com/HTML-Babies-Web-Design/dp/0615487661

Aktuelle Version vom 1. Dezember 2023, 19:27 Uhr

Inhaltsverzeichnis

HTML - die Sprache des Internet

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.


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

http://de.wikipedia.org/wiki/Kategorie:HTML

.

Aufbau einer HTML-datei 

<html>
<head>
<title> Titel </title>
<meta name=" ...>
</head>
<body> Text </body>
</html>

.

Seitenquelltext ansehen 

Im Browser clicken auf: ANSICHT
Dann auf: Seitenquelltext ansehen

Auskommentierten Text einsehen

zB



Überschriften in HTML mit h1 - h6 


<h1 align="center">HTML - die Sprache des Web</h1>

<h2 align="right">HTML - die Sprache des Web</h2>

<h6> HTML - die Sprache des Web</h6>

<h4 align="center">HTML - die Sprache des Web</h4>

<h5 align="right">HTML - die Sprache des Web</h5>
 
<h6>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

das pre-tag ohne die blanks schreiben und der text wird incl. zeilenumbrüche dargestellt. ohne das pre-tag müssen zeilenumbrüche per br-tag erzeugt werden. </ p r e> .

Zeilenumbrüche und Absätze 

 

 <br> - Zeilenumbruch

 <p> - Absatz

.

Listen im Dokument einfügen

Unnummerierte Liste === 

 <ul>
    <li>zeile 1 der liste</li>
    <li>zeile 2 der liste</li>
    <li>zeile 3 der liste</li>
 </ul>


Nummerierte Liste === 

 <ol>
    <li>zeile 1 der liste</li>
    <li>zeile 2 der liste</li>
    <li>zeile 3 der liste</li>
 </ol>

.

Links und Fotos und Mailadressen 

 Links: <a href="http://www.google.de">angezeigter text im browser - google</a>

 Fotos: <img align="right" src="http://www.karldietz.de/2007/v1.jpg">

 <a href="mailto:karl.dz@gmail.com"> karl.dz@gmail.com</a>

<a href="mailto:karl.dz@gmail.com"> karl.dz@gmail.com</a>

bzw. hier im Wiki einfach: mailto:karl.dz@gmail.com

.

Ausrichtung - links, rechts, zentriert

per: align="right" align="left" align="center" 

 zB <img align="right" src="http://www.karldietz.de/2007/v1.jpg">

.

Grösse in prozent oder pixel 

 Fotos: <img width="20%" heigth="20%" src="http://www.karldietz.de/2007/v1.jpg">

...

Fotos: 

<img width=100 heigth=100 src="http://www.karldietz.de/2007/v1.jpg">

...

Sonderzeichen in HTML

  • Ellipse = Auslassungszeichen = … = …
  • Gedankenstrich = Halbgeviert = – = –
  • An- und Abführungszeichen = „ und “ = „ und ”

HTML-Zeichenreferenz in SelfHTML: http://de.selfhtml.org

.

.

.

Farben in HTML

      • ...und falls es in ROT sein soll...
      • ...falls es mal in BLUE sein soll...
      • ...oder in GREEN ...
      • ...oder in yellow ...
      • ...oder in brown ...
      • ...oder in magenta ...
      • ...oder in grau ...
      • ...oder in dark ...
      • ...oder in white ... ...ist in weiss :)

.

SelfHTML online / als Buch

http://de.selfhtml.org

Addison-Wesley und Stefan Münz machen allen ein Geschenk: "Professionelle Websites" gibt es als kostenlosen Download (28 MB) ... http://aktuell.de.selfhtml.org/weblog/schenk_kultur_verlage

HTML Handbuch Von Stefan Münz, Wolfgang Nefzger Veröffentlicht von Franzis Verlag, 2005 3772366546, 9783772366543 1216 Seiten http://books.google.de/books?id=8RQ9ov56FhYC (keine Vorschau mehr am 12.10.09 in ES)

HTML und XHTML. Das umfassende Referenzwerk Autoren Chuck Musciano, Bill Kennedy Ausgabe 4 Verlag O'Reilly Germany, 2003 ISBN 3897213508, 9783897213500 Länge 698 Seiten ... 0311

SELFHTML: Grafik / Techniken und Begriffe der Bildbearbeitung Der Alphakanal ist eine Erweiterung der Farbmodelle. Dabei wird für jeden Bildpunkt (Pixel) neben dessen Farbwert ein Alphawert gespeichert. ... de.selfhtml.org/grafik/techniken.htm ... 190311


HTML erzeugen per ...

mit der Hand am Arm im Editor, zB NotePad oder hier im Wiki

mit Word schreiben und dann als HTML abspeichern

mit HTML-software, zB Dreamweaver oder Frontpage oder ...

Incomedia WebSite X5 Evolution 8.0.9 - http://www.websitex5.com

.

HTML Einführungen

HTML4 - [showUid=194 - ein herdt-buch. 0303]

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

Dive into HTML5 Mark Pilgrim http://diveintohtml5.org


Zusatzinfos beim image 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


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 in google auf = deep web

<meta name="language" CONTENT="de"> - sprache der seite ist deutsch
<meta name="author" content="Karl Dietz"> - ersteller der seite heisst: k.dz.

Die Metadaten sind ein wichtiger Part im Semantic Web. - s.a. Dublin Core.

. 

       <meta name="geo.region" content="DE-GE" />
       <meta name="geo.position" content="51.56; 7.048" />

   http://de.wikipedia.org/wiki/Geo-Tag
   http://tools.themenrelevant.de/#GeoTag


robots.txt

wg. schloss horst in mu-t im april 2018 ...


Die eigene Website - eLearning-Kurs ab 1. September 2017

Konzept, Installation, Design, Funktion - in fünf Wochen. https://diewebagentin.de = Silke Buttgereit


HTML for Babies: Volume 1 of Web Design for Babies

It's never too early to be standards compliant! Show your little ones HTML markup code along with letter forms to get them started on the visual patterns and symbols that make up the essential building blocks of the Web. The first in a three-volume set, originally designed by a NYC Web Designer for his baby, this beautiful book is a fun and colorful introduction to the world of web design for babies. https://www.amazon.com/HTML-Babies-Web-Design/dp/0615487661

Von „http://wiki.aki-stuttgart.de/mediawiki/index.php/HTML“
Meine Werkzeuge