Neues Design für eine Van Gogh - Seite

[MasterOfDsaster]

Bin gerade dabei eine Webseite über Vincent Van Gogh zu gestalten.
Inhalt ist bis jetzt nur Blindtext!

Wie findet ihr das Design? Habt ihr Verbesserungsvorschläge?

Bekannte Fehler (würde mich über Hilfe freuen):
1. Da ich den Links in der Lightbox einen bestimmten Stil gegeben habe, sehen die Visited Links auf der ganzen Seite so klein aus...
2. Obwohl ich in den HTML-Dateien die Unmlaute durch HTML-Code ersetzt habe klappts nich... Zeichensatz der Page vielleicht ändern?
Mfg, Jonas


LINK: Gogh.ch - Die umfangreichste Internetseite über Vincent Van Gogh

 

[MasterOfDsaster]

Viele Neuerungen und Verbesserungen, weitere Meinungen?

 

[gollum1990]

Sagenhaft.

Das Design topt alles was ich bisher gesehen habe. Klasse Arbeit!
Besonders der Grün Ton, gefällt mir besonders gut, die Navigation sieht auch super aus. Bis auf das man auf den Schriftzug klicken muss, damit sich etwas tut. Ansonsten eine stilvolle Seite die mir gut gefällt.

Zum Code, kann ich dir nicht viel sagen, aber der Validator schon. :)
30 Fehler überzeugt nicht gerade. :)
W3C: [Invalid] Markup Validation of http://www.gogh.ch/ - W3C Markup Validator

Der CSS Code ist auch mit diversen Warnungen und Fehlern übersäht, siehe Link.
Ergebnisse des CSS-Validators http://www.gogh.ch/ (CSS level 2.1)

 

[Körnerbrötchen]

Muss gerade essen, aber soviel erst einmal: Es fehen Hover-Effekte bei den Links. Man erkennt sich daher als solche nur schwer.

 

[Maxi]

Ich hab die Navigation erst etwas gesucht (unterm Bild erwartet) - aber sonst echt super.

 

[haddi]

Die Schriftart bei der Navigation passt, finde ich, nicht dazu.
Ansonsten schönes, warmen & farbenfrohes Design.

 

[sysop]

sehr gelungen !!

mich stört die schriftart der navigation auch etwas. ob die navi unter dem bild sein sollte oder nicht, ist sicher geschmackssache, könnte man ausprobieren. aber wie gesagt, sehr gelungen !

 

[neuroleptika]

Die Schrift in der Navigation ist Georgia. Bei kleinen Schriftgrößen verklumpen die feinen Serifen. Deshalb wirkt es etwas pixelig.
Die blauen Überschriften (span) sind nur 1px-Wert größer und wirken schon sauberer.


Die Überschriften sind als Grafik ( <div id="picture"><img.. ) ohne alt-Text eingefügt. Das solltest du ändern.
Die nächsten "Überchriften" sind mit einem <span> gestylt. Besser währe <hx>
Wenn man nicht über die Startseite reinkommt ist nicht sofort ersichtlich, daß es um van Gogh geht. Die Domain in der Grafik reicht meiner Meinung nach dafür nicht aus.

Das Inhaltverzeichnis/Sprungmenü unter Biografie enthält Verweise zu Kapiteln die es (noch) nicht gibt.
Ich würde sie solange entfernen.

Die Navigation fliegt bei Schriftvergrößerung auseinander. Ursache ist ein Abstandshalter (div) mit width in em.
Wenn du den Letzten Menüpunkt nach rechts floatest kannst du auf den Abstandshalter verzichten.
Im IE lässt sich die Schrift (wegen font-size in px) überhaupt nicht ändern.

Das Menü selber würde ich als Liste auszeichnen.

 

[MasterOfDsaster]

Bin gerade bei der Validierung der Seite.

Verstehe soweit alles, nur ein Problem habe ich noch:

in der Datei Gogh.ch - Die umfangreichste Internetseite über Vincent Van Gogh

Zeile: 20
Spalte: 8
Fehler: div ist an dieser Stelle nicht erlaubt.Es befindet sich evtl. ein Block-Element innerhalb eines Inline-Elements. Auch verschachtelte Block-Elemente könnten diesen Fehler verursachen, da Block-Elemente nicht beliebig verschachtelt werden dürfen. Dies ist abhängig von den verwendeten [X]HTML-Elementen.
Fehlerstelle: <div id="menuebox">

Meine CSS-Date befindet sich hier: www.gogh.ch/css/screen.css

Würde mich über eure Hilfe freuen, Gruß, Jonas

 

[_Thor_]

Block-Elemente sind in Inline-Elementen nicht erlaubt, dein <div> steht in einem <span>, das ist der Fehler.

 

[neuroleptika]

...Es befindet sich evtl. ein Block-Element innerhalb eines Inline-Elements...

Die Antwort steht bereits in deinem Post.

<span class="nav">
<div id="menuebox">
<div id="menue">
<div class="aussenallein">
...

Span ist ein inline-Element und div ein Block-Element.
Schreibe <div class="nav">

 

[_Thor_]

Wo du schon am überarbeiten bist, könntest du gleich noch etwas Semantik hinzufügen, denn auf jeder Seite sehe ich fast nur <a>,<img>,<div> und <span>, manchmal ein <p>, tief vergraben unter etlichen <div>.

Nirgends eine Liste oder eine Überschrift.

<div id="entry1" class="cushycms">
  <a href="biographie.html">
    <img src="img/ga1.jpg" class="thumb" alt="" />
    <span class="heading_left">Das sagenhafte Leben des Vincent van Gogh</span>
  </a>
  <br />
  Vincent Willem van Gogh, der am 30. März 1853 in Groot-Zundert, Niederlande geboren wurde gilt als Wegbereiter der modernen Malerei. Ihm wird oft nachgesagt, er sei geistig verwirrt gewesen und habe sich im Wahn das rechte Ohr abgeschnitten. Sein Hauptwerk, das stilistisch dem Postimpressionismus zugeordnet wird, übte starken Einfluss auf nachfolgende Künstler aus. Gogh starb am 29. Juli 1890 in Auvers-sur-Oise, Frankreich durch einen Suizid.
</div>

Richtig wäre

<a href="biographie.html"><img src="http://www.gogh.ch/img/ga1.jpg" alt="" /></a>
<h2><a href="biographie.html">Das sagenhafte Leben des Vincent van Gogh</a></h2>
<p>
Vincent Willem van Gogh, der am 30. März 1853 in Groot-Zundert, Niederlande geboren wurde gilt als Wegbereiter der modernen Malerei. Ihm wird oft nachgesagt, er sei geistig verwirrt gewesen und habe sich im Wahn das rechte Ohr abgeschnitten. Sein Hauptwerk, das stilistisch dem Postimpressionismus zugeordnet wird, übte starken Einfluss auf nachfolgende Künstler aus. Gogh starb am 29. Juli 1890 in Auvers-sur-Oise, Frankreich durch einen Suizid.
</p>
<hr />

 

[MasterOfDsaster]

Bin gerade dabei meinen Code mithilfe der Tipps von _Thor_ zu überarbeiten.

Jetzt habe ich das Problem, dass der IE den <hr />-Tag falsch interpretiert (7px-Problem).

Deswegen bin ich wieder auf die Span-Lösung ausgewichen, doch jetzt meint der Validator, Block und Inline-Elemente wären wild durcheinander...

Mein Code:

<div id="left">
    <span class="entry">
        <a href="biographie.html"><img src="img/ga1.jpg" class="thumb" alt="" /></a>
        <a href="biographie.html"><h2>Das sagenhafte Leben des Vincent van Gogh</h2></a>
        <p>Vincent Willem van Gogh, der am 30. März 1853 in Groot-Zundert, Niederlande geboren wurde gilt als Wegbereiter der modernen Malerei. Ihm wird oft nachgesagt, er sei geistig verwirrt gewesen und habe sich im Wahn das rechte Ohr abgeschnitten. Sein Hauptwerk, das stilistisch dem Postimpressionismus zugeordnet wird, &uuml;bte starken Einfluss auf nachfolgende Künstler aus. Gogh starb am 29. Juli 1890 in Auvers-sur-Oise, Frankreich durch einen Suizid.<a href="biographie.html"><span class="more"> weiterlesen</span></a></p>
    </span>

Gruß, Jonas

 

[_Thor_]

<span> ist ein Inline-Element, in diesem darfst du keine Block-Elemente verwenden. Das <h2> und <p> in dem <span> sind Block-Elemente.

Zu dem Problem mit dem <hr />, das lässt sich sicher lösen, musst es uns nur mal zeigen.

 

[MasterOfDsaster]

Würde gerne das <hr> weglassen und stattdessen so weitermachen, wie ich bis jetzt bin. Mit was muss ich das span-Tag ersetzen um valide zu werden?

In beiden Browsern (IE & FF) wird die Seite jetzt korrekt dargestellt.

 

[MasterOfDsaster]

Habe im Header nun den Text "Vincent van Gogh" probeweise als normale Schrift geschrieben. Musste dazu die Größe 182px nehmen. Jetzt ist das Schriftbild ziemlich pixelig. Kann ich was dagegen tun?