Firefox 11: Website-Struktur untersuchen in 3D

Ein interessantes Feature der neuen Firefox-Version 11 ist das 3D-Untersuchen.

Dieses Feature ist zeigt die Elemente-Struktur der Website (u.a. basierend auf z-index-Werte) in einer dreidimensionalen Umgebung. Mit der Maus kann man hin und her schwenken und die Website so von “allen Seiten” betrachten. Hier zwei Beispiele:

14. März 2012Kategorien Computer, Software- & WebentwicklungSchlagwörter , Schreibe einen Kommentar zu Firefox 11: Website-Struktur untersuchen in 3D

iPhone-User simulieren im Browser

Heutzutage bieten schon einige Websites spezielle Layouts für mobile Geräte an. Dabei ist natürlich auch das iPhone nicht unwichtig. Für einige System, z.B. WordPress, gibt es Erweiterungen, die eine Ansicht für iPhone-Benutzer generieren.

Bei meinen Tests habe ich herausgefunden, dass die Darstellung oft vor allem vom User-Agent abhängt. Das ist im Grunde eine Info, die Browser und weitere Programme dem Server mitsenden.

Für die Entwicklung und das erste Testen kann man bei vielen Browsern den User-Agent ändern. In Safari muss man das Entwickler-Menü einblenden und den gewünschten “Browser-Typ” wählen, in Firefox kann man über Eingabe about:config die Einstellung general.extra.useragent.firefox um “iPhone” erweitern (ohne Anführungszeichen). Dabei ist i.A. auf Groß-/Kleinschreibung zu achten, d.h. “IPHONE” funktioniert nicht überall.

Für viele Websites reicht das schon, um auf die iPhone-Darstellung zu wechseln. Das Testen in einer richtigen Testumgebung oder gleich im iPhone erspart man sich dadurch noch nicht.

Übrigens verwende ich hier das WordPress-Plugin WPtouch iPhone Theme, die mobile Fassung von www.bekomedia.com ist derzeit in Arbeit bzw. wird überarbeitet und erweitert.

Ballern im Firefox

Passend zu Silvester, dem Tag an dem besonders viel in die Luft fliegt, möchte ich ein unterhaltsames Addon für Firefox (ab Version 3.5) vorstellen:

Destroy the Web

Auf Knopfdruck startet das Ballerspiel: In einer bestimmten Zeit muss man möglichst viele Punkte sammeln, indem man alle möglichen Website-Elemente wie Links, Bilder, Formulare usw. abknallt. Genau richtig, wenn man z.B. mal wieder in eine lange Download-Warteschlange eingereiht wird.

Mir gefällt die Idee. Allerdings ist das Addon mit 4 MB relativ groß und wird wohl deswegen bei mir nicht sehr lange aktiviert bleiben.

TYPO3 4.x vs Firefox

Durch eine Inkompatibilität einer früheren TYPO3 4.2-Version (ich glaube z.B. 4.2.6) wurden in Firefox ab Version 3 falsche Links erzeugt. Erst ein Typo3-Update hat diesen Fehler beheben können.

Nun hatte ich wieder Probleme mit Firefox und TYPO3: Ich habe die neuen TYPO3-Updates 4.2.10 bzw. 4.1.13 auf einem Testsystem installiert. Mit IE und Safari konnte ich keine Fehler nach einem kurzen Testen feststellen. Im Firefox jedoch wurde der Frame mit dem Seitenbaum im Backend nicht geladen. Das ganze habe ich mit verschiedenen Firefox-Versionen getestet, konnte also eigentlich nicht an meinen Browser-Addons liegen: 2.0.0.14, 3.0.x und 3.5.3 – immer das gleiche Problem.

Google war mir zunächst noch keine Große Hilfe, konnte also kein allgemein auftretender Fehler sein. Glücklicherweise gibt es dafür einen Patch:

http://bugs.typo3.org/view.php?id=12324

Nachdem man per Hand die Codezeile wie oben angegeben geändert hat funktioniert auch wieder das Typo3-Backend im Firefox. Grund für diesen Fehler war bei mir ein (Minus/Bindestrich) im Ordnername. In der ebenfalls neuen Version TYPO3 4.1.13 besteht das Problem ebenfalls, auch hier hilft der Patch / die Code-Änderung.

Schade, dass Probleme in TYPO3 mit Firefox in letzter Zeit nicht gerade Einzelfälle sind.

Firefox: Lesezeichen neben Hauptmenü

Heute habe ich endlich auf meinen eigenen Computer die Version 3 von Firefox installiert. Lange Zeit waren noch ein paar interessante Erweiterungen nicht für 3.0 verfügbar. Auch hatte ich Bedenken, ob ich meine Einstellungen wieder so hinbekommen würde.

Aber das war doch nicht ganz so schwierig wie erwartet, einige Addons lassen den Export und Import der Konfiguration zu (z.B. Tab Mix Plus). Bei anderen Extensions musste ich nach der Neuinstallation ein paar kleinere Änderungen und Anpassungen vornehmen. Nun funktioniert hier auch endlich Firebug 🙂 . Weil ich damals von der Version 1.0 aktualisiert habe wurden wohl einige Dateien nicht kopiert oder ersetzt.

Etwas gedauert hat die Platzierung der vielbenutzten Lesezeichen. Da ich – auch bei dem 22″-Bildschirm – gerne viel Platz habe, blende ich gewöhnlich die Lesezeichensymbolleiste aus. Einige Lesezeichen verschiebe ich neben das Hauptmenü (oben, rechts neben “Hilfe”). Dies gab zunächst Schwierigkeiten. Dann habe ich heraus gefunden, dass die Anpassung mit folgenden Schritten möglich ist:

  • Menü -> Ansicht -> Symbolleisten -> Anpassen …
  • Symbol/Link “Lesezeichen-Symbole” an die gewünschte Stelle verschieben, in meinem Fall neben “Hilfe”
  • Bestätigen / Fertig
  • Nun können die gewünschten Lesezeichen wie üblich zur Lesezeichen-Symbolleiste hinzugefügt werden

Eigentlich ganz einfach, nur habe ich zunächst nicht das benötigte Symbol gefunden 8) …