WebsiteBaker für Dummies
Kurzanleitung für ahnungslose Redakteure
Diese Anleitung richtet sich an Leute, die ohne HTML-Kenntnisse Inhalte in ein bereits installiertes CMS "WebsiteBaker" einpflegen. Installation und Administration sind hier nicht Thema.
Üblicherweise hat ein Webdesigner bereits alles eingerichtet, auch Formulare und weitere Module sind bereits installiert, in der Regel auch einige Seiten mit (Blind)Text.
Wissenswertes vorab:
Das "Frontend" ist die eigentliche Website, also das, was alle im Internet sehen. Das "Backend" dient der Verwaltung der Inhalte und ist natürlich durch ein Passwort geschützt.
Bei WebsiteBaker ist der Unterschied zwischen Backend und Frontend sehr groß. Nicht nur Gesamterscheinung, auch die Schriften, Größen, Farben der Inhalte unterscheidet sich häufig stark von der "öffentlichen" Darstellung im Frontend.
Das häufigste Problem gleich zu Beginn:
Versuchen Sie nicht, eine bestimmte Erscheinungsform im Backend zu erzwingen, wenn Sie nicht genau wissen, was Sie tun! Geben Sie im Editor also zB an, dass eine Zeile das Absatzformat "Überschrift 1" hat, aber versuchen Sie nicht, den Text grün, klein, groß oder sonst was zu machen.
Vermeiden Sie, Ihre Gewohnheiten aus zb Word auf das CMS zu übertragen.
Warum ist das so?
Bei Webseiten wird das Aussehen im Frontend über "StyleSheets" (CSS) festgelegt. Diese hat der Webdesigner erstellt und darin angegeben, wie groß Schriften sind, welche Farbe, Stärke, Zeilenabstand jedes Element hat. Ein guter Webdesigner berücksichtigt dabei, dass Elemente zur inhaltlichen Strukturierung verwendet werden; etwa dass eine Seite als erstes eine Überschrift 1 hat, vielleicht eine oder mehrere Überschriften 2, Absätze, Auflistungen, usw.
Das Backend und der Editor haben allerdings ein anderes Stylesheet.
Wenn Sie im Editor den Text klein und grün machen, "überstimmen" Sie die Angaben im Stylesheet, und der Text wird immer klein und grün sein – auch wenn sich das Design ändert (Was am Anfang schon mal vorkommt).
Außerdem werden Sie dieses "spezielle" Grün, das der Webdesigner angegeben hat, nie genau herausfinden - und der Text wird immer etwas anders sein.
Schauen Sie also öfter mal, wie das, was Sie gerade gemacht haben, im Frontend aussieht. Dazu halten Sie am besten 2 Seiten im Browser offen und klicken bei der Frontend-Seite im Browser auf "aktualisieren" (F5 oder Strg-F5), nachdem Sie im Backend gespeichert haben.
Gehen wir’s an:
Das Backend von WebsiteBaker:
Geben Sie www.ihredomain.at/admin/ im Browser an. Es öffnet sich etwas Blaues – geben Sie Benutzernamen und Passwort an, das Sie wahrscheinlich per Mail bekommen haben.
Jetzt sind Sie "drin"
Normalerweise ist für Sie der Menüpunkt "Seiten" wichtig. Klicken Sie.
Oben stehen die bereits vorhandenen Seiten, manchmal steht daneben ein + Symbol um zusätzliche Unterseiten anzuzeigen. Klicken Sie auf die Seite, die Sie ändern möchten; es öffnet sich der Editor.
Solange Sie da jetzt einfach reinschreiben oder etwas ändern, ist das alles ganz einfach. Kritisch wird’s, wenn Sie etwas aus Word oder einer anderen Webseite kopieren...:
Leider: Das Copy&Paste Problem
Das Betriebssystem (meist Windows) versucht beim Kopieren/Einsetzen, die Schrift-Stile (Farbe, Größe usw) zu erhalten. Das ist oft recht praktisch, aber in Verbindung mit einem CMS kann das schlimme Folgen haben. Wirklich kritisch wird es dann, wenn aus verschiedenen Webseiten Texte oder gar Links kopiert werden – das kann mitunter zum schweren Darstellungsfehlern im CMS führen.
Der tiefere Grund ist, das Windows ein anderes Verständnis von HTML hat, als es vorgesehen ist. Im Hintergrund setzt das Betriebssystem nicht nur den Text ein, sondern das, was es für HTML hält – was in den seltensten Fällen gewünscht ist.
Die beste Möglichkeit, die Stil-Suppe zu vermeiden ist, den gewünschten Text aus Word (oder einem Browser) zuerst in ein Programm zu kopieren, das keine Stile kennt; unter Windows zB der "Editor" (Programme -> Zubehör -> Editor) und von dort wieder raus in den CMS-Editor.
Dadurch bleibt der "nackte Text" über, der nachträglich sauber formatiert werden kann. Der häufig verwendete FCK-Editor hat eine eigenen Schaltfläche, um Texte aus Word vor dem Einsetzen zu bereinigen; das funktioniert aber nicht immer sehr gut.
Wenn es Ihnen passiert ist, sollten Sie nicht versuchen, das alles zu reparieren. Besser: kopieren Sie alles wieder raus (in den Windows-"Editor") und wieder zurück.
...weiter....
Normalerweise wird zuerst der Text ohne Formatierungen eingefügt/geschrieben und erst nachträglich die Formate zugewiesen. Die Zeilenwechsel-Taste (Return) erzeugt einen neuen Absatz, Shift-Return einen Zeilenumbruch (Also eine neue Zeile im selben Absatz). Der Unterschied ist nicht nur der Zeilenabstand, sondern vor allem: Einige Formatierungen gelten immer nur für ganze Absätze. Sie können also nicht ein einzelnes Wort im Satz als Überschrift 1 auszeichnen, immer nur einen ganzen Absatz.
Verwenden Sie "Überschrift 1" für die oberste Überschrift, weitere Überschriften 2 - 4 für ebendiese. Überschrift 5 und 6 wird normalerweise nicht oder nur für Bildunterschriften verwendet. Fett und kursiv nach Belieben. Unterstreichungen sollten Sie vermeiden, weil diese Links vorbehalten bleiben sollten.
Im Web gibt es keine Tabulatoren und Sie können auch nicht mit Leerzeichen einrücken. Verwenden Sie stattdessen die Ein/Ausrück-Schalter.
Natürlich können Sie Bilder einfügen, allerdings sollten Sie sie nicht "stauchen" oder gar vergrößern, weil die Qualität darunter sehr leidet.
Wovon Sie die Finger lassen sollten:
Schriftart, Size und Farbe. Wenn vorgesehen verwenden Sie einfache Absatzformate und schauen Sie erst mal, was diese so tun.
Es kann vorkommen, dass ein Format im Frontend "unpassend" aussieht, etwa dass Überschrift 3 größer ist als Überschrift 1 udgl. Ursache dafür ist meistens, dass der Webdesigner den Schriftstil noch nicht definiert hat. Normalerweise sollte ein Mail oder Anruf reichen, um das ein für alle mal zu klären.
Eine kleine Anmerkung noch: Wenn es mehrere Blöcke gibt (also mehrere Editor-Felder) müssen Sie jeden einzeln speichern, etwaige Änderungen in anderen Blöcken gehen dabei verloren. Einen "Alles Speichern"-Schalter gibt es leider nicht.
Seiten anlegen und Menüpunkte ändern:
Im unteren Bereih der Seitenverwaltung können Sie neue Seiten anlegen. Normalweise werden das WYSIWYG-Seiten sein, also „allgemeine“ Seiten, die Texte und Bilder enthalten. Es öffnet sich dann gleich der Editor und Sie können loslegen wie gehabt.
Einstellungen ändern:
Wichtig ist für Sie:
Seitentitel: Eben dieser
Menütitel: Der Seitentitel ist meist nicht als Menütitel geeignet, weil er zu lang ist, deswegen können Sie den Menütitel extra ändern.
Übergeordnete Datei: Oft sollen Menüpunkte erst sichtbar werden, wenn ein anderer (=die übergeordnete Datei) angeklickt wurde. Keine: Die Seite ist als Menüpunkt schon auf der Startseite.
Die Beschreibung ist wichtig, wenn Ihre Site von Suchmaschinen wahrgenommen werden soll: Google zeigt den Seitentitel und die Beschreibung in den Suchergebnissen. Titel und Beschreibung sollte für JEDE Seite individuell sein und etwa so lang sein, wie das Feld fasst.
Schlüsselwörter: Die sogenannten Meta-Keywords sind nicht sehr wichtig, sie schaden aber auch nicht.
Weiteres dazu unter: Website Baker und Suchmaschinen.
Ziel: Normalerweise "Frameset sprengen" (außer Sie haben ein Frameset, was aber sehr ungewöhnlich wäre)
Dokumentenvorlage: Standardeinstellung. Ändern Sie hier nur etwas, wenn Sie wissen, was Sie tun.
Sprache: Ebendiese
Suchen: Gibt an, ob die Seite bei der Suche berücksichtigt werden soll. Sie können Suche eingeschaltet lassen, auch wenn eine Suche gar nicht vorgesehen ist. Ich mache die Vorlagen meistens ohne Suchmöglichkeit, weil sie a) ohnehin nicht ordentlich funktioniert und b) auf kleineren Sites wenig Sinn macht.
Abschnitte verwalten:
Website Baker bietet die Möglichkeit, mehrere Blöcke pro Seite zu zeigen. Diese Blöcke können verschiedener Natur sein, normalerweise gibt es bestimmte Vorgaben des Webdesigners. Leider ist es in Website Baker nicht möglich, schon beim Anlegen einer Seite alle vorgesehenen Blöcke zu erzeugen, es wird immer nur der erste angelegt.
Je nach Vorlage kann es daher nötig sein, weitere Blöcke anzufügen, etwa „Sidebar“ anzulegen, also ein Block der – wie hier - seitlich als Marginalie dargestellt wird.
Besser ist, das etwas versteckte Modul "Page Clone" zu verwenden, das eine Seite komplett mit allen Blöcken dupliziert:
Gehen Sie dazu auf: Optionen, (ganz runter: ) --> erweiterte Optionen (ganz runter: ) --> Page Cloner: zu Klonende Seite auswählen. Grundsätzlich sollten Sie aber keine übergeordnete Seite angeben, sonst könnte es später Ärger geben. Danach geben Sie der Seite die Sichtbarkeit "Privat", um gerade anwesende Besucher nicht zuschauen zu lassen, was Sie gerade tun.
HTML-Crashkurs für Dummies
Sie können natürlich „ganz ohne html-Kenntnisse“ Ihre Seiten erstellen. Normalerweise haben Sie im „Quelltext“ - so nennt man den Text inklusive HTML - nichts verloren. Manchmal müssen Sie aber rein; etwa weil nix mehr tut wie es soll.
Jeder besserer Editor hat eine HTML-Ansicht, die mehr oder weniger so aussieht:
<h1>Meine Überschrift</h1>
<p>Und das steht da kleiner unter der Überschrift<br/>
und das in der nächsten Zeile</p>
Das in den spitzen Klammern sind „Tags“, also Auszeichnungen. Die Dinger treten meistens paarweise auf: <p>...</p>, also der am Ende hat einen Slash / gleich nach der < Klammer. Ausnahmen sind Anweisungen, die prinzipbedingt kein Ende haben, in diesem Fall also der Zeilenwechsel <br/>. Hier ist der Slash am Ende vor dem >
Normalerweise müssen Sie das nicht schreiben, das macht eben der Editor für Sie.
Wichtig: Im Quelltext haben Zeilenwechsel und Einrückungen mit Leerzeichen oder Tabulatoren keine Bedeutung. Sie können die Zeilen beliebig umbrechen oder Leerzeichen einfügen, um sich Übersicht zu verschaffen.
Die üblichen Verdächtigen, wenn etwas nicht mehr richtig tut sind <font...> - Tags. Diese Tags enthalten immer Attribute, also Angaben zu Schrift oder Farbe. Wenn Sie diese Tags löschen wollen, gehen Sie am besten so vor:
Machen Sie vor der Klammer < einen Zeilenwechsel und nach dem Ende > wieder einen. Jetzt brauchen Sie noch den Schlusstag – Font-Tags sind immer paarweise. Suchen Sie also das nächste </font> und machen Sie wieder davor, danach einen Zeilenwechsel. Nochmal schauen, ob die Tags auch wirklich komplett sind – mit < am Anfang und > am Ende, dann die beiden gesamten Tags löschen.
Das gemeine an Font-Tags ist, dass sie oft verschachtelt sind. Am besten: Sie löschen alle. |
zurück