Frage zu Web-Accessibility

Dieses Thema im Forum "Web Page Design" wurde erstellt von defect, 24.02.2005.

  1. defect

    defect Thread Starter MacUser Mitglied

    Beiträge:
    827
    Zustimmungen:
    7
    MacUser seit:
    12.11.2004
    Hallo zusammen.

    Ich habe eine Frage zur Zugänglichkeit von Web-Seiten. Es sieht inzwischen so aus, als hätte ich meine erste Seite spruchreif designt. Jetzt habe ich noch Feinheiten zu machen, sowie den Inhalt abzustimmen.
    Und jetzt die Frage: Die Seite ist komplett CSS designt, keine Tabellen im HTML oder so. Das Design ist mit Bildern (Logo usw.) realisiert, die auch in der CSS sitzen und nicht im HTML. Wenn ich also zB beim Firefox bei "Ansicht -> Webseiten-Stil -> Kein Stil" wähle, habe ich vollkommen undesignten, nackten Text. Allerdings fehlt der Name der Gruppe, sowie die Bezeichnung der Seite, auf der man/frau sich momentan befindet. Ich überlege also, ob ich Überschriften einbinden soll, die ich im CSS dann unsichtbar machen würde. Bei Ausschalten des CSS wären sie sichtbar und auch die Screenreader bekommen sie mit. Wie löst ihr eure Accessibility-Probleme? Ist meine Lösung elegant? Ich hatte auch überlegt, ein Alternativ-Design anzubieten... Kann ich darauf vertrauen, dass Menschen mit Sehschwächen Browser benutzen, die CSS abstellen können? Das Schriftgröße ändern auf meiner Seite führt nach sechs Klicks bei Safari ins Chaos, deswegen würde ich gerne trotzdem noch möglichst hohe Zugänglichkeit erreichen. Ich bin äußerst dankbar für Tipps und/oder Anregungen :)

    mit Gruß.
    godn
     
    Zuletzt bearbeitet: 25.02.2005
  2. defect

    defect Thread Starter MacUser Mitglied

    Beiträge:
    827
    Zustimmungen:
    7
    MacUser seit:
    12.11.2004
    -- Also ich hab inzwischen den Bobby-Tester gefunden... leider kann ich den Test erst durchführen, wenn die Seite online ist, aber das scheint schonmal gut zusein. www.einfach-fuer-alle.de hat einige interessante Beiträge. Fangs vor allem scheint mir auch ziemlich brauchbar... schon interessant, wie das dann aussieht.
    Trotzdem interessieren mich immernoch eure Erfahrungen und Lösungswege.
     
    Zuletzt bearbeitet: 25.02.2005
  3. defect

    defect Thread Starter MacUser Mitglied

    Beiträge:
    827
    Zustimmungen:
    7
    MacUser seit:
    12.11.2004
    [​IMG] Kann mir niemand die Fragen beantworten? Mich interessiert die Sache mit der Accessibility wirklich sehr und es wäre sehr hilfreich für mich, von einigen erfahreneren Forums-Mitgliedern ihre Lösungswege und eine Einschätzung meiner Überschriften-Idee zu bekommen.
    ich hoffe, mein erneutes posten wird mir nicht als spam angelastet
     
  4. HAL

    HAL Gast

    Vielleicht hilft Dir diese Seite weiter: http://www.scoreberlin.de/barrierefreiheit/*

    Nebenbei bemerkt: Der Bobby Test ist Hardcore, die wenigsten Webseiten die ich
    kenne erfüllen dessen Standard. Für rein private Webseiten ist es auch nicht
    nötig, anders schaut es bei Gouverment (Behörden) Seiten aus, dort ist eine
    strikte Accesibility gesetzlich vorgeschrieben (auch in Deutschland).

    *Womit ich nicht sagen möchte, das Du deren Dienst in Anspruch nehmen
    sollst, sondern man von denen einen Menge lernen kann. ;)
     
    Zuletzt von einem Moderator bearbeitet: 25.10.2015
  5. defect

    defect Thread Starter MacUser Mitglied

    Beiträge:
    827
    Zustimmungen:
    7
    MacUser seit:
    12.11.2004
    Danke für den Link.
    Zum Bobby-Test: Es wird keine rein-private Seite. Es wird die Homepage einer Hochschul-Fachschaft, die auch auf der Seite des entsprechenden Instituts landen wird. Außerdem kenne ich selbst schonmal entfernt Eine, die Sehbehindert ist, und ich möchte -bestimmt auch deswegen- eine Zugänglichkeit für wirklich so viele wie möglich erreichen.
    mit Gruß und danke für den Hinweis :)
    godn
     
  6. HAL

    HAL Gast

    Das ist eine Seite, die durchaus durch die harte Mühle des Bobby-Tests
    gehört. Viel Erfolg!

    :)
     
  7. defect

    defect Thread Starter MacUser Mitglied

    Beiträge:
    827
    Zustimmungen:
    7
    MacUser seit:
    12.11.2004
    Danke. Das wird schon... und wenn nicht, bau ich um (das Valid-XHTML 1.0 strict und Valid-CSS habe ich ja auch geschafft :))
    Bleibt also erstmal nur noch die Frage mit den unsichtbaren Überschriften... (das habe ich mir so ausgedacht, weil es für Bilder in der CSS ja kein "alt" gibt oder irre ich mich?)
    Hat jemand so eine Lösung schonmal benutzt? Wie sichert ihr den Inhalt, wenn ihr mit Bildern (und CSS) gestaltet?
    :) godn
     
  8. neolox

    neolox MacUser Mitglied

    Beiträge:
    85
    Zustimmungen:
    0
    MacUser seit:
    22.09.2004
    gesetzlich vorgeschrieben ist für 2005 (wann genau weiss ich jetzt leider nicht) dass deutsche öffentliche und staatliche seiten barrierefrei gestaltet sein müssen...

    mit bobby fährst du schon recht gut was barrierefreiheit angeht...
    so weit ich das bisher gesehen hab wird das oft so gelöst wie du bereits gesagt hast...

    eine überschrift <h1>name der seite</h1> wird mit css so formatiert dass dort ein logo dargsetellt wird, der inhalt jedoch nicht...wird das stylesheet weggelassen..zb wenn ein blinder mit textbrowser unterwegs ist -> brailleschrift oder einen screenreader verwendet..funktioniert die seite trotzdem wunderbar :)

    weiters musst du nicht unbedingt auf teufel komm raus alle bilder aus dem quelltext entfernen..wenn sie für den inhalt der seite eine bedeutung haben kannst du sie ruhig reintun und einen alternativtext anbieten der so gut wie möglich eine alternative information geben kann falls das bild nicht dargestellt wird...ich glaube es gibt auch das attribut longesc um eine ausführliche beschreibung zu geben.

    bilder die fürs design sind kannst du jedoch ins css auslagern das is auch super so :)

    wie du die accessibility noch weiter steigern kannst ist wenn du die ladezeiten gering hältst, und indem du die navigation durch tabulator shortcuts ermöglichst (ist jedoch dank firefox nicht mehr so dringend notwendig, da der browser schon nette features für das ansteuern von links bietet...mit type-and-find

    man kann generell sagen...100% barrierefrei geht nicht...aber man kann viel dazu beitragen und es der software wie browsern und screenreadern und bestimmter hardware einfacher machen damit so viele user wie möglich komfortabel eine webseite bedienen können...

    es ist eine parallele weiterentwicklung zwischen standards in markup und design, software und hardware...und wenn du mit deiner webseite einen schritt in die richtige richtung machst kann das schon viel bewegen :)

    find ich echt toll dass du dir mühe gibst...leider hab ich dir nicht viel mehr infos geben können...aber ich hoffe es hat dir ein bisschen weiter geholfen...

    lg
     
  9. defect

    defect Thread Starter MacUser Mitglied

    Beiträge:
    827
    Zustimmungen:
    7
    MacUser seit:
    12.11.2004
    Das ist gut zu hören :) Dann mach ichs so.

    So mach ichs auch. Die Bilder fürs Design (Logo, Navigationsleisten-Hintergrund) sind in der CSS, die Bilder von den Gruppenmitgliedern kommen aber mit "alt" ins HTML. Das mit dem "longsc" klingt gut. Recherchier ich mal.

    Mach ich das mit "tabindex" für die Links richtig, oder gibts noch bessere Methoden?

    Das hat es :)

    mit gruß. godn
     
  10. HAL

    HAL Gast

    Das kann man z.B. so lösen (Als Beispiel ein Logo, kann
    aber auch für andere Bilder benutzt werden):

    Quellcode:

    PHP:
    <div class="logo">
    <
    h1>
    <
    a href="index.php" title="Startseite">Startseite</a>
    </
    h1>
    </
    div>
    CSS:

    PHP:
    #logo {
        
    width120px;
        
    height16px;
        
    margin-left25px;
        
    text-decorationnone;
        
    positionabsolute;
        
    margin0px;
    }

    h1    {
        
    text-indent: -9999px;
        
    margin0;
        
    border0;
        
    padding-left38px;
        
    color#336699;
        
    text-decorationnone;
        
    positionabsolute;
        
    padding-top7px;
        
    width100px;
        
    height16px;
    }
        
    h1 a:linkh1 a:visited    {
        
    displayblock;
        
    background#FFF url(pixel/logo.gif) top left no-repeat;
        
    border0;
        
    margin0px;
        
    color#336699;
        
    text-decorationnone;
        
    padding-top7px;
        
    padding-left38px;
        
    width100px;
        
    height16px;
    }
        
    h1 a:hoverh1 a:active    {
        
    background#FFF url(pixel/logo.gif) top left no-repeat;
        
    border0;
        
    margin0px;
        
    color#336699;
        
    text-decorationnone;
        
    padding-top7px;
        
    padding-left38px;
        
    width100px;
        
    height16px;
    }
    Wobei Ausrichtung, Schriftgrösse und Farben natürlich anpassbar sind.
     
Die Seite wird geladen...

Diese Seite empfehlen