Bitte mal Design bewerten

[Hanno]

Hallo
Wie so viele will ich heute mal mein neues Design vorstellen, was ich heute am Nachmittag erarbeitet habe. Ich würde miich auch über Verbesserungsvorschläge freuen.
http://www.sfbshop.de/Hanno%20Becker/
Gruß
Hanno

[Johannes Zeller]

Hallo Hanno

Wie so viele will ich heute mal mein neues Design vorstellen, was ich heute am Nachmittag erarbeitet habe. Ich würde miich auch über Verbesserungsvorschläge freuen.

Nun, als Design kannd man das bisher nich bezeichnen, z.Zt. ist es nur ein Layout. Ich finde es eigentlich ansprechend, da nicht zu überladen. Trotzdem sind da noch ein paar Punkte, die du verbessern könntest.

• Das Stylesheet ist in einer eigenen Datei besser aufgehoben.
• Es scheint, als hättest du keine Schriftart für den Fließtext definiert.
• Rechts ausgerichteter Fließtext ist in einer Sprache, die von links nach rechts gelesen wird, anstrenged zu lesen.
• Im Konqueror fehlt der rechte Rand deiner Navigation

http://www.sfbshop.de/Hanno%20Becker/

</faq/#Q-19>

Ich hoffe das hilft dir weiter

Schöne Grüße

Johannes

[Sönke Tesch]

Wie so viele will ich heute mal mein neues Design vorstellen, was ich heute am Nachmittag erarbeitet habe. Ich würde miich auch über Verbesserungsvorschläge freuen.

Sieht aus, als wenn jemand auf Karopapier Kästchen mit einem alten Filzstift ausgemalt hat - nur bei weitem nicht so interessant. Genau genommen ziehe ich die Nur-Text-Ansicht per Lynx der grafischen Darstellung sogar vor. Die lässt sich nämlich sehr schön lesen und wirkt nicht so "angestrengt gewollt, aber nicht gekonnt", daß ich ein schlechtes Ohje-Gewissen kriegen müsste ;)

Sorry für den Verriss, aber ich kann da für mich beim besten Willen nichts optisch ansprechendes entdecken (und Inhalte, die darüber hinweg helfen könnten, hast Du ja noch nicht).

Was Du strukturell besser machen könntest:

Die Text-Version ist ja -wie bereits gesagt- eigentlich sehr gut gelungen (Absicht oder nicht:), nur leider hast Du irgendwie auf einen Titel verzichtet, so daß man nicht unbedingt auf Anhieb weiß, wer da "über mich" schreibt. Setz' doch noch ein <h1> mit Text rein, dann wäre es perfekt.

Ganz daneben in dieser Ecke der Seite ist das Einbinden der Titelgrafik als Hintergrundbild einer Tabellenzelle. Dafür sind Hintergründe nicht gedacht! Verwende <img>, das funktioniert genauso gut und mit Alternativtext erledigt sich dann auch die Geschichte mit dem <h1>-Text.

In Deinem Stylesheet taucht die Zeile "font-size:2pt" auf. Schriftgröße mit 2 Punkt Höhe kann niemand mehr lesen (ok, mit dem Mikroskop auf Papier vielleicht, aber definitiv nicht am Bildschirm), insofern ist diese Angabe sinnlos. Willst Du die Höhe des Elements bestimmen, benutze height (und lasse das Element _ganz_ leer).

Überhaupt wäre es schön, wenn Du statt fester Zeichengrößen relative Angaben wie em oder Prozent nutzen würdest, und auch diese nur dort, wo Text größer oder kleiner als normaler Fließtext gestaltet werden soll.
Die 7 Punkt, die Du verwendest, sind vielleicht für Deine Wünsche passend, aber nicht jeder hat so gute Augen. Auf meinem Monitor erreicht das große Ü von "Über mich" eine Höhe von etwas mehr als zwei Millimetern (der TFT-Monitor ist auf Optimalauflösung eingestellt).
Belasse es doch einfach bei der Einstellung, die der Leser (der Deine Seiten ja schließlich lesen soll) für sich am Browser eingestellt hat - Du tust ihm oder ihr damit einen großen Gefallen!

Der Text "Alle Grafiken sind ohne Erlaubnis nicht anderwärtig zu verwenden." am unteren Rand (auf wahrscheinlich jeder Seite) wirkt gelinde gesagt reichlich deplaziert, und das nicht nur, weil dem Menü nach zu urteilen Deine Seite sich noch nicht einmal hauptsächlich mit Grafiken beschäftigen wird.
Eine Impressumsseite ist für solche Geschichten der ideale Ort. Und falls Du wirklich soviel Angst hast, daß jemand bei Dir Grafiken klaut: Die Leute, die sich an die guten Sitten halten, brauchst Du nicht mit einem extra Text jedesmal auf Deine Rechte hinzuweisen, und der Rest klaut so oder so. Du hast auch keinerlei rechtliche Vorteile, wenn der Hinweis auf jeder Seite statt nur im Impressum auftaucht.

Auf der Kontaktseite hast Du ein Auswahlfeld "Typ". Sowas mag bei großen Konzernen sinnvoll sein, um verschiedene Abteilungen anzusprechen (Kundendienst, Entwicklung, Webmaster), bei Dir ist das aber eher unnötig, Du liest doch sicher eh alles, oder werden "Kritiken" gleich gelöscht? Zumal eine Bitte auch eine Frage ist. Und was mache ich, wenn meine Kritik auch die Bitte um Besserung enthält, muß ich dann zweimal schreiben? ;)

Gruß,
  soenk.e

PS: Und bitte daran denken, Design ist Geschmackssache.

[molily]

Hallo Sönke und Hanno,

Die Text-Version ist ja -wie bereits gesagt- eigentlich sehr gut gelungen (Absicht oder nicht:), nur leider hast Du irgendwie auf einen Titel verzichtet, so daß man nicht unbedingt auf Anhieb weiß, wer da "über mich" schreibt. Setz' doch noch ein <h1> mit Text rein, dann wäre es perfekt.

Du willst auf einen site-weit einheitliches h1-Element hinaus (<h1><img alt="Private Homepage von Hanno Becker"></h1> oder ähnlich)? Welches Überschriftselement würden dann »Themen« und »Startseite« tragen, etwa h2?

Ganz daneben in dieser Ecke der Seite ist das Einbinden der Titelgrafik als Hintergrundbild einer Tabellenzelle. Dafür sind Hintergründe nicht gedacht! Verwende <img>, das funktioniert genauso gut und mit Alternativtext erledigt sich dann auch die Geschichte mit dem <h1>-Text.

Das wäre in diesem Falle wenig sinnig, da die Hauptüberschrift des Dokuments dort anzusiedeln ist, wo im Layoutentwurf »Startseite« steht. Auf den Folgeseiten würde dort höchstwahrscheinlich der Seitentitel (Über mich->Allgemeines, Über mich->Referenzen, Projekte->eCommerce Lösung etc.) untergebracht, sofern ich Hannos Rohling verstehe.
Deinem Vorschlag nach müsste entweder der Dokumenttitel an der genannten Stelle ebenfalls mit einem h1-Element ausgezeichnet werden, oder müsste genauso wie »Themen« als h2 ausgezeichnet werden.

Ich neige bei solchen Layouts dazu, die Kopfgrafik nicht als Überschriftselement auszuzeichnen, wenn sie zwar den Sitenamen als Schriftzug enthält, aber der Sitename konsequent auf jeder Unterseite im title-Element mitgeführt wird, sodass eine Wiederholung am Dokumentanfang durch einen transformierbaren Text unnötig ist. Um diese Wiederholung bspw. beim Vorlesen zu vermeiden, ist es m.M.n. durchaus naheliegend, eine Grafik mit leerem Alternativtext beziehungsweise noch konsequenter wie Hanno ein CSS-Hintergrundbild zu verwenden.

In dem Fall würde h1 für den Dokumenttitel nach der Navigation und vor dem Inhalt verwendet und die Navigation hätte keine Überschrift und stände am Dokumentanfang:

<title>Sitename - Dokumentname [o.ä.]</title> [Element mit Kopfgrafik ohne Alternativtext] ...Primärnavigation... <h1>(Rubrikname -) Dokumentname</h1> ...Hauptinhalt...

(Oder abgewandelt: Wenn die Kopfgrafik primär als ein Link zur Startseite betrachtet wird, dann ist ein img-Element nötig und ein hX-Element ebenfalls sinnlos und der Alternativtext sollte »Zurück zur Startseite« oder ähnlich lauten.)

Da im konkreten Fall jedoch eine Überschrift für die Navigation vorliegt, sollte tatsächlich abgewogen werden, ob ein solches Muster angemessen wäre:

<title>Sitename - Dokumentname [o.ä.]</title> <h1>Sitename</h1> <h2>Themen</h2> ...Primärnavigation... <h2>(Rubrikname -) Unterrubrik</h2> ...Hauptinhalt...

Ich stehe dem JavaScript-Menü kritisch gegenüber, da es vermutlich nicht erlaubt, einen angewählten Menüpunkt hervorzuheben und ohne JavaScript scheint es nicht zu funktionieren (was sich aber über noscript bzw. CSS via JavaScript o.ä. umgehen ließe). Ein breadcrumb trail scheint auch nicht geplant zu sein, es ist auch nicht ersichtlich, ob und wie sich die Rubrikstruktur in den Überschriften wiederfinden soll.

Grüße,
Mathias

[Chräcker Heller]

Hallo,

mal positiv formuliert: ich empfinde das Aussehen der Seite als "nicht störend".... allerdings auch nicht viel mehr. Es wirkt recht neutral, und somit, in der Tat, etwas langweilig. (Dabei: ich mag eigentlich gestaffelte Menüs nicht so gerne, aber Deine Lösung/Variante gefällt mir noch recht gut....)

Ich sehe an Deiner Seite zwei Dinge: Du hast Engangement und freust Dich zu lernen, und Du scheinst einen Willen zu haben, Deine technischen Versuche in ein ansprechendes Kleid zu packen. Was Dir (und der Seite) jetzt fehlt, ist eine wirkliche "Aufgabe", vulgo "Inhalt". Stell Dir vor, Dur programmierst eine Datenbank nach der anderen, jeder irrer als die vorige, aber niemand nutzt die. Alle virtuellen Karteikärtchen bleiben unausgefüllt, niemand braucht die Suchroutiene, weil je Datenbank eh nur 3 Datensätze mit den Worten "Test" gefüllt wurden.... Das wäre doch eine heillose Verschwendung von Energie.

Das was Du da präsentierst, ist ein Blick in Deinen wohlgeordneten Werkzeugkoffer, bei dem man sieht, das er nicht nur mit Wissen und einer gewissen Liebe gefüllt wurde, sondern das Du auch weist, wie man diese Werkzeuge benutzen kann. Jetzt mach ihn wieder zu, überlege Dir, was für ein Werkstück Du nun bearbeiten willst, und zeige niemals wieder Deinen Werkzeugkoffer. (Ausnahme: Du willst einmal Deine Tätigkeiten verkaufen/vermieten: dann kann es auf Deiner Referenzseite nicht schaden, den potentiellen Kunden Deine Werkzeuge kurz zu zeigen).

Such Dir ein Thema, Eine spannende Sache, eine wichtige, oder etwas, für das man sich engagieren könnte, etwas was Spaß macht oder sonst was und erarbeite dann mit Deinem Wissen und Deiner Lernfreude eine tolle Seite.

(Sollte Dir nichts einfallen, kann ich das verstehen, geht mir auch oft so. Dann laß den Werkzeugkasten in Deinem Hobbykeller und bastel erst mal da vor Dich hin, das machen viele so. )

Chräcker