Warden.de

 

Der erste Beitrag auf der neuen Seite

Lange lange hat es gedauert. Das letzte Update dieser Homepage war am 20. März 2003. Mehr als acht Jahre musste diese Seite über sich ergehen lassen. Zu Zeiten entwickelt als der Internet-Explorer 5 einer der modernste und besten Browser war ...

Cambio Light

ist der Name meines Neuen CMS. Diese Seite ist so­zu­sagen die erste Test- und auch Entwicklungs­seite. Sobald dieses neue CMS einen Stand erreicht hat von dem ich be­haup­ten kann das es für einen An­wender benutzbar ist, werde ich auf dieser Seite die erste Version ver­öffent­lichen.

Damit die Seite nicht so lang­weilig wird - und ich mein CMS auch testen kann - wird diese Seite mit der Zeit mit diversem Inhalt ge­füllt werden.

Die alte Warden GDV Homepage ist weiterhin erreichbar

Thema­tisch wird sich diese Seite haupt­sächlich mit Web-Programmierung sowie (Web-) Design be­schäf­tigen. In der Sektion Spielwiese werde ich diverse er­stellte Web­seiten, Grafik- und Design­ideen sowie Code­schnipsel (von denen ich hoffe das Sie nütz­lich sind) ver­öffent­lichen.

Auf jeder Seite gibt es die außerdem die Mö­glich­keit Kommen­tare abzugeben.

Stefan Englmann - Dienstag, 6. September 2011 - 20:05

Code und Preformatted

natürlich brauch ich auch eine Möglichkeit Code dazustellen.

Dieser Codeblock z.B.:

  1. <ol class="code">
  2.   <li>Foo&nbsp;1</li>
  3.   <li>&nbsp;Bar</li>
  4.   <li>&nbsp;&nbsp;Baz</li>
  5. </ol>
wird genauso als HTML mit dem unten gezeigten CSS gerendert.

Die Zeilennummerierung erledigt eine ordered-list (<ol>). Um die Preformatierung zu erreichen werden alle Leeerzeichen durch ein Nobreakspace (&nbsp;) und alle Tabs durch zwei Nobreakspaces ersetzt.

Dazu eine Monospace-Schriftart und ein bisschen CSS und schon hat man ein (meiner Meinung nach) recht brauchbares Ergebnis.

 

Hier der dazugehörige CSS Code

  1. ol.code {
  2.   font: 11px "Courier New",monospace;
  3.   line-height: 18px;
  4.   margin:  10px 0 10px 22px;
  5.   padding: 8px 0;
  6.   background: #ffffe0;
  7.   border-left: 1px solid #867300;
  8. }
  9. ol.code li {
  10.   list-style-position: outside;
  11.   list-style-type: decimal;
  12.   margin: 0;
  13.   padding: 0 0 0 8px;
  14. }
  15. ol.code li:nth-child(odd) {
  16.   background:  #fffff3;
  17. }
Stefan Englmann - Dienstag, 20. September 2011 - 23:10

Es lebe die Textspalten

Diese Seite dient primär zum Testen aller mö­glichen Dinge. Wie z.B.: Spalten. Text­spalten sind mit CSS3 mö­glich. Dies Seite ver­wendet jedoch nur ein­faches CSS um 2 Spalten zu er­zeugen.

Im Print­bereich werden Text­spalten überall ein­ge­setzt. Ob in der Tages­zeitung oder in Ma­ga­zinen. die Gründe dafür sind ganz einfach. Der Text wird auf­gelockert, wirkt nicht wie ein großer fetter Block und lässt sich viel leichter lesen. Gerade auf Seiten mit viel Text sind Spalten-Dar­stellungen mit ge­ringer Brei­te ein wahrer Segen für den Be­nutzer. Aber bei den meisten Seiten ist genau das Gegen­teil der Normal­fall. Die Monitore wer­den immer brei­ter, und die Seiten müssen dem­zufolge auch immer brei­ter werden.

Nachdem der typische Windows­user auch noch jedes Pro­gramm im Voll­bild­modus aus­führen muss (bin ich froh, das der Taschen­rechner keinen Voll­bild­modus hat) werden Sei­ten entweder un­leser­lich in die Brei­te ge­zo­gen,

oder der halbe Bild­schirm wird mit einer Hinter­grund­farbe ge­füllt.

"Kann man die Seite denn nicht breiter machen" bekommt man dann immer zu hören. Ja, man kann. Aber kein Mensch will das dann lesen.

Anscheinend wollen die meisten im Web eh nichts lesen, sondern einfach nur die die großen Bilder an­schauen (darum muss die Seite ja auch immer so breit werden). Ich habe mir auf dieser Seite jedoch die Frei­heit genommen den Content­bereich nur 460 Pixel breit zu ges­talten. Somit hat jede Spalte Augen- und Lese­freundliche 216 Pixel.

Jetzt weiß ich nur noch nicht wie gut man Textsplaten im Web wirklich einsetzen kann. Denn im gegensatz zu Printprodukten kann man im Web scrollen, und das Anzeigemedium (Monitor statt Papier) hat keine genormte größe.

aber wir werden sehen.... ... Kommentare und Meinungen ausdrücklich erwünscht :-)

Stefan Englmann - Sonntag, 11. September 2011 - 22:13