Webseitengestaltung, Seite 3
       Zurück zur Seite 2      Weiter zur Seite 4       Die Begleitung zur Nvu Anleitung Blatt 12 bis 16 mit Nvu / KompoZer

Nach Seite 2 kann die Frage auftreten, wie weit kommt Mensch mit dem Gelernten? Bilder, Texte und Links sind die Bestandteile für komplette Webseiten. Können wir jetzt schon Webseiten erstellen? Wenn die einzelnen Seiten keinen großen Umfang haben, dann Ja und nichts wie ab ins Internet damit. Du hast alles zur Verfügung. Wie bei der Anwendung hier, die vom Umfang her recht sparsam ist.  Bei umfangreicheren Inhalten kommt es jedoch zu Problemen mit der Anordnung. Das Beispiel weicht diesen Problemen aus. Das jeweilige Bild ist rechts angeordnet und der Text links. Damit sind alle Bildschirmbreiten abgedeckt. Im Verlauf des Kurses kommen wir auf die Anordnung noch zu sprechen. Zuerst kommen aber einige Gestaltungsmöglichkeiten dran.

Blatt 12, 3.4 Arbeiten mit dem Text

Schaltfläche 'Farbe für Texthervorhebung'BILD 1
Als Text zum Üben dient aus der SHELL Jugendstudie 2002 eines der Hauptergebnisse. Den Anfang dieser Studie von hier verwende ich als Mustertext.  (Der Link von soeben funktioniert noch Jan. 2007. Falls einmal nicht, es wäre ein Extrafenster zu sehen, nur der Text der gelben Streifen und unten eine Navigationsleiste aus verlinkten Texten. Nichts, was du nicht jetzt auch könntest.) Mit der Schaltfläche 'Farbe für Texthervorhebung auswählen', das gelbe Viereck im Bild 1, wurde der Shell-Text gelb unterlegt, wie mit einem Marker.
Dieser gelb hervorgehobene Text wird im Auftrag 3 benutzt.

Einstellung zu Demokratie und Gesellschaft



Die überwiegende Mehrheit der Jugendlichen hält die Demokratie in Deutschland für eine gute Staatsform. Nur 8% der Jugendlichen in den alten und 17% in den neuen Ländern sind hier anderer Meinung. Auf Nachfrage sieht jedoch die überwiegende Mehrheit auch der ablehnenden Gruppe keine Alternative zur Demokratie. Für die Regierung eines „starken Mannes“ spricht sich nur eine verschwindend geringe Minderheit aus, genauso übrigens für einen sozialistischen Staat, etwa nach dem Vorbild der DDR. Das gilt sowohl für Jugendliche in den alten als auch in den neuen Ländern.

Dennoch sind in den neuen Bundesländern immerhin 52% der Jugendlichen, in den alten 27% kritisch gegenüber der demokratischen Praxis, so wie sie in Deutschland besteht, eingestellt. Insgesamt ist diese Kritik bei solchen Jugendlichen besonders hoch, die in prekären Lebensverhältnissen in Bildung und Beruf leben oder die mit ihren gesellschaftlichen Perspektiven nicht zufrieden sind. Die problematische Beurteilung der Demokratie in Deutschland entpuppt sich demnach bei diesen Jugendlichen als Kritik an den Lebensverhältnissen sowie als persönliche Reaktion auf fehlende Chancen in Beruf und Gesellschaft. Dieser Umstand drückt sich in den neuen Bundesländern spürbar stärker aus. Die dortige junge Generation, von denen der größte Teil den „real existierenden Sozialismus“ bewusst nicht mehr miterlebt hat, ist mit ihrer Perspektive in Deutschland deutlich unzufriedener als Jugendliche in den alten Ländern.

Das Vertrauen der Jugendlichen in die gesellschaftlichen Institutionen und Akteure bestätigt das bisher dargestellte Bild. Erhöhtes Vertrauen genießen solche staatlichen Institutionen, die als parteiunabhängig angesehen werden, wie etwa Bundesverfassungsgericht, Justiz und Polizei. Das geringste Vertrauen wird dagegen den politischen Parteien entgegen gebracht. Als besonders vertrauenswürdig werden außerdem Menschenrechts- oder Umweltschutzgruppen eingeschätzt. Eher mäßig, aber höher als in die Parteien, ist das Vertrauen der Jugendlichen in die Bundesregierung und in die Kirchen. Auch die Bürgerinitiativen genießen nur ein mäßiges Vertrauen, wenn auch etwas mehr als die Regierung. Im mittleren Bereich bewegt sich auch das Vertrauen in die Gewerkschaften.

An Wahlen beteiligen sich die Jungwähler im Vergleich zur Gesamtbevölkerung schon seit längerem unterdurchschnittlich. So lag die Beteiligung der 18- bis 24 jährigen Wahlberechtigten in Deutschland zuletzt im Schnitt um fast ein Viertel unter dem Gesamtdurchschnitt. Dieser Trend wird auch in der aktuellen Shell Jugendstudie bestätigt. Nur 35% der (deutschen) Jugendlichen zwischen 12 und 25 Jahren gaben an, sich – sofern sie wahlberechtigt wären – ganz sicher an der nächsten Bundestagswahl zu beteiligen, während weitere 37% meinten, sie würden "wahrscheinlich" wählen gehen. Je jünger die Jugendlichen, desto geringer die Bereitschaft, sich (wenn man bereits wahlberechtigt wäre) an einer Bundestagswahl zu beteiligen. Wahlen sind in der Jugend also kein „Selbstläufer“, viele Jugendliche müssen für eine Beteiligung erst gewonnen werden.

Blatt 13, 3.4.1.1 Einleitung

Der nicht hervorgehobene Text auf dieser Seite wurde nicht gestaltet. Im Bild 2 ist die Auswahlliste 'Absatzformate auswählen' aufgeklappt zu sehen. Für diese Zeile hier würde in Nvu die Auswahl auf "Normaler Text" stehen. Beim gelb unterlegten Text oben drüber würde in Nvu die Auswahl auf "Absatz" stehen. Der von der SHELL-Studie hierher kopierte Mustertext enthält tatsächlich 4 Absätze. Die Absätze 2, 3 und 4 wurden zum Abstand erzeugen ergänzt. Möglich wäre gewesen, hinter dem Titel "Einstellung ..." bei gedrückter Umschalttaste sechs [Enter], die genannten Umschalt-Enter einzugeben. Der Unterschied wäre ein geschlossenes gelbes Feld an Stelle der 3 Streifen. Im Auftrag 3 wird das angesprochen.

Auswahlliste Standardelemente
BILD 2

Blatt 13 Mitte anzeigen. Das gilt nur für die markierten Absätze, alles andere auf dieser Seite ist ja (nur) normaler Text. Das gilt auch in den Editiermodi 'HTML-Tags' und 'Vorschau' . Nachsehen bitte.

Blatt 13, 3.4.2 Text formatieren, Blatt 15, 3.4.3 Text positionieren, Textbreite festlegen

Das ist alles für die Anwender von Textverarbeitung selbsterklärend und wird im Auftrag 3 exemplarisch benutzt. Eine andere Sache ist, dass hier dem Box-Modell begegnet wird. Die Berechnung der gesamten Breite einer Box wird vom Firefox richtig nach Spezifikation und vom IE anders berechnet. Einen Einstieg in das Problem mit dem Box-Fehler bei Microsoft bietet SELFHTML mit der Webseite http://de.selfhtml.org/css/formate/box_modell.htm. Gucken und mal für später aufheben, oder wenn es wieder begegnet hier den Link für die Lösung sofort finden.

Auftrag 3

Lade bitte mit Nvu die Datei www.elew.de/kurs1/auftrag03.html und arbeite sie durch.  Lösche die erledigten Sachen, so dass am Ende nur noch dein Werk übrig bleibt, und komme dann wieder hierher zurück.

Das gewonnene Beispiel erhält von mir noch Links und eine Unterschrift und ist hier zu sehen.

Weiter im Kurs mit Seite 4 

Was jemand, der bisher keine Ahnung hatte, nach dieser Seite getan haben, bzw. können sollte:

Bereichskonturen ein- und abschalten. (Auftrag 3, a)
Die Auswahlliste Absatzformate anwenden. (A3, a,c)
p-Container auf Blocksatz umstellen. (A3, c)
Mit der Schaltfläche 'Farbe für Texthervorhebung auswählen' aus der Format-Symbolleiste beliebige Texte farbig unterlegen. (A3, d)

Absätze mit der Eingabetaste in neue Absätze unterteilen. (A3, e)
Zeilenumbrüche ohne Beginn eines neuen Absatzes herstellen. (A3, e)
Mit den Linealen von Nvu die Boxbreite von Absätzen einstellen. (A3, g-i)
Mit Nvu Inline Styles bei Absätzen für Boxeigenschaften, Breite, Hintergrund und Ränder verwenden. (A3, j-n)

Garantie: Falls nicht(s) verstanden, erfolgen Zusatzinformationen nach Erhalt einer eMail mit Beschwerde a garantiert at huscholz punkt de senden.

Vorschläge, Fragen, Kritik zum Kurs

Frage 10.11.05 H.S.: "Leider muss ich erneut eine Anfrage starten: Dein Text lautet: "j) Rechtsklicke auf <p> und wähle im Kontextmenü Inline styles / Box-Eigenschaften. Der erste Absatz hat einen Rand links, den du jetzt in Pixeln angegeben siehst und eine Angabe für Breite. Rand bedeutet nicht Rahmen, sondern Abstand zum Nachbarn. Setze alle 4 Ränder auf 2px. Gib zuerst eine 2 ein und klicke dann auf den Runterpfeil für die Auswahlliste, um px zu wählen. Oder tippe gleich 2px ein." Aber bei Rechtsklick auf p wird der Abschnitt markiert und ein Menü aufgerufen, von dem ich wie oben angegeben Erweiterte Eigenschaften/Inline styles wähle. Aber in Pixel wird mir nichts angegeben: Ich sehe nur im Fenster
background-color rgb(255, 255, 102) sonst nichts?
Antwort (Hinweis Februar 06: Die Buchstaben j) und f) sind inzwischen verschoben und heißen anders): "Bei f) hast du den Absatz "Die überwiegende..." am Lineal gepackt und die linke Seite nach rechts zur Blattmitte hin verschoben. Bei j) ist dieser verschobene Absatz gemeint. Da muss der Cursor drin sitzen, dann gibt es die Angabe des Abstandes vom Rand links und die Breite in Pixeln. Ich werde dank deines Hinweises das anders formulieren.

Frage 21.11.05 B.M.: "Deinen Kurs mache ich mit. Nur hätte ich gerne ein Buch begleitend dazu, so dass ich nachlesen kann und eine Referenz habe. Ich möchte auch evtl. die HP meines Vereins erneuern. Die macht zurzeit zwar ein Profi (er nennt sich zumindest so), aber er kümmert sich nicht um sie und hält sie nicht auf dem Laufenden.
Antwort: "Als Referenz bietet sich SelfHTML von Stefan Münz an. Das bekommst du auch als Buch. Jeder kleine Codeschnippsel ist mit einem Beispiel ausgestattet. Ein Werk, dass ich auch als Referenz benutze. Wenn es das SelfHTML gibt, kannst du fragen, warum mache ich dann hier einen Kurs? Ich denke, die Möglichkeit, eMail-Kontakt zu halten und als Gruppe einen Kurs voranzubringen, macht einen Unterschied. Dass der Kurs zum "Buch" Nvu-Anleitung die Begleitung ergibt, macht einen weiteren Unterschied.

Frage 8.12.2005 B.M.: "Wenn ich z.B. auf den Button (Link) "Startseite" klicke  öffnet sich (wie gewollt) die Testseite. Nur sie öffnet sich in einem neuen Tab, was ich aber nicht möchte. Wie kann ich denn das ändern bzw. programmieren?"
Antwort:  "Wenn du mit Nvu im Dialog '
Link-Eigenschaften' in der Mitte unter 'Ziel - Link wird geöffnet' das Häkchen setzt, kannst du das mit der Auswahlliste entscheiden. Z.B. Link wird geöffnet in einem neuen Fenster oder im gleichen Fenster.  Wenn du das im Quellcode programmieren willst, wählst du "<a href="http://de.selfhtml.org/" target="_blank">SelfHTML von Stefan M&#252;nz</a> für ein neues Browserfenster oder einen neuen Tab beim Firefox. Um im aktuellen Fenster zu bleiben lässt du das target="_blank" weg oder zwingst den Browser ins aktuelle Fenster mit target="_self".

Frage 12.4.2006 M.E.: "Vor kurzem habe ich festgestellt, dass es anscheinend nicht möglich eine Ordnerstruktur mit NVU zu erstellen. Befindet man sich in einem Ordner, so hilft eine relative Adresse nicht weiter um beispielsweise wieder zur Startseite zu kommen oder eine andere Rubrík (in einem anderen Ordner) zu öffnen. Gibt man die Adresse als absolute Adresse an (kein Haken bei relativer Adresse) wird die Adresse später automatisch als relative Adresse umgestellt."
Antwort:  "
Mit der Nvu-Seitenverwaltung kann ich online Unterverzeichnisse auf dem webserver anlegen. Ein Standardsache bei mir ist das Unterverzeichnis "img" für die Grafiken. Sicher verstehe ich das Problem nicht auf Anhieb. Ich habe als Problem No.6 hier behandelt: http://people.freenet.de/kurs1/ . Schau mal, ob meine Antwort dort dir weiterhilft.

Frage 30.4.2006 J.U.: "Die Boxbreite mit Linealen einstellen klappt. Wie kann ich eine manuell eingestellte Boxbreite wieder auf "volle" Breite mit automatischem Zeilenumbruch einstellen? Mit manuellem Verändern auf die Ausgangsbreite ("voll") wird der Text nicht wieder umgebrochen. Kann der automatische Zeilenumbruch auch bei manuell festgelegten Boxbreiten genutzt werden? Diese Funktion finde ich sehr praktisch."
Antwort:  "Am Ende von Auftrag 3 hast du schon erste Erfahrungen mit den inline styles
. Klicke in die Box und rechtsklicke dann in der Statuszeile auf den Tag. Im Kontextmenü nimmst du 'Inline styles.. / Box Eigenschaften' und löscht die Breite einfach aus. Du kannst aber die Breite auch auf 100% setzen. Der automatische Zeilenumbruch wird dann nur noch verhindert, wenn im Text Zeilenumbrüche erzwungen werden. Im Quelltext stehen dann die <br>-Tags. Soche im Quelltext entfernen oder einfacher im Editiermodus 'HTML-Ansicht' anklicken und per Kontextmenü löschen."

Frage 22.12.2007 Maik M.: "Mit diesem Absatz komme ich nicht zurecht: c) Absätze haben nur Inhalt und selbst keine Funktion, usw. Meine Frage: Ich finde die Schaltfläche `Im Blocksatz ausrichten`nicht. Auf Body, dann rechte Maustaste, dann inline styles, dann ????"
Antwort: "Die Schaltfläche kannst du in meiner Bildschirmkopie BILD 1 auf http://www.elew.de/kurs1/kurs1-2.html sehen. Direkt unter "ieren" von Publizieren.
Meine jetzigen KompoZer-Schaltflächen sind anders sortiert, das Bild stammt noch von 2005 aus Nvu 1.0, aber die Blocksatz-Schaltfläche ist bei KompoZer wieder dabei. Zur Aufgabe c): Rechtsklicke nicht auf <body>, sondern setze einfach nur den Cursor in einen der vier gelben Absätze und klicke dann auf die Schaltfläche 'Im Blocksatz ausrichten'. Nvu codiert dann den Absatz, was du im Quelltext dann kontrollieren kannst, was du aber schon im Moment des Klickens durch den Wechsel im gelben Absatz von Flattersatz auf Blocksatz beobachten kannst."

Weiter im Kurs mit Seite 4