T3 Templates
In diesem Artikel erfährst du, wie du mithilfe von TYPO3 Animationen auf deine Webseite hinzufügen und gestalten können, um ein einzigartiges Benutzererlebnis zu schaffen.
Sei gespannt, denn hier erfährst du alles, was du über die Verwendung von Animationen mit TYPO3 wissen musst.
Warum Animationen für Webseiten verwenden?
Animationen sind eine fantastische Möglichkeit, deine TYPO3 Webseite ansprechend und einzigartig zu gestalten.
Sie können interaktiv, fesselnd und unterhaltsam sein und das Interesse deiner Besucher steigern.
Mit den richtigen Animationen kannst du das Aussehen und die Funktionalität deiner Webseite verbessern und eine emotionalere Verbindung zu deinen Besuchern schaffen.
Weiterhin können Animationen die Zeit erhöhen, welche deine Besucher mit deiner Webseite beschäftigen. Das ist wichtig für die Customer Journey und SEO.
Glücklicherweise gibt es mehrere Möglichkeiten, Animationen in deine TYPO3 Webseite zu integrieren.
Du kannst GIFs, Videos oder interaktive SVG Elemente einbauen. Du kannst mittels CSS3 deine Inhaltselemente animieren lassen. Besonders beliebt ist das in Verbindung mit dem Scrollen.
Hier gibt es keinerlei Grenzen. Neben einfachem Fade In's über komplexere Scrollytelling Elementen.
Im Folgenden stelle ich dir ein paar tolle Extensions und Templates vor, welche dir genau das ermöglichen.
Welche Extensions können verwendet werden, um Animationen in TYPO3 einzusetzen?
Es gibt eigentlich nur eine TYPO3 Extension, die professionellen Animationen in TYPO3 ermöglichen. Diese Extension ist dafür sehr gut umgesetzt und kostenfrei.
Content Animations
Die Extension Content Animations ist für alle Major Versionen von TYPO3 verfügbar. Sie ermöglicht es, auf CSS basierende Animationen auf Inhaltselemente anzuwenden.
Dabei nutzt diese Erweiterung einer der beliebtesten CSS Frameworks für Animationen - Animate.css.
Dementsprechend lassen sich pro Inhaltselement alle Animationstypen von Animate.css auswählen und folgende Parameter dabei individuell einstellen:
- Delay
- Duration
- Repeat
Das besondere ist, dass die Animationen erst dann starten, wenn die Elemente im Viewport sichtbar werden. Dadurch wird dem Besucher keine Animation entgehen.
Welche Templates können verwendet werden, um Animationen in TYPO3 einzusetzen?
An dieser Stelle gibt es etwas mehr Auswahl. Diverse TYPO3 Templates bieten Animationen an und in der Regel wird auch auf das gleiche CSS Framework: Animate.css zurückgegriffen.
T3sbootstrap
T3sbootstrap ist kein echtes TYPO3 Template. Es ist vielmehr eine Templatebasis, um Templates zu erstellen.
Diese Extension bietet einem sehr viel Funktionen und viel Konfigurationsmöglichkeiten und einfache Templates.
Darüber hinaus unterstützt T3sbootstrap auch die Extension: Content Animations und bindet dadurch Animationen ein.
T3 Planet Templates
Alle TYPO3 Vorlagen von T3 Planet in ihrer kostenpflichtigen Version bieten Animationen an.
In diesem Fall wird nicht auf Animate.css zurückgegriffen, sondern ich glaube, es ist eine Eigenlösung, welche ebenfalls auf CSS3 Animationen in Kombination mit jQuery Animations setzt.
T3 Creative Agency
Mein TYPO3 Template für Onlineagenturen bietet seit dem letzten Inhaltspatch ebenfalls Animationen an. Auch ich nutze Animate.css und biete genau wie Content Animations die Möglichkeit an, jedes Inhaltselement individuell zu animieren.
Du kannst auch hier die 3 Eigenschaften:
- Delay
- Duration
- Repeat
für jeden Animationstyp einstellen.
Auch bei T3 Creative Agency startet die Animation erst dann, wenn die Inhalte im Viewport sichtbar werden.
Die Animationsfunktion wird in Zukunft auch für alle anderen T3 Templates Vorlagen eingebaut werden.
Fazit
Das Fazit ist klar: Animationen sind eine wunderbare Möglichkeit, deine TYPO3 Webseite aufzuwerten und ein besonderes Erlebnis für deine Besucher zu schaffen.
Mit den richtigen Extensions und Templates kannst du Animationen nach TYPO3 holen und spielend einfach für jedes Inhaltselement nutzen.
Animierte Elemente machen deine TYPO3 Webseite lebendiger, interessanter und fesselnder. Außerdem erhöhen sie die Zeit, die Benutzer sich mit deiner Webseite beschäftigen.
Wenn du also mehr aus deiner TYPO3 Webseite machen möchtest, ist Animation eine echte Möglichkeit, um deine Ziele zu erreichen.
