screen.design

2005 wurde mit einem Redesign der Homepage das screen.design eingeführt. Es war im Prinzip auf eine Auflösung von 800x600 optimiert und sollte dem Anspruch genügen, der Seite maximalen Platz zur Verfügung zu stellen; das Menü sollte also entsprechend eng ausfallen.

Development-Design und fresh.design

Im Mai 2007 wurde ein zeitgemäßeres Design, ursprünglich für ein damals noch fiktives neues development-Portal entworfen. Als einige Monate später der Ruf nach einem neuen Design laut wurde, diente dieses Design als Grundlage für das fresh.design. Dieses Design wirkte nicht mehr so gedrängt und bediente sich mehr Grafiken. Das Design wurde so konzipiert, dass die HTML-Auszeichnungen sowohl zu dem screen.design als auch fresh.design kompatibel sind. Dadurch lassensich heute beide Designs parallel verwenden.
Das damals "fiktiv" entwickelte Development-Portal ist heute mittlerweile Realität (dev.technikum29.de).

full fresh.design

Die Homepage-Designs von technikum29.de waren zwar zur Benutzung in der Homepage (mit Menü, ...) konzipiert, sind aber trotzdem flexibel genug, z.B. auch einen "development"-Banner und eine Seite ohne Menü im technikum29.de-Gewand erscheinen zu lassen. Mit den Zusatzseiten, die mit der Zeit entstanden, hat dies aber nicht mehr ausgereicht. Daher entstanden verschiedene kleine Erweiterungen, die zusätzlich zu dem großen Hauptdesign (damals das "screen.design") geladen wurden. Mit dem Umzug zum neuen Server sind diese gebündelt unter dem full fresh.design benutzbar. Seiten, die dieses Design benutzen, müssen im Aufbau notwendigerweise die Konventionen des fresh.designs einhalten, d.h. in etwa so aufgebaut sein wie Homepageseiten. Mit der Benutzung dieses Designs werden insgesamt 40kb an CSS-Massen in 1400 Zeilen genutzt. Daher war und ist die Benutzung dieses Designs nie sonderlich praktisch.

wiki.design

Das wiki.design wurde ähnlich wie das fresh.design auf Basis des Development-Designs entwickelt. Es dient einzig der Benutzung in der Wiki. Ziel war, ein Design zu entwickeln, dass den Inhalt möglichst in den Vordergrund stellt. So nutzt der Banner zwar die Elemente des für das Development-Design entwickelten Banners (oranges "development-Zone" in Verdana), fällt aber, angelehnt an die ehemaligen kleinen Zusatzbanner des Screen-Designs, recht klein aus. Er teilt sich mit einer Navigationsleiste im goldenen Schnitt, diese behält ein paar wesentliche Links zur Navigation in der Wiki. Auffällig ist, dass es keine einheitliche bzw. im Design fixierte Navigationsleiste gibt – so ist maximale Freiheit gegeben.

Vom Wiki-Design hat sich ganz wesentlich das private.design inspirieren lassen, was mit dem Umzug der Homepage im Januar 2008 entwickelt wurde.

private.design

Das private.design wird ausschließlich im Privat-Bereich genutzt, der sich so farblich von der technikum29-Hompage absetzt. Dies indiziert: Hier spricht nicht mehr das "Museum für Kommunikations- und Rechnertechnik", wie es bei den Homepage-Designs im Banner steht, sondern z.B. die Institution, der Arbeitskreis, etc.

Farblich hält sich das Design in Grautönen. Seitenhintergrund stellt ein sachter Verlauf zwischen zwei hellen Grautönungen dar. Der Banner ist zweigeteilt im goldenen Schnitt, die Beschriftung ist am rechten Rand ausgerichtet. Banner und Seiteninhalt nehmen sich viel Freiraum und haben große Seitenabstände. Der obere Banner besteht nur aus einem weißen, mit schwarz schattiertem "technikum29" vor einem dunkleren Grauverlauf, der Banner drunter stellt einen ähnlichen Farbverlauf, etwas heller, dar, dazu schmaler. Die Beschriftung des unteren Banners passt sich farblich dem technikum29-Schriftzug an, ist aber aus praktischen Gründen in Verdana gesetzt, da sie so dynamisch austauschbar ist.
Der Seiteninhalt ist in schwarz (das einzige richtige Schwarz im Design) und in Arial gesetzt. Die Größe der inhaltlichen Hauptüberschrift übertrifft die des unteren Bannerteils. Links sind im klassischen "Web"-Blau und werden bei Überfahren mit der Maus ganz grob mit gelb hinterlegt.

Das Privat-Design setzt sich von allen anderen durch einen wesentlichen Grundsatz ab: Im Vordergrund steht maximale Wartbarkeit des HTML-Quelltextes – Zeit ist Geld. Das wird deutlich, wenn man den Inhaltsteil sieht, der, verglichen mit dem Banner, in seinem Arial geradezu grob wirkt. Insgesamt ist das Design sehr verschieden zu anderen technikum29-Designs, nur die Schriftart des Banners ist identisch. Das Design eignet sich für alle Seiten, die durchaus reichlich mit Inhalt befüllt sein können: Directory-Listings, Quick&Dirty-Programme oder auch die Projekte. Ein Quelltext-Beispiel demonstriert am Besten das, was die Absicht dieses Designs ist:

<html><head>
   <title>So schnell so viel Design</title>
   <link rel="stylesheet" type="text/css" href="/src/private.design/style.css">
</head><body>
   <h1><a href="/>technikum29 Privat:</a> <strong>Bereich</strong></h1>
   Und schon kann der Inhalt einfach folgen. Ende!

Von den erstmals dunklen Grautönen des private.designs hat sich das black.design inspirieren lassen.

black.design

Das black.design wird zum Beispiel auf dem Privat-Portal genutzt und ist für repräsentative Einzelseiten ausgelegt, die wenig Inhalt haben, der stark hervorgehoben wird.

Das Design setzt auf dezente Kontraste und besteht nur aus Schwarz und abgedunkelten Weißtönen. Der ganze Seitenhintergrund ist schwarz, den oberen Seiteninhalt dominiert ein sehr großer in reinem weiß geradezu strahlender technikum29-Banner, der sich unscharf spiegelt. Dies setzt an den neuen Spiegelbanner im "Web 2.0-Look" des fresh-Designs an, wirkt aber noch imposanter und auf das wesentliche konzentrierter, denn außer dem überlebensgroßen "technikum29" steht kein zusätzlicher Text im Banner, nur viel Platz und ein leichter Hintergrundverlauf zu einem dezenten Grau.
Der Inhalt ist in einer schmalen Box anzutreffen, die in diesem Grauverlauf ansetzt und selbst einen schwarzen Hintergrund bietet. Durch den recht hellen Rahmen ist diese Box recht hervorgehoben. Seitenüberschrift und Inhalt bedienen sich ziemlich großer Schrift (Verdana) und sind in abgedunkelten Weißtönen dargestellt. Links unterscheiden sich durch leichte Helligkeitsdifferenzen und gestrichelte Unterstreichung.

Zusammenfassend fällt also auf: Das "technikum29" steht bei Seiten, die sich des black-Designs bedienen, definitiv im Mittelpunkt. Alles soll recht nobel wirken - eben nicht grauer Anzug, sondern schwarzer Somoking.