Hallo,

Ich habe eine konkrete Frage, ist dieser folgende HTML-Code barrierefrei?

Ich habe da irgendwie Zweifel, da Lynx und der Autorenmodus von Opera den Alternativtext nicht als h1-Überschrift darstellen, und würde gerne euere Meinung wissen.

SChönen Tag noch,
Christian[/code]

Also logisch wäre erstmal das hier:

[img]logo.gif[/img]

ALT ist für einen Alternativtext, wenn das Bild nicht geladen werden kann.

__________________
“My software never has bugs. It just develops random features ...”

» DevShack - die Website des freien Webentwicklers Boris Bojic

ja ist barrierefrei kein Problem.

Ich finde es aber äußerst unschön gelöst. Weshalb benutzt du nicht eine der gängigen Image-Replacement Methoden? Dadurch würde der Text auch vernünftig dargestellt werden. Ferner gilt es das Markup, die Inhalte (HTML) vom Design (CSS) zu trennen, ich befürchte aber, du nimmst nur ein Bild, "weil's schicker aussieht". Also ab in's CSS damit (mit einer der besagten Image Replace Methoden)

__________________
Bitte keine PN's - schreibt mir ne anständige Mail oder sprecht mich über Msn / Icq an
Milian Wolff | Markdownify | Typogridder

Dem kann ich nicht zustimmen. Man sollte nicht gnadenlos alle Bilder via CSS darstellen. Design- und Schmuckelemte ja, aber so etwas wie ein Logo nicht.

Der ALT Text wird im übrigen genau so dargestellt, wie im CSS für das H1 definiert wurde.

Bei den meisten Image Replacement Methoden gibt es das Problem, dass bei abgeschalteten Bildern nichts zu sehen ist - auch der Text nicht. Klar gibt es Methoden, mit denen es doch geht - aber nur über zusätzlichem HTML/CSS Code.

__________________
“My software never has bugs. It just develops random features ...”

» DevShack - die Website des freien Webentwicklers Boris Bojic

Hierzu ein Sample das CSS/(X)HTML valide ist und dem WAI Level A entspricht.
CSS-Code:
(X)HTML-Code:
Hier meckert weder der CSS-/(X)HTML Validator, noch Bobby von Watchfire oder Cynthia. Das entspricht im grossen und ganzen auch der WCAG 1.0, sowie den höheren WAI Levels.

Getestet von mir persönlich mit Amaya, Blazer (Palm OS), Dillo, "Gecko"-Engine Browser (Epiphany, FF, Mozilla, Seamonkey, Netscape), eLinks, iCab, Konqueror, Lynx, Opera, Safari, w3m und den MS Internet Explorern ab Version 5.01, einschliesslich MS Internet Explorer 7.0 beta 2 und dem Internet Explorer auf Windows Mobile 2005.

Getestet wurde das mit JAWS Screenreader V6.2 und V7.0 beta. Aber nicht von mir persönlich, hatte einfach auch mal tierisch Glück mit einem unbekannten Tester.

Ein Problem taucht auf, wenn man Amaya unter 8.7 verwendet, dann tauch ein horizontaler Scrollbalken auf und man sieht standardmässig zuerst den Überschriftstext und nach dem Scrollen auch das Logo und den Rest der Webseite.

Fairerweise möchte ich hier hinzufügen, das diese Lösung nicht meinem Kopf entsprungen ist, sondern von 2 sehr erfahrenen Forum-Moderatoren, die mir mehr als einmal geholfen haben.

__________________
Personal stuff

[code]<h1>[img]logo.gif[/img] gepackt wird

oder eine (echte) Überschrift, in die eine logoähnliche Grafik eingepasst wird?

Für ein Logo würde ich einen eigenen Absatz

vorsehen - für eine Überschrift Text ohne Grafik!

__________________
Informationen aus Koblenz-Metternich
-----------------------------------
"Wissen heißt, Fragen zu erwerben."

Ergänzung:

Ersetzt man im CSS-File die "#" durch einen "." und im (X)HTML-File die "id" durch "class" erreicht man auch das WAI Level AAA. Funktioniert mit Acessibility Valet der Guild of Accessible Web Designers.

__________________
Personal stuff

@D. Krautmeier

Das soll eine "richtige" Überschrift werden. Ich hätte ja gerne die Überschrift in einem speziellem Font mit kleinen Effekten. Sorry, wenn das logo.gif so verwirrt hat

Und danke für die Antworten. Das mit den IR-Methoden finde ich ja recht interessant, aber taucht der Text von der Variante von laborix auch noch auf, wenn CSS an ist und Bilder aus sind?

EDIT: Ich bin beim googlen auf die Fahrner-IR-Methode gestossen. Ich denke diese müsste doch am glattesten sein, oder?

http://meiert.com/de/publications/articles/20040415/

Nein, das ist der Nachteil der "Phark-Methode".
Die einzige Methode, bei der das einigermaßen klappt, ist IMHO "Gilder-Levin".
Diese und weitere findest du hier:
http://meiert.com/de/publications/articles/20050513/

edit: *g* ... Synchron-Posting ...