XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   Site- und Layoutcheck (http://xhtmlforum.de/forumdisplay.php?f=77)
-   -   Website check (http://xhtmlforum.de/showthread.php?t=42015)

webnet 20.09.2006 16:40

Website-Check (barrierefreiheit, ältere Browser, Browser auf Mac)
 
Hallo Community,

ich möchte euch um ein Feedback einer Website bitten.

Die Seite sollte möglichst barrierefrei sein (divs, accesskeys, tabindex usw.). Der Inhalt wird vom Kunden via CMS bereitgestellt, daher befindet sich nicht wirklich ein sinnvoller Text auf der Website.
Ich hoffe der Kontrast ist trotzdem hoch genug. Der Grafiker erstellte ein noch viel "verwascheneres" Screen-Design.

Die Seite sollte so weit eigentlich im Rahmen der XHTML 1.0 Spezifikationen liegen.

Merkwürdigerweise funktionieren die Accesskeys im IE nicht. Liegt es daran dass diese versteckt werden?

Der Text kann via Browser und via Link "A+" vergrössert werden. Im moment setze ich das mit ASP um. Gibts da eine bessere Variante. Evt. ein beispiel?

Die Domain lautet:
www.-

Für einen Check und eine Beurteilung bin ich sehr froh.
Ich arbeite mich erst ein in diese ganze "barrierefrei" Materie.



Getestet habe ich die Website auf:
- Win/IE6
- Win/IE7
- Win/FF1.5x
- Win/Opera9
- Mac/FF1.5x
- Mac/Opera9
- Mac/Safari

Browser älter als IE5.5 habe ich nicht getestet. Dort wird es wohl zu Darstellungs-Problemen kommen.
Der XHTML code wurde validiert und sollte eigentlich soweit ok sein.

Edit: Mir ist gerade aufgefallen, dass im Win/IE5.5 der Text im Content-Bereich an einigen Stellen etwas gross ist. Wie kann man das beheben? Liegt es daran, dass IE5.5 den em-Schriftgrad anders auslegt?


Edit: Hat sich erledigt. Danke.

FTOTHEO 20.09.2006 18:25

was ist denn mit "-a" wenn du schon "a+" hast ? ;)

ansonsten sieht die seite gut aus! hab auch Win/FF1.5x deswegen wird sie richtig dargestellt ;)

webnet 20.09.2006 18:35

Vielen Dank.
Ja, bevor ich n A- im ASP ausprogrammiere, möchte ich nachfragen ob es eine einfachere Variante gibt. Mithilfe von JS (Ajax) oder sowas.

P.S. wenn du vier mal auf A+ klickst wird die Seite wieder mit der normalen Schriftgrösse dargestellt.

Ok, ist halt noch nicht optimal.

Irgendjemand eine Lösung zu dem Win/IE5.5 Problem?

Gibts eine Lösung die Accesskeys im IE zu verwenden, auch wenn die Liste versteckt ist (FF kann das. ;)).


Edit: Sorry das ich bei diesem Beitrag den Titel nicht so aussagekräftig erstellt habe. Lässt sich ja nun nicht mehr ändern. Hat niemand mehr noch n input? Gerade was die Schriftgrössen-Manipulation angeht. Oder ist in eueren Augen diese Website soweit genug barrierefrei?

prm 21.09.2006 08:35

Die Seite sieht sehr gut aus, übersichtlich und klar gegliedert.
Der Kontrast sollte zur besseren Lesbarkeit noch etwas stärker sein (dunklerer Grauwert für die Schrift).
Selbst wenn du eine proportionale Schrift verwendest wäre zu überlegen, ob du die Standardschriftgröße nicht noch einen kleinen Tick größer einstellst, weil viele die Möglichkeit des Vergrößerns im Browser nicht kennen.
Der Header wirkt etwas überdimensioniert. Hier würde ich die Höhe zu Gunsten des Contents etwas reduzieren.

webnet 21.09.2006 09:57

Vielen Dank für deine Rückmeldung. Werde sehn ob ich den Grafiker von etwas mehr "Kontrast" überzeugen kann.

Glaub mir, es war bereits ein Kampf dein Grauwert so zu setzen. Aber du hast ja recht, der Kontrast ist echt bescheiden.

laborix 21.09.2006 13:44

Zitat:

Zitat von webnet
Für einen Check und eine Beurteilung bin ich sehr froh.

Design:

Graue Schrift auf weissem Grund? Weisse Navigation auf grauem Grund?
Für mich auf meinem Notebook sehr schlecht lesbar (1280x1024/120DPI) mit schwachen Helligkeit

Gut ist, das der IE die Schrift vergrössern kann, ohne "A+". Hierzu würde ich vorschlagen folgende Struktur zu verwenden "A-- A- Normal A+ A++". Wird auch auf professionellen Seite oft in der Art so angeboten.

Offene Frage:
Für deutsche Seiten gibt es eine Impressumspflicht, wie ist das bei .ch Seiten?


Code:

- im <acronym> ein Stylesheet versteckt (WAI Level Test)
- <noscript> Bereiche fehlen (BITV Test)
- die Überschriften Reihenfolge ist unlogisch (BITV)
-- <h1> für Willkommen und <h1> für Aktuelles?

Der CSS Validator meckert beim Element "-moz-scrollbars-vertical" und es fehlen Definitionen zur Hintergrundfarbe. Eigentlich sollte ein "color:" Element in direkten Anhang auch ein "background-color:" Element haben.


WAI:

- Meine Screenreader Simulation (WAVE) kann die Seite wegen des .asp nicht interpretieren
- Unlogischer Seitenaufbau mit Text Browser

Schön ist der Skip-Link "Direkt zum Inhalt", aber bin ich am Inhalt, so kann ich nur per "Nach oben, TOP" (besser "zum Seitenanfang") wieder nach oben. Muss dann aber
entscheiden, ob da wirklich nach dem Skip Link "Direkt zum Inhalt" eine Navigation kommt oder keine.

Zum Abschluss möchte ich noch bemerken, das kein Inhaltsverzeichnis (Sitemap) vorhanden ist und meines persönlichen Erachtens noch ein "title"-Attribut in die Navigation gehört.

Ansonsten eine gute Webseite, nicht überladen und wenn das Grau/Weiss Verhältnis etwas besser wäre, doch sehr ansprechend.

webnet 21.09.2006 14:17

Danke auch dir.

Was die farben anbelangt da kann ich nichts mehr ändern. Es ist eben so, ich muss die Seite für diese Grafik-Firma umsetzen. Sie haben also die Oberhand was das Konzept anbelangt.

Musste eben vorhin die Farbe wieder heller stellen, Zitat "ich will das halt so". Da ist leider nichts zu machen. Auch wenn ich für nicht sinnvoll halt. Die Seite ist bei Sonnenlicht einfall nicht mehr zu lesen. Nun ja, werde es also nochmals versuchen einen etwas stärkeren Kontrast durchzuboxen.

Die Schrift lässt sich vergrössern da es mit em realisiert wurde. Zu dem A+ das ist eben wie gesagt noch nicht fertig. Kannst du mir eine Website angeben wo sie dies mit "A-- A- Normal A+ A++" realisiert haben? Kann da evt. mal das ganze anschauen. Im Moment wird das noch via ASP (mit Session) geregelt. Ist also keine optimale Lösung. Bin dir sehr dankbar für einen Link dazu.

Ein Impressum ist in der Schweiz weder für Private noch für Firmen Pflicht. Da die der Domain-Inhaber jederzeit eingesehen werden kann (alle .ch und .li Domains werden von der Switch verwaltet).

- Zu den Accesskeys: Setzt man das so um? Hab jetzt den <acronym> Tag entfernt.
- Was meinst du genau mit <noscript> Bereiche?
- Der Inhalt wird aus dem CMS geneneriert. Daher habe ich wohl übersehen dass es 2 h1 Tags gibt. Werde der Spalte Aktuelles tiefere h-Tags zuweisen.
Andere Frage, ich habe h1 Tags für Titel definiert. Zudem habe ich aber noch versteckte Infos, jedoch auch als h1. Ist dies ein Problem -> (screenreader)?
- "moz-scrollbars-vertical" muss ich leider so belassen. Der Grafiker will eine zentriere Seite die nicht hüpft. Bekanntes Problem mit FF zeigt die Scroll-Leiste ja nur an wenns was zu scrollen gibt. Diesen nicht validen Teil muss ich wohl so stehen lassen.

- Zum unlogischen Seitenaufbau. Gibt es eine Möglichkeit den Bereich mit den News (Aktuelles mit Anriss) für den Screenreader zu verstecken?
Wie soll die Seite struckturiert werden, damit es logischer ist?

Sitemap ist vorhanden. Und zwar in der Hilfsnavigation. Oben in der Mitte ;).
Du denkst also ich soll noch pro Menüpunkt ein "titel" Tag aus dem CMS generieren lassen, obwohls ja ein Listen-Menü ist?

Betreffend CSS, ist es also so, sobald ich ein "color" definiere, muss ich auch ein "background-color" definieren muss? Bläst dass das CSS-File nicht unnötig auf?

Nun, ich bedanke mich für deine Bemühungen.

BreiteSeite 22.09.2006 22:35

Hi, schöne Seite... ich würde nur noch Script und so unescapen(?)... d.h aus

Code:

                <script type="text/javascript"><!--
                        var mail = "info";
                        var domain = "gemeindeverband.ch";
                        document.write('<a href=\"mailto:' + mail + '@' + domain + '\" title="Kontakt per E-Mail">');
                        document.write(mail + '@' + domain + '<\/a>');
                // --></script></p><br />

Code:

                <script type="text/javascript">
                        /* <![CDATA[ */
                        var mail = "info";
                        var domain = "gemeindeverband.ch";
                        document.write('<a href=\"mailto:' + mail + '@' + domain + '\" title="Kontakt per E-Mail">');
                        document.write(mail + '@' + domain + '<\/a>');
                        /* ]]> */
</script></p>

Das <br /> gehört da glaube ich auch nicht hinein. :)

Und warum Leerzeilen vor dem DTD?

Keine XML Deklaration? Hat das einen Grund? Evtl. damit der IE nicht in den Quirksmode springt? Ansonsten sowas mit hinzufügen. :)

Aus
Code:

xml:lang="de" lang="de"
kann übrigens
Code:

xml:lang="de-DE" lang="de-DE"
gemacht werden (entspricht Deutsch (Deutschland) [gibt ja noch Deutsch (Österreich) etc. ]

<meta> würde ich generell streichen (sowas wie autor oder so finde ich unnötig, google und so achtet da eh kaum drauf. :)) und sowas über den Webserver ausliefern lassen (z.B. Content-Type, [evtl. Content-Script-Type[?]])

Zitat:

<!-- Adresse -->
Statt des Layers würde ich das dafür geschaffene <address> Element benutzen. :)

btw. schade das es kein XHTML 1.0 Strict ist.. :)

webnet 23.09.2006 03:20

Auch dir danke ich.

Deine Tipps werde ich am Montag umsetzen.

Das br gehört dort wirklich nicht rein. Wurde von mir übersehen.
Ein xml:lang="de-CH" lang="de-CH" ist sinnvoll, da hast du recht.
Der Meta-Text wird automatisch aus unserem CMS generiert (eigenes CMS). Ist noch n bestandteil von früher.
Werde ich wohl bei gelegenheit etwas kürzen.

Anstat ne division n <address> wäre semantisch wohl korrekt.
Wie siehts vom stylen aus, und wie geht der screenreader damit um?

xhtml strict ist wohl irgendwann n nächster schritt. so in ein paar monaten.

ich versuche mir mit jedem projekt mehr wissen aufzubauen. Denn für mich ist das wichtig. (darum hasse ich reine Flash-Sites)

BreiteSeite 24.09.2006 04:27

Zitat:

Zitat von webnet
Anstat ne division n <adress> wäre semantisch wohl korrekt.
Wie siehts vom stylen aus, und wie geht der screenreader damit um?

Ich glaube jedes Element lässt sich stylen, wie man mag... :) also Du kannst wenn Du möchtest, alle Styledaten von dem div einfach ins address übertragen und ein display:block; und dann sollte das auch passen. :)

Zitat:

Zitat von webnet
darum hasse ich reine Flash-Sites

Ich glaube das tut jeder hier...

(und ich hasse <meta> das ist irgendwie nicht mein ding.. lieber HTTP-Header für's encoding... <meta> finde ich, ist nichts halbes und nichts ganzes... :D


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:21 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023