Ist das hier okay ?

Hallo,

ich habe nun mein Frameset in CSS geändert (puuh).
Ist das so in Ordnung: www.hamburgistschoen.de (ich red jetzt nur von der Startseite)

Das dieses Hintergrundbild verbunden mit dieser Schrift noch nicht als barrierefrei zu bezeichnen ist, ist mir klar; aber sonst ?

Gruß Karsten

Hab eben noch was neues gelernt :smile: aber werd es erst morgen umsetzen. Bei dem mittleren Bereich werde ich das float rausnehmen und ihn durch margin begrenzen, so das er sich zwischen der Navigationsleiste und dem Adventskalender beliebig anpassen kann; hoffe das ist so richtig ausgedrückt / gedacht ?

Gruß Karsten

Wow!

Was willst Du da noch verbessern? Was hast Du mit der Schrift? Wieviel höher ist denn Dein Anspruch?

Also, ich seh’ da keinen Restzweifel. Sonst jemand?

Also,

perfekter als perfekt geht nich’.

Aber, wo Du so rumzweifelst, is’ mir doch was aufgefallen:
… (seh’ das ganze zwar nur in 800 x 600 mit nur 16 Farben, probier’s mal aus ;o] aber) … wenn die Blautöne im Text bei 1200 x dingens (1024?) ungefähr dem entsprechen, was ich seh’, dann …
könnte es sein, daß OHNE das den Blautönen im hg-Bild entsprechende Blau im Text, dieses scheinende Blau - überhaupt die schönen Farben - im hg-Bild NOCH BESSER ZUR GELTUNG KOMMT ?

Hallihallo,

zunächst einmal, damit Du nicht gleich wieder die Lust verlierst :wink:
Ich erinnere mich dumpf an die Site vorher, und die sieht jetzt einfach auch ein ganzes Stück besser aus als vorher. Gut!

ich habe nun mein Frameset in CSS geändert (puuh).

Aber ich komme nicht umhin, die Sinnlosigkeit dieser Aussage zu kommentieren :wink:
Man kann ein Frameset nicht in CSS ändern. Ich weiß, was Du meinst, aber mitlesende Anfänger wissen das nicht. Deswegen habe ich schon so viele Fragen beantworten müssen „Wie mache ich meine Frames mit CSS?“ Das ist aber Unsinn :smile: Nein, ehrlich.

Es ist tatsächlich für CSS geplant, sowas wie Frames zu machen, aber halt rein in CSS. Das ist dann letztendlich aber was anderes als die Frames, wie man sie jetzt kennt. Es gibt auch keine Technik, mit der man „Frames ersetzen“ kann, wie ich das oft höre. Frames haben einige Vorteile, aufgrund derer die Leute diese nutzen. Die meisten dieser Vorteile lassen sich auf andere Weise abbilden. Dass ein Menü nur einmal geschrieben werden muss z.B. geht mit einer serverseitigen Include-Technik, hat aber auch nichts mit CSS zu tun.
Auch Seiten mit Framesets sollten mit CSS gelayoutet sein. Frames und CSS widersprechen sich nicht. Mit CSS kann man allenfalls das Feature von Frames ersetzen, dass Elemente einer Seite fix stehen bleiben.

Und nochmal klargestellt: Ich sage das nicht, weil ich Dich ärgern will, ich sage das nicht, weil ich Lob einheimsen will, oder weil ich glaube, ich wäre der einzige, der weiß, wie HTML/CSS funktioniert.
Ich sage das, weil ich einiges weiß und das Wissen teilen will. Und insbesondere weiß ich, dass Leute durch falsche Ausdrucksweise ihre Gedanken in die völlig falsche Richtung lenken und dadurch Fehler machen oder einige Dinge nicht verstehen. Dadurch erschließt sich das ansonsten sehr einfache CSS vielen nicht sofort.
Ich hab die selben Fehler auch gemacht und ich will nur den richtigen Weg weisen.

Ist das so in Ordnung: www.hamburgistschoen.de (ich red jetzt
nur von der Startseite)

Verbesserungsvorschläge:

  1. In der Überschrift „Hamburg ist schön“ formatierst Du „schön“ mit span. Gibt es kein passenderes Tag? Was willst Du damit erreichen, dass Du „schön“ einfärbst? Nur einen Farbklecks setzen? Oder soll das auch was bedeuten? Wie sprichst Du das aus? Betont? Wäre hier vielleicht ein „em“ angebracht, anstelle von span?
  2. Die erste Überschrift ist h1, die zweite h3. Wo ist h2?
  3. Überschrift h3, willst Du mit dem „strong“ wirklich sagen, dass diese Überschrift besonders wichtig ist, dass sie beim Vorlesen deutlich betont werden soll? Denn das ist es, was strong bedeutet. Es ist gegenüber em noch gesteigert.
  4. Der Text darunter „Im Forum…“ ist nicht als Textabsatz ausgezeichnet („p“).
  5. Das center-Tag ist deprecated und hat da nichts mehr zu suchen. Nutze text-align:center in CSS.
  6. Ich empfehle, alle CSS-Eigenschaften aus der HTML-Datei zu verbannen und alles in externe Stylesheets zu packen. Ist einfacher und übersichtlicher.
  7. In Deiner nav_list gibst Du jedem Listenelement die selbe Klasse. Je nachdem, was Du erreichen willst, geht das auch anders, z.B. mit
    „ul#nav_list li“ - Das beschreibt alle li, die unterhalb der ul mit ID „nav_list“ liegen. Du sparst Dir viel Tipparbeit und Deinen Besuchern lange Ladezeit.
  8. Eine Klasse „yellow“ zu nennen, ist nicht sehr weitsichtig. Das tolle an CSS ist, dass man Änderungen am Layout/Design der gesamten Site in nur einer Datei (Stylesheet) machen kann. Nennt man eine Klasse „yellow“ und ändert die Schriftfarbe irgendwann mal in Rot, steht man dumm da :smile: Auch das geeignete Wählen von Klassen- und ID-Namen gehört in die Kategorie „Trennung von Inhalt und Layout“. Mit diesem Klassenname steckt wieder Layout in der Datei für den Inhalt. Wähle Namen, die die Funktion beschreiben, nicht das Aussehen.

Alles in allem scheint mir, Du hast den Weg zu CSS geschafft. Der Rest kommt mit der Übung. Ich hoffe nicht, dass Du die Punkte oben negativ siehst, ich finde das alles sehr positiv.

Das dieses Hintergrundbild verbunden mit dieser Schrift noch
nicht als barrierefrei zu bezeichnen ist, ist mir klar; aber
sonst ?

Ach ja, genau, die Schrift ist zu klein. Ich empfehle, den FLießtext immer 100% bzw. 1em groß zu machen, denn das ist die Schriftgröße, die sich Dein Besucher als optimal eingestellt hat. Er möchte nicht, dass irgendeine Website daran was ändert. Wenn Du das tust und dann feststellst „Das ist ja viel zu groß“, dann solltest Du die Standard-Schriftgröße in Deinem Browser verkleinern. Wenn Du dann feststellst, dass häufig von Dir besuchte Websites zu klein sind, dann kann ich nur sagen „Willkommen im Club“. Dann merkst Du, wie doof das ist, wenn man dem Anwender seine bevorzugte Schriftgröße wegnimmt. (prinzipiell bezieht sich das auf alle Dinge, die man einem Besucher nimmt).
Versuch auch mal die Schriftgröße deutlich größer zu stellen und schau, was mit Deinem Menü passiert - oder meintest Du das oben?

Nochmal Fazit: Gelungene Änderungen. Du bist auf dem richtigen Weg!

Weiterhin viel Spaß,
-Efchen

Hallo,

wollt nur einmal kurz vorbeischauen um zu sagen Vielen Dank für die ausführliche, freundliche, konstruktive Antwort.
Durch privaten Streß bin ich leider z.zt. nicht in der Lage das umzusetzen. Ich wollte nur, das du weisst, das ich deine Antwort gelesen habe

Gruß Karsten

  1. In der Überschrift „Hamburg ist schön“ formatierst Du
    „schön“ mit span. Gibt es kein passenderes Tag? Was willst Du
    damit erreichen, dass Du „schön“ einfärbst? Nur einen
    Farbklecks setzen? Oder soll das auch was bedeuten? Wie
    sprichst Du das aus? Betont? Wäre hier vielleicht ein „em“
    angebracht, anstelle von span?

Du hast Recht, es sollte optisch und akkustisch betont sein. Also em und red, nun richtig so ?

  1. Die erste Überschrift ist h1, die zweite h3. Wo ist h2?

ouuups… kommt davon wenn man dauernd hin- und herbastelt. Erledigt.

  1. Überschrift h3, willst Du mit dem „strong“ wirklich sagen,
    dass diese Überschrift besonders wichtig ist

Nein. also weg damit. Danke.

  1. Der Text darunter „Im Forum…“ ist nicht als Textabsatz
    ausgezeichnet („p“).

Erledigt

  1. Das center-Tag ist deprecated und hat da nichts mehr zu
    suchen. Nutze text-align:center in CSS.

Auch erledigt

  1. Ich empfehle, alle CSS-Eigenschaften aus der HTML-Datei zu
    verbannen und alles in externe Stylesheets zu packen.

Kapiert und erledigt.

  1. In Deiner nav_list gibst Du jedem Listenelement die selbe
    Klasse. Je nachdem, was Du erreichen willst, geht das auch
    anders, z.B. mit
    „ul#nav_list li“ - Das beschreibt alle li, die unterhalb der
    ul mit ID „nav_list“ liegen.

Jetzt hab ich mich noch durch selfhtml gewühlt, kapier die Anwendung aber immer noch nicht *heul*

  1. Eine Klasse „yellow“ zu nennen, ist nicht sehr weitsichtig.

Hast Recht. Geändert in „important“

Alles in allem scheint mir, Du hast den Weg zu CSS geschafft.
Der Rest kommt mit der Übung. Ich hoffe nicht, dass Du die
Punkte oben negativ siehst, ich finde das alles sehr positiv.

Dankeschön :smile:

Ich empfehle, den
FLießtext immer 100% bzw. 1em groß zu machen, denn das ist die
Schriftgröße, die sich Dein Besucher als optimal eingestellt
hat.

Hmmm… welcher 0815-Internetsurfer stellt sich denn irgendwas an seinem Browser ein ? Ich denke mal die Meisten wissen gar nicht wie das geht. Darum auch die Voreinstellung „normal“ in den Browsern (was immer normal bedeuten soll).
Ich habe jetzt die px-Grüßen weggenommen und durch % - Größen ersetzt, so das die Proportionen zueinander stimmen und der Text okay aussieht, wenn ich es in Firefox oder IE auf „Standard“ oder „Normal“ setze.

Vielen Dank nochmal für deine Hilfe und vielleicht kannst du mir ja „ul#nav_list li“ nochmal erklären.

Gruß Karsten

Hmmm… welcher 0815-Internetsurfer stellt sich denn irgendwas
an seinem Browser ein ?

Es geht nicht darum, was irgendwer macht, sondern was möglich ist.
Und wenn Du eine andere Schriftart einstellst, nimmst Du den Anwendern, das so zu machen, wie sie es wollen. Ich habe meine Schrift z.B. kleiner gestellt. Auf vielen Websites kann ich nix mehr lesen, weil die Webmaster den Text gerne so klein hätten, wie ich das auch will. Bloß addieren sich dann beide Verkleinerungen hin zur Unlesbarkeit.

Oder der Sehschwache, das können auch schon alte Leute sein, die stellen ihre Schrift absichtlich größer. Kommen sie auf ne Website, wo das verstellt wird, sind sie - zu recht - sauer.

Der 0815-Surfer muss sich auch mit seinem Browser auseinander setzen. Wenn er etwas größer oder kleiner haben will, soll er das verstellen. Derjenige, der dieses Feature seines Browsers nutzt, ist verärgert, wenn er das für jede Website wieder anders einstellen muss.

„ul#nav_list li“ - Das beschreibt alle li, die unterhalb der
ul mit ID „nav_list“ liegen.

Jetzt hab ich mich noch durch selfhtml gewühlt, kapier die
Anwendung aber immer noch nicht *heul*

ul#nav_list li bedeutet:
Für alle Tags „ul“ mit der Id (definiert durch das #) mit Namen „nav_list“ und darunter alle „li“-Tags (durch Leerzeichen getrennt).
Eigentlich muss man das von rechts nach Links lesen, denn es gilt nur für alle li, die unterhalb einer ul mit der genannten id liegen.

„body div#Content p“ z.B. bezieht sich auf alle Absätze § des div mit Id „Content“ innerhalb des body.

„html body p.fliesstext“ bezieht sich auf Textabsätze der Klasse (.) „fliesstext“ innerhalb des Tags body das innerhalb des Tags html steht.

Alles klar? :smile:
-Efchen

sorry, aber in 16 Farben hat’s besser ausgesehen, da war alles heller.
(für die Hinterlegung der Schrift hatt’ ich da dasselbe Blau, wie das Leuchten im Bild, das’ jetzt nich’ mehr der Fall)
Jetzt hab’ ich alle Farben und alles is’ aber jetzt viel dunkler. Man erkennt kaum noch 'was.

Sieht ziemlich nächtlich aus.
Heller wär’ freundlicher.