Webdesign Fulda - birdmedia

birdmedia - Webdesign aus Fulda. Individuelles und barrierefreies Webdesign mit HMTL, CSS, PHP und Flash mit und ohne Content-Management-Systeme.

Webdesign (auch Webgestaltung) umfasst die Gestaltung, den Aufbau und die Nutzerführung von Webseiten für das WWW bzw. das Interface-Design in diesem Bereich. Dabei werden in der Regel strukturierte Texte, die in XHTML bzw. HTML verfasst sind, samt ergänzenden Grafiken mit CSS formatiert. Der Webdesigner (Internetagentur) hat dabei die Aufgabe, den besten Kompromiss zwischen den Wünschen des Auftraggebers, den Ansprüchen der Besucher und den technischen Möglichkeiten zu finden.

Webdesign in Fulda von birdmedia

Neben der reinen Optik geht es beim Webdesign (der Gestaltung von Webseiten) vor allem um Nutzerfreundlichkeit. Navigation und Aufbau der Webseiten sollen möglichst vielen Menschen entgegen kommen. Hier erfahren aber z. B. viele behinderte Menschen Nachteile, sie benötigen Webseiten, die barrierefrei gestaltet sind. Werden in einem Hypertext zu viele Wahlmöglichkeiten von Links gegeben, kann dies zu einer Desorientierung, dem so genannten Lost in Hyperspace führen.
Zur Benutzungsfreundlichkeit kommt die Zugänglichkeit, die sich in der Vermeidung von Techniken manifestiert, durch die Informationen nur mit einem bestimmten Browser erreichbar sind, oder durch das Schaffen von (Text-)Alternativen zu multimedialen Inhalten. Flash und andere Browsererweiterungen müssen deswegen nicht grundsätzlich vermieden werden, es sollte aber sichergestellt sein, dass der Inhalt auch ohne diese Techniken voll abrufbar bleibt.
Hier gilt form follows function (engl. wörtl. (Die) Form folgt (aus der) Funktion). So soll sichergestellt sein, dass bei zum Teil kunstvollem Design die Benutzbarkeit (engl. Usability) der Webseite nicht verloren geht.

Ein wichtiger Aspekt beim Webdesign ist eine korrekte Textauszeichnung und Kenntnisse in Webtypografie. Während Webseiten für die Browsergenerationen 4 (Netscape 4 und Internet Explorer 6) noch sehr unterschiedlich geschrieben wurden, kann der Webentwickler in den aktuellen Versionen eine weitgehende Unterstützung der Standards des W3C erwarten.
Webdesign unterscheidet sich vom Design für andere Medien vor allem durch diese starke Leserorientierung. Sie ist darin begründet, dass Websurfer meist gezielt nach Informationen suchen und eine Site nur so lange besuchen wie unbedingt nötig. Die starke Textlastigkeit von Webdesign hängt z. T. allerdings auch mit den Indizierungsmöglichkeiten von Suchmaschinen zusammen.

Benutzerfreundlichkeit

Benutzerfreundlichkeit (auch Benutzungsfreundlichkeit) bezeichnet die vom Nutzer erlebte Nutzungsqualität bei der Interaktion mit einem System. Eine besonders einfache, zum Nutzer und seinen Aufgaben passende Bedienung wird dabei als benutzerfreundlich angesehen.
Benutzerfreundlichkeit ist damit analog zu Begriffen wie hautfreundlich zu verstehen: Freundlich ZUM Benutzer. Gelegentlich wird aber (sprachlich fragwürdig) argumentiert, dass Benutzerfreundlichkeit einen besonders freundlichen Benutzer oder gar eine besonders freundliche Maschine implizieren würde. Um solche verwirrenden Interpretationen des englischen Originalbegriffes user friendly und die fehlende wissenschaftliche Trennschärfe zu vermeiden, wird in Normungszusammenhängen stattdessen von der "Gebrauchstauglichkeit" (engl. Usability) eines (Software-)Produktes gesprochen. Diese wiederum ist in der Normenreihe DIN EN ISO 9241 in Teil 11 definiert als das Produkt aus Effektivität, Effizienz und Zufriedenheit. Diese Definition lässt sich so auch auf alle anderen Werkzeuge und Medien übertragen. Für Anwender und Nutzer ist der Begriff der Benutzerfreundlichkeit aber intuitiver und berücksichtigt auch mehr den Aspekt des gesamten Nutzungserlebnisses, der sogenannten User Experience.
Die Benutzerfreundlichkeit ist eng verbunden mit der Ergonomie. Während man mit Hardware-Ergonomie die Anpassung der Werkzeuge an den Bewegungs- und Wahrnehmungsapparat des Menschen versteht (z.B. Körperkräfte und Bewegungsräume), befasst sich die Software-Ergonomie mit der Anpassung an die kognitiven Fähigkeiten des Menschen, also seine Möglichkeiten zur Verarbeitung von Informationen (z.B. Komplexität) aber auch softwaregesteuerten Merkmalen der Darstellung (z.B. Farben und Schriftgröﬂen). Ziel ist dabei die Berücksichtigung des Menschen und seiner Aufgaben und Fähigkeiten sowie die Anpassung des Werkzeuges (sei es Software oder aber jedes andere Werkzeug) daran.

Wahrnehmung

Der bei weitem gröﬂte Teil der Informationen über die Auﬂenwelt (etwa 80%) erreicht den Menschen über die Augen. Es ist wesentlich einfacher, Informationen zu verarbeiten und zu behalten, die eine bekannte Struktur aufweisen. Zu viele Informationen überlasten das kognitive System. Durch Abstraktion, Filterung und das Erkennen von kausalen Beziehungen werden Sinneseindrücke bewertet und sortiert. Dieser Vorgang wird in der Psychologie als ÑChunkingì bezeichnet. Gemeinhin gilt für die menschliche Erinnerungsleistung das Modell der Ñmagischen 7ì (Miller) anwendbar. Es kommen Störfaktoren hinzu, die diese Zahl mindern können. Es gilt, sich ein Zwischenziel zu merken, man ist möglicherweise demotiviert, hat schlechte Laune, steht unter Stress, ist müde, alkoholisiert, etc.. Zudem reicht die Erinnerung beim Surfen nicht weiter als ca.4-5 Bildschirmseiten zurück. Im Schnitt bleiben drei bis fünf begriffliche Einheiten im Kurzzeitgedächtnis.

Gestaltungsaufgaben

Die Aufgabe einer Web-Seite ist immer zuerst, den Bedürfnissen des Kunden nachzukommen. Der Kunde möchte informiert werden, unterhalten werden, oder etwas kaufen. Um das so gut wie möglich zu gewährleisten, muss die Seite eindeutig ihren Inhalt vermitteln. (Wo bin ich? Was tut diese Seite? Wo bin ich gewesen? Wohin kann ich gehn?) Die Informationen sollten in eindeutigen Hierarchien klar dargestellt und sinnvoll gruppiert sein. Die Seite muss schnell sein, da der Benutzer ungeduldig ist und schnell an Informationen gelangen möchte. Das Ziel ist eine möglichst groﬂe Verarbeitungstiefe ÑDepth of Processingì (Craig und Lockhart), eine möglichst starke Erinnerung an das Gesehene. Die Bedienung wird durch Standards, wie ein festes Layout oder eine feste Terminologie vereinfacht. Durch die Aktivierung bereits erlernter Vorgehensweisen zu Bedienung technischer Systeme wird eine intuitive Bedienung ermöglicht.

Aufmerksamkeit

Die Aufmerksamkeit anregend wirken intensive Farben, starke Kontraste, scharfe Konturen sowie komplexe Formen und Elemente die eine intellektuelle Auseinandersetzung anregen. Das Andere sticht hervor. Augenfreundlich und angenehm sind dagegen groﬂe Flächen, Pastelltöne sowie gedeckte, gebrochene oder abgedunkelte Farben. Besondere ÑEye Catcherì sind hochgesättigtes Rot und Warnfarben wie Schwarz und Gelb, Animationen, Gesichter, Augen, das Kindchenschema oder sexuelle Darstellungen. Treten zu viele dieser die Aufmerksamkeit anregende Elemente auf, wirken sie wieder ablenkend.

Gestaltung durch birdmedia

Durch einen klaren Aufbau und einfache Bedienung soll die Seite so zugänglich wie möglich gemacht werden und dem Nutzer möglichst schnell die gewünschten Informationen vermitteln.

Konventionen

Es bestehen bestimmte gestalterische Konventionen (vgl. oben Gestaltungsaufgaben), die immer wiederkehren und deshalb vom Benutzer vermutet bzw. vorausgesetzt werden. In westlichen Kulturen wird ein Textfluss von links nach rechts erwartet. Objekte haben Bedeutung entsprechend ihrer Gröﬂe. Oben auf der Seite steht das Wichtigste.

Lesestile

Die Seite muss unterschiedlichen Leseanforderungen gerecht werden. Nutzer mit schwebender Aufmerksamkeit haben einen uneindeutigen Blick auf den Gesamtinhalt und Ñscannenì im Text nach den hervorstechendsten Stellen. Dabei erfassen sie etwa 50% des Inhalts. Nutzer mit fokussierter Aufmerksamkeit filtert das Wahrgenommene. Er Ñskimmtì nach einem konkreten Suchbegriff und erfasst dabei ca. 30% des Gesamtinhaltes. Eine besonders abwechslungsreiche Präsentation erfreut so den ersten Lesertyp, deprimiert aber den zweiten Typ. Das Lesen von Texten am Bildschirm ist schwieriger als das Lesen in Büchern oder Magazinen. ‹berschriften sollten wie in jedem Text aber in diesem Fall noch stärker, ein Destillat des Inhalts sein und keine Wortspiele oder Ironie enthalten. Es ist weiterhin günstig wichtige Informationen im ersten Wort oder Anfang des Textes auszudrücken. Das Scannen wird weiter erleichtert wenn nicht jede Seite mit dem selben Wort beginnt, generell eine markante Struktur erkennbar ist. Schlüsselreize beim Scannen sind Begriffe wie News, Börse, Travel, Geld, Digital, Jobs, Mobil, etc.. Zudem sollten Texte nicht im ÑBroschürenstilì verfasst werden, die keine nützliche Information erhalten und die Bedürfnisse des Nutzers nicht befriedigen. (vgl oben: Information, Unterhaltung, Shopping) "Wir sind ein fortschrittliches, Unternehmen der XY-Branche, das die neuesten Entwicklungen in der Informationstechnologie kreativ für seine Kunden nutzt"

Lesbarkeit

Zur Erhöhung der Lesbarkeit tragen viele Einzelelemente bei. * Kontrast zwischen Text und Hintergrund: Den besten Kontrast bietet schwarze Schrift auf weiﬂem Grund, weiﬂe Schrift auf schwarzem Grund ist kaum schlechter. * Hintergründe sollten nicht ablenken, einfarbig sein oder nur dezente Muster haben. * Statischer Text (kein Blinken oder ƒndern der Gröﬂe) * serifenlose Schriften besonders bei kleinen Texten (Verdena, Arial) * NICHT ALLES GROSS SCHREIBEN * nicht alles unterstreichen (Konvention!: Links sind unterstrichen)

Navigation

Die Navigation soll schnell erkennbar und nachvollziehbar sein. Das wird (Breadcrumbs) und einen wenig verschachtelten Aufbau erleichtert. Es sollten keine alternativen Terminologien verwendet werden, die von den Konventionen abweichen und den Nutzer zu sehr verwirren.

Client- und serverseitige Entwicklung

Programmcode zur Steuerung und zur äuﬂerlichen Erscheinung der Website lässt sich entweder durch serverseitige Skriptsprachen wie PHP, Perl, ASPNet, ColdFusion oder JSP (Java Server Pages) ausführen oder auch durch weitgehend clientseitige Erweiterungen wie Flash, Java oder JavaScript. Es besteht auch die Möglichkeit, client- und serverseitige Technologien zu kombinieren, beispielsweise PHP und Flash, um die Vorteile beider nutzen zu können. Dabei sollte man darauf achten, mit clientseitigen Erweiterungen sparsam umzugehen, da oft die notwendigen Plugins beim Benutzer nicht vorhanden sind oder JavaScript aus Sicherheitsgründen abgeschaltet wurde.

Tendenzen

Die Entwicklung des Webdesigns hat sich in den letzten Jahren merklich beruhigt. Nach der Einführung von Flash 1997 konnten sich im Wesentlichen nur W3C-konforme Technologien wie CSS, XHTML oder auch JavaScript und Java etablieren. Bei fast allen neuen Websites konzentriert man sich derzeit auf das Ausreizen dieser Technologien.

Die meisten anderen Techniken sind weitgehend vom Markt verschwunden bzw. neue Technologien können auf Grund mangelnder Reichweite kaum noch durchgesetzt werden. Neben modischen Trends sind neue Entwicklungen die das Webdesign beeinflussen fast nur noch serverseitig anzutreffen. Die einzige Ausnahme bilden Erweiterungen, die auf XML basieren. Da praktisch jeder moderne Browser XML verarbeiten kann, sind neue Möglichkeiten im Webdesign besonders in diesem Bereich zu erwarten, z. B. Vektorgrafik mit SVG und Darstellung mathematischer Formeln mit MathML. Webdesign und Printlayout bei birdmedia Webdesign und Printlayout unterscheiden sich in Gestaltung oder Präsentation einer Publikation. Eine Webpräsenz oder Webseite folgt anderen Regeln als Layout im Druckwesen.Im Unterschied zu Printmedien und den darauf bezogenen Seitenbeschreibungssprachen wie PostScript oder das Dateiformat PDF, sowie Grafikorientierten Methoden wie Flash, hat im normalen, auf HTML und XML basierenden Webdesign der Autor keine Kontrolle ñ und auch kaum Information ñ darüber, in welcher Form jemand anderer seine Arbeit tatsächlich zu Gesicht bekommt. Insbesondere versucht Webauthoring Arbeitsweisen zu vermeiden, die aus den Traditionen des Druckwesens übernommen sind, dem Medium Web aber nicht angemessen sind. Das umfasst etwa alle Versuche, Formatierungen zu kontrollieren, die mit der verwendeten Technologie nicht fixiert werden können, also Erscheinungsbild der Funktionalität vorzuziehen.Funktionierende Arbeitsweisen von birdmedia Webdesign Würzburg / Fulda Methoden aus Typographie und Drucklayout, die im Webdesign funktionieren, sind etwa:

Die Gliederung einer Webpräsenz in inhaltliche Gruppen (Webseiten), die Kapiteln entsprechen.
Gliederungsauszeichnungen wie ‹berschriften, Listen
Einfache Textauszeichnungen wie relativ zur Normalschrift gröﬂere oder kleinere Schriftgrösse, Schriftschnitte wie kursiv und fett
Einfache Anweisungen zur Bildanordnung oder von Tabellen und deren Inhalt

Als weiteres Problem erweist sich die Farbdarstellung: Das Erscheinungsbild von Farbabbildungen – die Farbtreue - ist sowohl vom Monitor-Gamma als auch dem verwendeten Farbraum abhängig. Hier hat sich im Web sRGB als Standard durchgesetzt. Darüber hinaus ist – etwa durch den Einsatz von Screenreadern (Vorleseprogrammen) oder ähnlichem – nicht einmal sicher, das der Benutzer eine Webseite überhaupt zu Gesicht bekommt. Arbeitsweisen, die auf barrierefreies Webdesign keine Rücksicht nehmen, weil der Autor der Gestaltung zuliebe die Zugänglichkeit vermindert, gelten als einer der Modellfälle von „ausgrenzendem Mechanismus“.