-

Stichwörter (Index)
en Index
fr Indexe

Stichwort  A  B  C  D  E  F  G  H  I  J  K  L  M  N  O  P  Q  R  S  T  U  V  W  X  Y  Z

Ⓖ Internet-Grundlagen Normen & Empfehlungens Datum & Zeit, Sprachen, Ländercodes, Zahlen, Währungen Maßeinheiten: Masseinheiten Umrechnung, Unit Converter Einheiten: l, g, m, W (Liter, Grammm, Meter, Watt) Präfixe: kg, km, kW (Kilogramm, Kilometer, Kilowatt) Präfixe: kCHF (Tausend Schweizer Franken) aber: MW, GW, TW ( Megawatt, Gigawatt), Terawatt) Watt=Leistung [W] ┃ Wattstunde=Energie [Wh] Internationales Einheitensystem Die Revision des Internationalen Einheitensystems Formatieren von Text Ⓗ HTML - Hypertext Markup Language Ⓒ CSS   Ⓟ PHP   Ⓙ JavaScript Ⓦ Webdesign (Webgestaltung) Codetabelle der Sonderzeichen HTML-Steuerzeichen &=&amp; <=&lt; >=&gt; Sonderzeichen / Umlaute ü=&uuml; ß=&szlig; é=&eacute; è=&egrave; â=&acirc; ç=&ccedil; æ=&aelig; œ=&oelig; ñ=&ntilde; ø=&oslash; Buchstaben mit Caron (Hatschek) Anführungszeichen "=&quot; '=&#39; Angewinkelt «=&laquo; »=&raquo; Auslassungszeichen …=&hellip; Gedankenstrich –=&ndash; —=&mdash; Punkt/Kreis •=&bull; ⚬=&#9900; Geboren/gestorben *=&#42; †=&dagger; Symbole Griechisches Alphabet α=&alpha; β=&beta; γ=&gamma; δ=&delta; ε=&epsilon; ζ=&zeta; η=&eta; ϑ=&thetasym; ι=&iota; κ=&kappa; λ=&lambda; μ=&#956; ν=&nu; ξ=&xi; ο=&omicron; π=&pi; ρ=&rho; σ=&sigma; τ=&tau; υ=&upsilon; Pi: ϖ=&piv; Mikro: µ=&micro; Omega: Ω=&Omega;/ω=&omega; Phi Φ=&Phi;/φ=&phi; Psi: Ψ=&Psi;/ψ=&psi; ypsilon mit Haken:ϒ=&#978; Grafik-Technik Bilder/Symbole/Icons Farbwähler (ink. Color-Mixer) Listen Rahmen Tabellen Automatische Weiterleitung Suchen Übersetzungen de/en/fr AltaVista Google Leo bab.la Collins Beolingus woerterbuch Linguee Verkürztes Suchen Nachschlagewerke (Deutsch) Internet-Archiv (Wayback-Datenbank) ChatGPT (Frag mich alles!!!)

HTML-Formatierungshilfen ⇒ aus der Codetabelle der Sonderzeichen Sonderzeichen Zeichensetzung Von Leerzeichen und Sonderzeichen Abbildungen und Tabellen Stolpersteine der deutschen Rechtschreibung Beispiel HTML-Code Beschreibung & # < > &amp; &#35; &lt; &gt; Ampersand, Doppel­kreuz Kleiner als, grösser als € $ £ ¢ &euro; &#36; &pound; &cent; Euro, Dollar, Pfund Sterling, Cent km2 m3 W⁄m2 km<sup>2</sup> m<sup>3</sup> W<&frasl;>m<sup>2</sup> Höher gestellt CO₂ NOx CO&#x2082; NO<sub>x</sub> Tiefer gestellt 5 MW 5&nbsp;MW Geschützter Abstand (kein Umbruch) 3 °C 5 K 3&#8239;°C 5&#8239;K Kleiner geschützter Abstand bei Kelvin ohne ° Trenn­beispiel Trenn&shy;beispiel Bedingte Trennung (Trennung erfolgt hier) ‑   ⁄ │ ┃ &#8209; &frasl; &#9474; &#9475; Geschützte Striche vertikale Trennstriche 5 < 8 > 6 x ≤ y y ≥ z 5 &lt; 8 &gt; 6 x &le; y y &ge; z Kleiner (als), grösser (als) Kleiner oder gleich, grösser oder gleich 5⁄8 ¼ ⅓ ½ ⅔ ¾ 1½ % ‰ ⁄ ∞ 5&frasl;8 &frac14; &#8531; &frac12; &frac32; &frac34; &1frac12; &#37; &permil; &frasl; &infin; Zahl 1 / Zahl 2 ein Viertel, ein Drittel, ein Halb, zwei Drittel, drei Viertel, eineinhalb (anderthalb) Prozent, Promille, Bruchstrich, Unendlich ± × ⁄ ÷ ⁒ ⋅ ~ ≈ ≅ ≡ ≙ ≠ &plusmn; &times; &frasl; &divide; &#8274; &#sdot; &#126; &asymp; &cong; &#8801; &#8793; &ne Plusminus, Mal Bruchstrich (Schrägstrich), geteilt abzüglich, Mittelpunkt Tilde/proportional, ungefähr, ungefähr gleich, identisch entspricht, ungleich ↑ → ⬆ ⬇ ⇑ ⇒ ⇧ ⇨ ▶ ▷ &uarr; &rarr; &#11014; &#11015; &uArr; &rArr;; &#8679; &#8680; &#9654; &#9655; Pfeile x Text y <p style="visibility: hidden">Text></span> Abstand horizontal (Abstand=Textlänge) Abschnitt 1 Abschnitt 2 <p style="visibility: hidden">Text></span> Abstand vertikal (in Pixel: px) A B C <hr size="3" style="margin‑top:0.3em; margin‑bottom:0.3em; background:black"> Trennstrich - verschiedene Stärken - Abstand oben & unten - Farben (z.B "blue")

-

⬆ A

Abkürzungen
Absatz
Ausrichtung und Abstände

→ Anfürungszeichen ⇒ Formatieren von Text [F]

→ Anzeige in einem Fenster ⇒ Übergrosser Inhalt (overflow) [P]

→ Internet-Archiv (Wayback-Datenbank) ⇒ Internet-Zugang: Internet-Archiv [Z]

→ Audio (hören) ⇒ Multimedia [M]

→ Aufzählungszeichen (Bullet/Puce) ⇒ Codetabelle der Sonderzeichen [S]

→ Auszeichnung (Fett, Italic, etc.) ⇒ Formatieren von Text [F]

-

⇧ Abkürzungen

• 1 Allgemein
• 2 Internet-Zugang, Webhosting und Fernwartung
• 3 Normen

⇦ Grundlagen-Websites [G]

-

⇧ Absatz

• Beispiel: <p> ... </p>

⇦ Text-Elemente [T]

-

⇧ Ausrichtung und Abstände

↓ Grundlagen

↓ Absatzkontrolle

↓ Horizontale Textausrichtung <text-align>

↓ Vertikale Textausrichtung <vertical-align>

↓ Aussenabstand margin:

↓ Innenabstandpadding:

⇦ HTML - Hypertext Markup Language [H]

-

↑ Grundlagen

• Grundlagen-Websites

-

↑ Absatzkontrolle

• Beispiel: Texteinrückung

• Beispiel: Textausrückung

-

↑ Horizontale Textausrichtung <text-align>

• Beispiel: Links Ausrichten von Text und Trennstrich mit align="left"

• Beispiel: Zentrieren von Text und Trennstrich mit align="center"

• Beispiel: Rechts Ausrichten von Text und Trennstrich mit align="right"

• Beispiel: Rechts Ausrichten von Text und Trennstrich mit align="right"

-

↑ Vertikale Textausrichtung <vertical-align>

• Bezeichnungen

• Beispiel

-

↑ Aussenabstand margin:

• Beispiel

-

↑ Innenabstandpadding:

• Beispiel

-

⬆ B

Begriffe und Definitionen
Block-Elemente
Browser

→ Bildlaufleiste (scrollbar) ⇒ Übergrosser Inhalt (overflow) [P]

→ Bilder ⇒ Bilder/Symbole/Icons [W]

→ Grafik ⇒ Grafik-Technik [G]

→ Das Boxmodell ⇒ Kasten (box) [P]

→ Breite & Höhe (width & height) ⇒ Positionierung [P]

→ Kasten (box) ⇒ Kasten (box) Rahmen (border) & Kontur (outline) [R]

→ Rahmen (border) ⇒ Kasten (box) Rahmen (border) & Kontur (outline) [R]

→ Opera-Buttons zum Wechseln des Browsers ⇒ Opera-Button [O]

-

⇧ Begriffe und Definitionen

• 1  Internet
• 2  Intranet
• 3  Extranet
• 4  World Wide Web
• 5  Webmaster
• 6  Internet-Zugang, Webhosting und Fernwartung
• 7  Norm, Norumung / Standard, Standardization
• 8  HTML = Hypertext Markup Language
• 9  CSS = Cascading Style Sheet
• 10 PHP = Hypertext Preprocessor
• 11 JavaScript
• 12 Cookies
• 13 Webdesign / Grafik
• 14 Quellen
• 15 Protokolle
• 16 Quelltext
• 17 Formale Sprachen
• 18 Datenbanken
• 19 Suchmaschinen

⇦ Grundlagen-Websites [G]

-

⇑ Block-Elemente

• Grundlagen

⇒ Block-Element div [D]

⇒ Block-Element pre [P]

⇦ HTML - Hypertext Markup Language [H]

-

⇧ Browser (Webbrowser)

• Allgemein (Begriffe, Websites etc.)

• Browser Kennung (User Agent)

• Browser-Sicherheit (mit Prüfprogramm)

• Browser-Support (mit Prüfprogramm)

• Opera

• Internet Explorer

• Firefox

• Netscape

• Weitere Browser

⇦ Internet-Grundlagen [G]

-

⬆ C

<code>
Computer Hard- & Software
CSS - Cascading Stylesheets

→ tabelle der Sonderzeichen ⇒ Codetabelle der Sonderzeichen [S]

→ Color-Mixer ⇒ Farbwähler [F]

→ Cookies ⇒ JavaScript [J]

-

⇧ <code> (Inline-Element)

• Beispiel: Im Text mit code

⇦ Inline-Elemente [I]

-

⇧ Computer Hard- & Software

• Verlage, Zeitschriften, Downloads

• Computer-Hardware

• Computer-Software Allgemein

• Betriebssysteme

• Editoren

• Web-Ladeprogramme (file transfer)

• Grafikprogramme

• Fotosoftware

• Sprachsoftware

• Player

• Freeware

• Open Source Software

⇦ Internet-Grundlagen [G]

-

⇧ CSS - Cascading Stylesheets

↓ Einleitung

↓ Grundlagen

↓ Erstellen und Einbinden von Stylesheets

↓ CSS-Spezifikation und Syntax

↓ Layouts mit CSS

↓ Beispiele

-

↑ Einleitung

• 3.1.1 Einleitung
• 3.1.2 Trennung von Inhalt und Aussehen
• 3.1.3 Dokumentstammbaum
• 3.1.4 Arten von Stylesheets
• 3.1.5 Kaskade-Anwendung von Stylesheets

-

↑ Grundlagen

• 3.2.1 Websites
• 3.2.2 Video-Tutorials
• 3.2.3 Glossars
• 3.2.4 Häufig gestellte Fragen (FAQ)
• 3.2.5 Suchen im Web

-

↑ Erstellen und Einbinden von Stylesheets

• 3.3.1 Art der Einbindung
• 3.3.2 Separates Stylesheet (external stylesheet)
• 3.3.3 CSS-Definitionen im Kopf der HTML-Datei (internal stylesheet)
• 3.3.4 CSS-Definitionen im Textbereich der HTML-Datei (inline styles)

-

↑ CSS-Spezifikation und Syntax

• 3.4.1 Prinzip
• 3.4.2 CSS-Kommentare (comments)
• 3.4.3 CSS-Eigenschaften
• 3.4.4 Selektoren
• 3.4.5 Spezifität (Specificity
• 3.4.6 Vererbung (Inheritance)
• 3.4.7 Attributbedingte Formate
• 3.4.8 Regel-Abkürzungen
• 3.4.9 Numerische Angaben
• 3.4.10 Sprachausgabe
• 3.4.11 Hinweise

-

↑ Layouts mit CSS

• 3.5.1 Einführung in CSS-basierte Layouts
• 3.5.2 Mehrspaltige CSS-basierte Layouts
• 3.5.3 Fixe Bereiche und Footer mit CSS-basierten Layouts
• 3.5.4 CSS-basierte Navigationsleisten

-

↑ Beispiele

• 3.6.1 Das Stylesheet dieser Website
• 3.6.2 Andere Stylesheets

-

⬆ D

Schreibweise von Datum und Zeit
<div>

→ Datenbank ⇒ PHP-Hypertext Preprocessor [P]

→ Internet-Archiv (Wayback-Datenbank) ⇒ Internet-Zugang: Internet-Archiv [Z]

→ Datenschutz ⇒ Recht & Datenschutz [R]

→ Dekoration (Unterstreichen etc.) ⇒ Formatieren von Text [F]

→ Diashow ⇒ Grafik-Technik [G]

→ Digitalkameras ⇒ Multimedia [M]

-

⇧ Schreibweise von Datum und Zeit

• Schreibweise von Datum und Zeit

-

⇧ <div> (Block-Element)

• Beispiel: Mehrere Kasten an verschiedenen Orten

⇦ Block-Elemente [B]

-

⬆ E

→ Internationales Einheitensystem (SI-Einheiten) ⇒ Text-Elemente [M]

→ Text-Elemente ⇒ Text-Elemente [T]

→ Zwei Elemente in einer Zeile (display:inline) ⇒ Positionierung [P]

→ E-Mails ⇒ E-Mails, Emoticons & Smileys [M]

→ Emoticons ⇒ E-Mails, Emoticons & Smileys [M]

→ Bilder/Symbole/Icons ⇒ Bilder/Symbole/Icons [W]

→ Grafik ⇒ Grafik-Technik [G]

→ Empfehlungen ⇒ Normen und Empfehlungen [N]

→ Erster Buchstabe und erste Zeile anders ⇒ Positionierung [P]

→ Externe Links mit einem Symbol ↗ ⇒ Verweis: Pseudoklassen [V]

-

⬆ F

Farben Farbwähler
Foren
Formatieren von Text
Häufig gestellte Fragen (FAQ)

→ Typische Fehler ⇒ Webdesign/Technik [W]

→ Fenster mit Bildlaufleiste (scrollbar) ⇒ Übergrosser Inhalt (overflow) [P]

→ Video, Fernsehen und Camcorder ⇒ Multimedia [M]

→ Fett (bold) ⇒ Formatieren von Text [F]

→ Formatierungs-Codes (Trennung etc.) ⇒ Codetabelle der Sonderzeichen [S]

→ Formulare ⇒ PHP-Hypertext Preprocessor [P]

→ Foto ⇒ Bilder/Symbole/Icons [W]

→ Foto ⇒ Grafik-Technik [G]

→ Fotografie/Digitalkameras ⇒ Multimedia [M]

-

⇧ Farben

↓ Grundlagen und Workshops

↓ Etwas Farbenlehre

↓ Farbwähler

↓ Hexadezimalformat / Hex-Umrechnung

↓ Standardisierte Farbnamen

↓ Websichere Farben

↓ Beispiele von Farben

↓ Hintergrund- und Schriftfarbe

⇦ HTML - Hypertext Markup Language [H]

-

↑ Grundlagen und Workshops

• Grundlagen-Websites

• Kurse und Workshops

-

↑ Etwas Farbenlehre

• a) Allgemein
• b) Additive und subtraktive Farbsynthese
• c) Farbmodelle RGB, CMYK und HSV
• d) Komplementärfarbe
• e) Psychologische Wirkung

-

↑ Farbwähler

• 1 Color-Mixer

• 2 Wählen nach Farbnamen

-

↑ Hexadezimalformat / Hex-Umrechnung

• Allgemein

• 216 Farbenpalette mit Hex-Zahlen

hexadecimal  00   33   66   99   CC   FF

    decimal   0   51  102  153  204  255
    
    percent   0   20   40   60   80  100

• Dez/Hex-Umrechner SELFHTML

• Umrechner von Raggett

-

↑ Standardisierte Farbnamen

• Netscape VGA - 16 Farben mit Namen

Entspricht der CSS 2.1 jedoch ohne Orange.

-

• CSS 2.1 - 17 Farben mit Namen

Entspricht Netscape VGA mit zusätzlich Orange.

Farben kann man in CSS als RGB-Wert oder Name angeben.

In der CSS 2.1-Spezifikation sind dafür 17 Namen festgelegt.

• Beispiel der Formatierung

-

• Netscape - 120 Farben mit Namen

• Beispiel der Formatierung

-

↑ Websichere Farben

• Allgemein

Bemerkung:

• Als die Palette der websicheren Farben entwickelt wurde, konnten Computer oft nur 256 verschiedene Farben anzeigen.
• Durch die Verbreitung von Grafikkarten und Monitoren, die 24 Bit oder mehr Farbtiefe darstellen können, verliert die Palette der websicheren Farben zunehmend an Bedeutung.

-

• Netscape und CSS - 216 Farben

Die browsersichere Palette setzt sich aus den Farben zusammen, bei denen Rot, Grün und Blau auf folgende Werte beschränkt sind:

Hex	00	33	66	99	CC	FF
RGB	00	51	102	153	204	255
%	0	20	40	60	80	100

Total sind dies also: 6 rote x 6 grüne x 6 blaue = 216 Farben

• Beispiel der Formatierung

-

↑ Beispiele von Farben

• a) Aus dem Stylesheet des Webseitenbaus

Webseitenbau & Vademecum
Farbe	Verwendung	Bezeichnung	Format
Grundfarbe	Hintergrund	$grund	#283A4B
	Schrift	$grund_ganzhell	#D7E1EA
Blau-Grün	Hintergrund	$grund_ganzhell	#D7E1EA
Blau	Hintergrund	$blau	#B3C5D6
Grau	Hintergrund	$grau	#E8EEF3
Rot	Hintergrund/Rahmen/Schrift	$rot	#D42B34
Gelb	Hintergrund	$gelb	#F5F08F
Grün	Hintergrund	$gruen	#D0E5CD
Braun	Hintergrund	$braun	#F0DBBD
Violett	Hintergrund	$violett	#E1C6C6
Violettblau	Hintergrund	$violettblau	#E9D6FF

• b) Aus Stylesheets von fremden Websites

Farben aus fremden Websites
Farbe	Verwendung	Format
SELFHTML	Heller Hintergrund der Titelboxen	#FFEEDD
	Dunkle Schriftfarbe der Titel	#AA5522
SNV	Logo (Orange)	#EE7D00
Louis Homepage	Hintergrund der Hauptseite	#751000
	Hintergrund Inhalt	#EFEFEF
Sterlingsangels	Hintergrund Hauptseite	#FFCC00

-

↑ Hintergrund- und Schriftfarbe

• 1 Allgemein
  • a) Bezeichnungen
  • b) Prinzip
  • c) Grundlagen Websites und Workshops

• 2 Hintergrundfarbe (background-color)
  • a) CSS-Tags
  • b) Beispiel 1: Hintergrund eines Abschnittes formatiert im HTML-Dokument
  • c) Beispiel 2: Hintergrund eines Abschnittes formatiert mit CSS
  • d) Grundlagen und Workshops

• 3 Schriftfarbe (color)
  • a) Attribute
  • b) Beispiel 1
  • c) Beispiel 2
  • d) Grundlagen und Workshops

• 4 Hintergrundfarbe und Schriftfarbe vom ganzen Dokument
  • a) Beispiel 1: Formatiert im HTML-Dokument mit HTML-Tags
  • b) Beispiel 2: Angabe im Stylesheet

• 5 Hintergrundfarbe und Schriftfarbe in einer Tabelle
  • a) Beispiel 1
  • b) Beispiel 2

• 6 Mit <span> formatierter Text mit Farbe hervorheben
  • a) Beispie 1: Angabe im Text (inline)
  • b) Beispiel 2: Formatierung mit Stylesheet

-

⇧ Foren

• 1 SELFHTML
• 2 Validome

⇦ Grundlagen-Websites [G]

-

⇧ Formatieren von Text

↓ Grundlagen

⇒ Zeichen [Z]

⇒ Worte [W]

⇒ Zeilen [Z]

↓ Auszeichnung (Fett, Italic, etc.)

↓ Dekoration (Unterstreichen etc.)

↓ Transformation (Gross, klein etc.)

↓ Schatten

↓ Sprache

↓ Anführungszeichen

⇦ HTML - Hypertext Markup Language [H]

-

↑ Grundlagen

• Grundlagen-Websites

-

↑ Auszeichnung (Fett, Italic, etc.)

• Elemente und Bedeutung der physischen Auszeichnungen im Text

• <b>...</b> = zeichnet einen Text als fett aus
• <i>...</i> = zeichnet einen Text als kursiv aus
• <tt>...</tt> = dicktengleich (tt = Teletyper = Fernschreiber)
• <u>...</u> = zeichnet einen Text als unterstrichen aus
• <strike>...</strike> = zeichnet einen Text als durchgestrichen aus
• <s>...</s> = zeichnet einen Text als durchgestrichen aus
• <big>...</big> = zeichnet einen Text grösser als normal aus
• <small>...</small> = zeichnet einen Text kleiner als normal aus
• ^... = zeichnet einen Text als hochgestellt aus
• _... = zeichnet einen Text als tiefgestellt aus

• Beispiel 1: Verschiedene Formate

• Beispiel 2: Formatierung im Text mit HTML

-

↑ Dekoration (Unterstreichen etc.)

• Prinzip

  Mit "text-decoration:..." kann eine zusätzliche Formatierung bestimmt werden.

• underline = unterstrichen
• overline =überstrichen
• line-through = durchgestrichen
• blink = blinkend
• none = normal (keine Text-Dekoration)

• Beispiel 1: ganzer Abschnitt

• Beispiel 2: nur ein Teil des Abschnittes

-

↑ Transformation (Gross, klein etc.)

• Prinzip

  Mit dieser Eigenschaft kann in einem Textbereich Klein- oder Grossbuchstaben oder Kapitälchen erzwungen werden, unabhängig davon, wie die einzelnen Buchstaben tatsächlich in der Datei stehen.

• capitalize = Wortanfänge als Grossbuchstabe (capitalizes first character of each word)
• uppercase = Nur Grossbuchstaben (capitalizes all characters of each word)
• lowercase = Nur Kleinbuchstaben (uses small letters for all characters of each word)
• none = normal = keine Text-Transformation (the initial value)

• Beispiel: Alles Grossbuchstaben (uppercase)

-

↑ Schatten

• text-shadow = Textschatten

  Diese Eigenschaft wird in CSS 2.1 voraussichtlich nicht mehr enthalten sein.

-

↑ Sprache

• :lang (Pseudoklasse für Sprachauszeichnung)

• Wahl der Sprache

-

↑ Anführungszeichen

• Beipiel von automatische Anführungszeichen

-

⇧ Häufig gestellte Fragen (FAQ)

• 1 Internet-Zugang
• 2 Internet-Sicherheit
• 3 Normen
• 4 HTML
• 5 CSS
• 6 PHP
• 7 JavaScript

⇦ Grundlagen-Websites [G]

-

⬆ G

Grafik-Technik
Internet-Grundlagen
Grundlagen-Websites Glossars
Geschichte.

→ Gästebuch ⇒ PHP-Hypertext Preprocessor [P]

→ Griechische Buchstaben ⇒ Codetabelle der Sonderzeichen [S]

→ Grossschreibung ⇒ Formatieren von Text [F]

→ Bilder/Symbole/Icons ⇒ Bilder/Symbole/Icons [W]

-

⇧ Grafik-Technik

↓ Grundlagen und Workshops

↓ Grafikformate

↓ Grafiken einbinden

↓ Grafiken skalieren und ausrichten

↓ Grafiken in Rahmen

↓ Grafik und Text

↓ Grafik mit Verweis

↓ Diashow

↓ Grafiksorten

↓ Rechtliche Aspekte

⇦ HTML - Hypertext Markup Language [H]

⇒ Bilder/Symbole/Icons [W]

-

↑ Grundlagen und Workshops

• 1 Bezeichnungen
• 2 Websites
• 3 Grafik-Technik
• 4 Grafikprogramme und Bildbearbeitung

-

↑ Grafikformate

• 1 Allgemein
  • a) Die wichtigsten Grafikformate
  • b) Die wichtigsten Eigenschaften von GIF und JPG
  • c) Allgemeine Websites
• 2 Das GIF-Format
• 3 Das JPEG-Format
• 4 Das PNG-Format
• 5 Das SVG-Format
• 6 Das LuraWave-Format

-

↑ Grafiken einbinden

• 1 Allgemein
  • a) HTML-Tags
  • b) HTML-Elementreferenz img
  • c) Attribute zum Element img
• 2 Grundlagen-Websites & Workshops
  • a) Allgemeines zu Grafiken einbinden
  • b) Grafikreferenz definieren
  • c) Namen für Grafiken
  • d) Langbeschreibung für Grafiken
• 3 Relative Adressierung
  • a) Beispiel: Das Bild ist im Ordner "grafiken" dieser Website
  • b) Workshop zu Relative Adressierung
• 4 Absulute Adressierung
  • Beispiel 1: Das Bild ist auf einer andern Website
  • Beispiel 2: Mit bestimmter Grösse und Rand der Grösse 1
  • Beispiel 3: Mit noch grösser und Rand der Grösse 5
  • Workshop zu Absulute Adressierung
• 5 Alternativer Text alt="..." (Angabe im Quelltext)

-

↑ Grafiken skalieren und ausrichten

• 1 Grafiken Skalieren
  • Grundlagen-Websites & Workshops
• 2 Grafiken ausrichten
  • a) Grundlagen-Websites & Workshops
  • b) Grafik zum umgebenden Text ausrichten
  • c) Text um Grafik fließen lassen
  • d) Grafik und andere Inhalte ausrichten mit Tabellen
  • e) Grafiken ausrichten mit CSS
• 3 Bilder zuschneiden (shape)
• 4 Bildlaufleiste (overflow)

-

↑ Grafiken in Rahmen

• 1 Rahmen um Grafiken
• 2 Grafiken in Tabellen-Rahmen

-

↑ Grafik und Text

• 1 Grafiken ausrichten
  • a) Grafik zum umgebenden Text ausrichten
  • b) Text um Grafik fließen lassen
  • c) Grafik und andere Inhalte ausrichten mit Tabellen
  • d) Grafiken ausrichten mit CSS
• 2 Grafik fliessend in den Text einbinden (float)
  • a) Bild ohne Rahmen, rechts vom Text
  • b) Bild mit punktiertem Rahmen, rechts vom Text
  • c) Bild mit Rahmen, rechts vom Text und eingefügter Bildlegende (caption)
  • d) Das Bild ist im Text und vertikal ausgerichtet
  • e) Der erste Buchstabe "schwimmt" links oben vom Abschnitt
• 3 Grafik hinter oder vor dem Text
  • a) Grafik hinter dem Text (Z-index ist -1, also niedriger und dadurch ist die Grafik hinten)
  • b) Grafik vor dem Text (Z-index ist 1, also höher und dadurch im Vordergrund)
• 4 Grafik mit Text in Tabellen

-

↑ Grafik mit Verweis

• 1 Anklickbare Grafiken
• 2 Beispiele mit Bildern
  • Beispiel 1: Kleines Bild nicht anklickbar (aus Wikipedia)
  • Beispiel 2: Grosses Bild nicht anklickbar (aus Wikipedia)
  • Beispiel 3: Bild mit Link auf eine fremde Website
  • Beispiel 4: Link im Bild auf das grosse Bild auf dem Server dieser Website
• 3 Beispiele mit Icons
  • Beispiel 1: Ikon ohne Verweis
  • Beispiel 2a: Link im Icon zum grossen Bild auf dem Server dieser Website
  • Beispiel 2b: Link im Icon zum grossen Bild auf dem Server dieser Website
  • Beispiel 3: Link im Icon zum grossen Bild in einer fremden Website
• 4 Beispiele mit Smileys
  • Beispiel 1: Smiley mit Link auf die Website des Herstellers
  • Beispiel 2: Smiley mit Link auf das Internet-Vademecum
  • Beispiel 3: Smileys mit Link auf das entsprechende Land im Internet-Vademecum/Erkunden
• 5 Verweis-sensitive Grafiken (Image Maps)
  • a) Verweis-sensitive Grafiken definieren
  • b) Server-seitige verweis-sensitive Grafiken
  • c) Referenzieren von sensitiven Bereichen
  • d) Grundlagen aus der Mathematik

-

↑ Diashow

• Diashow

-

↑ Grafiksorten

• 1 Typische Grafiksorten für Web-Seiten
  • a) Buttons (Schaltflächen)
  • b) Dots (Auflistungspunkte)
  • c) Bars (Trennleisten)
  • d) Wallpapers (Hintergrundbilder)
  • e) Symbole (Textergänzung oder Textersatz)
  • f) Cliparts (Illustrationen)
  • g) Thumbnails (Vorschaugrafiken)
  • h) Fotos
  • i) Blinde Pixel
  • j) Grafische Layout-Elemente

-

↑ Rechtliche Aspekte

• 1 Bilder-Klau
• 2 Traffic-Klau

-

⇧ Internet-Grundlagen

↓ Grundlagen-Websites

⇒ Normen & Empfehlungen [N]

⇒ Management & Handel [M]

⇒ Webmaster [W]

⇒ Computer Hard- & Software [C]

⇒ Internet-Zugang, Webhosting & Fernwartung [Z]

⇒ Browser [B]

⇒ E-Mails, Emoticons & Smileys [M]

⇒ RSS-Feeds & Postcasting [R]

⇒ Internet-Telefonie & SMS [T]

⇒ Multimedia [M]

⇒ Sicherheit [S]

⇒ Recht & Datenschutz [R]

↓ Geschichte [G]

-

↑ Grundlagen-Websites

⇒ Begriffe und Definitionen [B]

⇒ Websites [W]

⇒ Video-Tutorials [V]

↓ Glosssars [G]

⇒ Abkürzungen [A]

⇒ Häufig gestellte Fragen (FAQ) [F]

⇒ Foren [F]

⇒ Suchen im Web [S]

-

↑ Glosssars

• 1  Allgemeine Internet und Computer-Glossars
• 2  Normen
• 3  IP-Adresse
• 4  JavaScript
• 5  Cookies
• 6  Telekommunikation
• 7  Multimedia
• 8  EDV-Wörterbuch
• 9  Suchmaschinen
• 10 Internet-Zugang
• 11 Recht
• 12 Nutznetz

-

↑ Geschichte

• Computer

• Internet

• World Wide Web

⇦ Internet-Grundlagen [G]

-

⬆ H

HTML - Hypertext Markup Language
Hintergrund

→ Hexadezimalformat / Hex-Umrechnung ⇒ Farben [F]

→ Hintergrundfarbe ⇒ Farben [F]

→ Breite & Höhe (width & height) ⇒ Positionierung [P]

→ Horizontale Textausrichtung ⇒ Ausrichtung und Abstände [A]

→ Handel ⇒ Management & Handel [M]

→ Hardware ⇒ Computer Hard- & Software [C]

-

⇧ HTML - Hypertext Markup Language

↓ Einleitung

↓ HTML-Grundlagen

↓ HTML-Dokument

⇒ Schriftzeichen [S]

⇒ Text-Elemente [T]

⇒ Block-Elemente [B]

⇒ Inline-Elemente [I]

⇒ Formatieren von Text [F]

⇒ Positionierung [P]

⇒ Ausrichtung und Abstände [A]

⇒ Listen [L]

⇒ Tabellen [T]

⇒ Kasten (box), Rahmen (border) & Kontur (outline) [R]

⇒ Hintergrund [H]

⇒ Verweise (Links) [V]

⇒ Grafik-Technik [G]

⇒ Farben [F]

-

↑ Einleitung

• Bezeichnungen
• HTML als "lingua franca" des Web
• HTML-Versionen
• HTML-Varianten

-

↑ HTML-Grundlagen

• HTML Grundlagen-Websites und Workshops

• Video-Tutorials

• Glossars

• Häufig gestellte Fragen (FAQ)

• Foren

• Suchen im Web

-

↑ HTML-Dokument

• Arten von Dokumenten

• HTML-Dokument erstellen

• Grundgerüst eines HTML-Dokumentes

• Struktur der Dokumente

• Struktur der Sprache

• Pseudoelemente und Pseudoklassen

• Kommentare im HTML-Quelltext

• HTML und/versus CSS

-

⇧ Hintergrund

↓ Grundlagen

↓ Angaben für den Hintergrund

↓ Angaben des Hintergrundes in einem Stylesheet

⇦ HTML - Hypertext Markup Language [H]

-

↑ Grundlagen

• 1 Prinzip: Hintergrund von was?
• 2 Bezeichnungen
• 3 Grundlagen-Websites & Workshops

-

↑ Angaben für den Hintergrund

• 1 Hintergrundfarbe (background color)
• 2 Hintergrundbild (background-image)
• 3 Fixierte Hintergrundgrafiken
• 4 Wiederholungs-Effekt (background-repeat)
• 5 Wasserzeichen-Effekt (background-attachment)
• 6 Hintergrundposition (background-position)

-

↑ Angaben des Hintergrundes in einem Stylesheet

• 1 Allgemein
• 2 Beispiel: Hintergrund und Schrift dieser Anleitung
• 3 Vorschrift des W3C-Validators

-

⬆ I

Inline-Elemente

→ Icons ⇒ Bilder/Symbole/Icons [W]

→ Informationstechnologie ⇒ Normen und Empfehlungen [N]

→ Zwei Elemente in einer Zeile (display:inline) ⇒ Positionierung [P]

→ Innenabstand ⇒ Ausrichtung und Abstände [A]

→ Internet-Archiv (Wayback-Datenbank) ⇒ Internet-Zugang: Internet-Archiv [Z]

→ Internet-Archiv (Wayback-Datenbank) ⇒ Internet-Zugang: Internet-Archiv [Z]

→ Internet-Grundlagen ⇒ Internet-Grundlagen [G]

→ Italic (kursiv) ⇒ Formatieren von Text [F]

-

⇧ Inline-Elemente

• Grundlagen

⇒ Inline-Element span [S]

⇒ Inline-Element code [C]

⇦ HTML - Hypertext Markup Language [H]

-

⬆ J

JavaScript

-

⇧ JavaScript

↓ Einleitung

↓ Grundlagen

↓ Anleitung

↓ Befehle

↓ Beispiele

↓ Cookies

-

↑ Einleitung

• 5.1.1 JavaScript
• 5.1.2 DOM
• 5.1.3 JScript
• 5.1.4 Java
• 5.1.5 Ajax

-

↑ Grundlagen

• 5.2.1 Websites
• 5.2.2 Video-Tutorials
• 5.2.3 Glossar
• 5.2.4 Fragen (FAQ)
• 5.2.5 Sicherheitsrisiko Javascript
• 5.2.6 Suchen im Web

-

↑ Anleitung

• 5.3.1 JavaScript in HTML definieren und einbinden
• 5.3.2 Einbinden mit Alert
• 5.3.3 Kommentar
• 5.3.4 Strings und Variablen

-

↑ Befehle

• 5.4.1 script
• 5.4.2 noscript

-

↑ Beispiele

• 5.5.1 Websites mit Beispielen
• 5.5.2 Javascript aktivieren
• 5.5.3 Taschenrechner
• 5.5.4 Uhr
• 5.5.5 Kalender
• 5.5.6 Diverse Beispiele

-

↑ Cookies

• 5.6.1 Einleitung
• 5.6.2 Grundlagen
• 5.6.3 Anleitung

-

⬆ K

→ Kasten (box) ⇒ Kasten (box), Rahmen (border) & Kontur (outline) [R]

→ Kleinschreibung ⇒ Formatieren von Text [F]

→ Kontaktformular ⇒ PHP-Hypertext Preprocessor [P]

→ Kontur (outline) ⇒ Kasten (box), Rahmen (border) & Kontur (outline) [R]

-

⬆ L

Ländercode,
Listen

→ Externe Links mit einem Symbol ↗ ⇒ Verweis: Pseudoklassen [V]

-

⇧ Ländercode

• Ländercode

-

⇧ Listen

↓ Grundlagen

↓ Unsortierte Listenpunkte (unsorted list) <li>

↓ Sortierte Listenpunkte (ordered list) <ol>

↓ Beschreibungsliste (descriptive list)

↓ Listeneinrückung

↓ Listenpunkte als Abschnitte

↓ Listenpunkte mit Grafik

↓ Horizontale Menüs mit Listen position:inline

⇦ HTML - Hypertext Markup Language [H]

-

↑ Grundlagen

• Prinzip

• Grundlagen-Websites & Workshops

-

↑ Unsortierte Listenpunkte (unsorted list) <li>

• Wahl des Listenzeichens oder kein Listenzeichen

• Unsortierte Liste mit <ul> ohne Attribut (Standard)

• Beispiel: Runder Punkt (disc) - Formatiert mit "disc"

• Beispiel: Kreis (cercle)

• Beispiel: Quadrat (square)

• Beispiel: Kein Listenzeichen (none)

-

↑ Sortierte Listenpunkte (ordered list) <ol>

• Bezeichnungen

• Sortierte Liste mit <ol> ohne Attribut (Standard)

• Wahl des Aufzählungszeichens

• Beispiel: Zahl (decimal) - Formatiert mit "decimal"

• Beispiel: Grossbuchstabe (upper-alpha)

• Beispiel: Kleinbuchstabe (lower-alpha)

• Beispiel: Grosse römische Zahl (upper-roman)

• Beispiel: Kleine römische Zahl (lower-roman)

-

↑ Beschreibungsliste (descriptive list)

• Bezeichnungen

• Beispiel 1

• Beispiel 2: Menüliste ohne linken Einzug

-

↑ Listeneinrückung

• Prinzip und Bezeichnungen

• Beispiel: Unsortierte Liste mit Einrückung - ul ohne Attribut (Standard)

• Beispiel: Unsortierte Liste mit Einrückung - mit Attribut "outside"

• Beispiel: Unsortierte Liste ohne Einrückung - mit Attribut "inside"

• Beispiel: Sortierte Liste mit Einrückung - ohne Attribut (Standard)

• Beispiel: Sortierte Liste mit Einrückung - mit Attribut "outside"

• Beispiel: Sortierte Liste ohne Einrückung - mit Attribut "inside"

-

↑ Listenpunkte als Abschnitte

• Beispiel: Ohne Abschnitt innerhalb des Listenpunktes

• Beispiel 2: Mit Abschnitt innerhalb des Listenpunktes

-

↑ Listenpunkte mit Grafik

• Workshops

-

↑ Horizontale Menüs mit Listen <position:inline

• Horizontale Menüs mit Listen <position:inline

-

⬆ M

E-Mails, Emoticons & Smileys
Management & Handel
Metrologie
Multimedia

→ Margin ⇒ Ausrichtung und Abstände [A]

→ Masseinheiten und deren Umrechnungen ⇒ Metrologie [M]

→ Mathematische Symbole ⇒ Codetabelle der Sonderzeichen [S]

→ Horizontale Menüs mit Listen position:inline ⇒ Listen [L]

→ Microsoft PowerPoint ⇒ Multimedia [M]

→ Bilder/Symbole/Icons ⇒ Bilder/Symbole/Icons [W]

-

⇧ E-Mails, Emoticons & Smileys

• E-Mail

• Emoticons

• Smileys

⇦ Internet-Grundlagen [G]

-

⇧ Management & Handel

• Management & Handel

⇦ Internet-Grundlagen [G]

-

⇧ Metrologie

• Allgemein

• Internationales Einheitensystem (SI-Einheiten)

• Masseinheiten und deren Umrechnungen

• Numerische Angaben bei Computern

-

⇧ Multimedia

• Allgemein

• Fotografie/Digitalkameras

• Microsoft PowerPoint

• Video, Fernsehen und Camcorder

• Audio (hören)

⇦ Internet-Grundlagen [G]

-

⬆ N

Normen und Empfehlungen

→ Navigation ⇒ PHP-Hypertext Preprocessor [P]

→ Numerische Angaben bei Computern ⇒ Metrologie [M]

-

⇧ Normen und Empfehlungen

↓ Allgemein

↓ Sektoren

⇒ Metrologie (Masse und Gewichte)

↓ Informationstechnologie

⇒ W3C-World Wide Web Consortium - Recommendations

↓ Organisationen

↓ Gesetze und Normen

↓ Globale Normen

↓ Recherche

⇦ Internet-Grundlagen [G]

-

↑ Allgemein

• 1 Einleitung
• 2 Begriffe
  • a) Norm, Normung / Standard, Standardization
  • b) Standard / De-facto-Standard
  • c) Unterscheidung zwischen "Norm" und "Standard" im Deutschen
  • d) "Norm" und "Standard" im Englischen
  • e) Technische Vorschriften
  • f) Technische Regeln
• 3 Websites
  • a) Wikipedia
  • b) Reglemente, Glossars und FAQ
  • c) Organisationen
  • d) W3C - World Wide Web Consortium
• 4 Reglemente, Glossars und FAQ
  • a) Reglemente zur Normungsarbeit
  • b) Leitfäden
  • c) Bezeichnung von Normen
  • d) Begriffe und Definitionen
  • e) Abkürzungen und Glossars
  • f) Fragen und Antworten (FAQ)
• 5 Internet-Dokumentationen
  • a) Allgemeines zu Dokumenten und Dokumentationen
  • b) Recommendations des W3-Konsortiums
  • c) Requests For Comments (RFCs)
  • d) Frequently Asked Questions (FAQs)
  • e) Anbieter-Dokumentationen
  • f) Freie Dokumentationen
  • g) Bücher

-

↑ Sektoren

⇒ Ländercode [L]

⇒ Sprachencode [S]

⇒ Währungs-Abkürzungen [W]

⇒ Datum und Zeit [D]

⇒ Papierformate [P]

-

↑ Informationstechnologie

• Allgemein

-

↑ Organisationen

• 1 Internationale Organisationen
  • a) Allgemeine Normen
  • b) Elektrotechnische Normen
  • c) Fernmeldewesen (Telekommunikation)
  • d) Empfehlungen
• 2 Regionale Organisationen
  • a) Europa
• 3 Nationale Organisationen
  • a) Deutschland
  • b) Frankreich
  • c) England
  • d) Österreich
  • e) Schweiz

-

↑ Gesetze und Normen

• 1 International
  • a) Referenzieren von ISO und IEC Normen in Vorschriften
• 2 Europäische Union (EU)
  • a) Die Union
  • b) Die Europäische Kommission
  • c) Die Beziehungen der Schweiz zur EU
• 3 Europäische Freihandelsassoziation
• 4 Schweiz
  • a) Technische Handelshemmnisse
  • b) Notifikation von technischen Vorschriften
  • c) New and Global Approach, Normierung, CE Kennzeichnung
• 5 Neues Konzept - Harmonisierte Normen
  • a) Neues Konzept/New Approach/La nouvelle approche
  • b) Harmonisierte Europäische Normen
• 6 Rechtsverbindlichkeit von Normen

Internet-Vademecum: Behörden, Gesetze

-

↑ Globale Normen

• 1 Verhinderung von Handelshemmnissen
  • a) WTO The World Trade Organization
• 2 Referenzieren von ISO und IEC Normen in Vorschriften
• 3 Internationale und Regionale Zusammenarbeit
  • a) Technische Zusammenarbeit zwischen ISO und CEN
  • b) Zusammenarbeit zwischen IEC und CENELEC
• 4 Weltweite Anwendbarkeit von Internationalen Normen
• 5 Globale Normen - Internationale Normen

-

↑ Recherche

• 1 Klassifikation der Normen
• 2 Internationale Normen
  • a) ISO Normen
  • b) IEC Normen
• 3 Europäische Normen
  • a) Europäische Normen
  • b) ETSI Normen
  • c) Harmonisierte europäische Normen
• 4 Recherchen
  • a) Deutschland
  • b) Schweiz
  • c) USA
  • d) Weitere Links zu Organisationen und Verlagen

-

⬆ O

Opera (Browser), Browser-Umschaltung

→ Kontur (outline) ⇒ Kasten (box) Rahmen (border) & Kontour (outline) [R]

-

⇧ Opera (Browser)

-

• Browser-Umschaltung
  (Opera-Buttons zum Wechseln des Browsers)

-

⬆ P

Papierformate
PHP-Hypertext Preprocessor
Positionierung
<pre>
Pseudoelemente & Pseudoklassen

→ Padding ⇒ Ausrichtung und Abstände [A]

→ Paragraph ⇒ Absatz [A]

→ Pfeile ⇒ Codetabelle der Sonderzeichen [S]

→ Pseudoelemente & Pseudoklassen ⇒ Text-Elemente [T]
→ Pseudoelemente & Pseudoklassen ⇒ Verweise [V]

→ RSS-Feeds & Postcasting ⇒ RSS-Feeds & Postcasting [R]

→ Microsoft PowerPoint ⇒ Multimedia [M]

-

⇧ Papierformate

• Papierformate

-

⇧ PHP-Hypertext Preprocessor

↓ Einleitung

↓ Grundlagen

↓ PHP-Einführung

↓ PHP-Befehle

↓ Formulare

↓ Formular-Beispiel

↓ Formulare verarbeiten

↓ Erstellung eines Kontaktformulars

↓ Erstellung eines Gästebuches

↓ Diverse Anwendungen

↓ Navigation mit PHP erstellen

↓ Datenbanken

↓ Session

-

↑ Einleitung

• 4.1.1 Bezeichnungen
• 4.1.2 Was ist PHP?
• 4.1.3 Voraussetzungen für das Programmieren in PHP
• 4.1.4 Ablauf
• 4.1.5 Beispiel eines PHP-Befehls
• 4.1.6 Orte an denen PHP-Codes stehen können
• 4.1.7 Dateiendung wenn PHP-Befehle verwendet werden
• 4.1.8 Test mit der Datei PHP-Info
• 4.1.9 PEAR
• 4.1.10 Mögliche Anwendungen

-

↑ Grundlagen

• 4.2.1 Websites
• 4.2.2 Video-Tutorials
• 4.2.3 Glossars
• 4.2.4 Fragen (FAQ)
• 4.2.5 Suchen im Web

-

↑ PHP-Einführung

• 4.3.1 PHP-Codes
• 4.3.2 Kommentare
• 4.3.3 Anführungszeichen
• 4.3.4 Ausgabe mit echo
• 4.3.5 Zeilenumbruch
• 4.3.6 Variablen & Konstanten
• 4.3.7 Berechnungen
• 4.3.8 Bedingungen
• 4.3.9 Include
• 4.3.10 Schleifen

-

↑ PHP-Befehle

• 4.4.1 Dateien
• 4.4.2 Zeichenketten
• 4.4.3 Kontrollstrukturen
• 4.4.4 Operatoren
• 4.4.5 Arrays
• 4.4.6 Mathematik
• 4.4.7 Datum und Zeit
• 4.4.8 URL und HTML
• 4.4.9 E-Mail

-

↑ Formulare

• 4.5.1 Dateityp-Deklaration
• 4.5.2 Stylesheet umschalten
• 4.5.3 Fusszeile
• 4.5.4 Browser
• 4.5.5 Weiterleitung

-

↑ Formular-Beispiel

• 4.6.1 Navigation Allgemein
• 4.6.2 Erstellung der Array-Liste menue.php
• 4.6.3 Anzeige von menue.php
• 4.6.4 Menü-Formel menue-formel.php
• 4.6.5 Einlesen der Strukturdaten in die HTML-Dokumente
• 4.6.6 Erstellen der Kopfdaten mit kopf-start.php
• 4.6.7 Einlesen des Menüs im body-start.php
• 4.6.8 Einlesen des Dokument-Endes mit ende.php
• 4.6.9 Anzeige von Inhaltsverzeichnissen
• 4.6.10 Erstellen der Sitemap

-

↑ Formulare verarbeiten

• 4.7.1 Einleitung
• 4.7.2 Bezeichnungen
• 4.7.3 Grundlagen-Websites & Workshops

-

↑ Erstellung eines Kontaktformulars

• 4.8.1 Allgemein
• 4.8.2 Die Formularbox
• 4.8.3 Beschriftungen
• 4.8.4 Labels
• 4.8.5 Eingabefelder definieren
• 4.8.6 Passwort
• 4.8.7 Auswahllisten
• 4.8.8 Druckknöpfe
• 4.8.9 Radio-Button
• 4.8.10 Checkboxen
• 4.8.11 Datei-Upload
• 4.8.12 Absenden
• 4.8.13 Klick-Button
• 4.8.14 Versteckte Elemente
• 4.8.15 Gruppierung von Elementen
• 4.8.16 Tabulator-Reihenfolge, Tastaturkürzel und Ausgrauen

-

↑ Erstellung eines Gästebuches

• 4.9.1 Formatieren von Formularen
• 4.9.2 Stylesheet der Formulare vom Webseitenbau
• 4.9.3 Stylesheet eines Beispiels von SELFHTML

-

↑ Diverse Anwendungen

• 4.10.1 Demonstration
• 4.10.2 W3C
• 4.10.3 JavaScript

-

↑ Navigation mit PHP erstellen

• 4.11.1 Website
• 4.11.2 Wikipedia
• 4.11.3 Google
• 4.11.4 SELFHTML-Wiki
• 4.11.5 PHPnet

-

↑ Datenbanken

• 4.12.1 Allgemein
• 4.12.2 Formulardaten überprüfen
• 4.12.3 Umwandeln der Variablen
• 4.12.4 Einlesen zur Anzeige der Variablen
• 4.12.5 Variablen anzeigen
• 4.12.6 Weiterleiten

-

↑ Session

• 4.13.1 Allgemein
• 4.13.2 Aufbau und Bestandteile des Kontakformulars
• 4.13.3 Quelltext des Formulars k-formular.php
• 4.13.4 Das Stylesheet des Formulars formular.css.php
• 4.13.5 Das Formular in ein HTML-Dokument einlesen
• 4.13.6 Formular anzeigen
• 4.13.7 Datei k-senden1.php
• 4.13.8 Datei k-senden2.php
• 4.13.9 Die Kontaktseite

-

⇧ Positionierung

↓ Grundlagen

↓ Positionsart (position)

↓ Breite & Höhe (width & height)

↓ Übergrosser Inhalt (overflow)

↓ Platzhalter

↓ Erster Buchstabe und erste Zeile anders

↓ Zwei Elemente in einer Zeile (display:inline)

↓ Textumfluss (float)

⇦ HTML - Hypertext Markup Language [H]

-

↑ Grundlagen

• Grundlagen-Websites

-

↑ Positionsart (position)

• Allgemein

-

↑ Breite & Höhe (width & height)

• Breite (width)

• Höhe (height)

-

↑ Übergrosser Inhalt (overflow)

• 1 Elementbereich mit übergrossem Inhalt (overflow)
  • a) Allgemein
  • b) Beispiel

  1) Angabe im Quelltext

  <div style="width:400px;height:180px;overflow:auto;
  border:1px solid #840;margin:1em;">
  <b>Anzeige in einem Fenster</b>
  Grosses Smiley:<br>
  <img src="../grafiken/smiley/gelb80.gif"
  width="80" height="80" border="0" 
  alt="Grosses Smiley
  80 x 80 Pixel animiert in 2 Frames"><br>
  Wenn der Inhalt zu gross ist: Fenster mit Bildlaufleiste (scrollbar).<br>
  Formatiert mit mit overflow: auto
  </div>
  

  2) Ausgabe im HTML-Dokument

  Anzeige in einem Fenster Grosses Smiley:
  
  Wenn der Inhalt zu gross ist: Fenster mit Bildlaufleiste (scrollbar).
  Formatiert mit mit overflow: auto
• 2 Richtung (direction)
• 3 Fortsetzung bei Textumfluss (clear)

-

↑ Platzhalter

• Anzeige bzw. Nichtanzeige mit Platzhalter (visibility)

-

↑ Erster Buchstabe und erste Zeile anders

• Erster Buchstabe grösser (first letter)

-

↑ Zwei Elemente in einer Zeile (display:inline)

• Zwei Abschnitte in der gleichen Zeile

-

↑ Textumfluss (float)

• Beispiel

-

⇧ <pre> (Block-Element)

• Beispiel: Monospace für ausgerichteten Text mit pre class="text"

⇦ Block-Elemente [B]

-

⇧ Text-Elemente: Pseudoelemente & Pseudoklassen

• 1 Allgemeines zu Pseudoelementen und Pseudoklassen
• 2 Grundlagen-Websites
• 3 Pseudoklassen für Verweise und andere Elemente
  :link, :visited, :focus, :hover, :active
• 4 Pseudoklasse und Pseudoelemente für Absätze
  :first-child, :first-line, :first-letter
• 5 Pseudoklasse für Sprachauszeichnung :lang
• 6 Pseudoelemente für automatisch generierten Inhalt
  :before, :after
• 7 Automatische Anführungszeichen
• 8 Automatische Nummerierung

⇦ Text-Elemente [T]

→ Pseudoelemente → & Pseudoklassen

⇒ HTML-Dokument: Pseudoelemente & Pseudoklassen [H] ⇒ Text-Elemente: Pseudoelemente & Pseudoklassen [P] ⇒ Verweise: Pseudoklassen a:link a:visited a:hover a:active [V]

-

⬆ Q

-

⬆ R

Kasten (box) Rahmen (border) & Kontur (outline),
Recht & Datenschutz
RSS-Feeds & Postcasting

→ Grafiken in Rahmen ⇒ Grafik-Technik [G]

→ Referenzieren ⇒ Verweise [V]

-

⇧ Kasten (box) Rahmen (border) & Kontur (outline)

↓ Allgemein/Prinzip

↓ Kasten (box)

↓ Rahmen (border)

↓ Kontur (outline)

↓ Beispiele

⇦ HTML - Hypertext Markup Language [H]

-

↑ Allgemein/Prinzip

• Prinzip

-

↑ Kasten (box)

• Das Boxmodell

-

↑ Rahmen (border)

• Allgemein

• Rahmenbreite (border-width)

• Rahmentyp (border-style)

• Rahmenfarbe (border-color)

-

↑ Kontur (outline)

• Prinzip

• Beispiel

-

↑ Beispiele

• 1 Rahmen mit dem Code div

• 1.1 Schwarze Box: div class="box-schwarz"

• 1.2 Box blau-grün: div class="box-blau-gruen"

• 1.3 Hintergrund blau-grün: div class="blau-gruen"

• 1.4 Box blau: div class="box-blau"

• 1.5 Hintergrund blau: div class="blau"

• 1.6 Box rot: div class="box-rot"

• 1.7 Box rot-dünn div class="box-rotduenn"

• 1.8 Box grün div class="box-gruen"

• 1.9 Box gelb: div class="box-gelb"

• 1.10 Hintergrund gelb: div class="gelb"

• 2 Rahmen mit dem Code code

• 2.1 Rahmen mit code class="box-grau"
• 2.2 Rahmen mitten im Satz mit code class="inlinebox-grau"

• 3 Rahmen mit dem Code pre

• 3.1 pre class="text-box"
• 3.2 pre class="code"
• 3.3 pre class="style"
• 3.4 pre class="quell"
• 3.5 pre class="php"

-

⇧ Recht & Datenschutz

• Allgemein

• Haftungsbeschränkung (Disclaimer)

• Urheberrecht & Copyright

• Traffic-Klau (Traffic Guards)

• Datenschutz

• Domain-Recht

• Recht im E-Business

• Newsletters und E-Mail Marketing

• Netiquette (oder Netikette)

⇦ Internet-Grundlagen [G]

-

⇧ RSS-Feeds & Postcasting

• RSS Feeds

• Podcasting

⇦ Internet-Grundlagen [G]

-

⬆ S

Schriftzeichen
Schriftsatz Codetabelle der Sonderzeichen
Schrift (font) Schriftart (font family)
Sicherheit
<span>
Sprachencode
Suche im Web

→ Satzzeichen (Interpunktion) ⇒ Codetabelle der Sonderzeichen [S]

→ Schriftfarbe ⇒ Farben [F]

→ Bildlaufleiste (scrollbar) ⇒ Übergrosser Inhalt (overflow) [P]

→ Session ⇒ PHP-Hypertext Preprocessor [P]

→ Smileys ⇒ E-Mails, Emoticons & Smileys [M]

→ SMS (Short Message Service) ⇒ Internet-Telefonie & SMS [T]

→ Sonderzeichen / Umlaute ⇒ Codetabelle der Sonderzeichen [S]

→ Software ⇒ Computer Hard- & Software [C]

→ Steuerzeichen ⇒ Codetabelle der Sonderzeichen [S]

→ Symbole/Sinnbilder ⇒ Codetabelle der Sonderzeichen [S]

→ Bilder/Symbole/Icons ⇒ Bilder/Symbole/Icons [W]

-

⇧ Schriftzeichen

↓ Grundlagen

↓ Schriftsatz (character set)

↓ Schrift (font)

↓ Schriftart (font-family)

↓ Schriftgrösse (font-size)

↓ Schriftstärke (font-weight)

↓ Schriftvariante (font-variant)

↓ Schriftstil (font-style)

↓ Schriftlaufweite (font-strech)

Weitere Schriftformatierungen:

→ Wortabstand (word-spacing) ⇒ Wort-Formatierung [W]

→ Zeichenabstand ⇒ Zeichen-Formatierung

→ Textdekoration (Unterstreichen etc.) ⇒ Formatieren von Text [F]

→ Text-Transformation (Gross, klein etc.) ⇒ Formatieren von Text [F]

→ Hintergrund- und Schriftfarbe ⇒ Farben [F]

→ Textschatten ⇒ Formatieren von Text [F]

⇦ HTML - Hypertext Markup Language [H]

-

↑ Grundlagen

• Grundlagen-Websites

-

↑ Schriftsatz (character set)

• ISO-Schriftsatz

• Umlaute

• Sonderzeichen

• Spezialschriftzeichen verschiedener Sprachen

• Formeln: Formeleditor

-

• Grundlagen-Websites

-

↑ Schrift (font)

• Prinzip der Formatierung mit separaten Attributen

• Kurzform der Schriftformatierung

-

↑ Schriftart (font-family)

• Beispiele von Schriftarten

• Generische Schriftfamilien

• Beispiel: Formatierung der Schriftart im HTML-Textbereich

-

↑ Schriftgrösse (font-size)

• Prinzip

• Angabe der Schriftgrösse in Punkten (pt)

• Angabe der Schriftgrösse in em

• Schriftgrösse in Schlüsselworten

-

↑ Schriftstärke (font-weight)

• Prinzip

• Beispiel: <... style="font-weight:bold">

-

↑ Schriftvariante (font-variant)

• Prinzip

• Beispiel 1: normale Schriftvariante

• Beispiel 2: style="font-variant:small-caps"

-

↑ Schriftstil (font-style)

• Prinzip

• Beispiel: Verschiedene Schriftstile

-

↑ Schriftlaufweite (font-strech)

Diese Eigenschaft wird von den verbreiteten Browsern nicht interpretiert
und daher in CSS 2.1 voraussichtlich nicht mehr enthalten sein.

-

⇧ Text formatieren mit <span>

• Beispiel: Schriftfarbe formatieren mit <span>...</span>

• Beispiel: Hintergrundfarbe einiger Worte in einem Abschnitt formatiert mit Stylesheet

• Beispiel: Ganzer Abschnitt Gelb hervorgehoben

⇦ Inline-Elemente [I]

-

⇧ Sprachencode

• Sprachencode

-

⇧ Sicherheit

• Begriffe und Definitionen

• Internetsicherheit

• Anonymität

• Antivirenprogramme

• Zertifizierung

⇦ Internet-Grundlagen [G]

-

⇧ Suche im Web

• 1 Suche im Webseitenbau und im Internet-Vademecum
• 2 Suche in Wikipedia und Suchmaschinen
• 3 Suche in Grundlagensites des Webseitenbaus
• 4 Suche in der Internet Archiv-Datenbank

⇦ Grundlagen-Websites [G]

-

⬆ T

Tabellen
Internet-Telefonie & SMS
Text-Elemetne
Trennlinie

→ Tastaturzeichen ⇒ Codetabelle der Sonderzeichen [S]

→ Grafik und Text ⇒ Grafik-Technik [G]

→ Texteinrückung/Textausrückung ⇒ Absatzkontrolle [A]

→ Textumfluss (float) ⇒ Positionierung [P]

→ Tipps und Tricks ⇒ Webdesign/Technik [W]

→ Transformation (Gross, klein etc.) ⇒ Formatieren von Text [F]

→ Typische Fehler ⇒ Webdesign/Technik [W]

-

⇧ Tabellen

↓ Grundlagen

↓ Tabelle mit Gitternetzlinien (table with border)

↓ Tabelle ohne Gitternetzlinien (table without border)

↓ Tabelle mit Tiltel in der ersten Spalte

↓ Tabelle mit bestimmten Breiten, Höhen und Farben

↓ Tabellenüberschrift

↓ Zellen miteinander verbinden

⇦ HTML - Hypertext Markup Language [H]

-

↑ Grundlagen

• Bezeichnungen

• Grundlagen-Websites

-

↑ Tabelle mit Gitternetzlinien (table with border)

• Beispiel 1: Tabellen mit Gitternetzlinien (Rahmen)

Titel 1	Titel 2	Titel 3	Bemerkungen
Zeile 2/Spalte 1	Zeile 2/Spalte 2	Zeile 2/Spalte 3	Zeile 2/Spalte 4
Zeile 3/Spalte 1	Zeile 3/Spalte 2	Zeile 3/Spalte 3	Zeile 3/Spalte 4

• Beispiel 2: Tabellenrahmen mit Zellen-Innenabstand cellpadding="10"

Titel 1	Titel 2	Titel 3
Zeile 2/Spalte 1	Zeile 2/Spalte 2	Zeile 2/Spalte 3
Zeile 3/Spalte 1	Zeile 3/Spalte 2	Zeile 3/Spalte 3

• Beispiel 3: Tabenrahmen mit Zellen-Aussenabstand cellspacing="8"

Titel 1	Titel 2	Titel 3
Zeile 2/Spalte 1	Zeile 2/Spalte 2	Zeile 2/Spalte 3
Zeile 3/Spalte 1	Zeile 3/Spalte 2	Zeile 3/Spalte 3

• Beispiel 4: Dünner Rahmen mit cellpadding="10" und cellspacing="0"

Titel 1	Titel 2	Titel 3
Zeile 2/Spalte 1	Zeile 2/Spalte 2	Zeile 2/Spalte 3
Zeile 3/Spalte 1	Zeile 3/Spalte 2	Zeile 3/Spalte 3

• Beispiel 5: Dünner roter Rahmen border:1px solid:#f00, Breite="50%"

Tabelle mit dünnem Rahmen in Rot

• k) Dekorative Tabellenrahmen

-

↑ Tabelle ohne Gitternetzlinien (table without border)

• Prinzip

• Beispiel

Titel 1	Titel 2	Titel 3	Bemerkungen
Zeile 2/Spalte 1	Zeile 2/Spalte 2	Zeile 2/Spalte 3	Zeile 2/Spalte 4
Zeile 3/Spalte 1	Zeile 3/Spalte 2	Zeile 3/Spalte 3	Zeile 3/Spalte 4

-

↑ Tabelle mit Tiltel in der ersten Spalte

• Prinzip

• Beispiel 1

Titel 1	Zeile 1/Spalte 2	Zeile 1/Spalte 3
Titel 2	Zeile 2/Spalte 2	Zeile 2/Spalte 3

• Beispiel 2: Titel links, formatiert wie Überschrift 6

-

↑ Tabelle mit bestimmten Breiten, Höhen und Farben

• Attribute

• Beispiel 1: Tabelle mit Breite width="70%"

Titel 1	Titel 2	Titel 3
Zeile 2/Spalte 1	Zeile 2/Spalte 2	Zeile 2/Spalte 3
Zeile 3/Spalte 1	Zeile 3/Spalte 2	Zeile 3/Spalte 3

• Beispiel 2: Tabelle mit Farbe, ohne Rand

• Beispiel 3: Tabelle mit Randabstand (cellpadding) und mit Farbe, ohne Rand

• Beispiel 4: Tabelle mit Randabstand, ohne Rand, Zellen mit verschiedener Farbe

Text 1a Spalte 1 Text 1b Spalte 1

Text 2a Spalte 2 Text 2b Spalte 2

• Beispiel 5: Tabelle mit einer bestimmten Höhe und Breite der ersten Spalte

• Beispiel 6: Tabelle mit schwarzem Hintergrund und weisser Farbe

Irgendein Text in dieser Zelle

• Beispiel 7: Breite und Höhe mit HTML resp. CSS formatieren

• Beispiel 8: Farben in Tabellen

-

↑ Tabellenüberschrift

• Prinzip

• Beispiel: Titel über der Tabelle

Assoziationen

Berlin	Hamburg	München
Buletten	Frikadellen	Fleischpflanzerl

-

↑ Zellen miteinander verbinden

• Allgemein

• Beispiel 1: Nebeneinanderliegend Zellen verbinden (colspan)

• Beispiel 2: Übereinanderliegende Zellen verbinden (rowspan)

• Beipiel 3: Neben- und übereinanderliegende Zellen verbinden (colspan + rowspan)

• Beispiel 4: Zellen colspan="3" und rowspan="2"

Titel der 3 Spalten
Text der Zeilen 2 und 3 in Spalte 1	Zeile 2 in Spalte 2	Zeile 2 in Spalte 3
	Zeile 3 in Spalte 2	Zeile 3 in Spalte 3

-

⇧ Internet-Telefonie & SMS

• Von der Nachrichtentrommel bis zum Telefon

• Internet-Telefonie (VoIP Voice over IP)

• Skype

• JAJAH

• Andere VOIP-Systeme

• Bildtelefonie (Video-Calls)

• SMS - Short Message Service

• "gPhone"

⇦ Internet-Grundlagen [G]

-

⇑ Text-Elemente

• Grundlagen

⇒ Überschrift [U]

⇒ Absatz [A]

⇒ Zeile [Z]

⇒ Trennlinie [T]

⇒ Unsichtbare Elemente [U]

⇒ Pseudoelemente & Pseudoklassen [P]

⇦ HTML - Hypertext Markup Language [H]

→ Pseudoelemente & Pseudoklassen ⇒ Text-Elemente [T]
→ Pseudoelemente & Pseudoklassen ⇒ Verweise [V]

-

⇧ Trennlinie <hr> (horizontal ruler)

• Beispiel: Standard-Trennlinie <hr>

⇦ Text-Elemente [T]

-

⬆ U

Überschrift
Unsichtbar

→ Übergrosser Inhalt (overflow) ⇒ Positionierung [P]

→ Umkreiste Zeichen ⇒ Codetabelle der Sonderzeichen [S]

→ Umlaute ⇒ Codetabelle der Sonderzeichen [S]

→ Masseinheiten und deren Umrechnungen ⇒ Metrologie [M]

→ Unterstreichen (underline ) ⇒ Formatieren von Text [F]

-

⇧ Überschrift

• Darstellung der Überschriften dieser Website

⇦ Text-Elemente [T]

-

⇧ Unsichtbare Elemente

• Beispiel: Text unsichtbar

⇦ Text-Elemente [T]

-

⇧

-

⬆ V

Verweise, Externe Links mit einem Symbol ↗
Video-Tutorials

→ Vertikale Textausrichtung (vertical align) ⇒ Ausrichtung und Abstände [A]

→ Grafik mit Verweis ⇒ Grafik-Technik [G]

→ Video, Fernsehen und Camcorder ⇒ Multimedia [M]

-

⇧ Verweise

↓ Referenzieren (Internetadresse)

↓ Verweise (Links)

↓ Projekt-interne Verweise

↓ Projekt-externe Verweise

↓ Verweise auf beliebige Dateien und Dowwnload-Verweise

↓ Link zu E-Mail <mailto>

↓ Zielfenster, Tabulator-Reihenfolge und Tastarurkürzel

↓ Pseudoklassen a:link etc.

↓ Grafik mit Verweis

↓ Diverses

⇦ HTML - Hypertext Markup Language [H]

-

↑ Referenzieren (Internetadresse)

• 1 Was heisst "Referenzieren"?
• 2 Bezeichnungen
• 3 Adressen von Webseiten
• 4 Mit vollständigen URIs referenzieren
• 5 Relativ zum Basis-URI referenzieren
• 6 Grafiken referenzieren

-

↑ Verweise (Links)

• 1 Was ist ein Verweis?
• 2 Elemente und Attribute für Verweise
• 3 Beispiel: Erklärung von Link auf eine andere Website
• 4 Arten von Verweisen
• 5 Grundlagen-Websites & Workshops

-

↑ Projekt-interne Verweise

• 1 Prinzip
  • a) Projekt-interne Verweise
  • b) Im Gegensatzu zu Projekt-externen Verweise
• 2 Grundlagen-Websites & Workshops
• 3 Beispiele von internen Verweisen
  • Beispiel 1: Die Datei befindet sich im gleichen Verzeichnis
  • Beispiel 2: Link auf eine Datei in einem andern Verzeichnis
  • Beispiel 3: Link auf eine Datei im Stammverzeichnis dieser Website
  • Beispiel 4: Link auf das Stylesheet dieser Website
• 4 Anker definieren und Verweise zu Ankern
  • a) Prinzip
  • b) Beispiel: Link auf Color-Mixer im Abschnitt Farben
  • c) Workshops

-

↑ Projekt-externe Verweise

• 1 Beispiele
  • Beispiel 1: Veweis auf Wikipedia
  • Beispiel 2: Verweis auf SELFHTML
• 2 Grundlagen-Websites & Workshops

-

↑ Verweise auf beliebige Dateien und Dowwnload-Verweise

• 1 Allgemein
• 2 Beispiele
  • Beispiel 1: Verweis zu einer Tabellenkalkulation
  • Beispiel 2: Verweis zu einer wav-Audio-Datei
• 3 Grundlagen-Websites & Workshops
• 4 MIME-Typ des Verweisziels angeben
  • a) Beispiel mit Angabe des MIME-Typs: zu Tabellenkalkulation
  • b) Grundlagen und Workshops
• 5 Download-Verweise
  • a) Allgemein
  • b) Grundlagen und Workshops

-

↑ Link zu E-Mail <mailto>

• 1 Prinzip
• 2 Beispiele
  • Beispiel 1: Mail an den Webmaster und Autor dieser Website
  • Beispiel 2: Mail Mail mit Adressierungsschema (siehe Optionen)
• 3 Grundlagen-Websites & Workshops
• 3 Optionen bei E-Mail-Verweisen
  • Option 1: Mail mit Adressierungsschema
  • Option 2: Mail an zwei
  • Option 3: Mail mit Kopie
  • Option 4: Mail mit Geheimkopie
  • Option 5: Mail mit Betreff
  • Option 6: Mail mit Body
  • Option 7: Mail mit cc und Subject
  • Workshops: Optionen

-

↑ Zielfenster, Tabulator-Reihenfolge und Tastarurkürzel

• 1 Zielfenster für Verweise bestimmen (neues Fenster)
  • a) Prinzip
  • b) Beispiel 1: Öffnen im gleichen Fenster
  • c) Beispiel 2: Öffnen in einem neuen Fenster
  • d) Workshops
• 2 Tabulator-Reihenfolge für Verweise
• 3 Tastaturkürzel für Verweise

-

↑ Verweise: Pseudoklassen a:link a:visited a:hover a:active

• 1 Verweise optisch gestalten mit CSS
  • a) Zweck
  • b) Angabe im Stylesheet
  • c) Grundlagen-Websites & Workshops
• 2 Externe Links mit einem Symbol ↗

→ Pseudoelemente → & Pseudoklassen

⇒ Text-Elemente: Pseudoelemente & Pseudoklassen [P] ⇒ Verweise: Pseudoklassen a:link a:visited a:hover a:active [V]

-

↑ Grafik mit Verweis

• Grafik mit Verweis

-

↑ Diverses

• 1 Typisierte Verweise
  • a) Logische Beziehung zum Verweisziel angeben
  • b) Sprache und Zeichenkodierung des Verweisziels angeben

-

⇧ Video-Tutorials

• 1 Allgemeine Computer Video-Tutorials
• 2 HTML und CSS Video Tutorials
• 3 PHP Video Tutorials
• 4 JavaScript Video Tutorials
• 5 Webdesign Video Tutorials

⇦ Grundlagen-Websites [G]

-

⬆ W

Währungs-Abkürzungen
Webdesign (Webgestaltung)
Webmaster
Websites
W3C - World Wide Web Consortium Empfehlungen
Wort-Formatierung

→ Internet-Archiv (Wayback-Datenbank) ⇒ Internet-Zugang: Internet-Archiv [Z]

→ Währungssymbole ⇒ Codetabelle der Sonderzeichen [S]

→ Webbrowser ⇒ Browser [B]

→ Grafik ⇒ Grafik-Technik [G]

-

⇧ Währungs-Abkürzungen

• Währungs-Abkürzungen

-

⇧ Webdesign (Webgestaltung)

↓ Einleitung

↓ Grundlagen

↓ Design

↓ Bilder/Symbole/Icons

↓ Bildbearbeitung

↓ Technik

↓ Zusatzprogramme

↓ Diverses

-

↑ Einleitung

• Begriffe und Definitionen

-

↑ Grundlagen

• Grundlagen-Websites und Workshops

• Video-Tutorials

• Suchen im Web

-

↑ Design

• Gitterfreie Gestaltung

• Tabellenlose Websites

• Webdesign mit Tabellen (nicht zu empfehlen)

• Bestandteile einer Website

• Frames

• Multimedia

• Mauszeiger (cursor-symbol)

• Barrierefreies Webdesign

-

↑ Bilder/Symbole/Icons

• Allgemein und rechtliche Aspekte

• Bilderquellen, Fotos

• Symbole

Textilpflegesymbol

• Bildtafeln, Schilder

Baustelle

• Cliparts

Buch Meeting

• Piktogramme

Behindertengerecht

• Icons

Brief E-Mail Telefon Karte Kurs

Pfeil Lupe Lupe plus Lupe minus

Bleistift Telefon Baustelle

Schloss zu Schloss offen Passwort Bildsschirmsperre

New Neu Info Welt Wichtig Link Weiter

FAQ (Frequently asked questions) Suchen Buch Audio Video

Word Dokument PDF Dokument PowerPoint Dokument Flash Player

• Buttons (Schaltfläche)

• Dots (Auflistungspunkte)

• Bars (Trennleisten)

• Favicons

• Thumbnails (Vorschaubilder)

• Wallpaper (Hintergrundbild)

• Banner

• Emoticons

• Smileys

Grosses Smiley Telefon-Smiley Computer-Smiley

• Flaggen und Wappen

⇒ Grafik-Technik [G]

-

↑ Bildbearbeitung

• Grafikprogramme

• Bildbearbeitung

• Animierte Grafiken

-

↑ Technik

• Definitionen für verschiedene Ausgabemedien

• Website Online stellen

• Eine Webseite umleiten

• Typische Fehler

• Tipps und Tricks

• Geld verdienen mit der eigenen Homepage

-

↑ Zusatzprogramme

• Zugriffe zählen (Counter)

• Fraktale (Mandelbrot & Julia-Menge)

-

↑ Diverses

• Formatierungs-Vorlagen

• Websites und Tests für eventuelle Ergänzungen

• Temporär

-

⇧ Webmaster

• Begriffe ⇒ Begriffe und Definitionen [B]

• Websites ⇒ Websites [W]

• Anwendungssoftware (Tools & Programme)

• Anzeige- & Prüfprogramme

• Sonderzeichen

• Korrekturprogramme

• HTML- und CSS-Validierung

• Linkprüfer (von und zu diesen Seiten)

• Suchmaschinen-Optimierung (SEO)

• Rechtliche Aspekte von Web-Projekten

⇦ Internet-Grundlagen [G]

-

⇧ Websites

• 1 HTML - Hypertext Markup Language
• 2 CSS - Cascading Stylesheets
• 3 PHP - Hypertext Preprocessor
• 4 JavaScript
• 5 Cookies
• 6 Webdesign
• 7 Support-Websites
  • a) Webmaster
  • b) Internet-Zugang
  • c) Normen und Empfehlungen
  • d) Suchmaschinen

⇦ Grundlagen-Websites [G]

-

⇧ W3C - World Wide Web Consortium Empfehlungen

• W3C - World Wide Web Consortium

• HTML-Empfehlungen von W3C

• CSS-Empfehlungen von W3C

• Status der Dokumente

• Requests For Comments (RFCs)

-

⇧ Wort-Formatierung

• Beispiel: Wortabstand

⇦ Formatieren von Text [F]

⇔ Schriftzeichen [S]

-

⬆ X

-

⬆ Y

-

⬆ Z

Zeichen-Formatierung
Zeile (Text-Element)
Zeilen-Formatierung
Internet-Zugang, Webhosting und Fernwartung

→ Schreibweise von Datum und Zeit ⇒ Schreibweise von Datum und Zeit [D]

→ Zwei Elemente in einer Zeile (display:inline) ⇒ Positionierung [P]

-

⇧ Zeichen-Formatierung

• Zeichenabstand

⇦ Formatieren von Text [F]

⇔ Schriftzeichen [S]

-

⇧ Zeile (Text-Element)

• Beispiel: Zeilenumbruch erzwingen <br> (break)

• Textumbruch white-space (white space)

• Geschützte Leerzeichen   (nonbraking space)

• Zeilenumbruch erlauben
  ­ (mit Trennstrich, falls notwendeig),
  <wbr> (sollte nicht verewndet werden),
  ​ (zero width space = Leerzeichen ohne Breite:
  trennt also falls notwendig in einem Leerzeichen ohne Trennstrich)

⇦ Text-Elemente [T]

-

⇧ Zeilen-Formatierung

• Beispiel: Formatierung der Zeilenhöhe im HTML-Dokument style="line-height:..."

⇦ Formatieren von Text [F]

-

⇧ Internet-Zugang, Webhosting und Fernwartung

• Allgemein (Begriffe, Websites etc.)

• Domains suchen & registrieren

• Web-Anbieter (Provider/Host/Server)

• Domain und Domain Name System (DNS)

• IP-Adresse

• Prüfung des Internetzugangs

• Fernwartung - Desktop Sharing - Remote Support

• Kurzlink

• Internet-Archiv (Wayback-Datenbank)

⇦ Internet-Grundlagen [G]

 

↑