Anleitung Website


Das PBCS Webtemplate basiert auf reinem HTML Code nach Spezifikation 4.0. für kleine Zusatzinformationen wird Javascript 1.2 verwendet (Stand der Webseite, Datum, Begrung). Alle Layouts basieren auf einem sogenannten Cascaded Style Sheet (kurz: CSS). Das ist eine Textdatei, die für die meisten Elemente (Hintergründe, Tabellen, Schriftarten, Farben und Gren) die Vorgabe enthält. Darüberhinaus gibt es eine Musterseite, die als Vorlage für eigene zusätzliche Webseiten genutzt werden sollte. Zur Bearbeitung der Seiten kann z.B. Microsoft Expression Web, ein handelsüblicher Texteditor, Shareware-HTML-Editoren oder auch professionelle Software wie Macromedia Dreamweaver verwendet werden. Webaufbau und Dateinamen Die Startseite (index.htm) enthält BLOG, Journal und Shoutbox, sowie eine TadCloud Alle Grafiken liegen im Unterordner „/graphics“. Bitte beachten, wenn eigene Grafiken zugefügt werden, diese auch hier zu speichern. !template.htm Dieses Muster für eine Webseite liegt im Stammverzeichnis Ihres Webauftritts und ist in Sektionen unterteilt, sogenannte „DIV“s (wie an dieser Seite erkennbar). Der erste „DIV“ namens „KOPF“ enthält die Überschrift der Seite. Hier wird das Wort übernommen, auf das man zuvor in der Navigationsleiste geklickt hat. DIV Nummer 2 (Titel) und DIV Nr. 3 (Kasten) sind immer als Doppel zu verwenden. Im Webseiten-Muster wird in der ersten Kapitelüberschrift automatisch das Datum der letzten Bearbeitung der Webseite eingefügt (Javascript). Mit „Kopf“ und „Kasten“ können einzelne Kapitel optisch ansprechend dargestellt werden. Im Bereich „Titel“ formulieren Sie die Überschrift des Kapitels, im Bereich „Kasten“ setzen Sie den Inhalt, Grafiken, Tabellen usw. wie gewohnt ein. Beachten Sie dabei bitte folgende Dinge: Der Inhalt des Kastens darf nicht breiter als 600 Pixel sein (wird er breiter, so werden beim Ausdruck einer Seite rechts Teile abgeschnitten) Ändern Sie nicht die Schriftarten, denn diese werden im CSS (siehe oben) vorgegeben Geizen Sie mit verschiedenen Schriftgrößen und Farben. Das macht das Web nur unbersichtlich und gibt ihm einen unprofessionellen Touch. Weniger ist mehr! Verwenden Sie innerhalb des Kastens keine Hintergrundbilder. Das erschwert nur die Lesbarkeit und macht die Darstellung unruhig. Speichern Sie alle Grafiken im Unterordner /graphics Beachten Sie die goldenen Regeln des Webdesigns (weiter unten zu lesen) Im folgenden Fall-Beispiel sind die typischen Änderungsfälle am Web für Sie beschrieben. Als Webeditor wird z.B. das mittlerweile kostenlose Microsoft Expression Web verwendet. Neue Seite einfügen (wir fügen eine Seite „veranstaltungen“ ein): Expression Web starten, (falls nur eine leere Seite angezeigt wird: Datei/Web öffnen/Stammordner für Ihr Web auswählen) Doppelklick auf !template.htm, dann Datei/Speichern unter „veranstaltungen.htm“, Titel der Seite ebenfalls ndern auf „Veranstaltungen und Messen“ Im Entwurfsmodus können Sie nun wie gewohnt Inhalte einfügen Wenn Sie ein zweites Kapitel einfügen wollen, schalten Sie die Darstellung bitte auf „HTML“ um – so geht es am Einfachsten. Suchen Sie nach der Zeichenfolge: [/div] [div id=“titel“]Subtitel[/div] [div id=“kasten“] (statt „Subtitel“ steht dort Ihre berschrift) markieren Sie diese und kopieren sie in die Zwischenablage. Finden Sie nun das Kommando [DIV] hinter dem Inhalt von „Kasten“ und fgen den gespeicherten Inhalt direkt DAVOR ein: [div id=“kasten“] [p]Text und Bilder und Tabellen…hier hinkopieren[/div] Schon haben Sie ein zweites Kapitel erzeugt. Schalten Sie nun wieder auf die „Entwurf“ Darstellung um. Öffnen Sie die gewnschte Seite und wechseln in die „HTML“ bzw. „Code“- Darstellung Finden Sie die erste [div id=“kasten“] Öffnen Sie die Seite „pbcsneu.css“ bzw. die einzige Datei mit der Endung .CSS im Stammverzeichnis mit Expression Web ber „Format““Formatvorlage“ sehen Sie nun die einzelnen Elemente, die Sie links markieren können und dann ber „Ändern““Format“ nach Ihren Wnsche gestalten. Alle Änderungen wirken sich nach Speichern der CSS Datei sofort auf das gesamte Web und alle Seiten aus. (Post ID:920)

Zusammenfassung
  1. htm", Titel der Seite ebenfalls ndern auf "Veranstaltungen und Messen" Im Entwurfsmodus können Sie nun wie gewohnt Inhalte einfügen Wenn Sie ein zweites Kapitel einfügen wollen, schalten Sie die Darstellung bitte auf "HTML" um - so geht es am Einfachsten.
  2. Beachten Sie dabei bitte folgende Dinge: Der Inhalt des Kastens darf nicht breiter als 600 Pixel sein (wird er breiter, so werden beim Ausdruck einer Seite rechts Teile abgeschnitten) Ändern Sie nicht die Schriftarten, denn diese werden im CSS (siehe oben) vorgegeben Geizen Sie mit verschiedenen Schriftgrößen und Farben.
  3. CSS im Stammverzeichnis mit Expression Web ber "Format""Formatvorlage" sehen Sie nun die einzelnen Elemente, die Sie links markieren können und dann ber "Ändern""Format" nach Ihren Wnsche gestalten.
Verwandte Beiträge
Über den Autor:
Patrick Bärenfänger ist Ihr Experte für IT-Sicherheit und Web-Entwicklung. Mit mehr als 34 Jahren Erfahrung in der IT-Branche und einer TÜV-Zertifizierung als IT-Security Manager und -Auditor bietet er Ihnen professionelle und zuverlässige Lösungen für Ihre digitalen Anforderungen. Ob Sie einen ansprechenden Internet-Auftritt, eine maßgeschneiderte Web-Anwendung, die KI nutzen lernen möchten, die Beurteilung Ihrer IT-Umgebung nach gängigen Standards benötigen, Patrick Bärenfänger ist mit den neuesten Software- und Hardware-Trends vertraut und setzt diese für Sie um.

Kommentare

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert