Manualshelf

Operation Manual

Manuals Brands Kompozer Manuals Software 07
1 2 3 4 5 6 7 8 9 10
Kompozer
Anleitung
Für Kompozer Version 0.7.10
© Charles Cooke
2005 - 2007
Dieser Text wird herausgegeben unter der
Creative Commons Licence
http://creativecommons.org/liceneses/by-sa/2.0/
Ins Deutsche übersetzt und ergänzt von
Jürgen Klose

Summary of content (157 pages)

. 3.6.5 Optimierung von Tabellen Es gibt mehrere Wege, Tabellen hinsichtlich der Präsentation und der Zugänglichkeit zu verbessern.

  • PAGE 39

    Kompozer fett und zentriert angezeigt. Überschriften werden im HTML eingefügt, indem td (Tabellendaten)-Elemente durch th (Tabellenheader)-Elemente ersetzt werden. Eine Zelle von td (normale Zelle) in eine Überschrift zu verwandeln: 1. Rufen Sie das Tabelleneigenschaften-Fenster auf. 2. Wählen Sie das Register Zelle. 3. Klicken Sie die Checkbox Zellenstil an und wählen Überschrift.

  • PAGE 40

    Kompozer Modell basiert auf einer Breite, die den Inhalt ganz dicht umrahmt, deshalb muss die Breiteneinstellung entfernt werden. Markieren Sie jede Tabelle der Reihe nach. Löschen Sie im Tabelleneigenschaften-Fenster und dort im Tabelle-Register den Wert für Breite. 3.7 Links Hyperlinks bieten das wichtigste Instrument für die Navigation innerhalb und außerhalb von Websites.

  • PAGE 41

    Kompozer Um dieses zu erreichen, verfahren Sie so wie im vorhergehenden Kapitel. Wenn das Fenster LinkEigenschaften sich öffnet, aktivieren Sie das Kontrollfeld Dies ist eine E-Mail-Adresse. Wenn Sie ein Bild als E-Mail-Link nutzen, müssen Sie im GrafikEigenschaften-Fenster das Register Link wählen. Im Quellcode erscheint der Link auf diese Weise: PAGE 42

    Kompozer 3.7.1.5 Größere Sprünge Sie können direkt an die Position eines benannten Anker auf anderen Seiten springen. Leider ist das bei Kompozer nicht so einfach zu konstruieren. 1. Klicken Sie auf den Link-Button. 2. Wählen Sie zunächst die Datei wie bereits beschrieben. 3. Schreiben Sie dann sofort im Fenster Link-Eigenschaften nach dem Dateinamen ein "#", gefolgt von dem Namen des Ankers. Wenn Ihre Datei pinguin.html heißt und der Anker #oben, wird der komplette Eintrag "pinguin.

  • PAGE 43

    Kompozer Voraussetzung für eine Verlinkung zu anderen Seiten oder Ankern ist, dass der Webmaster die Struktur der Site nicht neu ordnet. In diesem Fall werden Ihre Besucher beim Anklicken der Links mit nicht funktionierenden Verbindungen konfrontiert. 3.7.1.6 Hyperlinkfarben Links werden normalerweise unterstrichen und in Blau dargestellt. Wenn Sie genau hinsehen, können Sie erkennen, dass die Farbe Änderungen unterworfen ist. Drei verschiedene Zustände werden durch die Farben angezeigt.

  • PAGE 44

    Kompozer 3.7.2 Bilder als Hyperlinks Eine Verwendung von Bildern als Links wird dann sehr wichtig, wenn Sie auf Ihrer Webseite eine Reihe von Fotos anbieten möchten. Die Ladezeiten wachsen stark an und nicht jeder Betrachter hat die Geduld, so lange zu warten, bis alle Bilder aufgebaut sind. Daher sollten auf der Webseite zunächst nur kleine Vorschaubilder eingefügt werden. Diese haben eine geringere Auflösung und werden daher schnell geladen.

  • PAGE 45

    Kompozer 3.7.3 Links ändern Das Ziel des Hyperlinks kann sowohl in der Normal-, HTML-Tag- und Vorschau-Ansicht geändert werden. Dazu klicken Sie doppelt auf den Link, damit sich das LinkEigenschaften-Fenster öffnet. Bei einem Bild öffnet sich Grafik-Eigenschaften-Fenster, hier müssen Sie noch auf das Link-Register klicken. Ändern Sie jetzt die Angaben zu dem Link. Um die Verbindung zu entfernen, löschen Sie die Adresse im Eingabefeld.

  • PAGE 46

    Kompozer src="anzeige.htm"> <body> <p>Diese Seite verwendet Frames. Frames werden von Ihrem Browser aber nicht unterstützt.</p> </body> 3.9 Formulare 3.9.1 Einführung Formulare stellen dem Betrachter ein Mittel zur Verfügung, Daten zur Verarbeitung zum Host-Computer (Server) zu schicken. Dabei kann es sich im einfachsten Fall um eine EMail-Nachricht handeln, aber auch um ein Auftragsformular im eCommerce.

  • PAGE 47

    Kompozer 6. Klicken Sie auf OK Das Formular wird auf der Seite mit einem gestrichelten Rahmen angezeigt. Nun tragen Sie feste Texte und Formularfelder in den Formularbereich ein. 1. Fügen Sie auf dem Formular Überschriften, Absätze und Bilder ein. Das Einfügen der Felder in ein Formular kann etwas knifflig sein. Es ist manchmal einfacher zuerst, etwas blinden Text als Platzhalter zu setzen und ihn später zu löschen. Es empfiehlt sich hier der Einsatz von Tabellen. 2.

  • PAGE 48

    Kompozer Auch hier können Sie über den Mehr Eigenschaften-Button weitere Einstellungen vornehmen. Anmerkung: Da dieser Text eine Anleitung für Kompozer ist und nicht für die Konstruktion von Formularen, belassen wir es bei diesen Informationen. 3.9.3 Formular mit Styles formatieren Wenn die Standardformatierung der Felder nicht ansprechend genug ist, kann durch den Einsatz von Styles eine Gestaltung nach den persönlichen Vorlieben erfolgen.

  • PAGE 49

    Kompozer 3.10.2 Layer einrichten 1. Markieren Sie den Block, der zum Layer werden soll. 2. Klicken Sie auf den Layer-Button in der FormatierungsSymbolleiste(2) Layer besitzen Rahmen, durch die eine Änderung der Größe ermöglicht wird. An der Oberseite des Layers finden Sie einen Handle zur Positionierung (gekennzeichnet durch einen Vierfachpfeil). Um den Layer zu verschieben klicken Sie den Pfeil an und ziehen Sie an dem Handle.

  • PAGE 50

    Kompozer Beim Positionieren erlaubt Kompozer eine pixelgenaue Bewegung. Wenn allerdings versucht wird, einzelne Objekte genau auszurichten, können kleine Abweichungen offensichtlich werden. Einfacher wird es, indem man die Objekte in einem gröberen Rasterfeld 'einschnappen' lässt. Das Raster wird aktiviert durch Format-Positionierungsgitter. Sie aktivieren das Kontrollkästchen und stellen die Rasterweite ein. Die Bewegung wird jetzt an dem gedachten Raster entlang durchgeführt.

  • PAGE 51

    Kompozer Anmerkung: Eine sinnvollere Bezeichnung für die Buttons wäre 'Eine Ebene nach vorne bringen' bzw. 'Eine Ebene nach hinten bringen' 3.10.5 Anheften Sechs andere Buttons auf der Format(2)-Symbolleiste können benutzt werden, um die Position von Layern zu beeinflussen. Sie legen fest, zu welchem Seitenrand ein konstanter Abstand eingehalten wird. Dadurch wird das Verhalten des Layers bei Änderungen der Fenstergröße im Browser bestimmt.

  • PAGE 52

    Kompozer Die im Dialogblatt aufgeführten Eigenschaften sind abhängig von der Anheften-Option. In der Tabelle finden Sie einen Überblick. Anheften-Option Initial Links Mitte Eigenschaft Recht Oben Mitte Unten Werte der Eigenschaften Position absolut absolut absolut absolut absolut absolut absolut Breite px px px px px px px Oben px px px px px % Auto Links px px % Auto px px px Auto Auto px Auto Auto px Rechts Unten 3.10.

  • PAGE 53

    Kompozer Im CSS-Editor sind alle wichtigen Eigenschaften unter dem Box-Register (Siehe Abschnitt 4.2.1.4) erreichbar. Die erforderlichen Eigenschaften und die Werte sehen Sie in der Tabelle. Eingabefeld Wert Position absolut Breite px Offset – Oben px oder % Offset - Links px oder % Offset – Rechts px oder % Offset– Unten px oder % Z-Index Ganzzahl Indem Sie Klassen verwenden, stehen Ihnen weitere Optionen zur Verfügung, die Sie nicht über die Symbolleiste erreichen können.

  • PAGE 54

    Kompozer Lassen Sie das Kontrollkästchen angekreuzt und stellen Sie den Stil, die Breite und die Farbe für den oberen Rand ein. Wenn alle Ränder das gleiche Aussehen haben sollen, klicken Sie auf OK. Anderenfalls entfernen Sie das Häkchen und legen die Einstellungen für die anderen Seiten einzeln fest. Diese Methode deckt allerdings nicht alle Möglichkeiten der Rahmengestaltung wie z. B. das Padding ab.

  • PAGE 55

    Kompozer 3. Im Dialog gehen Sie zum Registerblatt Hintergrund. 4. Über den Button rechts neben dem Feld Farbe starten Sie den Farbwähler. Die Inline-Styles erlauben Ihnen, einige Eigenschaften für die komplette Seite einzustellen. Dieses schließt Text-, Ränder- und Box-Eigenschaften ein. Daher haben Sie einfache Möglichkeit zur Formatierung einer vollständigen Seite.

  • PAGE 56

    Kompozer Durch Inline Styles kann die Body-Breite kleiner eingestellt werden als die volle Fensterbreite. In diesem Fall kann die Seite im Fenster zentriert werden. Eine Seite im Fenster zentrieren: 1. Klicken Sie in der Statuszeile auf den gelben Body-Tag. Der komplette Inhalt wird markiert. 2. Rechtsklick auf den Body-Tag in der Statuszeile 3. Wählen Sie Inline Styles und dann das Box-Registerblatt 4. Im Breite-Feld wählen Sie die gewünschte Breite der Seite aus 5.

  • PAGE 57

    Kompozer sätze werden gekennzeichnet, indem man eine speziell zu diesem Zweck erzeugte benannte Klasse (Abschnitt 4.2.3) auf sie anwendet. Wahlweise kann ein

    (Abschnitt 4.5), dem eine benannte Klasse zugewiesen worden ist, benutzt werden. Das Erzeugen und das Verwenden eines Verzeichnisse auf diese Art hat den Vorteil, dass Änderungen an der Seite automatisch berücksichtigt werden. Eine Verzeichnis arbeitet nur innerhalb der Seite, in der es sich befindet.

  • PAGE 58

    Kompozer Eine Verzeichnis löschen. 1. Es ist nicht notwendig, den Cursor in das Verzeichnis zu setzen. 2. Klicken Sie auf Einfügen-Inhaltsverzeichnis-Entfernen. 3.13.3 Methoden Kompozer bildet das Inhaltsverzeichnis wahlweise als nummerierte oder unsortierte Liste (Siehe Abschnitt 3.4.4). Diese Listen können geschachtelt werden, um die erforderte Struktur zu erreichen. Das bedeutet, dass jedes Niveau im Verhältnis zu dem vorhergehenden eingerückt wird.

  • PAGE 59

    Kompozer Anmerkung: Wenn beim Anklicken eines Elements dieses nicht markiert wird, betätigen Sie die Strg-Taste und klicken erneut. Editiermodus-Symbolleiste Markiertes Element Abbildung 1 Die Auswahl der Ansicht über die Editiermodus-Symbolleiste und das Markieren eines Elements über die Statusleiste Sie sehen auch, dass das Element in der Statuszeile markiert wird (Siehe Abbildung). Wenn Sie zur Quelltext-Ansicht wechseln, bleibt das Element markiert.

  • PAGE 60

    Kompozer Dieser Modus ist für die bestimmt, die mit der Kodierung in HTML vertraut sind. In diesem Modus ist Kompozer nicht einfach ein Texteditor. Beim Umschalten zu einer anderen Ansicht führt Kompozer Überprüfungen des Codes durch, um sicherzugehen, dass er gültig ist. Wenn er es nicht ist, wird er repariert. Kompozer hat Mutmaßungen darüber angestellt, was beabsichtigt wurde.

  • PAGE 61

    Kompozer Geeignete Aktionen für vollständige Blöcke sind Drag'n'Drop oder die Zuweisung einer Klasse. Markieren über die Statuszeile Die Statuszeile ist sehr nützliches Werkzeug. Klicken Sie im Bearbeitungsfenster auf ein beliebiges Textobjekt oder ein Bild, dann in der Statuszeile auf das Tag, das am weitesten rechts steht. Das Objekt ist markiert. Links von diesem Tag sehen Sie Elemente, die in der Dokumentenhierarchie höher stehen. Ein Klick auf diese Tags markiert die dazugehörenden Elemente.

  • PAGE 62

    Kompozer pozer gibt es einige Eigenarten, die der Benutzer beachten sollte, bevor er ausgefeilte Seiten publiziert. Wir beschäftigen uns später damit. Eine vollständige Einführung und Referenz finden Sie unter: http://de.wikipedia.org/wiki/Cascading_Style_Sheets 4.1.1 Die Stärken von Styles Styles bestimmen, wie bestimmte Seitenelemente auf dem Schirm oder im Druck erscheinen. Diese Anleitung beschränkt sich auf die Gesichtspunkte der Bildschirmgestaltung.

  • PAGE 63

    Kompozer 4.1.3.2 Interne Styles Die zweite Möglichkeit, Styles zu verwenden ist die Einbettung einer Liste von StyleDefinitionen innerhalb des HEAD-ABSCHNITTS einer Seite. Diese Definitionen werden Style-Regeln oder einfach Regeln genannt. Diese Regeln können auf zwei Arten deklariert werden. Die erste trifft auf alle Elemente eines bestimmten Tags zu (z.B. p, h1, table), die zweite ist die Klasse, wie oben besprochen.

  • PAGE 64

    Kompozer Wie kann das genutzt werden? Möglicherweise setzt Ihre Site einen Style eines externen Stylesheets ein. Stellen Sie sich vor, Sie haben eine Seite über Verhalten in Notsituationen und Sie entscheiden sich dafür, dass alle Absätze in Rot gesetzt sein sollten. Sie fügen einfach einen internen Style auf dieser Seite hinzu, die den

    -Tag rot definiert, aber verbinden die Seite mit Ihrem normalen Stylesheet.

  • PAGE 65

    Kompozer Style-Begriffe Einfache Regel mit einer Deklaration p{ Regel mit 2 Deklarationen p { font-family : Arial, sans-serif ; font;} size : medium Regel mit 2 Selektoren : h1 , h2 Color { ;} #990000 Regel mit Klassenselektor .

  • PAGE 66

    Kompozer Um Styles für ein Element zu entwerfen: 1. Klicken Sie in der Bearbeiten-Symbolleiste auf den Button CSS Editor. Alternativ wählen Sie im Menü Extras den CSS-Editor. Das CSS-Stylesheet-Fenster öffnet sich. 2. Klicken Sie auf das Paletten-Symbol. In dem Fenster 'Sheets und Regeln' sehen Sie jetzt ein 'Internes Stylesheet'. 3. Markieren Sie den Radiobutton 'Style-Regel für Elemententyp'. 4. Klicken Sie auf den Pfeil neben dem leeren Eingabefeld. Sie sehen eine Liste häufig gebrauchter HTML-Elemente.

  • PAGE 67

    Kompozer Definition der Styles 1. Suchen Sie der Reihe nach die Registerblätter 'Text', 'Hintergrund', 'Begrenzungen' usw. auf und gestalten Sie die Elemente nach Ihren Wünschen. Der folgende Abschnitt legt detailliert dar, wie Sie vorgehen müssen. 2. Kehren Sie zum Registerblatt 'Allgemein' zurück, um die komplette Style-Definition zu sehen, die Sie für den Selektor gesetzt haben. 3.

  • PAGE 68

    Kompozer 4.2.1.1 Das Registerblatt Text Auf gut deutsch werden font families Schriftarten genannt. CSS kennzeichnet sie immer als Schriftfamilien. Die richtige drucktechnische(typographische) Bestimmung ist 'Schriftbild'.

  • PAGE 69

    Kompozer Einen Font-Set bilden: Beachten Sie die Struktur der Vordefiniert-Sets. Die Listen werden gebildet durch Schriftarten, die durch Kommata getrennt werden und immer mit einem generischen Typ (Serif, Sans-Serif oder Monospaced) enden. 1. Wählen Sie Benutzerdefiniert 2. Aus der DropDown-Liste wählen Sie einen. 3. Dann in das Eingabefeld klicken, ein Komma und ein Leerzeichen und Ihre bevorzugten Schrifttypen eingeben. 4. Verfahren Sie ebenso mit weiteren Schriftarten. 5.

  • PAGE 70

    Kompozer ming behindern oder schwer vorhersehbare Schriftgrößen zur Folge haben. Der letzte Abschnitt der benannten Schriftgrößen (beginnend mit noch kleiner) ist vielleicht am sinnvollsten, alternativ können Sie die Prozentangabe oder die em-Größen wählen. Wenn Sie die Größe ändern, können Sie die Auswirkung direkt auf Ihrer Seite sehen. Absolute and relative Größen. Im Allgemeinen haben 'normal', 100% und 1em dieselbe Größe, wenn sie für das Element gesetzt sind.

  • PAGE 71

    Kompozer einer Division positioniert. Bei einer der Tabellen und einer der Zellen wurde ein Schriftgrad angeben, bei den anderen nicht. Text in Division. Größe nicht angegeben – 'vererbt' Text In Tabelle. Größe nicht angegeben. Geerbt vom DIV Text in zweiter Tabelle Größe dieser Zelle 120% gesetzt Textgröße für die Tabelle auf 120% gesetzt Größe für die Zelle nicht angegeben, geerbt von der Tabelle Tabelle 1 Beispiel für Regelvererbung Nicht alle Größenangaben lassen sich auf diese Weise skalieren.

  • PAGE 72

    Kompozer Die nächste Option ist ein Klick auf den 'Regenbogen'-Regler. Die gewählte Farbe erscheint in dem Quadrat. Feinabstimmungen können mit den RGB oder HSB Werten vorgenommen werden. Ein Feld mit der Aufschrift Hex zeigt den Hexadezimalwert der Farbe. Sie können diesen Wert sogar ändern, ohne den Farbwähler Textfarbe zu öffnen, indem Sie im Text-Register den Hex-Wert (hinter einem #) neben dem Farbfeld ändern. Das Farbfeld zeigt Ihnen sofort die neue Farbe an.

  • PAGE 73

    Kompozer Warnung: Die Transparenz-Option nutzt eine Eigenschaft, die nicht in der CSS2Spezifikation enthalten ist. Sie ist in den verschiedenen Browsern entweder überhaupt nicht oder nur ungenügend implementiert. 4.2.1.3 Ränder Elemente können eingefasst werden von Rahmenlinien. Die Wahlmöglichkeiten bieten ein hohes Maß an Flexibilität. Linienart, -stärke und -farbe können für jede Seite des Rahmen getrennt eingestellt werden.

  • PAGE 74

    Kompozer In den Eingabefeldern, die ein Maß erfordern, schreiben Sie zunächst die Zahl, dann wählen Sie die Maßeinheit über das DropDown-Feld. Außenabstand (Margin)stellt den Abstand zwischen den Boxen der Elemente und den umgebenden oder benachbarten Boxen ein.

  • PAGE 75

    Kompozer Position, Offset und Z-index sind die Parameter, die sich auf dem Gebrauch von Layer beziehen. Diese sind in Abschnitt 3.10.6 behandelt worden. 4.2.2 Styling mehrerer Elemente Anstatt Styles für ein Element nacheinander einzustellen, kann es einfacher sein, mehrere gleichzeitig zu bearbeiten. Möglicherweise sind alle Ihre Überschriften in einer Schriftart (z.B. Serif) und alle anderen Elemente in einer anderen (Sans-Serif).

  • PAGE 76

    Kompozer auch immer es auf einer Seite gefunden wird. Dadurch wird eine Konsistenz innerhalb eines Dokumentes bewirkt, aber möglicherweise kommt auch ein Anflug von Langeweile auf! Sie können Ihre eigenen Styles auch so definieren, dass Sie sie selektiv anwenden. Diese Styles werden als Klassen bezeichnet. Eine Klasse einrichten: 1. Öffnen Sie den CSS Editor, und falls erforderlich, legen Sie ein Stylesheet (Siehe Abschnitt 4.2.1) an. 2. Markieren Sie das Stylesheet im Fenster 'Sheets und Regeln'. 3.

  • PAGE 77

    Kompozer 7. Klicken Sie auf Style-Regel erstellen. Sie werden den Namen Ihrer neuen Klasse im linken Fenster sehen und feststellen, dass dem Namen ein Punkt vorangestellt wird. 8. Alles weitere geschieht so, wie oben beschrieben, mit einer Ausnahme. Bei der bisherigen Arbeitsweise konnten Sie den Effekt Ihrer Styles sofort auf Ihrer Seite beobachten, wenn Sie eine Seite hatten, die die entsprechenden Elemente benutzte).

  • PAGE 78

    Kompozer reits angewandten Klasse geschieht durch das erneute Anklicken in der DropDownListe. 4. Das Resultat der Klassenzuweisung kann in jeder Ansicht überprüft werden. Anmerkung: Obwohl Kompozer kein Browser ist, emuliert es die Browser-Darstellung recht gut. Jedoch werden Styles, die Links zugewiesen werden, noch nicht korrekt dargestellt. Klasse zuweisen - Methode 2 Anmerkung: Diese Methode kann nicht auf so genannte Inline section (mit -Tags) angewandt werden. 1. Schließen Sie den CaScadeS. 2.

  • PAGE 79

    Kompozer Klicken Sie sie erneut an, dadurch wird sie deaktiviert. Wählen Sie dann die Klasse, die Sie nutzen möchten. Anmerkung: Es können mehrere Klassen auf ein Element angewandt werden. Wenn Sie so verfahren, müssen Sie sicherstellen, dass die Klassen-Eigenschaften nicht im Konflikt zueinander stehen. Die meisten Leute werden vermutlich jeweils nur eine Klasse zur Zeit anzuwenden. Sie müssen überprüfen, dass Sie nicht ungewollt mehrere Klassen anwenden. 4.2.3.

  • PAGE 80

    Kompozer 4. Betätigen Sie die Schaltfläche Stylesheet erstellen. Das neue Stylesheet erscheint im linken Fenster als Internes Stylesheet, es muss daher noch umgewandelt und als Datei gespeichert werden. 5. Klicken Sie wieder auf den Namen des Stylesheets Kompozer-Anleitung Version 1.01 vom 07.06.

  • PAGE 81

    Kompozer 6. Klicken Sie auf Stylesheet exportieren und auf externes Stylesheet umstellen. 7. Sie werden aufgefordert, dem Stylesheet einen Namen zu geben. Sie sollten die Erweiterung css angeben und vorzugsweise im gleichen Ordner wie Ihre Seite speichern. 8. Drücken Sie im Speichern-Dialog auf Speichern. Wenn das externe Stylesheet angelegt wurde, können Sie dort Regeln anlegen wie in einem internen Stylesheet. Wenn wir interne Styles verwenden, werden sie auf unserer Seite im HEAD-Abschnitt eingetragen.

  • PAGE 82

    Kompozer 4.2.4.2 Ändern Sie ein internes Stylesheet in ein externes Stylesheet Wenn Sie bereits Ihre Seite mit internen Styles versehen haben, können Sie sie in ein externes Stylesheet umwandeln und mit dem Dokument verbinden. 1. Öffnen Sie den CSS Editor. 2. Im Fenster Sheets und Regeln markieren Sie das Stylesheet. 3. Klicken auf der Allgemein-Registerkarte auf Stylesheet exportieren und auf externes Stylesheet umstellen. Der weitere Vorgang wurde bereits weiter oben beschrieben. 4.2.4.

  • PAGE 83

    Kompozer Warnung: Wenn das Stylesheet mit anderen Seiten verbunden ist, erkennen diese die Änderungen nicht, wenn sie derzeit geöffnet sind. Erst wenn sie geschlossen und wieder geöffnet werden, können die aktualisierten Styles verwendet werden. 4.2.5 Andere Style Selektoren 4.2.5.1 Einleitung Element Styles (Abschnitt 4.2.1) und benannte Klassen (Abschnitt 4.2.3) sind die zwei Haupt-Selektoren, die für Styles benutzt werden.

  • PAGE 84

    Kompozer a:link für alle noch nicht besuchten Verbindungen a:visited für Verbindungen, die bereits besucht worden sind a:hover für einen Link, über dem der Cursor schwebt Anmerkung: Die folgenden Verfahren basieren auf dem Gebrauch der internen Stylesheets. Ähnlich ist das Verfahren mit externen Stylesheets. Link Pseudo-Klassen einrichten 1. Öffnen Sie den CSS Editor, und falls erforderlich, legen Sie ein Stylesheet (Siehe Abschnitt 4.2.1) an. 2.

  • PAGE 85

    Kompozer Der CaScadeS CSS-Editor trägt Styles in der Reihenfolge des Einrichtens ein. Die Reihenfolge kann verändert werden, indem das Element markiert und mit den Pfeilen oberhalb des 'Sheets und Regeln'-Fensters verschoben wird. Anmerkung: Diese Styles werden auf die Links automatisch angewandt. Sie müssen nicht wie Klassen manuell zugewiesen werden. 4.2.5.3 Styles für Formularelemente Formulare nach den eigenen Wünschen zu gestalten, kann den Einsatz von Styles für die Elemente erforderlich machen.

  • PAGE 86

    Kompozer 7. Sie erhalten jetzt ein Fenster mit der Überschrift 'Style-Regel' mit der Angabe des ausgewählten ID. Das Fenster listet die Style-Deklarationen diese Elementes aus, natürlich ist es jetzt noch leer. Tipp: ID-Namen müssen mit einem Buchstaben beginnen, ansonsten können Sie dieselben Zeichen verwenden wie in Klassennamen. Ein ID anwenden Obwohl im Prinzip IDS den Klassen ähneln, ist es nicht möglich, einen id über das Klassenauswahlfeld zuzuweisen. Der anzuwendende Methode ist aber einfach: 1.

  • PAGE 87

    Kompozer Warnung: Sie können jedes ID nur einmal auf einer Seite anwenden. Kompozer ab der Version 0.7.10 wird sicherstellen, dass das auch so geschieht. Wenn Sie einen ID anwenden, der bereits vergeben ist, wird keine Warnung gegeben, sondern der ID wird wie verlangt dem neuen Objekt zugewiesen und vom alten entfernt. 4.3 Löschen von Styles Der CSS Editor erlaubt Ihnen, Styles auch wieder zu entfernen.

  • PAGE 88

    Kompozer Das

    Element wurde bislang nur nebenbei erwähnt. Ein
    bestimmt einen Teil einer Seite, der eine Anzahl von Elementen enthält. In diesem Abschnitt wird keine vollständige Erklärung des
    -Elements vorgenommen. (In einem DIV werden Styles oft auf eine besondere Weise eingesetzt, dazu später mehr.) Es folgt vielmehr eine Beschreibung, wie man mit Kompozer
    erzeugt und nutzt. Andere Aspekte von
    gehen wahrscheinlich über das Interesse von Anfängern hinaus. 4.5.

  • PAGE 89

    Kompozer Tipp: Wenn Sie in die 'Falle' des letzten DIV auf der Seite getappt sind, gibt es einen 'Fluchtweg'. Klicken Sie auf den letzten Eintrag im DIV und dann auf den Marker für den DIV in der Statusleiste. Drücken Sie dann die PfeilUnten-Taste. Das wird den Cursor unterhalb des DIV positionieren, ihn jedoch nicht sichtbar machen. Unique divisions Ein allgemeiner Einsatz von DIVs gilt einzelnen Regionen einer Seite. Beispiele könnten ein Menü, eine Inhaltsübersicht oder der Haupttextbereicht sein.

  • PAGE 90

    Kompozer In der folgenden Abbildung sehen Sie unten einen

    -Bereich, dem die Regel divclas zugewiesen wurde, der obere Bereich erhielt keine Zuweisung. 4.5.3 Ein Layer mit DIV einrichten In Abschnitt 3.10.3 merkten wir an, dass die Layer in DIVs eingerichtet werden. Tatsächlich ist ein Layer einfach ein div, der Styles und eine Position hat, und vielleicht einen Z-Index. Wenn Sie mit Kompozer ein Layer legen , wird ein Inline-Style im
    -Tag eingefügt.

  • PAGE 91

    Kompozer 5 Skripte Skripte sind kurze Programme, die in HTML Dokumenten eingeschlossen sind (und folglich aus alphanumerischen Zeichen bestehen), die im Browser laufen und die Darstellung der Seiten auf verschiedene Weise ändern können. Skripte müssen in einer passende Skriptsprache geschrieben werden, aber diese ist nicht Teil der HTML-Spezifikation. Das Maß der Unterstützung für Skript-Sprachen hängt vom eingesetzten Browser bzw. Server ab.

  • PAGE 92

    Kompozer • Horizontale Linie. Setzt am markierten Punkt eine horizontale Linie über die Breite eines Blockes ein. Sie müssen es nicht bei dem einfachen Standardstil bewenden lassen, sondern können die Linie individuell gestalten. Sie können für die spezielle Formatierung eine Klasse definieren und auf die Linie anwenden. Alternativ erlaubt ein Doppelklick auf die Linie die Einstellung der 'Eigenschaften der horizontalen Linie', vornehmlich der Breite und der Höhe.

  • PAGE 93

    Kompozer • HTML. Erlaubt Ihnen, an beliebiger Stelle auf einer Seite HTML-Code per Hand einzugeben. (wenn Sie Code im HEAD-Bereich hinzufügen möchten, müssen Sie in die Quelltext-Ansicht wechseln.) Anmerkung: Wenn Sie HTML in Ihre Seite einsetzen möchten, ist dieses vermutlich die sicherste Weise. Während Sie den Code eingeben, führt Kompozer einige Überprüfungen durch und stellt sicher, dass das Resultat gültiges HTML ist. Das Editieren in der Quellansicht (siehe Abschnitt 3.

  • PAGE 94

    Kompozer mehrere ähnliche Punkte hinzugefügt werden können. Blockelemente werden entsprechend den normalen Blockregeln formatiert. Ein Fließtext-Bereich befindet sich in einem Block in einem Text, z. B. um ein oder zwei Wörter in einem Absatz auszutauschen. Jedem editierbaren Bereich muss ein Name zugewiesen werden. Dieser erscheint als Label, und auch als Ausgangstext, der später im Dokument ersetzt wird. 7.

  • PAGE 95

    Kompozer 4. Klick auf Datei - Speichern unter. Der Dateityp HTML-Template wird automatisch eingetragen. 5. Benennen und Speichern wie üblich. 7.5 Vorlagendetails einrichten Der vorformulierte Text wird geschrieben und formatiert wie auf jeder anderen normalen Seite. Im weiteren Verlauf kann dieser Inhalt nicht durch den Benutzer verändert werden. Der Inhalt der Seite – Textbaustein (boilerplate) und Beispieltexte der editierbaren Bereiche sollten bereits eingetragen und formatiert sein.

  • PAGE 96

    Kompozer Warnung: In Kompozer 0.7.10 ist diese letzte Option deaktiviert Die editierbaren Blockbereich sehen aus wie in dem folgenden Beispiel. Einen Fließtext-Editierbereich einrichten 1. Markieren Sie die Textpassage, die editierbar werden soll. 2. Klicken Sie auf Einfügen - Vorlagen - Editierbaren Bereich einfügen 3. In dem Fenster 'Fügt einen editierbaren Bereich ein' geben Sie dem Block einen eindeutigen Namen. 4. Lassen Sie das Kontrollkästchen Textfluss aktiviert. 5.

  • PAGE 97

    Kompozer Wenn Sie die Arbeiten beendet haben, speichern Sie die Vorlage wie im Abschnitt 7.3 beschrieben. Die Abbildung zeigt die Vorlage in diesem Stadium. Die Abbildung veranschaulicht eine Vorlage mit mehreren Fließtexten (Künstler, Ort und Literaturgattung), einem wiederholbaren editierbaren Bereich (Werke) und einem optionalen Bereich (Probetext). Sie sehen, dass die Fliesstextbereiche in -Abschnitte eingeschlossen werden. 7.

  • PAGE 98

    Kompozer Eine neue Seite eröffnen: 1. Klicken Sie auf Datei Neu 2. Aktivieren Sie die Optionsschaltfläche Eine neue Seite, basierend auf einer Vorlage 3. Wählen Sie über den DurchsuchenKnopf die Vorlage Anmerkung: Vorlagen haben die Erweiterung mzt. 4. Klicken Sie dann auf Erstellen. Die neue Seite enthält: • Den festen Text (boilerplate). • Label der editierbaren Bereiche in farbigen Registern (mit abgerundeten Ecken). • Beispieltexte in den gepunktete Rahmen um die editierbaren Bereiche.

  • PAGE 99

    Kompozer In den ersten beiden Flusstext-Bereichen wurde der Fülltext ersetzt. Die Markierungen verschwinden daher. Der dritte Flusstext-Bereich wurde noch nicht bearbeitet. Der Bereich 'Werke' wurde vervielfältigt, konnte aber noch nicht ausgefüllt werden. Der editierbare Blockbereich wurde ausgefüllt. Die Seite ist in der HTML-Tag-Ansicht dargestellt worden, damit die und

    Tags sichtbar sind. Warnung: Bei Kompozer 0.7.10 kann der Text der wiederholbare Bereiche nicht editiert werden.

  • PAGE 100

    Kompozer Die Seitenverwaltung kann ein- oder ausgeschaltet werden durch die Funktionstaste F9 oder über das Menü Ansicht und das Kommando Anzeigen/Verstecken - Seitenverwaltung Die Seitenverwaltung kann Sites bearbeiten, unabhängig davon, ob sie auf Ihrer lokalen Maschine oder auf einem Remote-Server liegen. Im letzten Fall, wenn Sie über eine Wählleitung kommunizieren, stellt der Site-Manager die Verbindung für Sie her.

  • PAGE 101

    Kompozer Tragen Sie in den anderen Feldern (Server-Informationen, Benutzernamen usw.) nichts ein. Zurück in der Seitenverwaltung sollte in der Spalte Name die neue Site aufgeführt sein. Durch einen Klick auf das Pluszeichen kann der Ordner erweitert werden, um seinen Inhalt zu zeigen. 8.3 Site-Manager-Funktionen Das Hauptfenster verzeichnet alle verwalteten Sites. Diejenigen, die – durch Klick auf das Pluszeichen - expandiert worden sind, zeigen auch alle enthaltenen Dateien. (Siehe Abbildung oben.

  • PAGE 102

    Kompozer Für die Dateianzeige kann bestimmt werden, ob die Dateigröße und das Änderungsdatum dargestellt wird. Um diese Einstellung vorzunehmen, klicken Sie auf das Symbol ganz rechts in der Tabellenüberschrift des Fensters und aktivieren oder deaktivieren Sie im Menü die Option. Vielleicht müssen Sie das Seitenverwaltungsfenster verbreitern, um das Symbol zu erreichen. (Siehe die Abbildung unten) Es ist nicht möglich, die Sortierung der Liste zu ändern.

  • PAGE 103

    Kompozer Warnung: Denken Sie daran, dass eine mögliche lokale Firewall Kompozer den Zugang zur Site ermöglichen muss. Unglücklicherweise stellt Kompozer kaum Hilfe bei der Einrichtung der Sites zur Verfügung 9 Einstellungen 9.1 Voreinstellungen Kompozer bietet Ihnen einige Möglichkeiten, die Arbeitsweise des Programms individuell anzupassen. Einige dieser Optionen sind im Menü Extras – Einstellungen zu finden.

  • PAGE 104

    Kompozer Extras Einstellungen Seiteneinstellungen Autor kein Eintrag Standardfarben des Lesers aktiviert Hintergrundbild kein Eintrag Sprache kein Eintrag Schreibrichtung keine Festlegung Zeichensatz ISO-8859-1 Extras Einstellungen Erweitert Proxys für den Zugriff auf das Internet konfigurieren Direkte Verbindung zum Internet HTML-Sprache HTML 4 DTD Strict ENTER-Taste in einem Absatz erzeugt einen neuen Absatz aktiviert Unterstreiche falsch geschriebene Wörter aktiviert Die folge

  • PAGE 105

    Kompozer Wenn Sie den Quellcode neu formatieren, werden einige Tags eingerückt um die Lesbarkeit zu verbessern. Es werden aber auch Leerzeilen eingefügt. Beachten Sie, dass die Quellansicht und der aktuelle Dateiinhalt nicht exakt übereinstimme. Formatierung des Original-Quelltextes erhalten fügt eine Anzahl von Leerzeilen, besonders im -Bereich ein, aber wenn die Dateien z.B. zu einem HTML-Validator übertragen werden, stimmen die Zeilennummer (für die Fehlermeldungen) ungefähr überein.

  • PAGE 106

    Kompozer wenden. Wenn die Option nicht gewählt wurde, berücksichtig Kompozer keine Styles und verwendet eine Schriftart aus der Liste in dem oberen Teil dieses Dialogblattes. Die Boxen für die Größen und die Bildschirmauflösung scheinen nicht zu funktionieren. Seiteneinstellungen Hier werden einige Einstellungen für die Abfassung neuer Seiten festgelegt. (Andere finden Sie im 'Neue Seite oder Vorlage erstellen'-Fenster, das erscheint, wenn Sie über das Menü 'Datei – Neu' gehen.

  • PAGE 107

    Kompozer Hintergrundbild Geben Sie hier eine Bilddatei ein für alle Seiten Sprache Die Hauptsprache für die Seite sollte angegeben werden, um automatischen Tools wie Sprachsynthesizern die Arbeit zu erleichtern. Viele Sprachen bieten regionale Alternativen, wählen Sie diese oder eine allgemeine. Schreibrichtung Üblicherweise kann hier die Voreinstellung 'Keine Richtung angegeben' übernommen werden. Die Auswahl der Sprache bestimmt auch die Schreibrichtung.

  • PAGE 108

    Kompozer HTML Die HTML-Sprache und der DocType kann nach Belieben gesetzt werden. Wir empfehlen jedoch Strict. Anmerkung: Wahrscheinlich wäre diese Einstellung besser aufgehoben im Register 'Seiteneinstellungen'. Übrigens werden bereits bestehende Seiten nicht geändert. ENTER-Taste in einem Absatz erzeugt immer einen neuen Absatz Die Wirkung der ENTER-Taste in oder am Ende eines Absatz beschreibt die folgende Tabelle.

  • PAGE 109

    Kompozer 9.3 Symbolleisten Sie können mehrere Symbolleisten einblenden oder verstecken. Auf der Menüleiste wählen Sie Ansicht – Anzeigen/Verstecken. Entscheiden Sie dann durch Anklicken, welche Symbolleisten Sie angezeigt oder ausgeblendet haben möchten. Sie können allerdings nicht die Menüleiste ausblenden. Sie können den Inhalt einiger Symbolleisten ändern. Die Änderung können Sie durch einen Rechtsklick mit der Maus innerhalb der betreffenden Symbolleiste einleiten.

  • PAGE 110

    Kompozer Symbole der Bearbeitungssymbolleiste Neue Seite erstellen Lokale Datei öffnen Datei lokal speichern Datei publizieren Vorschau im Browser Rückgängig Wiederherstellen Sprungmarke Link einfügen Grafik einfügen Tabelle einfügen Formular einfügen CSS-Editor Symbole der Format-Symbolleiste I Hervorhebung Stark hervorheben Nummerierung Aufzählung Einzug vergrößern Einzug verkleinern Definitionsausdruck Definitionsbeschreibung Text bzw.

  • PAGE 111

    Kompozer Menüs als Alternative Da die Benutzung der Bearbeitungssymbolleiste die einfachste Möglichkeit des Agieren ist, geht diese Anleitung allgemein davon aus, dass alle für diese Leiste vorgesehenen Symbole sichtbar sind. Wenn Sie die Bearbeitungs- oder die Formatsymbolleiste ausgeblendet haben, können Sie die Funktionen immer noch über die Menüleiste erreichen. Die entsprechenden Menübefehle werden in der Tabelle gezeigt.

  • PAGE 112

    Kompozer Eine Site zu veröffentlichen bedeutet das Transferieren der Site mit allen HTML-Seiten, den Bildern und den einbezogenen Stylesheets auf einen Web-Server, von dem aus sie weltweit erreicht werden kann. Dieser Prozess wird Hochladen oder Upload genannt. Vor dem Veröffentlichen gibt es einige Überprüfungen, die unbedingt durchgeführt werden sollten. 10.2 Überprüfung (Validierung) einer Site. Die Validierung bedeutet einfach das Prüfen, ob die Seite oder die Site wie beabsichtigt funktioniert.

  • PAGE 113

    Kompozer Gegenwärtig sollte die Minimalausstattung an Browsern zu Testzwecken beinhalten: Firefox (neueste Version) Opera (neueste Version) Safari Internet Explorer 6 und 7 Zwischen den letztgenannten gibt es Unterschiede und auch zu den anderen Browsern, so dass es sinnvoll ist, beide zu benutzen. Trotz der Verfügbarkeit der Version 7 bleibt zunächst der IE 6 der am weitesten verbreitete Browser, daher muss auch er verwendet werden. Tipp.

  • PAGE 114

    Kompozer Der Code ist gültig, das heißt, er entspricht HTML 4.01 Transitional. Um Seiten mit internen oder externen Stylesheets zu validieren, können die Validatoren unabhängig voneinander verwendet werden. Die URLs werden im Anhang angegeben (Anhang 2). Die Seiten können entweder von der lokalen Platte oder nach dem Upload auf den Webserver auf Gültigkeit überprüft werden.

  • PAGE 115

    Kompozer sen Sie über das Menü Bearbeiten-Publizierungseinstellungen folgende Daten eingeben: • Der Cursor ist im Seite-Namen-Feld. Tragen Sie den Namen ein, mit dem Sie Ihre Site verwalten möchten. • HTTP Adresse Ihrer Homepage – dieses ist die URL Ihrer Site. Erhalten Sie von Ihrem Provider (Siehe Tipps). • Publizierungs-URL– das ist die FTP Adresse, zu der Sie die Seiten senden. • Benutzername – erhalten Sie von Ihrem Provider. • Passwort – erhalten Sie von Ihrem Provider.

  • PAGE 116

    Kompozer 4. Wenn es das erste Mal ist, dass Sie die Seite hochladen und diese Bilder oder externe Stylesheets einschließt, markieren Sie das Kontrollkästchen Grafiken und andere Dateien hinzufügen. (wenn die Seite nicht zum ersten Mal hochgeladen wird und die Bildoder Stylesheet-Dateien nicht geändert wurden, kann der Haken entfernt werden). Die Daten werden in dem gleichen Verzeichnis wie die Seite abgelegt.

  • PAGE 117

    Kompozer 8. Falls das Publizieren nicht erfolgreich war, erhalten Sie eine Fehlermeldung. Eine mögliche Ursache kann eine Firewall sein, die den Zugang zum Server sperrt Die Problemlösungs-Schaltfläche führt Sie zum Kompozer Hilfesystem, das aber zu diesem Zeitpunkt gegenwärtig keine wesentlichen Aussagen bereithält.

  • PAGE 118

    Kompozer FTP File Transfer Protocool. Wird benutzt zum Upload von Webseiten. Handle Symbole, normalerweise kleine Quadrate, an den Rändern von Boxen, die der Größenänderung oder Positionierung dienen HTML Hypertext Markup Language. Die Publizierungssprache des World Wide Web ISP Internet Service Provider Mozilla Sammelbegriff für eine Anzahl von ähnlichen Browsern einschließlich Netscape 6 und neuer, Mozilla und Firefox. MSIE Microsoft Internet Explorer.

  • PAGE 119

    Kompozer den mit spitzen Klammern eingerahmt. Z. B.

    und

    Transitional Siehe Deprecated UCS Universal character set. Enthält etwa 100.000 Zeichen. Upload Der Transport von Webseiten von Ihrem lokalen Computer zum Server des Presence Providers URL Uniform Resource Locator. Die Netzadresse einer Seite oder eines anderen Objekts World- Wide Web Consortium http://www.w3.org W3C A2 A3 World Wide Web Consortium http://www.w3.

  • PAGE 120

    Kompozer HTML Strict XHTML Transitional XHTML Strict

  • PAGE 121

    Kompozer Wenn mit bereits bestehenden Seiten gearbeitet wird, kann Kompozer mit jedem unterstützten DocType umgehen. Sie können diesen DocType weiter verwenden, vermeiden sollten Sie aber den Wechsel zu einem anderen DocType. Wenn Sie ein neues Dokument anlegen, empfehle ich die Verwendung von HTML 4.01 strict. Ich empfehle nicht die XHTML 1.0 DocType declaration (Transitional oder Strict), es sei denn dass Sie Ihre Webseite Inhalte vom Typ application/xhtml+xml benötigt.

  • PAGE 122

    Kompozer Beim Erstellen und Editieren der Dokumente erzeugt Kompozer Code, der dem deklarierten Doctype entspricht, es werden nur die zulässigen Elemente und Attribute verwendet. Das heißt, dass einige Eigenschaften, abhängig von der Art des Dokumentes, nicht zur Verfügung stehen können. Üblicherweise kann dann der Einsatz von CSS-Styles den Effekt zu erzielen, der mit einem HTML Attribut nicht zugänglich ist. Kompozer wandelt nicht von einem Doctype in einen anderen um.

  • PAGE 123

    Kompozer Mit dem ZIP-Archiv 1. Laden Sie die Datei kompozer-0.7.10-win32.zip von der Download-Seite 2. Speichern Sie die Datei an einem beliebigen Ort, vielleicht in 'Eigene Dateien\Downloads'. Die Erweiterung ist 'zip'. 3. Entscheiden Sie sich für einen Ordner, in dem das Programm installiert werden soll. Empfehlung: 'C:\Programme' 4. Führen Sie einen Doppelklick auf die 'zip'-Datei aus und extrahieren Sie die Dateien in dem gewünschten Ordner. 5. Suchen Sie in diesem Ordner die Datei `kompozer.exe'. 6.

  • PAGE 124

    Kompozer 6. Rekonstruieren Sie die Einstellungen für den Site-Manager und das Publishing. A4.3 Erweiterungen installieren Es gibt eine Anzahl von Erweiterungen für Kompozer einschließlich alternativer Wörterbücher. Erweiterungen werden anders als normale Programme installiert. Das Verfahren ist wie folgt: 1. Suchen Sie die Webseite auf, von der die Erweiterung heruntergeladen werden kann 2.

  • PAGE 125

    Kompozer 3. In dem Eigenschaften-Fenster sehen Sie im Feld Ziel z. B. den Eintrag "C:\Programme\Kompozer\kompozer. exe". 4. Änderung Sie den Eintrag, indem Sie ein Leerzeichen und "-p" hinzufügen. Das Ergebnis soll dann so aussehen: "C:\Programme\Kompozer\kompoz er.exe" -p Wenn Sie mehr als eine Verknüpfung verwenden, können Sie diese auf die gleiche Weise bearbeiten. Beim nächsten Programmstart, werden Sie jetzt folgendes Dialogblatt sehen .

  • PAGE 126

    Kompozer Sie können auch den Ordner auswählen, in dem Sie die Dateien des Profils speichern möchten. Wenn Sie einen Unterordner in "Eigene Dateien" bestimmen, erleichtern Sie sich damit die regelmäßigen Backups. Anmerkung: Sie sollten für jedes Profil einen eigenen Ordner einrichten. Sie können in dem Dialog "Choose User Profile" auch Profile umbenennen und löschen. Bevor Sie zusätzliche Profile hinzufügen, ist das Standard-Profil jenes, das Sie bislang verwendeten.

  • PAGE 127

    Kompozer A6 Zeichencodierung A6.1 Einführung Encoding bezieht sich darauf, wie die Zeichen der Quelldatei einer Webseite für die Übertragung über das Web codiert werden. Größtenteils kann der Autor sich darauf verlassen, dass Kompozer oder die Browser die Details regeln. Es sind Optionen verfügbar, mit denen der Autor in einigen Fällen die Datei optimieren, um die Funktionalität zu beeinflussen. A6.2 Quickstart Kompozer verwendet ISO-8859-1 als Standard-Codierung mit den folgenden Einstellungen.

  • PAGE 128

    Kompozer • Aus dem Menü Extras wählen Sie Einstellungen und dann Erweitert Im Bereich "Spezielle Zeichen" überprüfen Sie die Einstellung bei Die folgenden Zeichen als Entitys ausgeben: "Nur & < > und nicht umbrechbare Leerzeichen" Kompozer-Anleitung Version 1.01 vom 07.06.

  • PAGE 129

    Kompozer • Für die zwei Kontrollkästchen darunter gilt: Keine Kodierung von > außerhalb von Attributen Kein Haken bei Haken bei Keine Kodierung von Spezialzeichen in Attributen. Diese Einstellungen sind korrekt für englischsprachige Seiten und – obwohl nicht ganz optimal – für die meisten anderen Sprachen in West- und Nordeuropa. Wenn Sie eine andere Sprache verwenden, kann eine andere Wahl als ISO-8859 angemessen sein. Kompozer bietet das komplette verfügbare Spektrum an.

  • PAGE 130

    Kompozer Um das zu umzusetzen, ist es klar, das mehr als 256 Zeichen erforderlich sind, obwohl nur 256 Speicherstellen (darunter eine Reihe von Steuerzeichen) verfügbar sind, um sie zu anzusprechen. Die Zeichen, die erforderlich sind, alle Zeichensätze herzustellen werden aus einem viel größeren Satz herangezogen. A6.3.3 Universal Character Set Das Unicode-Konsortium [Ref 17] hat eine universale Zeichenmenge (UCS) standardisiert, d. h.

  • PAGE 131

    Kompozer Tabelle A6.3.2 ASCII und griechische Zeichen A6.3.5 Zeichenreferenzen ISO-8859 verwendet ein einzelnes Byte pro Zeichen, um alle in einer Sprache allgemein erwarteten Zeichen zu präsentieren, aber es kann sich ergeben, ungewöhnliche Zeichen darzustellen. HTML stellt zwei Mechanismen - Character entity references (Entitäten) und numerische Zeichen-Referenzen zur Verfügung. Durch die Anwendung dieser Methoden kann jedes Zeichen im UCS erreicht werden.

  • PAGE 132

    Kompozer halb dieses Bereichs liegen, um derart verschlüsselt zu werden. Tabelle A6.3-3 zeigt einige der häufig verwendeten Zeichen, darunter auch einige ASCII-Zeichen. Zeichen Entity Numeric character reference € € € € < < < < > > > > × × × × ÷ ÷ ÷ ÷ & & & & " " " " no-break space       Tabelle A6.

  • PAGE 133

    Kompozer doch wesentlich. Mit UTF-Verschlüsselung können alle Zeichen als korrekte Bildzeichen dargestellt werden, so dass das Problem vermieden wird. A6.3.7 Symbole Traditionell haben sich Computer auf spezielle Schriftarten wie 'Symbol' oder 'Wingdings' gestützt, um Symbole zu erzeugen. Das ist auf Webseiten nicht notwendig.

  • PAGE 134

    Kompozer 3. Wenn Sie ein besonderes Symbol oft verwenden, kann es leichter sein, es durch einen Shortkey einzufügen. Mehrere Zeichen können auf diese Weise eingefügt werden. Bei diesen Symbolen wird in der rechten unteren Ecke der Zeichentabelle die Tastenkombination angezeigt. Das Eurosymbol kann z. B. eingefügt werden über die Kombination ALT+0128, wobei aber die Zahlen über den Ziffernblock eingegeben werden müssen. 4.

  • PAGE 135

    Kompozer Tabelle A6.3-4 Einige nützliche Symbole Symbolname Symbol Code Unicode En dash – alt+0150 U+2013 Em dash — alt+0151 U+2014 ellipsis ...

  • PAGE 136

    Kompozer Die Überprüfung für die Unterstützung ist schwieriger, wenn ungewöhnliche Zeichen verlangt werden. Kompatible Schriftarten müssen auf dem Computer jedes Besuchers installiert werden. Wenn in einer Formatvorlage die Schriftart-Familie als eine vordefinierte Liste von Schriftart-Familiennamen angegeben wird (wie es sein sollte), sollten idealerweise alle Schriftarten in der Liste überprüft werden.

  • PAGE 137

    Kompozer die im WGL4-Satz verfügbar sind. “Unicode fonts for Windows computers” [Ref 4] führt Schriftarten auf, die besondere Bereiche von Unicode-Zeichen und, noch was noch interessanter ist, zeigt Verbreitung der Schriftarten, so dass die Autoren die wahrscheinliche Verfügbarkeit bei den Besuchern überprüfen können. Jene, die ein seltenes Zeichen verwenden möchten, müssen überprüfen, welche Zeichensätze dieses als Unicode enthalten [Ref 5] A6.3.8.

  • PAGE 138

    Kompozer A6.4 Spezielle Zeichen A6.4.1 Entitys oder numerische Zeichenreferenzen A6.4.1.1 Ausgabe der folgenden Zeichen Die Weise, wie Zeichen im Quellcode der Seite codiert werden, kann in Kompozer über das Menü Extras – Einstellungen – Erweitert verändert werden. Im Bereich Spezielle Zeichen gibt es vier Optionen unter 'Die folgenden Zeichen als Entitys ausgeben' • Nur & <> ' und nicht umbrechende Leerräume • Obenstehende und Latin-1-Buchstaben • Spezialzeichen in HTML 4 • Benutze &# ..

  • PAGE 139

    Kompozer könnten. Siehe Abschnitt 5.3.2 der HTML-Spezifizierung [Ref 16]. Wenn Sie für dieses Zeichen das Verhalten ändern möchten, müssen Die das Kontrollkästchen "Keine Kodierung von '>' außerhalb von Attributen" ankreuzen. Da Entitys und numerische Zeichen-Referenzen mit einem Ampersand-Zeichen anfangen (&) kann ein ähnliches Problem mit diesem Zeichen entstehen.

  • PAGE 140

    Kompozer Wenn Sie eine Datei benötigen, die nur ASCII beinhaltet, gibt es eine Alternative über das Menü 'Datei - Zeichenkodierung ändern und speichern...'. Markieren Sie das Kontrollkästchen 'Als Text exportieren' und speichern Sie die Datei mit der automatisch vorgeschlagenen Erweiterung txt. Die ursprüngliche Datei bleibt davon unberührt. Die TXT-Datei lässt sich mit Kompozer allerdings nicht mehr öffnen. A6.4.1.

  • PAGE 141

    Kompozer Noch wüster sieht die Quelle aus, wenn die Zeichen als numerische Referenzen verschlüsselt wurden:

    Die Ausgabe auf dem Schirm, ob durch einen Property-Inspector z. B. der Web Developer oder in der Statuszeile des Browser-Fensters, wird normal sein, aber diejenigen, die viel in der Quellansicht arbeiten, werden es vorziehen, nicht derart zu codieren.

  • PAGE 142

    Kompozer Erlaubte Zeichen in einer URL Wenn die Codierung in einer URL-ADRESSE erforderlich ist, wird eine neue Methode, die als 'Prozentzeichen-Codierung' bezeichnet wird, verwendet. Ganz einfach bestehen derart codierte Zeichen aus einem Prozent-Zeichen gefolgt von zwei Zeichen, die die hexadezimale Position des Zeichens im Latin-1-Satz angeben. So steht die Angabe %20 für ein Leerzeichen.

  • PAGE 143

    Kompozer =1%7Cmd=6%7Cfrgb=100;139;216%7Cdd =E&reload=N"> und dass dieses nicht richtig erkannt wurde. Um dieses Problem zu beheben, aktivieren Sie das Kästchen 'Keine Kodierung von Spezialzeichen in Attributen'. Kompozer ist nicht in der Lage, selektiv Zeichen in einer URL zu codieren und in einer anderen nicht. Dennoch scheint diese Beschränkung kein Problem für die Autoren zu sein. A6.6 Quellen Jukka Korpela [1] Characters and Encodings http://www.cs.tut.

  • PAGE 144

    Kompozer [15] CSS 2.1 Spezifikation http://www.w3.org/TR/CSS21/ [16] HTML 4.01 Spezifikation http://www.w3.org/TR/html4/cover.html [17] Unicode Site http://www.unicode.org/ Andere Quellen [18] Penn State University http://tlt.its.psu.edu/suggestions/international/web/unicode.html also hat eine exzellente Seite über 'Getting Started: Unicode' welche Betriebssysteme, Browser, fonts etc abdeckt. [19] W3C http://www.w3.org/International/tutorials/tutorial-char-enc/en/all.

  • PAGE 145

    Kompozer A7.1.2 Drucker-Formatvorlagen Drucker-Stylesheets können entweder intern oder extern verlinkt sein. Erforderlich ist die Identifizierung des Zweckes der Styles. Das kann durch zwei alternative Methoden erreicht werden. • Für die Verwendung des kompletten Stylesheets wird das 'Media'-Attribut für den Link oder das Stil-Element angegeben. • Für einzelne Stil-Regeln oder Gruppen von Regeln wird @Media-Regel verwendet. A7.1.2.

  • PAGE 146

    Kompozer 3. Überschreiben Sie das Wort 'All' bei Median-Liste mit 'print'. 4. Schließen die CaScadeS. (Wenn der OK-Button nicht verfügbar ist, klicken Sie auf irgendein Stylesheet und dann auf eine beliebige Regel und dann auf OK.) Wenn Sie jetzt den Code untersuchen, wird sich diese Änderung ergeben haben: Für ein externes Stylesheet PAGE 147

    Kompozer A7.1.3 Medientypen Dieser Anhang handelt von Medientyp 'Print'. Die CSS Spezifizierung schließt aber auch die folgenden Typen ein: Braille, Embossed, Handheld, Print, Projection, Screen, Speech, tty und TV. Gegenwärtig werden aber nur Screen und in einem kleineren Ausmaß, Print unterstützt. Eine frühere Version der Spezifizierung hatte einen Typ 'Aural', aber der ist durch 'Speech' ersetzt worden A7.2 Styles für den Ausdruck Eigentlich ist der Ausdruck von Webseiten doch unkritisch.

  • PAGE 148

    Kompozer A7.2.1.2 Fonts Nach den Rändern sind die Schriftarten die wichtigsten Details. Obwohl die CSS-Regeln die Angabe der Schriftartgröße auch für gedruckte Medien in allen möglichen Einheiten erlauben, sollte die für Druckmedien allgemein verwendete Einheit Punkt ist verwendet werden. Es gibt eigentlich keinen guten Grund, irgendwelche anderen Einheiten zu verwenden.

  • PAGE 149

    Kompozer Einfach jeden Artikel, der nicht gedruckt werden soll, mit der Klasse 'noprint' versehen. Das wird keine Auswirkung auf dem Bildschirm haben, da es nur für Druckmedien definiert wird. Die Möglichkeit, Texte mit mehreren Klassen zu versehen, ist günstig, weil das Hinzufügen der noprint-Klasse keine Wirkung auf andere diesem Text zugewiesene Klassen hat. Wenn Menüs auf einer Seite ein einem Container eingeschlossen sind, ist die beschriebene Herangehensweise sehr einfach.

  • PAGE 150

    Kompozer unterdrückt wird, ist das Ergebnis des Ausdruckes höchstwahrscheinlich sehr unsicher. Die Hintergrundfarbe, kann in den weißen Text 'ausbluten', besonders wenn Papier schlechter Qualität verwandt wird. In solchem Fälle ist es viel besser, einen neuen Satz von Styles für die Menü-Buttons einzurichten, die Farbschemata verwenden, die funktionsfähig sind. A7.2.3 Page media Wenn entschieden wurde, was zu drucken und es wo zu drucken ist, folgt die Überlegung, wo die Seitenumbrüche festzulegen sind.

  • PAGE 151

    Kompozer .keeptogether {page-break-inside: avoid} A7.3 Ergebnisse A7.3.1 Die richtige Reihenfolge Wenn die Drucker-Formatvorlagen, wie beschrieben aufgestellt werden, sollte alles gut funktionieren, dennoch gilt es einige Vorsichtsmaßnahmen zu beachten. Normalerweise wird es zwei Sätze von Styles geben, einen für gedruckte Medien, einen für allgemeine Medien.

  • PAGE 152

    Kompozer A7.3.3 Bilder, Floats und Seitenumbrüche Hier sind einige der Probleme, auf die Sie treffen könnten, wenn Sie den Ausdruck Ihrer Seiten überprüfen wollen. Einige rühren zweifellos vom schlechten Support für Druckmedien, die die Browser bieten (gegen Ende 2007), andere können in der CSS Spezifizierung durch eine unzulängliche Definition dessen, was geschehen soll, verursacht worden sein.

  • PAGE 153

    Kompozer Lange Spalten, die zum Beispiel in einigen Layout-Schemata verwendet werden, sollten vermieden werden, wenn sie vermutlich von einer Seite auf die folgende reichen werden. Wie gewöhnlich ist der Rat: Vermeiden wenn möglich, sonst überprüfen, überprüfen und wieder überprüfen. A7.3.4 Browser Wenn die Seiten und Stylesheets wie vorgeschlagen entworfen wurden, 'rendern' die meisten Browser diese zufriedenstellend, obgleich auch nicht immer vollkommen.

  • PAGE 154

    Kompozer http://www.richinstyle.com/guides/fontface2.html Diese wird noch hilfreicher, wenn @page von den Browsern besser unterstützt wird. Kompozer-Anleitung Version 1.01 vom 07.06.

  • PAGE 155

    Kompozer Index @ @Media ......................................................143 A Element...................16, 23, 59, 62, 82, 84, 116 E-Mail-Adresse ............................................40 Externe Styles...............................................63 externe Stylesheets .......................................64 F absolute Adresse...........................................44 absolute Position ..........................................48 Alan Wood ..............................................

  • PAGE 156

    Kompozer K Klasse ...........52, 57, 62, 63, 76, 77, 79, 87, 91 Klassennamen.............................63, 76, 77, 82 Kommentar .................................................92 L Layer.............................................................48 Lesezeichen ..................................................41 Lineal..............................................................9 Linie.............................................................91 Links ändern...........................................

  • PAGE 157

    Kompozer X Zentrieren........................................................110 XHTML......................................................118 Ziehpunkt.................................... Siehe Handle z-index ..........................................................50 Z Zelle..............................................................30 Postskriptum Diese Anleitung entstand aus Anmerkungen für den persönlichen Gebrauch.