Planearium
Das Planearium wird mobil!

25.05.2014
Planearium.de Mobile Optimierung

Jetzt könnt ihr Planearium.de endlich auch bequem von unterwegs aus erkunden, denn ich habe die letzten Wochen über die komplette Seite für Smartphones optimiert. Auf kleinen Displays verschwinden die Seitenleisten, die Schrift wird größer und die Inhalte werden so angepasst, dass ihr nicht zoomen müsst. Das Menü lässt sich ein- und ausklappen. Alles, was ihr von der “großen” Seite kennt, ist auch in der kleinen Version enthalten. Und für mittelgroße Displays, wie etwa bei Tablets, gibt es eine Variante mit nur einer Seitenleiste. Da bereits ein Viertel meiner Besucher mit ihrem Handy das Planearium besuchen, erschien es mir an der Zeit, mich um die bisher fehlende Mobile Optimierung zu kümmern. Hoffentlich gefällt euch das Ergebnis!

Das ist die größte Neuerung, aber nicht die einzige. Weil ich hierfür jede einzelne Seite des Planeariums einzeln überprüfen und ändern musste, habe ich die Gelegenheit genutzt, auch überall den Quellcode “aufzuräumen”. CSS statt Grafikdateien, usw., das verringert die Ladezeiten und sorgt dafür, dass kleine Anzeigefehler in anderen Browsern verschwinden. Inhaltlich hat sich noch folgendes getan: Im Episodeguide sind die Pfeile zum Durchklicken der Folgen zurück, und auch bei den Gewinnspielen habe ich sie ergänzt. Es gibt einen besseren Chat. Und die Rubrik Kenny stirbt… wurde auf den aktuellen Stand gebracht.

5 Kommentare zu “Das Planearium wird mobil!

  1. Zwerg-im-Bikini

    Ihr könnt euch die Mobile Ansicht übrigens auch am PC ansehen, indem ihr einfach das Fenster verkleinert.
    Die Songtexte müssen noch angepasst werden (es sind so viele, das habe ich deshalb aufgeschoben), aber falls euch an anderer Stelle Fehler auffallen, sagt bitte Bescheid :).

  2. mamamia

    Toll, danke! :)
    Habe die Seite grade aufgerufen (vom smartphone aus), und hab mir gleich gedacht dass da wohl was anders ist als sonst ;).
    Jetzt ist alles Wichtige gut geordnet und auch mobil super lesbar!

    Lg

  3. keinname

    Ich versteh nicht, warum du immer für solche Sachen alle Seiten einzeln anpassen musst. Eigentlich müsste doch nur die zentrale CSS-Datei angepasst werden, oder nicht?

  4. Zwerg-im-Bikini

    Die Farben, Abstände, Schriften, etc. ließen sich auf diese Weise zwar einigermaßen ändern, allerdings hatte ich das Grundgerüst der Seite damals leider nicht konsequent mit CSS erstellt, sondern da steckte noch viel altmodisches HTML drin. Hätte ich das mal anders gemacht… aber hinterher ist man immer schlauer ;). Außerdem war alles total verwurschtelt: Divs in Divs in Divs… das hätte sich nicht mit CSS alleine retten lassen. Vieles war dann noch durch Grafiken auf eine feste Breite festgelegt gewesen. Und zu allem Überfluss hatte ich nur das Menü in einer einzelnen PHP-Datei ausgelagert, aber nicht die anderen Bereiche, weswegen ich an jede Unterseite ran musste.

    Jetzt habe ich aber alles ordentlich gegliedert, die Grundstruktur vereinfacht und es wird alles über die CSS-Datei verwaltet. Zukünftige Änderungen werden also einfacher :).

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Current month ye@r day *

BB-Code:
Fett: [b]bold[/b]
Kursiv: [i]italics[/i]
Unterstrichen: [u]underline[/u]
Durchgestrichen: [s]Text[/s]
URL: [url=http://...]Text[/url]
Spoiler: [spoiler]Text[/spoiler]

Du kannst bei Gravatar.com ein persönliches Avatar-Bild mit deiner E-Mail-Adresse verknüpfen.