Reboot
1.5.2006· 17
Hiermit präsentiere ich euch mein neues Design namens »Spring Breeze«. Mit diesem Redesign wollte ich vor allem große Schrift und flexibles Layout (macht mal das Browserfenster kleiner) einführen.
One Size Fits All
Wichtig war mir aber auch, dass Besucher mit kleinen Monitoren nicht ins Hintertreffen geraten. Wenn man bei einer Fenstergröße von 800×600 die Schrift verkleinert (mit »STRG« + »-«) sieht bensite.net noch immer so aus, als wäre es speziell diese Einstellung gemacht worden.
Der Feinschliff …
- Voriges
Design
… fehlt noch. Die Level 2-Navigation auf Seiten wie Webdesign ist einstweilen nur eine Liste und die Abstände der einzelnen Elemete passen auch noch nicht ganz. Und versucht nicht, beniste.net mit dem IE 6 anzuschauen. In zeitgemäßen Browsern – Firefox 1.5, Opera 8.5 und IE 7 Beta 2 – sieht die Seite aber gut aus (freue mich über Feedback von Safari-Benutzern).
Das letzte Design (»Mayflower«) könnt ihr euch noch auf Flickr anschauen.
Feedback
Ich freue mich sehr über Feedback. Bitte vergesst nicht, meine Seite direkt auf CSS Reboot zu bewerten. Danke!
English Version
Especially for all the interested folks from CSS Reboot.
This is my new design called »Spring Breeze«. With the new design I wanted to introduce big fonts and a liquid layout (try decreasing the browser window).
One Size Fits All
I also wanted the new site to be viewable on smaller monitors and resolutions. If you decrease the font size (using »CTRL« + »-«) on smaller resolutions or browser windows the site still looks like it was made for these settings.
The Finishing Touches …
- Previous
Design
… are coming soon. The level 2 navigation on pages like Webdesign is just a plain list and some margins don’t feel right yet. And don’t try to view this site with IE 6. On modern browsers – like Firefox 1.5, Opera 8.5 and IE 7 Beta 2 – it looks good though (Safari feedback appreciated).
You can take a look at the previous design (»Mayflower«) on Flickr.
Feedback
I’m looking forward to your feedback (altough most comments are in German comments in English are highly appreciated!). Please rate my reboot on CSS Reboot. Thanks!
Neueste Artikel
Schlagwörter
Bloggen · CSS Reboot · Relaunch · Screenshot
17 Kommentare
Kommentieren
Dieser Eintrag kann nicht mehr kommentiert werden.
Simpel, cool und erfrischend! Wiedermal ein gelungenes Update! Toll finde ich auch, dass du jetzt eine variable Breite verwendest. Bin schon gespannt auf den detailierteren Bericht!
Danke! Große Schrift und flexibles Layout waren die Hauptgründe für das Redesign. Der Feinschliff fehlt zwar noch, aber im Großen und Ganzen bin ich schon recht zufrieden.
Gefällt mir eigentlich recht gut, allerdings würde ich die Schrift standardmäßig doch ein bisschen kleiner machen und ‚bensite.net’ im Header vielleicht auch noch ein bisschen größer bzw. mit mehr Abstand.
Gratulation!
Nur das Grau ist ein bisserl zu hell, aber das ist nur eine Kleingikeit.
lg gernot
Danke für das positive Feedback! Bitte bewertet mein neues Design auch auf CSS Reboot.
Christoph,
Ich weiß, dass die Schriftgröße am Anfang etwas ungewohnt wirkt. Ich glaube aber, dass das der richtige Weg ist. Vielleicht liegt’s auch daran, dass einige Abstände noch nicht genau passen. Der Header ist bewusst so klein gewählt. Ich finde nämlich, dass viele Header recht groß sind und unnötig Platz verschwenden. Klar kann das auch schön sein, aber mein Ziel war es, die Seite funktional und trotzdem ansehnlich zu gestalten. Deswegen der kleine Header. Bin aber natürlich gespannt, wie’s ankommt.
Ich bin speziell für Feedback bezüglich der Schrift dankbar, da solche Größen im Web (noch?) nicht die Norm sind.
Gernot,
Du meinst die Navigation, gell? Die werde ich jedenfalls im Auge behalten, könnte ein Fall fürs Feintuning sein.
Hast du vor alle Artikel von nun an auch auf Englisch zu übersetzen? Finde ich eine super Idee! Hab auch schon darüber nachgedacht die ganze Seite auf Englisch zu gestalten, aber der Aufwand des Übersetzens ist nicht zu unterschätzen.
Die Schriftgröße finde ich gut, aber natürlich muss man sich daran gewöhnen. Das Grau könnte tatsächlich etwas mehr Sättigung vertragen.
Ich hab zwar schön öfters darüber nachgedacht Artikel auf Englisch zu schreiben oder generell alles in Englisch zu halten. Das wäre aber ein großer Schritt, zu dem ich mich aus verschiedenen Gründen noch nicht durchgerungen habe.
Beides gleichzeitig, also auf Deutsch und auf Englisch, ist mir aber zu aufwändig – ich glaub auch, das man das nicht lang durchhält.
Diesen Artikel habe vor allem wegen den Besuchern von CSS Reboot ins Englische übersetzt.
Yeah!
Hab’ ich wieder mal verschlafen 😉
Von technischer Seite kann ich berichten, dass deine neue Seite in Safari exakt gleich gerendert wird wie auf Gecko-basierten Browsern! Gratulation.
Dominik, danke für den Hinweis bezüglich Safari. Was meinst du zur Schriftgröße (speziell auf deinem 12″-iBook)?
Bis auf den Header wirklich sehr fein.
weider mal gute Arbeit geleistet 😉
die schriftgrösse ist ein interessanter ansatz.
stören tut er mit sicherheit nicht.
noch habe ich zwar keine sehschwierigkeiten, aber trotzdem liest es sich angenehmer als ne kleinere schrift.
also weiter so.
den header musst aber noch verändern.
bens ist dick, ite.net ist dünn -> fürchterlich 🙂
und kleiner header ist gut, trotzdem sollte er irgendwie »ins auge stechen«, ohne aufdringlich zu sein. wie du das schaffst, ist dann deine aufgabe 😛
lG
Ahmet
Das ist Absicht um das Wortspiel »Ben’s Site« zu verdeutlichen. Damit man das »s« auch »Ben« zuschreibt, habe ich ich »Bens« fettgeschrieben. Die Sache hat allerdings einen Schönheitsfehler: Das Possessive-s wird im Englischen durch einen Apostroph vom Hauptwort getrennt …
Ah, ich muss sagen mir ist die Schrift wirklich zu groß. Speziell auf meinem 12″ Schirm ist sie äußerst dominant. Es hat die Optik einer 14-er Größe, was bei üblichen 10-12 schon recht krass wirkt. Deine Standard-Schrift wirkt größer als die der Haupt-Menüleiste (vor allem Breiter).
Ich könnte jetzt nicht genau sagen was es ist, aber »gefühlsmäßig« da hat es noch was, und möglicherweise ist es auch die Type… Ich schicke dir daher einen Screenshot fürs Gefühl 😎
Das ist Absicht um das Wortspiel »Ben’s Site« zu verdeutlichen.
Der Zweck ändert nicht das aussehen 🙂
vielleicht liegts aber auch nur am font. bin leider designerisch nicht besonders gut. ich kann nur meckern und kritisieren 😛
bensite
ben‘s‚ite
ben’s’ite
benSite
etc. wären noch möglichkeiten für das wortspiel.
gibt sicher noch viele andere, schönere möglichkeiten =)
lG,
maulender Matrix
Dominik, danke für die aufschlussreichen Screenshots. Die Seite sieht unter Mac OS ganz anders aus, weil die Schrift anders geglättet wird. Das war mir vorher zwar bewusst, aber die Schrift wirkt viel schwerer, weil sie irgendwie fetter ist.
Ahmet,
Nur aus Neugier: Diese Verion würde dir tatsächlich besser gefallen? Brrrrrr … 😉
Eine Kleinigkeit:
Am Pocket PC sind die Artikel sehr schmal (zuviel margin-right?)
Sieht dann so aus:
Text PlatzPlatzPlatz Scrollbar
lg gernot
Kannst du mir einen Screenshot davon schicken? Eigentlich sollte der Inhaltsbreich um die 60% breit sein, dann ein paar Prozent Platz und der Rest Sidebar. Welchen Browser verwendest du auf deinem Pocket PC?
PS: Hab mir erlaubt, dein vielverwendets »genrot« auszubessern … soll ich dafür ein Skript schreiben? 🙂
Das mit dem PocketPC hab ich gerade gesehen ist so:
Die Sidebar schiebts nach ganz unten und damit wirkt der Platz rechts so ungenützt.
lg gernot