Kontakt

Blog

In unserem Blog erscheinen regelmässig interessante Artikel und wissenswerte Informationen über das Betreiben einer Website und über den Umgang mit dem Internet. Wir möchten auf diesem Weg Betreibern einer Website, solchen die es werden wollen oder einfach Interessierten Wissen vermitteln, welches sonst in dieser Form nicht verfügbar ist. Während viele Texte im Internet an Spezialisten gerichtet sind, versuchen wir hier allgemein verständliche Berichte zu viel diskutierten Themen zu veröffentlichen. Dieser Blog soll Ihnen ausserdem beim Aussuchen von Anbietern und Angeboten von Web-Dienstleistungen behilflich sein.

Feed abonnieren
Blog » Benutzerfreundlichere Websites dank flüssigem Layout

Benutzerfreundlichere Websites dank flüssigem Layout

23 Feb 2010

Sie kennen das Problem: Sie besuchen eine Website und können kaum den Text lesen. Die Schriftgrösse wurde so klein gewählt, dass es unmöglich ist sich im Sessel zurück zu lehnen und die angebotenen Informationen zu lesen. Noch mehr Mühe haben Menschen mit einer Sehbehinderung, denn diese können unter Umständen solche Texte überhaupt nicht lesen. Immer grössere Computerbildschirme mit feineren Auflösungen verschlimmern das Problem zusätzlich. Abhilfe schaffen ein gutes Webdesign und die Zoomfunktion des Browsers.

Besucher einer Website haben die Möglichkeit, Texte über Ihren Browser zu vergrössern oder zu verkleinern [1]. Damit dies überhaupt funktioniert muss der Webdesigner aber einige Anforderungen berücksichtigen. Der Internet Explorer von Microsoft weigert sich zum Beispiel Schriften, deren Grössen in Pixel (px) definiert wurden, zu zoomen. Ein weiteres Problem stellen statische Layouts (static layout) dar, bei welchen die Dimensionen der Website starr definiert werden. Viele Kunden wünschen sich ein Webdesign, das in jedem Browser gleich aussieht. Statische Layouts sind aber für ein dynamisches Medium wie das Internet nicht geeignet. Vergrössert man Schriften in einem statischen Layout, so tritt der Text schnell einmal über die Ränder der definierten Bereiche und die Seite wird vollständig unübersichtlich. Abhilfe bringt ein flüssiges Layout (liquid layout), dass sich immer der Schriftgrösse anpasst. Ein solches Layout ist zwar etwas aufwändiger zu programmieren, zahlt sich aber in Form höherer Benutzerfreundlichkeit definitiv aus.

Browser der neusten Generation vergrössern nicht nur den Text, sondern zoomen gleich die ganze Website inklusive Bilder. Den Unterschied zwischen Text-Skalierung und komplettem Zoom, "Page-Zoom" genannt, können Sie in Firefox ab Version 3.0 einfach testen. Ist die Funktion [Ansicht] -> [Zoom] -> [nur Text zoomen] aktiviert, so wird beim Zoomen nur die Schriftgrösse verändert. Ist die Funktion deaktiviert, werden auch Layout und Bilder vergrössert oder verkleinert.

Firefox Menü zum Ändern der Zoom-Optionen

Werden nun flüssige Layouts durch die neue Page-Zoom Funktion der Browser überflüssig? Nein im Gegenteil. Page-Zoom sorgt bei statischen Layouts für neue Probleme. So werden beim Vergrössern die Seiten einer Website schnell einmal breiter als der Bildschirm. Der Besucher muss nun bei jeder Zeile horizontal scrollen, was die Anwendung sehr Benutzerunfreundlich macht. Hinzu kommt, dass sich Inhalte einer Website immer ändern. Wird ein Text verlängert oder ergänzt, braucht er mehr Platz, und dieser ist in einem statischen Layout nicht vorhanden. Ein sorgfältig programmiertes flüssiges Layout macht Websites also in jedem Fall zugänglicher und benutzerfreundlicher.

Mit unserem nEon CMS gehen wir noch einen Schritt weiter und bieten integrierte Zoomfunktionen an. Auf unserer Website können Sie mit den Icons rechts unterhalb der Navigation die Schrift vergrössern oder verkleinern. Das Layout wird der neuen Schriftgrösse automatisch angepasst. Dadurch können die Einstellungen direkt auf der Website selber vorgenommen werden. Ein Vorteil für Besucher welche die Zoomfunktion Ihres Browsers nicht kennen.


[1] Zoomfunktion in Ihrem Browser. Für die Tastenkombinationen die Zeichen aus dem Ziffernblock benutzen. Die Kombinationen sind für Windows. Auf Mac (ausser Internet Explorer) statt [Ctrl] einfach [Cmd] drücken.

 

Browser Vergrössern Verkleinern Zurücksetzen Menü
Firefox [Ctrl] und [+] [Ctrl] und [-] [Ctrl] und [0] [Ansicht] -> [Zoom]
Opera [+] [-] [*] [Ansicht] -> [Zoomfaktor]
Safari [Ctrl] und [+] [Ctrl] und [-] [Ctrl] und [0] [Menü Symbol] -> [Zoomen]
Chrome [Ctrl] und [+] [Ctrl] und [-] [Ctrl] und [0] [Menü Symbol] -> [Zoom]
Internet Explorer [Ctrl] und [+] [Ctrl] und [-] [Ctrl] und [0] [Ansicht] -> [Zoom]
Permalink
Zuletzt geändert am 23 Feb 2010 von Florian Moser

novalab - new media engineering

Die Webagentur novalab - new media engineering bietet professionelles Webdesign und innovative Lösungen für Ihren Internetauftritt an. Standardkonforme und qualitativ hochstehende Websites und Webapplikationen werden dank dem hauseigenen nEon CMS rasch und preiswert erstellt. Zudem steht Ihnen unser Know-How in Form von kompetenter Beratung und Support jederzeit zur Verfügung.

Broschüre novalabBroschüre nEonAGB

Links

Weitere Seiten im Zusammenhang mit novalab

Feeds

Abonnieren Sie unsere Feeds und lesen Sie die neusten Informationen gleich bei deren Veröffentlichung