Hallo,

ich bin mal wieder am basteln einer Website (bei der ich diesmal komplett freie Hand habe ). Und zwar geht es um unsere Schul-HP: steenbeck-gymnasium.de -> index.php (getrennt wegen google ).

Was haltet ihr bisher Verbesserungswürdig? Was würdet ihr anders lösen? Diese beiden Fragen betreffen vor allem den Contentbereich, denn da gefällt mir das bisherige noch nicht (erdrückt etc.) und die "aktuellen Termine".

Was meint ihr?

Grüße
Heiko


Moderiert von Narses: Topic aus Sonstiges (Delphi) verschoben am Di 03.06.2008 um 17:34

Du magst wenig dezente Verläufe an den Rändern, oder? ^^

a) Etwas viel grau, vor allem im Hauptmenü - das ist doch für die meisten Besucher zuerst mal am Interssantesten, warum muss das dann grau (= inaktiv und unscheinbar) sein?

b) Trebuchet MS ist eine eher schlanke Schrift, d.h. sie wirkt vor allem, wenn der Text auch groß ist. Als Überschrift ist sie im Inhaltsbereich obendrüber daher gut eingesetzt, aber du benutzt sie auf der Homepage bei der Auflistung der Einträge auch in einer deutlich kleineren Größe - und das wirkt merkwürdig, weil die Überschrift nicht über-, sondern untergeordnet wirkt.

c) Eben diese "Artikelboxen" wirken sehr steif und eng, mach doch einfach ein bisschen mehr Abstand zwischen den einzelnen Boxen und/oder schaff innerhalb der Boxen oben und unten mehr Platz. Und mach die Texte länger. Wenn es nicht viel zu berichten gibt, kann das doch besser ganz auf der Homepage stehn. Gleiches gilt für "normale" Inhaltsseiten - mehr Abstand vor dem Text zu diesem grauen Balken unter der Überschrift! Und vielleicht ein leicht vergrößerter Zeilenabstand?

d) Du verwendest viele verschiedene Blau und Lila Töne - auch für Links, aber nicht nur. Das verwirrt. Für geübte Benutzer ist zwar klar, was klickbar sein wird und was nicht, aber z.B. rechts im Kalender stechen die klickbaren Zahlen nicht besonders hervor, weil auch andere Teile des Kalenders Blau/Lila sind.

e) Die Überschriften links und rechts wirken wegen dem geringen Kontrast Weiß-auf-Hellblau nicht besonders stark. Das Design ist generell geprägt von hellen Farben und wenig krassen Kontrasten. Das macht die schnelle Orientierung etwas schwierig, z.B. fällt ein gutes Feature wie die "Aktuelle Termine" Box am rechten Rand dadurch erst spät ins Auge.

f) Insgesamt fehlt der Seite ein wenig Übersichtlichkeit, zumindest für meinen Geschmack. Wie wärs, auf 2 Spalten umzusteigen?

Deine Idee war offenbar, das Blau aus dem Logo quasi als "Corporate Color" neben Weiß und Grau zu verwenden. Das ist an sich natürlich eine gute Idee, aber du hast meiner Meinung nach zu stark zu hellen Blau und Lila Tönen gegriffen - setz eher auf ein dunkleres Blau, dann hast du einen stärkeren Kontrast und kannst besser Highlights setzen.

Ich glaube das waren so die Punkte, die mir am stärksten ins Auge stachen - lass dich nicht abschrecken, nichts hiervon ist böse gemeint. Grundsätzlich muss ich sagen, hast du gute Arbeit geleistet, ein gut strukturiertes Hauptmenü hingekriegt, praktische Features integriert und auch technisch im Grunde einwandfrei gearbeitet (obwohl Tabellen als CSS Fix im IE zu verwenden zwar quick aber vor allem ziemlich dirty ist ).

Heyho,

da ich vor gut einem halben Jahr noch sehr in der Designszene tätig war, ist mir natürlich sofort aufgefallen, das die Website grafisch "meiner Meinung nach" nicht so ganz auf der höhe ist. Diese beiden Blautöne ( links im Frame und im Hauptcontent ) passen nicht so wirklich zusammen und die Buttons finde ich auch nicht so toll

Ich finde du solltest dir mal ein paar Tutorials zum erstellen von Buttongrafiken etc. durchlesen www.tutorialized.com...oshop/Web-Graphics/1 dort sind sehr schöne Beispiele zu finden...


LG

GericasS

GruppeCN hat folgendes geschrieben:

Du magst wenig dezente Verläufe an den Rändern, oder? ^^

Willst du mal als vergleich dir die Vorlage angucken? Dann schau dir mal das hier an. Ich glaube, da habe ich doch noch ein bisschen herausgeholt .

GruppeCN hat folgendes geschrieben:

a) Etwas viel grau, vor allem im Hauptmenü - das ist doch für die meisten Besucher zuerst mal am Interssantesten, warum muss das dann grau (= inaktiv und unscheinbar) sein?

Der HEader und der Foot sind grau. Da wollte ich noch im mittleren Bereich ein bissl grau ahben, damit der Header/Footer nicht zu sehr hervorstechen. Und eine rein blaues Layout wirkt nicht (zum testen habe ich lokal mal alles grau gegen gblau ausgetauscht...)

GruppeCN hat folgendes geschrieben:

b) Trebuchet MS ist eine eher schlanke Schrift, d.h. sie wirkt vor allem, wenn der Text auch groß ist. Als Überschrift ist sie im Inhaltsbereich obendrüber daher gut eingesetzt, aber du benutzt sie auf der Homepage bei der Auflistung der Einträge auch in einer deutlich kleineren Größe - und das wirkt merkwürdig, weil die Überschrift nicht über-, sondern untergeordnet wirkt.

Mit Schriftarten kenne ich mich ehrlicherweise gesagt kaum aus. Und die Standardschriftart wirkt mir im FF zu kantig (verdana) .

GruppeCN hat folgendes geschrieben:

c) Eben diese "Artikelboxen" wirken sehr steif und eng, mach doch einfach ein bisschen mehr Abstand zwischen den einzelnen Boxen und/oder schaff innerhalb der Boxen oben und unten mehr Platz. Und mach die Texte länger. Wenn es nicht viel zu berichten gibt, kann das doch besser ganz auf der Homepage stehn. Gleiches gilt für "normale" Inhaltsseiten - mehr Abstand vor dem Text zu diesem grauen Balken unter der Überschrift! Und vielleicht ein leicht vergrößerter Zeilenabstand?

Mit Artikelboxen meinste die News? Das ist dort ne Übergangslösung. Mir gefällt es selber noch nicht so recht - allerdings habe ich auch keine bessere Idee.
@längere Texte: Darauf habe ich keinen Einfluss . Ich kanns aber mal an die Autoren weiterleiten.

GruppeCN hat folgendes geschrieben:

d) Du verwendest viele verschiedene Blau und Lila Töne - auch für Links, aber nicht nur. Das verwirrt. Für geübte Benutzer ist zwar klar, was klickbar sein wird und was nicht, aber z.B. rechts im Kalender stechen die klickbaren Zahlen nicht besonders hervor, weil auch andere Teile des Kalenders Blau/Lila sind.

Eigentlich ist es nur ein blau - in verschiedenen Helligkeitsstufen. Und ich wüsste nicht, wie ich die Links sonst hervorheben könnte. Nen fettes schwarz erschlägt einfach .

GruppeCN hat folgendes geschrieben:

e) Die Überschriften links und rechts wirken wegen dem geringen Kontrast Weiß-auf-Hellblau nicht besonders stark. Das Design ist generell geprägt von hellen Farben und wenig krassen Kontrasten. Das macht die schnelle Orientierung etwas schwierig, z.B. fällt ein gutes Feature wie die "Aktuelle Termine" Box am rechten Rand dadurch erst spät ins Auge.

Ich hatte die Header zuerst dunkler. Aber da wirkte der Übergang von der Überschrift zum Kalenderheader. Von daher hatte ich es ein bisschen aufgehellt. Allerdings haste recht, das da ein höherer Kontrast besser wäre .

GruppeCN hat folgendes geschrieben:

f) Insgesamt fehlt der Seite ein wenig Übersichtlichkeit, zumindest für meinen Geschmack. Wie wärs, auf 2 Spalten umzusteigen?

Wenn ich die Teile von rechts links unten ranpacken würde, wäre die Seite imho zu lang. Und bei der letzten Website wurde mir der Hinweis gegeben, dass der Inhaltsbereich nicht zu breit sein sollte (damals hatte ich ungefähr die gleiche Breite, aber nur ein 2-spalten-Layout).

GruppeCN hat folgendes geschrieben:

Ich glaube das waren so die Punkte, die mir am stärksten ins Auge stachen - lass dich nicht abschrecken, nichts hiervon ist böse gemeint. Grundsätzlich muss ich sagen, hast du gute Arbeit geleistet, ein gut strukturiertes Hauptmenü hingekriegt, praktische Features integriert und auch technisch im Grunde einwandfrei gearbeitet

Solche Kritikien sind mir lieber, als die Kommentare, die ich bisher gehört habe (den meisten gefällt die Seite so, ohne eine einzige Kritik zu haben...)

GruppeCN hat folgendes geschrieben:

(obwohl Tabellen als CSS Fix im IE zu verwenden zwar quick aber vor allem ziemlich dirty ist ).

ich war froh, dass ich irgendwann das Menü übernommen bekommen habe. Da habe ich jetzt nicht weiter probiert. Im Endeffekt ist mir aber ein Tabellen-Hack lieber als per JS nachzuhelfen .

GericasS hat folgendes geschrieben:

da ich vor gut einem halben Jahr noch sehr in der Designszene tätig war, ist mir natürlich sofort aufgefallen, das die Website grafisch "meiner Meinung nach" nicht so ganz auf der höhe ist. Diese beiden Blautöne ( links im Frame und im Hauptcontent ) passen nicht so wirklich zusammen und die Buttons finde ich auch nicht so toll

Um genau zu sein bin ich eigentlich nur Hobbyprogrammierer und kein Grafiker . Mit den letzten Websiten musste ich mich ersteinmal in mein Grafikprogramm ein bissl einarbeiten (davor hat mir ausschneiden etc. gereicht ).

GericasS hat folgendes geschrieben:

Ich finde du solltest dir mal ein paar Tutorials zum erstellen von Buttongrafiken etc. durchlesen www.tutorialized.com...oshop/Web-Graphics/1 dort sind sehr schöne Beispiele zu finden...

Joar, müsste ich mal machen - auch wenn ich eigentlich kein Grafiker werden will - aber besser ist, man beherrscht es ein bissl.

Och, ich finds ganz nett.
Trotzdem muss ich GruppeCN bei den meisten Punkten zustimmen, nur bei einem nicht: Links kann man nun wirklich nicht schlecht erkennen. Die sind doch sauber hervorgehoben mit Fett+Blau...

Ich hab allerdings ein Problem gehabt rauszufinden wo ich grade bin. Eventuell solltest du den Text "Menü" ersetzen durch die entsprechende Kategorieüberschrift (Schule,Freizeit,Service usw). Die Breadcrumbs sind zwar direkt drüber, aber irgendwie übersieht man das leicht. Ich wusste grad nicht, wo nun auf einmal die Termine herkamen, da ich über den Kalender reingegangen bin.

Martok hat folgendes geschrieben:

Ich hab allerdings ein Problem gehabt rauszufinden wo ich grade bin. Eventuell solltest du den Text "Menü" ersetzen durch die entsprechende Kategorieüberschrift (Schule,Freizeit,Service usw). Die Breadcrumbs sind zwar direkt drüber, aber irgendwie übersieht man das leicht. Ich wusste grad nicht, wo nun auf einmal die Termine herkamen, da ich über den Kalender reingegangen bin.

Ja das ist ein mir bekannter Punkt. Das Problem ist, dass TypoLight keinen mir bekannten Hack bietet um den aktuellen Titel auszulesen - und ich wollte nicht für jede Seite ein extra Layout festlegen.

Du meinst also, das bei den Terminen z.B. statt "Menü" "Service" dasteht?

PS: Und wie würdest du es bei den Fächern lösen? Denn Naturwissenschaften etc. steht ja später nicht mehr im Submenü - obwohl es ja in der 2. Ebene liegt (bei den anderen Seiten fängt das Untermenü unterhalb der ersten Ebene an).

Falls du Grafiken brauchst kann ich dir gerne helfen, hab aber nicht alzu viel Zeit aber kannst dich ja mal melden PN oder ICQ 339397936

Heiko hat folgendes geschrieben:

Ja das ist ein mir bekannter Punkt. Das Problem ist, dass TypoLight keinen mir bekannten Hack bietet um den aktuellen Titel auszulesen - und ich wollte nicht für jede Seite ein extra Layout festlegen.

Einer der Gründe, warum ich nich auf ein CMS als CMS setze. WP hat das mit den Kategorien einfach viel schöner und flexibler.

Heiko hat folgendes geschrieben:

Du meinst also, das bei den Terminen z.B. statt "Menü" "Service" dasteht? PS: Und wie würdest du es bei den Fächern lösen? Denn Naturwissenschaften etc. steht ja später nicht mehr im Submenü - obwohl es ja in der 2. Ebene liegt (bei den anderen Seiten fängt das Untermenü unterhalb der ersten Ebene an).

Das ist doof, hab ich grade erst getestet. Notlösung: mach die Breadcrumbs deutlicher. Wenn man weiß, dass sie da sind ist das kein Problem. Nur hab ich die halt nicht auf Anhieb gefunden.

So, ich habe gerade nochmal wegen den Schriftarten gesucht, und nen guten Hinweis gefunden. Was haltet ihr von "Helvetica" (mir firebug einfach mal einfügen)