Veränderbare Schriftgrößen
Ab und zu bekomme ich E-Mails von Win-IE Usern, die sich über den Umstand beschweren, dass die Schriftgröße auf meiner Website nicht veränderbar ist – in der CSS-Datei werden nämlich absolute Größenangaben benutzt. Deshalb gibt es hier jetzt eine Lösung mit PHP und Javascript, die jeden Besucher seine eigene Schriftgröße einstellen lässt (siehe das Popup-Menü rechts in der Seitenleiste unter „Schriftgröße“). Damit die ausgewählte Schriftgröße auch für zukünftige Besuche eingestellt bleibt, wird ein Cookie gespeichert.
So geht’s
Im Stylesheet steht als erstes diese Anweisung:
@import url("fontsize.php")
Die Datei fontsize.php besteht aus folgenden Zeilen:
header('Content-type: text/css');
if (!$HTTP_COOKIE_VARS["fontsize"]) {
$fontsize = "12";
} else {
$fontsize = $HTTP_COOKIE_VARS["fontsize"];
}
echo '
body
{
font-size: '.$fontsize.'px;
}
';
Und die Javascript Funktion, die vom Schriftgrößen-Menü über onChange aufgerufen wird, sieht so aus:
function changeSize(newSize) {
mySize = newSize.options[newSize.selectedIndex].value
now = new Date();
now.setTime(now.getTime() + 365 * 24 * 60 * 60 * 1000);
document.cookie = "fontsize=" + mySize + "; expires=" + now + ";path=/;";
window.location.href = unescape(window.location.pathname);
}
Natürlich kann man die fontsize.php beliebig erweitern, so dass auch Überschriften, Bildunterzeilen etc. angepasst werden, wenn ein Besucher die Schriftgröße verändert.
Ähnliche Beiträge:
Referrer Spam III Diana Krall - The Girl In The Other Room
Kommentare:
Bei den Kommentaren handelt es sich um fremde Inhalte, die sich „esse est percipi“ nicht zueigen macht. Verantwortlich für den Inhalt eines Kommentars ist der jeweilige Verfasser.
was doch nicht nötig für den feuerfuchs, alldieweil der ja eh schriftgrössen ändern kann, auch wenn sie eine absolute größe haben.
Bei soviel Aufwand ist es doch echt einfacher, Die schriftgrösse in em anzugeben….
@ klaus die maus:
Richtig, aber meine Lösung ist bequemer: man wählt einmalig die Schriftgröße und findet sie anschließend bei jedem neuen Besuch dieser Website wieder so vor, wie man sie eingestellt hat – es wird nämlich ein Cookie mit der eingestellten Größe geschrieben.
@Beate:
So lange, wie die Schrift- und Bildschirm-Auflösungs-Voreinstellungen verschiedener Browser unter verschiedenen OSs so unterschiedlich sind bzw. so unterschiedlich interpretiert werden, überwiegen IMHO die Vorteile von absoluten Größenangaben. Im übrigen finde ich den Aufwand gar nicht so groß – immer an den Leser denken… ;-)
em/ex konsequent für alles (oder zumindest möglichst viel, manchmal braucht man schon absolute Pixelgrößen ...) einzusetzen hat den Vorteil daß auch alle Maße an die Schriftgröße anpassen, z.B. die Breite der Spalten.
Außerdem wäre die Schriftart sowieso schon in der Größe, wie ich sie für mich passend im Browser eingestellt habe, womit sich das Problem mit der zu kleinen oder zu großen Schrift automatisch erledigt hat, auch ohne Cookie ;)
wozu eigentlich die browserweiche mit javascript?
wenn du IEs füttern willst kannste doch auch folgenden code nutzen:
< ! --[if gte IE 5]>
< style type="text/css" media="screen,projection">@import ie5plus.css;< /style>
< ! [endif]-->
die leerzeilen sind nur dafür daß dein system hier den code nicht versteckt
Alle IE >= 5 nutzen dann die ie5plus.css
Alle unter 5 können mit @import eh nichts anfangen und bekommen das was ihnen zusteht: unformatierten Text!
Das mit den conditional comments ist eine gute Idee – und ich habe genau das eigentlich schon seit Januar vor. Aber ich hab ja auch die PixIcons immer noch nicht fertig…
Hallo,
ich versuche das auch so zu machen aber bei mir klappt das nicht. Muss ich noch etwas bedenken?
Viele Grüße
Stan
Hallo Stan, was genau klappt denn nicht? Gibt es irgendwelche Fehlermeldungen?
Kommentar schreiben:
FAQ (Häufig gestellte Fragen)
Kommentare:
- Michael Preidel zu Pasta dell’Orto
- Stefan zu Pasta dell’Orto
- Michael Preidel zu CookieCrumble Testflight jetzt auch für macOS
- Götz zu CookieCrumble Testflight jetzt auch für macOS
- Michael Preidel zu Harbor – Sicherer Hafen [Testflight]
- Henning zu Harbor – Sicherer Hafen [Testflight]
Schlagwörter

