web/designs0(31) Sprache: Deutsch


Webseitendesignentscheidungen

----------------------------------------------------------------------[ Meta ]--

name		web/designs0
section		31
description	Webseitendesignentscheidungen
tags		website theory policy mawebsite4 mawebsite
encoding	utf8
compliance	public
lang		de
attachments	redirect.png
creation	2014/08/02 23:58:50
version		1.0.1.0
copyright	Copyright (c) 2014, 2015 Ma_Sys.ma.
		For further info send an e-mail to Ma_Sys.ma@web.de.

----------------------------------------------------------------[ Motivation ]--

Damit die Entwicklung dieser Ma_Sys.ma Webseite ein möglichst gutes Ergebnis
hervorbringt und um dem Nutzer zu erklären, wieso sich die Seite so und nicht
anders verhält, wurden viele maßgebliche Designentscheidungen öffentlich
zugänglich festgehalten.

Bei den Designentscheidungen waren insbesondere die folgenden Seiten hilfreich
 * url(http://www.anybrowser.org/campaign/index.html)
 * url(http://linuxmafia.com/faq/Web/opti.html)
 * url(http://rule6.info/javascript.html)
 * url(http://kyleschaeffer.com/user-experience/10-things-a-website-should-
								never-ever-do/)

Ein wesentliches Ziel der neuen Webseite ist, dem "`Principle of the least
surprise"' gerecht zu werden und immer genau das zu tun, was der Nutzer
normalerweise erwarten würde.

-----------------------------------------------------[ Layout und Farbgebung ]--

Die Seite orientiert sich farblich lose an der Vorgängerversion
mawebsite3/final(33). Sie wurde insbesondere an das Logo angepasst und soll
damit enheitlich und leicht wiedererkennbar sein. Dass Rot als Hauptfarbe dabei
nicht unproblematisch ist, wurde hingenommen, zumal Gelb und Violett noch
weniger gepasst hätten. Wie alle anderen Ma_Sys.ma Webseiten zuvor, durchbricht
auch die neuste Version das mittlerweile gängige Einheits-Weiß, welches heute
fast alle großen Webseiten für die Darstellung ihrer Inhalte verwenden.

Layoutmäßig wurde das legendäre Layout der zweiten Ma_Sys.ma Webseite
mawebsite2(33) wieder aufgegriffen. Die in vorherigen Webseiten zu bemängelnde
Anordnung in deutlich abgegrenzten Kästen wurde aufgebrochen, um das Design
moderner zu machen und Platzverschwendung zu verhindern.

Im Vergleich zu den Vorgängerversionen wurden mobile Endgeräte ebenfalls
bedacht, weshalb die "`Buttons"' in der Navigationsleiste nicht nur größer sind,
als bei den alten Webseiten, sondern auch dafür ausgelegt sind, in sehr schmalen
und sehr breiten Darstellungen nicht zu hässlichen Layoutfehlern zu führen.

--------------------------------------------------------------------[ Bilder ]--

Das Layout der Webseite verwendet Bilder äußerst sparsam: Dadurch wird nicht nur
die kostbare Bandbreite von Mobilgeräten geschont, sondern auch der Inhalt in
den Vordergrund gestellt. In alter Tradition ist das Logo per SVG eingebunden
und als einzige "`Ungewohntheit"' traditionell animiert. Ebenfalls schon seit
der ersten Ma_Sys.ma Webseite mawebsite1(33) gibt es am Seitenende einige
Grafiken, die auf die verwendeten Standards und den vim(36) Texteditor
hinweisen.

--------------------------------------------------------[ Browseroptimierung ]--

Wie auch die Vorgängerversionen wird die Webseite zwar mit allen gängigen
Browsern auf Funktionsfähigkeit getestet, es gelten darüber hinaus aber zwei
Grundsätze:

 1. Die Seite verwehrt alten Browsern nicht absichtlich den Zugang, nimmt aber
    auch nicht gesondert Rücksicht. So kommt es, dass der `Content-Type`
    `application/xhtml+xml` in alten Internet Exploreren zu einer weißen Seite
    (ohne Möglichkeit den Inhalt zu lesen) führt, was (wie auch schon in der
    Vorversion) nicht durch Verwendung des weniger geeigneten
    `Content-Type: text/html` behoben wird. Mittlerweile wurde für diesen
    Sonderfall eine Ausnahme geschaffen, sodass `MSIE`-User-Agents immer
    `text/html` bekommen, wodurch alte Internet Explorer zumindest etwas
    anzeigen sollten.
 2. Die Seite muss nicht überall gleich aussehen. So werden die Buttons in
    Webkit-basierenden Browsern wesentlich hässlicher dargestellt, als z.\,B. im
    Firefox. Daran wird nicht durch umständliche Hacks etwas geändert, sondern
    das wird als unterschiedliches Verhalten von Browsern hingenommen.

----------------------------------------------------------[ Externe Verweise ]--

Bei älteren Ma_Sys.ma Webseiten waren externe Links immer mit einer
Zwischenseite vor der Weiterleitung auf eine andere Webseite ausgestattet.

{\img{redirect.png}{Eine Weiterleitungsseite der Ma\_Website 3}}

Diese Seite sollte die Sicherheit erhöhen, hatte aber mehrere negative
Seiteneffekte, weshalb solche Weiterleitungen auf dieser Seite nicht mehr
verwendet werden

 - Der Benutzer musste häufiger klicken
 - Unerwarteter Weise öffnete sich nicht der Link, sondern die Weiterleitung
 - Suchmaschinen "`bestraften"' die Seite aufgrund weniger externer Verweise
 - Vorausschauendes Öffnen von Links in einem neuen Tab produzierte unerwartete
   Ergebnisse.

Im Zusammenhang mit dem letzten Punkt steht auch eine weitere Änderung bei
(insbesondere aber nicht ausschließlich) externen Links: Wurden früher Links
manchmal automatisch in einem neuen Tab geöffnet, liegt es nun komplett beim
Benutzer, einen Link in einem neuen Tab zu öffnen oder nicht. Dadurch verhält
sich die Webseite weniger unerwartet.

---------------------------------------------------[ Technischer Rückschritt ]--

Vergleicht man die Funktionen älterer Ma_Sys.ma Webseiten, insbesondere der
mawebsite3/first_try(33) mit der momentanen Version kommt leicht der Verdacht
auf, diese Seite sei ein Rückschritt gegenüber den Vorversionen. Ähnlich wie
auch bei der mawebsite3/final(33) ist aber zu beachten, dass viele Features der
früheren Seiten absichtlich weggelassen wurden: So wurde die Anzahl der
Screenshots reduziert, damit die wichtigen Screenshots in den Vordergrund
gerückt werden. Außerdem fehlen die Onlinequelltexte in dieser Ausgabe der
Ma_Sys.ma Webseite vollständig. Dies ist nicht nur dem Umstand zu verdanken,
dass die Seite letztendlich "`nur"' ein D5Man-Export ist, sondern vor allem dem
Fakt, dass es äußerst aufändig ist, eine große Funktionsvielfalt wie die vielen
Stylesheets einiger Vorversionen oder die Online Quelltexte sinnvoll zu warten.
Regelmäßig veralteteten sowohl einige weniger verwendete Stylesheets, als auch
die Quelltexte der früheren Webseiten, weshalb nun ganz darauf verzichtet wird.

Ein weiterer Grund ist, dass dynamische Funktionen vom Server unterstützt werden
müssen. Um möglichst unabhängig vom Anbieter zu bleiben, stellt die Ma_Website 4
nur sehr geringe Anforderungen an den Webserver, sodass sich die Seite nicht nur
einfach spiegeln lässt, sondern auch einfach auf einen anderen Hoster migriert
werden kann.

----------------------------------------------------------------[ JavaScript ]--

Obwohl JavaScript nützliche Funktionen bietet, die z.\,B. bei der
Implementierung von Suchfunktionen Vorteile bieten, wird mittlerweile _komplett_
auf den Einsatz von JavaScript für die Webseite verzichtet. Damit verhält sich
die Seite komplett den Erwartungen entsprechend und spart Bandbreite, weil keine
JavaScript Dateien geladen werden müssen.

-------------------------------------------------------------------[ Cookies ]--

Frühere Ma_Sys.ma Webseiten setzten Cookies ein, um die Anzahl der
Nutzersitzungen statistisch auszuwerten. Mittlerweile werden keine Cookies mehr
von der Seite verwendet. Sollten dennoch welche gesetzt werden, so sind diese
online-Modifkiationen der Seite durch den Freehoster zuzuschreiben.

-----------------------------------------------------------------[ Sprachmix ]--

Um Inhalte möglichst authentisch abzubilden, sind die Sprachen der einzelnen
Seiten jeweils genau wie bei der Erstellung. Für eine Verfügbarkeit von Seiten
in beiden Sprachen stehen nicht die Zeitressourcen zur Verfügung, weshalb es
auch keine "`Umschaltmöglichkeit"' für die Sprachen gibt -- Seiten sind entweder
auf Deutsch oder Englisch, aber niemals in beiden Sprachen verfügbar.

---------------------------------------------[ Unleserliche Links und Zahlen ]--

Die meisten Links, denen man auf dieser Seite begegnet, muten auf den ersten
Blick etwas seltsam an: Kleinbuchstaben und Zahlen in Klammern -- das scheint
unleserlich und schwer benutzbar, wirft vor Allem aber die Frage nach dem Warum
auf und das ist genau der Grund, weshalb die Links in dieser Form belassen
wurden: Der Benutzer soll sich fragen, was dahinter steckt und es dann auf der
Seite d5man(32) erklärt zu bekommen.

------------------------------------------------------------------[ Ausnamen ]--

Von den hier beschriebenen Grundprinzipien sind nur web/experiments(31) und
einige abzweigende Seiten ausgenommen.


Zum Seitenanfang