Du bist nicht angemeldet.

Lieber Besucher, herzlich willkommen bei: WebStyleBoard. Falls dies dein erster Besuch auf dieser Seite ist, lies bitte die Hilfe durch. Dort wird dir die Bedienung dieser Seite näher erläutert. Darüber hinaus solltest du dich registrieren, um alle Funktionen dieser Seite nutzen zu können. Benutze das Registrierungsformular, um dich zu registrieren oder informiere dich ausführlich über den Registrierungsvorgang. Falls du dich bereits zu einem früheren Zeitpunkt registriert hast, kannst du dich hier anmelden.

1

Montag, 28. Juni 2004, 20:11

Ansätze barrierefrei?

Hallo Boardnutzer,

habe da mal eine Frage bezüglich dieser Internetseite: http://www.der-belegungsplan.de/neu2, ist diese Seite barrierefrei, oder muss ich nochmal von vorne anfangen?

Herzlichsten Dank schonmal an Euch.
Signatur von »ARESOL« wieder da

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »ARESOL« (28. Juni 2004, 20:11)


2

Montag, 28. Juni 2004, 20:19

RE: Ansätze barrierefrei?

versuche doch einmal, für solchen Fragen das richtige Forum zu treffen ... oder was glaubst du, weswegen ich es eingerichtet habe?
Signatur von »TheNobody Style«

3

Montag, 28. Juni 2004, 21:16

RE: Ansätze barrierefrei?

Zitat von »ARESOL«

ist diese Seite barrierefrei [...]?


Zitat von »http://validator.w3.org/check?verbose=1&uri=http%3A//www.der-belegungsplan.de/neu2/«

This page is not Valid XHTML 1.0 Strict!


Der CSS_Validator meckert auch (tipp: cursor:hand ist böse, cursor:help ist gut)

Web Content Accessibility Report



noch fragen? ;)
Signatur von »mrhappiness« Ich denke, also bin ich. Einige sind trotzdem...

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »mrhappiness« (28. Juni 2004, 21:16)


4

Montag, 28. Juni 2004, 23:17

RE: Ansätze barrierefrei?

Zitat von »ARESOL«

Ist diese Seite barrierefrei[?]

IMO nein, da sich selbst bei einer geringfügigen Schriftvergrößerung Seitenelemente überlagern. Außerdem kann seltsamerweise der Lynx-Viewer nicht darauf zugreifen.

Zitat von »ARESOL«

[...]oder muss ich nochmal von vorne anfangen?

IMO ja. Schau dir aber vorher mal http://einfach-fuer-alle.de/ an, dort wird der Begriff "Barrierefreiheit" recht anschaulich dargestellt.

5

Dienstag, 29. Juni 2004, 10:53

RE: Ansätze barrierefrei?

Hi,
eine erste Anlaufstelle ist für mich immer Bobby. Hier bekommst Du schonmal einige konkrete Hinweise zu möglichen Schwachstellen. Bei Deiner Seite meint Bobby auch "repair needed", wenn ich auf AAA teste.
Die konkreten Mängel:
- Provide an explicit label for each form control. (2 instances)
Lines 67, 69

- Identify the language of the text. (1 instance)
Line 2
Include default, place-holding characters in edit boxes and text areas. (2 instances)
Lines 67, 69

Priority 2 User Checks:
- If there are logical groupings of form controls, use FIELDSET with LEGEND on each group. (1 instance)
Line 65
Is the user made aware that there will be pop-up windows or changes in the active window? (1 instance)
Line 75

Davon abgesehen bekommt Bobby auch keine Styles ausgeliefert und wenn ich mir die Seite text-only so ansehe, dann finde ich einiges nicht optimal gelöst:

- Sie befinden sich auf www.edanet.de
Was soll mir diese Überschrift sagen? Nichts, das ich nicht bereits wüßte. Aber auch nichts, was mir beim Betreten doch mitgeteilt werden sollte, nämlich um was für ein Angebot es sich hier handelt. Die ganzen Grafiken zählen hier (mangels ALT-Text) nicht.

- Nachricht: Haus Sine Cura mit einer neuen Internetpräsenz
oops... darum geht es also auf der Seite?

- Liink zur Startseite
aber da bin ich doch schon!?

- diverse andere Links
eigentlich würde ich ja doch gern zunächst mal wissen, worum es hier überhaupt geht. Und wenn ich mir die Seite vorlesen lassen muß, dann nervt das Menü hier ziemlich.

- Herzlich Willkommen auf der Medienpräsenz der EDANET GmbH
Aha. Endlich. Aber wieso ist hier nochmal eine Überschrift erster Ordnung? Wenn ich in meinem Textbrowser zum Anfang (über H1) springen will, bin ich wieder ganz woanders. Irgendwie mißverständlich das Ganze.

- EDVElektronische Datenverarbeitung mittels Rechenmaschinen
(Bsp.: Computer)
oops. Das ist aber ein merkwürdiger Verweistext. Was ist denn nur "EDVElektronische"? Und bekomme ich da nun Computer zu sehen? hmm...

Soweit jetzt mal Deine Seite aus der Sicht eines Users mit Textbrowser bzw. Screenreader.
Du siehst die Barrieren?

Ach ja... da sind dann noch Deine gelibten Acronyme. Ich frage mich natürlich, wofür eigentlich z.B.
"ProdukteUnsere Produkte

Internetdesign
Netzwerklösungen
Hard- und Software
Businesslösungen
Schulungen
Telefonanlagen"
steht... (beachte auch das fehlende Leerzeichen).

Positiv immerhin die Skalierbarkeit, obwohl es nicht besonders schön (wenn auch noch barrierefrei) ist, daß bei Schriftvergrößerung der Inhaltsbereich unter die Navigation rutscht.
Nicht mehr barrierefrei ist allerdings, daß in standardkonformen Browsern gerade die " Nachricht: Die EDANET schreibt barrierefreie Internetseiten" die Navigation überlagert.

Apropos Navigation: im Mozilla sehe ich plötzlich noch eine Top-Navigation. Wenn diese wichtig ist, muß sie auch ohne Javascript verfügbar sein.

Gruß
Ingo

6

Dienstag, 29. Juni 2004, 10:58

So Ladies, schaut jetzt bitte nochmal.

Wo überlagert sich etwas Duke, Screens wären hilfreich.
Signatur von »ARESOL« wieder da

7

Dienstag, 29. Juni 2004, 12:05

Signatur von »ARESOL« wieder da

8

Dienstag, 29. Juni 2004, 13:39

Hi ARESOL.

[q]Line 49, column 44: document type does not allow element "form" here; missing one of "object", "ins", "del", "map" start-tag

<form action="senden.php" method="post"/>[/q]Das form-Element darf nicht direkt wieder geschlossen werden! Warum sollte dies eigentlich? Zum schließen von <form> gibt es doch </form>!
Funktioniert eigentlich das Formluar? Mich würde wundern, wenn ja.

[q]Line 50, column 8: document type does not allow element "p" here; missing one of "object", "ins", "del", "map", "button" start-tag[/q]
[q]Line 53, column 8: document type does not allow element "p" here; missing one of "object", "ins", "del", "map", "button" start-tag[/q]Die p-Tags haben an dieser stelle nichts verlohren, denn sie sind so nicht erlaubt. Außerdem ist es reichlich Sinnfrei, einen Textabsatz zu definieren, wenn es keinen Textabsatz gibt!

[q]Line 57, column 10: end tag for element "form" which is not open

</form>[/q]S.o.

MfG Arne :)

9

Dienstag, 29. Juni 2004, 14:37

Hi,
die meisten Kritikpunkte bzgl. Barrierefreiheit bestehen weiterhin.

Was den Screenshot betrifft: Installiere Dir mal Mozilla oder einen anderen Gecko-Browser und Du siehst das Problem mit der Nachrichtenzeile (übrigens sogar ohne Schriftvergrößerung) selbst.
Es ist grundsätzlich ohnehin zu empfehlen, eine Seite erst im Gecko-Browser zu testen und dann ggfls. Korrekturen für den IE vorzunehmen.

Jetzt hast Du ja Acronym sinnvoll angewendet..;-)
Allerdings frage ich mich gerade - auch wenn ich es ja auf meinen Seiten selbst so mache - ob es tatsächlich barrierefrei ist, in acronym auch die einzublendende Beschreibung mit einzubeziehen. Die Konstruktion
<acronym><a href>Begriff<span> Erklärung </span></a></acronym>
(beachte übrigens das Leerzeichen, das Du schon setzen solltest!)
hat zwar den Vorteil, daß man auf eine CSS-Klasse zur Formatierung verzichten kann, aber
<a class="infobox" href><acronym>Begriff</acronym><span> Erklärung </span></a>
könnte korekter sein.
Gruß
Ingo

p.s.: Deine Fehlerseite ist übrigens wegen dem Javascript-back nicht barrierefrei und außerdem leider wenig hilfreich.

10

Dienstag, 29. Juni 2004, 17:55

Zitat von »ARESOL«

Wo überlagert sich etwas Duke, Screens wären hilfreich.

Gerne doch! Übrigens ist es IMO recht unsinnig eine seperate "Druckversion" anzubieten, da du dieses Medium auch mit einem entsprechenden Stylesheet optimal bedienen kannst.

Dieser Beitrag wurde bereits 4 mal editiert, zuletzt von »DukeXP« (29. Juni 2004, 18:04)


11

Mittwoch, 30. Juni 2004, 09:33

Also ich nutze folgende Browser zum testen:

- IE 6.0
- Mozilla 1.7
- Netscape 4.7
- Opera 7.23
- Netscape 7.1
und Lynx in jedem Browser wird es annähernd gleich angezeigt.

Verschiebungen habe ich lediglich beim Inhalt, was auch denke ich in Ordnung ist. Bei mir verschiebt sich der Zufallstext nicht, warum? Liegt es an Deinem FireFox, den habe ich nämlich nicht installiert.
Signatur von »ARESOL« wieder da

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »ARESOL« (30. Juni 2004, 09:35)


12

Mittwoch, 30. Juni 2004, 10:15

Der Text verschiebt sich bei dir nicht, weil Du die Schrift nicht vergrößerst... Siehe:

[q=DukeXP]IMO nein, da sich selbst bei einer geringfügigen Schriftvergrößerung Seitenelemente überlagern.[/q]

Erhöhe also einfach mal die Schriftgröße und Du siehst, was der Duke meint... ;)
Signatur von »LapisInfernalis« Eine Milde Gabe...

Der Horizont vieler Menschen ist ein Kreis mit dem Radius Null - und das nennen sie ihren Standpunkt.

Albert Einstein (1879-1955)

A common mistake people make when trying to design something completely foolproof is to underestimate the ingenuity of complete fools.
Douglas Adams (1952-2001)

13

Mittwoch, 30. Juni 2004, 10:49

Hi,
wie ich schon schrieb, wird die Nachrichtenzeile im Mozilla bereits ohne Schriftvergrößerung falsch positioniert (auch wenn es hier so gerade eben noch zu keiner Überlagerung kommt.

Quellcode

1
2
3
4
5
6
7
8
  <p id="news" class="textbold"><br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    <br /> 
    Nachricht: Familie Jehn mit barrierfreier Seite online. 
  </p>

ist wirklich nicht geeignet, um einen Text an eine bestimmte Stelle zu positionieren. Abgesehen davon sind die Zeilenvorschübe in Textbrowsern völlig unmotiviert.
Gruß
Ingo

14

Mittwoch, 30. Juni 2004, 12:24

*----- Ab hier: neue Version -----*

So hab jetzt nochmal einiges von Euch verändert. Könnt Ihr nochmal schauen und sagen, was noch gemacht werden muss?

Vielen Dank schonmal.
Signatur von »ARESOL« wieder da

15

Mittwoch, 30. Juni 2004, 13:24

Mir fällt auf, das bei den beiden Input-Feldern des "Persönliche Beratung von Anfang an kostenlos!"-Formulars keine Beschriftungen sind! Was soll man also in die Felder Eintragen? Mach also besser Besriftungen an die Felder, sonst tragen manche Leute irgendwas ein, aber nicht was du willst ;) (falls überhaupt).

MfG Arne :).

16

Mittwoch, 30. Juni 2004, 16:07

Wenn das der einzigste Fehler ist, der noch besteht bin ich zufrieden. Ist ja erstmal nur zum testen.

Trotzdem Danke :) Brauche aber noch Verbesserungen zum QT.
Signatur von »ARESOL« wieder da

17

Mittwoch, 30. Juni 2004, 16:39

Jupp. Da kannst du noch was verbessern.


Du benutzt zweimal das h1-Tag, was man nicht umbedingt machen sollte.

Quellcode

1
2
3
4
5
6
7
8
9
<h1 id="ueberschrift">Willkommen auf der Medienpräsenz der EDANET GmbH</h1>
<div class="ie">
<p id="header"></p>
<p id="news" class="textbold">Nachricht: Familie Jehn mit barrierfreier Seite online.</p>
<ul id="navigation">
[... jede menge Menü ...]
</ul>
<div class="inhalt">
<h1>Herzlich Willkommen auf der Medienpräsenz der EDANET GmbH</h1>
Nimm lieber für die Seitenüberschrift h1 und für die zweite Überschrift (die mit "Herzlich Wilkommen") h2 und die nächste Unterüberschrift h3 und so weiter ...


Zudem fällt mir gerade auf, was ist das?

Quellcode

1
<p id="header"></p>
Wo für soll das gut sein?


Du benutzt an einigen Stellen fett formatierte Textabsätzte, die man besser durch Überschriften (3. Ordnung) ersetzten könnte. Dazu gehören zum Beispiel:

Quellcode

1
<p class="textbold">Zu unseren besonderen Leistungen gehören:</p>



Zudem gibt es noch Probleme beim Formular. Dazu muss ich sagen, dass ich mich bezüglich der Textabsätze geirrt habe. Diese sind durch aus erlaubt, aber etwas anderes ist nich erlaubt:

Quellcode

1
2
3
4
5
6
7
<p>Wir rufen Sie zurück! <br />
<form action="mail.php" method="post">
<input type="text" name="name" id="name" size="40" />
<input type="text" name="telefon" id="fon" size="40" />
<input type="submit" value="Abschicken" />
</form>
</p>
Und zwar ist der form-Tag nicht im p-Tag erlaubt! Das hat wahrscheinlich auch den Fehler mit den Textabsätzen bei den Textfeldern verursacht.


So, dass war eigentlich alles, was mir so grob aufgefallen ist. Man könnte den Quellcode sicherlich noch übersichtlicher gestallten, aber sonst ist er soweit ganz augeräumt.

MfG Arne :).

18

Freitag, 2. Juli 2004, 15:26

Ich verzweifel, warum klappt das mit dem Formular im Validator nicht.
Signatur von »ARESOL« wieder da

19

Freitag, 2. Juli 2004, 16:31

Hi,
Formulare haben in XHTML sehr strenge Vorgaben.
Setze das form-Tag in ein blocklevel-Element (kein P - dieses darf nur inline-Elemente enthalten) und schließe die input-Felder ebenfalls in einem (aber anderem) oder mehreren blocklevel-Elementen ein (das darf dann auch ein P sein).

z.B

Quellcode

1
2
3
4
5
6
7
<div>beliebiger inhalt
<form>
  beliebiger inhalt
  <p><input /></p>
  beliebiger inhalt
</form>
beliebiger inhalt</div>


Gruß
Ingo

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »Ingo« (2. Juli 2004, 16:34)