Micro Relaunch

• Mo, 05. September 2005,
• 612 Wörter,
• 3 Kommentare,
• Tags:
• CSS,
• Typografie,
• Website

Ein Satz fri­scher Tem­pla­tes, ein paar CSS Tweaks hier und da und schon ist diese Seite um eini­ges funk­tio­nel­ler. Soweit ich das sagen kann, bin ich wirk­lich zufrie­den mit dem Ergeb­nis. Die neue Start­seite ist genauso gewor­den, wie ich mir eine Index­seite eines Blogs vor­stelle. Ich hab eine kurze Weile über­legt, was möchte ein Besu­cher sehen und was muss er sehen. Er muss auf kei­nen Fall eine lange Link­liste, die letz­ten 10 Ein­träge und sämt­li­che Index­ar­chive sehen. Alles was geblie­ben ist, bezeichne ich als essen­ti­ell für die Start­seite die­ser Web­site.

Der jeweils aktu­ellste Ein­trag ist nun bes­ser erkenn­bar und erscheint nicht mehr ganz so blog-like wir vor­her. Die eigent­li­che Idee war, auch nur wirk­lich den letz­ten Ein­trag zu zei­gen, nur beson­ders für Erst­be­su­cher, ist es wich­tig mehr als nur den Ein­druck eines Ein­trags zu bekom­men. Neu dazu gekom­men, ist eine Liste der letz­ten Kom­men­tare. Die Kom­men­tare erschei­nen momen­tan oft genug, damit so eine Liste Sinn macht. Die rest­li­chen Link­lis­ten zu den Index­ar­chi­ven sind ver­schwun­den. Die Lis­ten sind nun über den Archiv Link bzw. die Kate­go­rie Links, in den jewei­li­gen Ein­trä­gen zu fin­den. Auch hier denke ich, diese Lösung ist bes­ser als vor­her.

Die alte Sei­ten­leiste ist Ver­gan­gen­heit. Hier hab ich sogar ein DIV Ele­ment raus­schmeis­sen kön­nen, aber dazu spä­ter mehr. Da ich nicht das kom­plette Lay­out ändern wollte, bie­tet die Seite nun mehr Weiß­raum als vor­her und in zukünf­ti­gen Ein­trä­gen werde ich die­sen sicher­lich für Ver­weise und ähnli­ches nut­zen.

Typo­gra­fie

Das Hor­ror­thema schlecht­hin. Ich hab wie­der mal ver­sucht eine bes­sere ein­heit­li­che Linie in die Typo­gra­fie zu bekom­men. Link und Sei­ten Archiv besit­zen nun die glei­che typo­gra­fi­sche Gestal­tung. Die Über­le­gung hier war fol­gende. Pro­blem bei den Sei­ten Archi­ven ist in mei­nen Augen, die Unmenge an Infor­ma­tio­nen, sau­ber und struk­tu­riert dar­zu­stel­len. Der effek­tive Platz für Con­tent ist in die­sem Design sehr begrenzt, auf 540 Pixel Breite um genau zu sein. Die Liste die vor­her zu sehen war, resul­tierte in einer rie­sig lan­gen Seite.

Um das zu ver­mei­den floa­ten die Lis­ten­ele­mente nun mit einer 12 Pixel gro­ßen Arial. Effek­ti­ver ist der Platz in mei­nen Augen nicht nutz­bar, Ord­nung stand hier vor Ästhe­tik. Die Arial ist für große Text­men­gen auf kleins­tem Raum nicht zu schla­gen. Eine Tre­bu­chet und eine Ver­dana stin­ken da mäch­tig gegen ab. Der Rest der Typo­gra­fie sind eher klei­nere Ände­run­gen, die nur unbe­wusst wahr­ge­nom­men wer­den. Eine Far­bän­de­rung hier, eine Grö­ßen­än­de­rung da und schon wirkt alles aus­ge­gli­che­ner. Alles in allem ist die Typo ins­ge­samt bes­ser, aber wei­ter­hin nicht 100% zufrie­den­stel­lend. Der Grund dafür?

CSS Chaos

Das Style­s­heet der Seite ist ein ein­zi­ges Chaos. Dies ist so ziem­lich meine erste die voll­stän­dig auf CSS setzt und nun merke ich wel­che Feh­ler dabei gemacht wor­den. Ange­fan­gen von viel zu vie­len Klas­sen und IDs bis hin zu unnö­ti­gen DIVs, alle klas­si­chen Feh­ler habe auch ich gemacht. Das nächste Ziel ist nun, das Style­s­heet und das DIV Lay­out zu ent­schär­fen. Immer­noch trägt das body Tag die Hin­ter­grund­gra­fik zu 100%, da brauch ich noch­mal bischen mehr Zeit um da die Gra­fi­ken als mehr als die­ses eine Ele­ment zu ver­tei­len. Ich hab bei die­sem Winz Upgrade schon mehr Zeit mit Suchen der CSS Feh­ler ver­bracht, als sonst. Das Thema Inter­net Explo­rer ist bis auf wei­te­res erst­mal auf Eis gelegt. Bis zum Release der 7er Ver­sion werde ich keine Sei­ten mehr anpas­sen und IE Bugs behe­ben. Alles ver­schwen­dete Zeit.

Und nun?

Nun lehne ich mich erst­mal etwas zurück und bade in Zufrie­den­heit über die­ses Ergeb­nis. Danach ist Auf­räu­men ange­sagt. Der Code vom CSS und von den Tem­pla­tes muss effi­zi­en­ter wer­den. Aber auf den ers­ten Blick ist die Seite nett gewor­den. Yup, kann sich sehen las­sen.

PS. HTML Umbruch Tags emp­feh­len sich ein Dut­zend mal auf Rich­tig­keit zu prü­fen. Tut man dies nicht, dann sucht man im schlims­ten Fall meh­rere Stun­den im CSS Code, wieso Fonts fett dar­ge­stellt wer­den. Aus einem fie­sen <br /> Tag, ist ein <b /> gewor­den und hat mir kost­barste Stun­den des Lebens geraubt.

Zum gleichen Thema

• Tutorial zur individuellen Gestaltung von Wordpress-EinträgenCSS

• tricky sticky FooterCSS

• Subjektive ResponsivitätCSS

• erste Reboot Trends 2006CSS

• Dokumentation zur neuen Gestaltung - Konzept und RasterWeb Design

• letzter Eintrag 2006Fundstücke

• John F. Obama und ein PosterFundstücke