CSS und HTML Unterstützung in mobilen Browsern
Bei Projekten für mobile Geräte wird meist auf die neuen Features von HTML5 und CSS3 zurückgegriffen.
TYPO3 Ländermenü mit CSS Sprites
Im Blogbeitrag auf webstandard.kulando.de „CSS Sprite – Ladegeschwindigkeit optimieren und HTTP-Requests verringern“ habe ich beschrieben, wie man die Ladegeschwindigkeit durch den Einsatz von zusammengefügten Bildern optimieren kann. Diesen Quell-Code nehmen wir als Ausgangsbasis um die Länder- oder Sprachauswahl in TYPO3 umzusetzen. Weiterlesen »
Inhalt in li-Tags im TYPO3-RTE wrappen
In einer ordered list <ol> sollten die Aufzählungszeichen in einer Farbe und der Text in einer anderen Farbe sein. Mit CSS lässt sich die Farbe bequem ändern, wirkt sich aber immer sowohl auf die Nummerierung als auch auf den Text aus. Also brauchts im <li>-Tag einen weiteren Tag um dem Text eine eigene Farbe zu geben. Der einfache Weg wäre nun, die <li>-Tags mit der parseFunc neu zu rendern und anstatt des <li>|</li> einfach <li><div>|</div></li> ausgeben zu lassen. Dazu brauchts im setup-Typoscript nur ein paar Zeilen:
Teaserboxen mit Verlauf ohne Bilder (CSS3 linear-gradient)
Wie man in Zukunft Hintergrundverläufe mit CSS erstellt, möchte ich heute vorstellen.
Da die Browserunterstützung für die Verläufe noch nicht sehr fortgeschritten ist, ist es eher ein Blick in die Zukunft, es sei denn, man kann auf eine browserweite optische Gleichheit verzichten oder man macht ein Workaround mit Bildern. Der aktuelle Stand der CSS3-Eigenschaft “linear-gradient” ist hier nachzulesen. Die Vorreiter in der Entwicklung sind – wie gewohnt – Webkit (Safari ab 4.0, Chrome 4) und Gecko (Mozilla Firefox ab 3.6). Opera unterstützt die Eigenschaft bisher nicht. Die Internet Explorer kann zwar seit IE 5.5 über die filter-Eigenschaft bedient werden, aber das ist weder performant noch zielführend – da nur ein einfacher Verlauf erzeugt werden kann.
In der aktuellen Ausgabe des TYPO3 Onlinemagazins TY-MA habe ich beschrieben, wie man solche Teaserboxen in TYPO3 4.3 über die Inhaltsrahmen (section_frames) der Contentelemente erstellt.
Mobile (Iphone) Firmen-Präsentation in TYPO3
Wir haben aktuell eine Idee, unsere Agenturpräsentation auf das Iphone zu bringen. Da sich die serielle Präsentationsform eignet, erstellen wir optimierte Slides nach Powerpoint-Logik als PNG Bilder, und stellen diese als Mobile-Präsentation dar. Am besten gleich mit Photoshop auf die optimale Größe 320×480 erstellen! Und damit das ganze auch einfach ist, soll es in TYPO3 bearbeitbar sein:
Extension Minify
Im TER ist vor kurzem eine neue Extension mit dem Namen Minify erschienen.
Diese Extension komprimiert automatisch sämtliche im Frontend eingebundene CSS- und Javascript Dateien und merged diese anschließend in je eine Datei für CSS bzw. Javascript.