Wysiwyg und CSS - geht das zusammen?

Langsam scheint man wirklich nicht mehr darum herumzukommen, CSS zu lernen und anzuwenden. Noch zögere ich, erstelle ich doch meine Seiten bequem mit einem Wysiwyg-Programm (Netscape Composer), sodass ich sehr rasch arbeiten kann und mich wenig um html zu kümmern brauche.

Falls ich mich entschliesse, es mit CSS zu versuchen, muss ich dann

  1. die ganze Website in einem Editor erstellen?
  2. Müsste alles Bisherige umgeschrieben werden? Wahrscheinlich schon, sonst bleiben ja die vielen Attribute bestehen.

Das gänge ja wahnsinnig viel Arbeit! Oder wie läuft die Umstellung in der Praxis?

Hallo,

welche WYSIWYGs inwieweit CSS unterstützen, kann ich dir leider nicht sagen. Das liegt daran, dass ich generell gegen diese Dinger bin, eben weil man dann nichts mit HTML zu tun hat - und das sollte man, wenn man es für nötig hält, eine Webseite zu erstellen.

Ich würde dir dazu raten, dir einen guten Texteditor zu suchen (SEG oder Textpad beispielsweise), HTML und CSS zu lernen und dann deine Seiten von Hand zu schreiben. Das ist nicht viel Arbeit, wenn man sich daran gewöhnt hat, führt aber meist zu besseren Ergebnissen.

Die Seite neu zu schreiben (von Anfang an), ist sicher auch keine schlechte Idee.

mfg
MB

Also den Composer den du benützt ist schon ok, das ja nicht wirklich Wysiwyg :smile: Es erzeugt also relative gutes HTML.
Um nun CSS zu nehmen, musst du nur das class attribut mit einbinden.
Und eben noch einmal eine zeile für den css stil.

Also bleib bei deinem Composer von netscape und füge nur die benötigten css stly hinzu :smile:

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

Also den Composer den du benützt ist schon ok, das ja nicht
wirklich Wysiwyg :smile: Es erzeugt also relative gutes HTML.
Um nun CSS zu nehmen, musst du nur das class attribut mit
einbinden.
Und eben noch einmal eine zeile für den css stil.

Ach, zwei Zeilen reichen aus?

Also bleib bei deinem Composer von netscape und füge nur die
benötigten css stly hinzu :smile:

Und was mack Du mit de -Dings?

frägt DannyFox64

PS: Bitte entschludige meine unordenliches sprach, abär dein unordentliches denke hats provoziert. / SCNR

Hi, Ursula!

Das gänge ja wahnsinnig viel Arbeit! Oder wie läuft die
Umstellung in der Praxis?

Da Du mit der Netscape-/Mozilla-Schiene vertraut bist, könntest Du Dir einmal den NVU ansehen. Siehe: http://www.nvu-composer.de/

Dies ist ein relativ neuer WYSIWYG-Editor, in dem Du auch (1) den Code editieren kannst, (2) über Dialog-Fenster (relativ komfortabel) Styles verfügen kannst.

Die Handhabung wird Dir möglicherweise vertraut vorkommen.

Wovor ich Dich aber warnen muss, ist, FONT-Tags und andere sog. Deprecated Tags zu verwenden, was die meisten herkömmlichen (layout-orientierten) Editoren beim direkt Formatieren (Schriftart, Schriftgröße und -farbe) in den HTML-Code einfügen; das führt nämlich zu oft dazu, dass CSS-Anweisungen überschrieben werden.

Das Sinnvollste ist also, die HTML-Seiten gut zu strukturieren, und dann „von außen eingreifend“ das Stylesheet wirken zu lassen (durch Verlinkung oder „@import url(…)“). Beispiel für guten Code:

 \<!--
 @import url(http://site.de/source/styles.css);
 //--\>
 Hauptüberschrift 
 Überschrift 2. Ordnung 
 Ein einleitender Absatz... blabla

 lafjalfjalfjaflk 

 Absatzüberschrift 
 Fließtext und Grafiken usw. usw.
 sfjalkfjd flj fkaj f

 Noch mehr fließtekst... 
 irgendwo steht noch ein Menü

 [[zurück](vorherigeseite.html)] 
 [[weiter](weiter.html)]
 (etc.pp.)




Wenn Du bisher viel mit Tabellen gearbeitet hast, kannst Du die auch weiter nutzen, auch mit CSS formatieren (ist aber schwieriger!). Langfristig empfehle ich, auf ein "fließendes Design" umzustellen, das vor allem mit DIV-Tags die Inhalte darstellt. Es gibt zahlreiche vorgefertigte Layouts/Designs als Vorlagen for free. - Beispiele an Code-Schnipsel für ein fließendes Design ist:



    
    HTML-Teil:
    
    [Kap. 2](%23kapitel1%3EKap.%25201%3C/a%3E%250D%250A%2520%2520%2520%2520%3Ca%2520href=)
    
    
     Hauptüberschrift der Seite = Titel 
     Überschrift 1 
     Text... 
     name="kapitel2"\>Überschrift 2 
     Text... 
    
    
    
    CSS-Teil:
     #menu {
     font-weight: bold;
     font-size: 0.8em;
     background-color: lemonchiffon;
     }
     #content {
     font-size: 1.0em;
     background-color: whitesmoke;
     }
     h1, h2, h3 { font-weight: bold; }
     h1 { font-size: 1.6em; }
     h2 { font-size: 1.4em; }
     h3 { font-size: 1.2em; }




Was Dich, wenn interessiert, in jedem Falle weiter bringt sind folgende Sites:

[http://jendryschik.de/](http://jendryschik.de/)
[http://www.drweb.de/](http://www.drweb.de/) (am besten gleich Newsletter bestellen :wink:)

HTH, CU DannyFox64

Koin Problm

Also du klickst auf HTML Reiter und hast dann dein HTML code

Beispiel

 Hallo Welt 

leider ist nun h1 mit einem style formatiert, der muss weg und in den style sheet
und der stylesheet muss in den html header rein also

 Hallo Welt 

die meinestyledatei.css sehen dann so aus

h1 {color: rgb(255, 102, 102);}

oder du arbeitest mit class zusammen z.b.

 Hallo Welt 







.roteSchrift {color: rgb(255, 102, 102);}

alles klar :smile:

Und wenn du alles richtig machst dann hast du alles im Css untergebracht und brauchst keine tags :smile:
Fazit: weg damit und rein ins Css.
Fördert auch die Übersicht.

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

Bist Du Dir sicher, RakonDark, dass Du mir antworten wolltest,

frägt DannyFox64

erneut.

Vielen Dank Euch allen.
Ich schiebe das Ganze glaub noch ein wenig hinaus, hätte ich doch mehrere hundert Unterseiten neu von Hand zu programmieren:

http://www.wandersite.ch

Vielleicht kann man ja eines Tages das Ganze automatisieren.

Hallo Ursi!

Vielen Dank Euch allen.
Ich schiebe das Ganze glaub noch ein wenig hinaus, hätte ich
doch mehrere hundert Unterseiten neu von Hand zu
programmieren:

http://www.wandersite.ch

Wenn ich mir so Deine Website betrachte, besser gesagt: auf mich wirken lasse - denn Zeit muss man da wirklich mitbringen -, dann kommt mir so der Gedanke: „Das (die Pflege der Site) ist eine Lebensaufgabe.“

Zumal Du ja wirklich mehr oder weniger alles manuell gemacht hast…

Vielleicht kann man ja eines Tages das Ganze automatisieren.

Bedingt ist das jetzt bereits möglich. Aber das kostet dann auch einige Euro oder Franken. Denn so etwas ist eine echte Herausforderung, eine Programmieraufgabe für Professionelle.

Aber nichtsdestotrotz gebe ich Dir gerne noch ein paar Informationen zur Hand für den Fall, dass Du Dich eines schönen Tages entscheidest, die Sache neu zu machen:

Ein sogenannter Relaunch (Um-/Neugestaltung einer Website) erfordert vor allem im Vorfeld viel Arbeit, vielleicht 80 oder 90 Prozent. Aber dann, über Nacht, innerhalb weniger Stunden kann man endlich ein Ergebnis dieser Arbeit sehen…

Und folgende Arbeitsschritte, ggf. ín etwas veränderter, d.h. angepasster Reihenfolge,

  • Entwicklung mehrerer Designs nach eigenem Geschmack (handgemalt, skizziert)

  • Entscheiden, welches Design, welches Layout die Website künftig bestimmen soll

  • Umsetzen des Designs in HTML/CSS

  • Ausgewählte Seite(n) auf allgemeine Tauglichkeit prüfen (z.B. auf einer separat eingerichteten Internet-Adresse/zweite Domain mit „mini“ Webspace

  • …auf Tauglichkeit in den wichtigsten Webbrowsern prüfen (IE, FF, Opera, …)

  • Erstellen von Vorlagen (Templates) auf dem Basis-Design (für jeweils verschiedene Seitentypen

  • Evtl. Absplitten von sich stets wiederholenden Blöcken in sog. Includes, die später ähnlich wie eingefügt werden können, jedoch immer nur einzeln, außerhalb der HTML-Seite bearbeitet werden, und deren Änderungen dann für alle „verlinkten“ Seiten gelten.

  • usw. usf.

  • Linkverzeichnisse/Datenlisten am besten auslagern, z.B. in eine Datenbank/Datenliste, die nur noch per Datenbank gepflegt wird; (im HTML als Includes einfügen)

  • usw. usf. …

So weit, so gut!

Ich hoffe, es ist Dir eine Anregung, wenn Du einmal den Rappel - oder wie sagt man bei Euch in der Schweiz - bekommst…

*LG*
CU DannyFox64

Ich gehe jetzt mal davon aus, dass Du bisher dein Layout mit Tabellen gelayoutet hast. Das wäre Murks. Tabellen sind, wie der Name schon sagt, zum darstellen von tabellarischen Daten gedacht und nicht zum Layout-Missbrauch.

Solche WYSIWYG-Editoren sind eine feine Sache, wenn man mit ihnen umzugehen weiß. Leider meinen viele sie könnten es, weil sie den Bockmist nicht sehen, den das Programm in den Quellcode schreibt. So ein Programm erzählt dir nix von Webstandards und dem was man macht oder besser nicht macht. Es folgt deinen Anweisungen stur. Und wenn Du es für sinnvoll erachtest die Breite eines Elements im HTML-Code anzugeben, wird dich das Programm nicht daran hindern, obwohl es Blödsinn ist.

Du musst dir darüber im klaren sein, dass CSS nicht mal eben schnell von heute auf morgen erlernbar ist. Oft gehen Jahre ins Land und man lernt noch dazu.

Doch die Arbeit lohnt sich, denn CSS ist die Zukunft und Tabellenlayouts sind Schnee von gestern. Und die Grundlagen sind doch recht zügig verinnerlicht.

Und wenn Du bisher nur mit einem solchen Editor deine Seiten erstellt hast und daher von HTML keine Ahnung hast, nutzt dir CSS auch nichts, weil Du dessen Einsatzmöglichkeiten nicht kennst. Das WIE und WARUM ist dir dann einfach ein Rätsel.

Ich arbeite schon seit längerem nicht mehr mit einem WYSIWYG-Editor, sondern code meine Seiten von Hand. Da weiß ich zumindest was ich im Quellcode habe.

Zu Frage 1: nicht zwangsläufig, aber lernen wirst Du allein mit WYSIWYG nichts.

Zu Frage 2: Schon allein alles von Tabelle auf DIVs umzustellen ist ne ganze Menge Abeit. Aber wie gesagt: es lohnt!

Wenn Du noch Fragen hast, da oben steht irgendwo meine Mailadresse.

Gruß Marcus.

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

Ich sag mal: wenn ich die Seite genau So wieder aufbauen müsste, wäre das eigentliche Layouten nicht das Problem. Eine klare Struktur ist eh recht schwer erkennbar… sorry.
Was die meiste Zeit in Anspruch nehmen würde, wäre nur der Inhalt der dann wieder eingefügt werden muss. Aber das ist dann Arbeit, bei der man nicht sonderlich viel nachdenken muss. Sie nervt nur und ist eintönig. Aber das ist die tägliche Arbeit im Berufsleben ja auch meistens.

Technische Schikanen hast Du ja nicht auf der Site. Das Meiste ist einfacher Text mit ein paar Überschriften, Bildern und Links etc. Layoutechnisch also keine große Herausforderung.

Gruß Marcus

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

Hallo Danny und Sven

Einige praktische Anleitungen habt Ihr mir gegeben - so etwas habe ich gesucht, vielen Dank! Vielleicht werde ich mich ja tatsächlich eines Tages hineinknieen.

Das mit dem Design ist mir bewusst; wer Lust und Zeit hat, eine bessere Struktur zu kreieren, ist herzlich eingeladen…

Allerdings werden meine Unterseiten zum Ausdrucken und In-den-Rucksack-Mitnehmen benutzt, weswegen ich sie so einfach wie möglich gestalte.