zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > Barrierefreiheit
Seite neu laden Bilder in Definitionsliste vergrößern

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 30.01.2007, 15:41
{ display: random;}
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.037
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard Bilder in Definitionsliste vergrößern

Hallo zusammen,

dass Bilder zur barrierefreien Darstellung in eine Definitionsliste gehören, scheint recht breit akzeptiert zu sein.

Per se sind diese Bilder für visuell Fähige nicht vergrößerbar.

Also habe ich mal ein wenig rumgespielt, da ich das gerne mal einsetzen möchte.

Folgendes ist dabei rausgekommen:

Vergrösserte Bilder in Definitionslisten am Beispiel Gustav Schwab

Im FF und IE7 WinXP neueste funktioniert das sehr ordentlich.
Opera bekommt beim Tabben keinen Fokus und bei Klick muss die Maustaste gedrückt bleiben, nicht gut.
Andere Browser habe ich gerade nicht zur Hand.
Hat jemand Vorschläge oder Ergänzungen, zum Beispiel zur Positionierung im Viewport? Wie sieht es in anderen Browsern /Betriebssystemen aus?

Danke einstweilen. Bin für 2 Std off.
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 30.01.2007, 18:09
Benutzerbild von LineMan
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 09.08.2006
Ort: Mülheim an der Ruhr
Beiträge: 211
LineMan befindet sich auf einem aufstrebenden Ast
Standard

Opera kann beim tabben keinen focus bekommen, weil opera die tabtaste nicht kennt (ausser in formularen)... ich glaube man muss im opera mit den pfeiltasten tabben? (weiss ich jetzt aber nicht genau)
__________________
Mein Bug, Dein Bug, Bugs sind für uns alle da...
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 30.01.2007, 18:55
{ display: random;}
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.037
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Ähm ja es ist die Q-Taste wie ich gerade bemerke.
Dann gibts aber nur einen schwarzen Rahmen - nach wie vor also Mausarbeit angesagt.
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
  #4 (permalink)  
Alt 31.01.2007, 10:28
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 29.11.2005
Beiträge: 1.324
AndreasB wird schon bald berühmt werden
Standard

Zitat:
dass Bilder zur barrierefreien Darstellung in eine Definitionsliste gehören, scheint recht breit akzeptiert zu sein.
Nur als kurze Anmerkung:
Eine solche Verwendung von DL skaliert nicht.
Sobald ein Wort aus der Bildunterschrift breiter wird als das Bild, wird es beim Skalieren verdeckt und damit unzugänglich.
Bei einer zweizelligen Tabelle tritt dieser Mangel nicht auf.

Interessante Technik. Prima Anregung, danke.

Zitat:
Hat jemand Vorschläge oder Ergänzungen, zum Beispiel zur Positionierung im Viewport?
Mir gefällt es so ganz gut. Eventuell würde die Darstellung noch gewinnen, wenn der Hintergrund während der Darstellung des großen Bildes abgedunkelt dargestellt würde - ähnlich wie bei Lightboxes.

Ob Techniken, die beim Klicken keine neue Seite laden und auch keinen Sprung im Dokument vollziehen, von der breiten Masse als Konzept wirklich verstanden werden, kann ich nicht sagen.
Ich bin skeptisch.

Jakob Nielsen bewertet ja sogar schon Sprunglinks als Verletzung des "mentalen Modells".
Within-Page Links Violate Users' Mental Model
__________________

Mit Zitat antworten
  #5 (permalink)  
Alt 31.01.2007, 13:37
{ display: random;}
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.037
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Scheint sonst niemanden zu interessieren, das Thema
Dabei ist es eine nette Spielerei und vielleicht mehr

Zitat:
Eine solche Verwendung von DL skaliert nicht.
kennst Du eine andere Verwendung?
Habe im oberen Bild eine Table eingebaut, die rot hinterlegte Schrift skaliert jetzt mit Hintergrund, die andere nicht, da werde ich wohl noch ein paar Klassendefinitionen einfügen müssen.

Nochmal der Link für die Bequemlichkeit:

Vergrösserte Bilder in Definitionslisten am Beispiel Gustav Schwab

Zitat:
Mir gefällt es so ganz gut. Eventuell würde die Darstellung noch gewinnen, wenn der Hintergrund während der Darstellung des großen Bildes abgedunkelt dargestellt würde - ähnlich wie bei Lightboxes.
Daran hatte ich gestern auch gebastelt- es soll halt ohne Scripting gehen, sonst könnte ich gleich lightbox nehmen.

Siehe das zweite Bild. Es hat eine Border^^ und sieht soweit ganz ordentlich ab 800x600 aus.
Viel genauer kann ich das Bild nicht positionieren, da die einzelne Definition von border-left merkwürdige Effekte hervorruft (Hintergrund scheint durch).
Ich muß aber left definieren, sonst baut sich das Bild in Relation zur dl auf, also eher rechts und kann aus dem Viewport rausfallen.
Habe wirklich viel probiert, aber viel besser scheint es nicht zu gehen, wenn man alle gängigen Auflösungen berücksichtigen will.

Aber vielleicht hast Du oder jemand anders noch eine Idee

Weiteres Problem beim IE6: Die Ausweitung durch border sorgt dafür, dass ein Fokusverlust nur ausserhalb der border möglich ist, ein komplettes Verdecken des Bildschirms ist so nicht möglich, es sei denn, der Nutzer klickt nach einigem Suchen auf die Scrollleiste seines IE 6 und vermutlich drunter - was nicht gerade barrierefrei ist

IE7, FF und Opera haben damit keine Probleme.

@ Nielsen: Würde gern wissen, was der für ein mentales Konzept hat. Manchmal schiesst er über das Ziel hinaus.
Sprunglinks sind für Nutzer, für welche die normale visuelle Navigation mit Maus gar nicht oder nur schwer zu nutzen ist.
In-Site-Links sind gängig. Ich gebe ihm nur soweit recht, als irgendwie klar sein muss, wo der Link hinführt, das kann sich aus dem Zusammenhang oder durch explizite Nennung ergeben.
Bei Skiplinks ist das klar, alle anderen müssen sorgfältig überdacht werden.
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
  #6 (permalink)  
Alt 31.01.2007, 23:15
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 29.11.2005
Beiträge: 1.324
AndreasB wird schon bald berühmt werden
Standard

Zitat:
Scheint sonst niemanden zu interessieren, das Thema
Vielleicht lesen viele interessiert mit, wer weiß.

Aber tröste Dich, ich bin auch so manchesmal davon überzeugt, dass ein von mir als hochspannend eingestuftes Thema doch massenhaft Poster zu Äußerungen inspirieren müsste
Zuletzt war es der Thread zu Präsentationen.
Interessierte niemanden.

Zitat:
Dabei ist es eine nette Spielerei und vielleicht mehr
Bilder vergrößert anzeigen ohne sie neu zu laden hat eine hervoragende Gebrauchstauglichkeit aus meiner Sicht.
"Kurz mal das Bild anschauen und weiter im Text!"


Zitat:
kennst Du eine andere Verwendung?
Habe im oberen Bild eine Table eingebaut, die rot hinterlegte Schrift skaliert jetzt mit Hintergrund, die andere nicht, da werde ich wohl noch ein paar Klassendefinitionen einfügen müssen.
Ich halte eine zweizellige Datentabelle (TH, TD) für besser geeignet als eine DL mit einem Term.

Dumm gelaufen, dass das W3C so essentielle Elemente wie Caption für IMGs vergessen hat.

Ob überhaupt skalierende Lösungen mit DL möglich sind, weiß ich nicht.

Vermutlich nicht.

Zitat:
Daran hatte ich gestern auch gebastelt- es soll halt ohne Scripting gehen, sonst könnte ich gleich lightbox nehmen.
Ohne javascript: das ist ein absolut edles und verfolgenswertes Ziel, ACK.

Zitat:
Aber vielleicht hast Du oder jemand anders noch eine Idee
Ich bin mit Positionierungen sehr unerfahren.
Das hat auch mit meiner persönlichen Abneigung gegen diese Eigenschaften zu tun.
Ich empfinde solche CSS-Konstrukte als "unrein". Maßangaben für Positionen anzugeben widerspricht in meiner engstirnigen Auffassung dem Ideal der Skalierbarkeit, der Flüssigkeit.

Zitat:
@ Nielsen:
In-Site-Links sind gängig.
Ich denke auch, dass sie von breiten Nutzergruppen verstanden werden. Nicht nur, aber auch weil sie auf Wikipedia eingesetzt werden.

Zitat:
Ich gebe ihm nur soweit recht, als irgendwie klar sein muss, wo der Link hinführt, das kann sich aus dem Zusammenhang oder durch explizite Nennung ergeben.
Ein guter Linktext kann über den Inhalt des Zieles Auskunft geben, aber nicht darüber, ob es sich um einen
  1. In-Site-In-Page-Link
  2. In-Site-Other-Page-On-Top-Link
  3. In-Site-Other-Page-Inside-Link
  4. Other-Site-Page-On-Top- Link oder
  5. Other-Site-Page-Inside-Link
handelt.
(Das Ganze jetzt bitte mal janz flott mehrmals hintereinander sprechen )

In der Spezifikation werden dazu eben keine Unterscheidungsmöglichkeiten aufgeführt.

Eine der denkbaren wäre: durchgezogener Unterstrich für Other-Page, gepunktet für In-Page.
Aber gepunktet ist schon belegt. Und die Überlegung ist nichts weiter als eine persönliche Vorliebe von mir ohne jede Relevanz.
__________________

Mit Zitat antworten
  #7 (permalink)  
Alt 02.02.2007, 15:22
Benutzer
neuer user
 
Registriert seit: 27.02.2006
Beiträge: 91
fuzzy189 befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von andir Beitrag anzeigen
dass Bilder zur barrierefreien Darstellung in eine Definitionsliste gehören, scheint recht breit akzeptiert zu sein.
Hallo andir,

wenn ich davon noch nie gehört habe, dann spricht das sicher nicht gegen die Richtigkeit deiner Aussage.
Hast du zu dieser Thematik mal den einen oder anderen Link, damit ich mich da einlesen kann?

Und zu der von dir verwendeten Technik:
Wenn es nicht anders geht, dann muss ich halt versuchen, die Technik anhand des source nachzuvollziehen.
Mein erster Versuch scheiterte schon daran, dass diese Technik anscheinend die rechte Maustaste kaputt macht - so etwas kennt man ja üblicherweise nur von Javascript
Leichter wäre es natürlich, wenn diese Technik irgendwo in Form eines Tutorials beschrieben wäre
Hast du da was?

Freu mich schon auf eine Antwort.
fuzzy
__________________
Warum hat Gott die Welt da erschaffen, wo sie ist, und nicht einen Meter weiter links? (Isaac Newton 1643 - 1727)
Webdesign - barrierefrei und zugänglich für Alle
Mit Zitat antworten
  #8 (permalink)  
Alt 02.02.2007, 16:01
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 29.11.2005
Beiträge: 1.324
AndreasB wird schon bald berühmt werden
Standard

Zitat:
Zitat von fuzzy189 Beitrag anzeigen
Mein erster Versuch scheiterte schon daran, dass diese Technik anscheinend die rechte Maustaste kaputt macht
Das kann ich hier nicht feststellen.
Was genau meinst Du bitte?
__________________

Mit Zitat antworten
  #9 (permalink)  
Alt 02.02.2007, 16:03
Benutzer
neuer user
 
Registriert seit: 26.01.2007
Beiträge: 87
trixta befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von andir Beitrag anzeigen
dass Bilder zur barrierefreien Darstellung in eine Definitionsliste gehören, scheint recht breit akzeptiert zu sein.
das ist eine frage von semantik, hat aber gar nix mit barrierefreiheit zu tun. bilder könnten genauso gut auch in einem div stecken...
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 02.02.2007, 16:29
Benutzer
neuer user
 
Registriert seit: 27.02.2006
Beiträge: 91
fuzzy189 befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von Andreas Borutta Beitrag anzeigen
Das kann ich hier nicht feststellen.
Was genau meinst Du bitte?
Im Firefox schau ich mir mit einem Rechtsklick z.B. die Eigenschaften des Bildes an.
Wenn ich das hier versuche, dann "poppt" das grosse Bild kurz auf, und verschwindet wieder. Aber anstelle der Eigenschaften des Elements "Bild", also Größe usw., bekomme ich nur zu sehen: "Text Sprache deutsch"

Gruss fuzzy
__________________
Warum hat Gott die Welt da erschaffen, wo sie ist, und nicht einen Meter weiter links? (Isaac Newton 1643 - 1727)
Webdesign - barrierefrei und zugänglich für Alle
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Problem mit Schattenrahmen um Bilder (Typo3) micronix CSS 2 20.08.2012 21:01
bilder in div container unten anordnen diegaby CSS 12 17.11.2008 15:08
Bildergalerie mit Variablen fledermaus Serveradministration und serverseitige Scripte 1 08.04.2008 09:57
Bilder einbinden SPMan CSS 1 14.06.2007 09:58
Texte mit margin:auto - Bilder mit margin:0 AndreasB (X)HTML 11 10.10.2006 14:50


Alle Zeitangaben in WEZ +2. Es ist jetzt 22:05 Uhr.