Lupenbild als Zoomlink verwenden

[Marmeladekuchen]

Hey ich stehe grade vor einem kleinen rätsel,
Ich erstelle grade eine Homepage, die hauptsächlich Sehbehinderte nutzen können sollen.

Ich bin ziemlicher frischling was webdesign angeht, ich habe zwei kleine lupen als bilder in das logo integriert.
Ich würde gerne dafür sorgen, dass wenn man auf die große lupe mit dem + klickt, das bild heranzoomt und visa versa.
Ich könnte ja an diese stelle eine linkbox einfügen(müsste ich auch nochmal nachsehen wie ich die genau da hinbekomme, aber würde ich denke ich noch hinbekommen) Wie aber mache ich, dass die page dann heranzoomt. Das tastenkürzel wäre ja STRG + / - bzw. STRG Masrad.

bitte helft mir :)

 

[Alex55]

Mit ein Klick per Javascript die Größe ändern. Wäre jetzt was mir so spontan einfallen würde.

 

[Marmeladekuchen]

habe bisher (vor 2 wochen mit dem ganzen zeug angefangen) eigentlich nur html und css verwendet. Javascript hab ich nur ein paar übungen auf codecademy.com gemacht...

 

[Cheffchen]

Hallo,

also das was da vorhast ist gerade absolut nichts für Sehbehinderte.

es gibt mit javascript (jquery) schicke zoom auch mit rein zoomen aber die sind nur spielerei und sind für Sehbehinderte doch sehr ungeeignet.

Mach Zoom und dann ist gut.

Cheffchen

 

[threadi]

Sehbehinderte brauchten keine in die Webseite eingebauten Hilfsmittel sondern nutzen eigene Mittel um ihre Umwelt wahrnehmen zu können. Eine Webseite muss dafür lediglich bestimmten Kriterien entsprechen hinsichtlich der Barrierefreiheit entsprechen. Du solltest dich hierüber informieren:
http://www.barrierefreiheit.de

Wenn Du wissen willst wie Sehbehinderte deine Webseite wahrnehmen könntest Du dir mal die folgende Software anschauen:
http://www.freedomscientific.com/products/fs/jaws-product-page.asp
http://www.visionaustralia.org/digital-access-wat

Auch gibt es ab und zu von Verbänden Workshops in denen man so etwas gezeigt bekommt, inkl. Tipps wie man Webseiten richtig darauf vorbereitet.

 

[Marmeladekuchen]

@threadi
Ja das mag wahr sein die meisten menschen, vorallem jene die affin mit dem internt sind, werden das nicht brauchen. Doch es gibt auch alte menschen die diese website besuchen und eben noch nicht mit hilfsmitteln wie screenreadern oder tastenkürzeln vertraut sind. für diese ist das dann gedacht. Die seite selbst ist für Menschen mit sehbehinderung gedacht. Deshalb wäre es wichtig dieses feature für diejenigen anzubieten die große probleme mit der bedienung eines computers haben und sehr schlecht sehen.

@Cheffchen, ja huch wie jetzt? Mach zoom und gut ist??

 

[threadi]

Menschen, die bisher keine Hilfsmittel haben oder kennen, werden es vermutlich schon schwer haben den Browser zu finden geschweige denn eine Webseite aufzurufen - je nach dem Grad der Behinderung. Im Zweifelsfall nutzen sie bereits den browsereigenen Zoom, den deine Webseite ebenfalls im Sinne der Barrierefreiheit größtenteils abdecken sollte. Wenn sie das tut, dann ist eine Zoom-Funktion per JavaScript auch einfach zu ergänzen: du musst lediglich per CSS die Basis-Schriftgröße ändern. Setzt aber eben auch eine möglichst barrierefreie Webseite voraus.

 

[Cheffchen]

Hallo,

strukturiere deine Seite logisch und Bilder bekommen allen ein Zoom, mehr brauchst nicht.
Was sollen die + und - Luppe wo man wohl eine Luppe brauch um das zu erkennen und ob mann dann auch deine angedacht funktion dahinter erwartet ist auch fraglich.

Zeige was hast und was vor hast, so ins blaue ist immer schwer aber wie immer stimme ich meinen vorschreiben @threadi zu.

Cheffchen

 

[Marmeladekuchen]

Okay jetzt mal ganz unabhängig davon ob das sinnvoll ist, wie genau würde ich das bewerkstelligen, dass ich auf eine linkbox oder ein bild den klassischen STRG + Mausrad zoom verknüpfe.

 

[threadi]

Wie oben bereits geschrieben musst Du die Webseite nahezu barrierefrei gestalten - vor allem hinsichtlich der Schriftgröße. Du darfst nur ausschließlich relative Schriftgrößen verwenden. Per JavaScript änderst Du dann lediglich die Basisschriftgröße per CSS (vermutlich im body-Tag die).

 

[Marmeladekuchen]

Nochmal zur Barrierefreiheit: Also es ist so, dass auf diese Seite Sehbehinderte Menschen kommen, die vielleicht auch erst kürzlich diese Behinderung haben oder zumindest auf jeden Fall unversorgt (z.b. älter, wenig bis keine Erfahrung mit Internet) sind. Das sind nicht die angepassten Sehbehinderten, für die ein solches Tool selbstverständlich völlig überflüssig wäre.
Somit sehe ich diese Funktion durchaus als sinnvoll an, aber darüber würde ich auch nur ungern weiter diskutieren.

Ich würde gerne einfach wissen wie ich diesen Zoom genau einrichte, für eine ausführliche Beschreibung wäre ich sehr dankbar (oder ist sowas nicht üblich, bin ja erst kürzlich hier unterwegs, soll ich mir das lieber erstmal zusammen googlen ?)

Also nochmal: Ich würde gerne nicht nur die Schriftgröße ändern, sondern die gesamte Seite vergrößern, also den Zoom aktivieren, der auch bei STRG+Mausrad ausgelöst wird. Die Schrift ist schon sehr groß, die würde aus ihren Boxen platzen, ist es möglich und wenn ja, wie ? zu Javascript: Hab ich bis jetzt noch nicht angewendet, exakter code wäre echt nett.

P.s. Nur relative Schriftgröße, heißt das % anstatt Pixel?
Und warum nur relative Schriftgrößen ?
Große, kontrastreiche Schriften, die sich noch weitervergrößern lassen, solltens doch auch tun oder nicht ?
Ich kann gerne auch mal die Files hochladen...

 

[Tronjer]

Du denkst in die falsche Richtung.

Um das an einem Beispiel zu erläutern: Wenn man bei einem E-Book Reader die Schriftgröße verändert, ändert sich damit die Seitenanzahl des Buches, aber nicht der Satzspiegel. Auf eine Webseite übertragen bedeutet es, dass bei einem vernünftigen, responsiven Styling die Div-Boxen niemals "platzen" sondern sich nach unten verlängern.

Relative Schriftgrößen funktionieren so:

html { font-size: 62.5%; }
body { font-size: 1.4rem; } /* =14px */
h1   { font-size: 2.4rem; } /* =24px */

http://snook.ca/archives/html_and_css/font-size-with-rem

Im Root-Element ist hier eine font-size von 62,5% und im Body von 1.4rem definiert, was zu einer Basis-Schriftgröße von 14px führt. Nun könnte man zwei kleine JavaScript-Funktionen für größer und kleiner bauen, welche das font-size Attribut des Bodys auslesen, 10% addieren oder subtrahieren und die neue Schriftgröße dem Body zuweisen. Wenn diese Funktionen auf Buttons mit '+' und '-' gelegt werden, entspräche das quasi der Übertragung eines E-Book Readers auf die Webseite.