Mit CSS3 stehen viele Möglichkeiten zur Verfügung, um Websites noch spannender zu gestalten. Eines der interessantesten Features sind CSS-Transitions, die es ermöglichen, ein Element mit einer Animation von einem Zustand in den anderen zu überführen.Dies kann man z.B. für Bilder benutzen:
http://tympanus.net/Tutorials/OriginalHoverEffects/index3.html
Eine effektive Website ist für den Erfolg eines Unternehmens von großer Bedeutung. Sie dient als Kommunikationsinstrument. Aus diesem Grund spielen auch „call to action“-Buttons eine große Rolle. Dank neuer Technologien lassen diese sich vielfältig animieren.
Hier einige aktuelle Trends:
Ghost-Buttons:
Ghost-Buttons sind sind minimalistisch gestaltet und versuchen die Aufmerksamkeit des Benutzers auf subtile Weise zu gewinnen. Mit einer intelligenten Hover-Animation , ist es ein Vergnügen sie zu verwenden Dabei fügen sie einen Hauch von Eleganz auf die Website. Besonders gut eignen sich diese Designform auf großen Hintergrundbildern.
http://www.interior-architects-munich.com/
Hover-Effekte und Click-Effekte für Buttons:
http://ianlunn.github.io/Hover/
http://daneden.github.io/animate.css/
http://tympanus.net/Development/CreativeButtons/
Mit dem Lazy-Load-Effekt ist ein beliebter on-scroll-Effekt mit dessen Hilfe man verschiedene Elemente einer Webseite in Abhängigkeit mit der Scrollleiste animieren kann. Je weiter man nach unten scrollt werden so verschiedene Elemente aus verschiedenen Richtungen eingeblendet oder animiert. Diese Technik eignet sich hervorragend für das Storytelling auf Webseiten. Zusammen mit Parallax-Scrolling können so beeindruckende Webseiten ohne textlastige Produktbeschreibungen entstehen. Dabei kommt dieser Effekt ohne ressourcenfressendes Flash-Plugin aus.
Beispiele:
http://www.mott-services.de/projects/demo/lazy_load/lazy_load.html
Der Parallax-Effekt ist einer der beeindruckendsten Scroll-Animationen. Es besteht aus einem großformatigen Hintergrundbild, von welchem man, je nach Scroll-Position, immer nur einen Ausschnitt sieht. Die Effekte die sich mit dieser Technik erzielen lassen sind vielfältig. Hier gibt es sowohl horizontale als auch vertikale Scroll-Richtungen. Kombiniert man dieseTechnik mit anderen Effekten, wie z.B. dem Lazy Load Effekt können fast schon filmreife Animationen ausgelöst werden, die den Besucher tief beeindrucken und sich gut für Storytelling eignen.
Einige Beispiele sehen Sie hier:
http://www.world-of-swiss.com/en
http://www.carde-app.com/
http://habitatweb.mx/
http://mintdesigncompany.com/
https://www.crayon.co/mottservices/collections/parallax-scrolling/
Mobiles Internet bedeutet nicht mehr nur Internet für Smartphones. In dem Begriff sind heute alle internetfähigen Endgeräte zu sehen, die nicht permanent an die Steckdose gebunden sind. Zwar gibt es ca 1 Milliarde Handys im Einsatz weltweit, aber auch über 52 Millionen Tablets wurden allein im letzten Quartal des Jahres 2012 verkauft und Ihnen werden Verkaufszahlen vorhergesagt, die PC- und Notebook-Verkäufe einholen. So wird recht schnell deutlich: eine Webseite, die sich optimiert an die jeweilige Bildschirmgröße des Endgerätes anpasst wird nicht mehr nur ein besonderes Feature sein, sondern eine Notwendigkeit. Das Webdesign und Webentwicklung wurde in den letzten Jahren maßgeblich von Touchscreens beeinflusst. Das Wischerlebnis in der Bedienung einer Website ist die eigentliche mobile Revolution. Touchscreen-Geräte werden zur Norm.
Werden Sie responsive und gewähren Sie Ihren Kunden Zugang zu Ihren Inhalten – egal auf welchem Endgerät. Mott services berät Sie gerne!
Fast jedes Unternehmen, welches sich im Internet präsentiert, nutzt mittlerweile Websoftware zur dynamischen Erzeugung von Webinhalten. Solche Content Management Systeme […]
Die zahlreichen Änderungen, die die DSGVO ab dem 25. Mai 2018 mit sich bringt, treffen jeden Unternehmer und Webseitenbetreiber. Es […]
Laut einer Meldung auf heise.de befällt der seit Tagen grassierende Erpressungs-Trojaner CTB-Locker nun auch Webserver. Hunderte Websites seien bereits verschlüsselt, […]
Fast jedes Unternehmen, welches sich im Internet präsentiert, nutzt mittlerweile Websoftware zur dynamischen Erzeugung von Webinhalten. Solche Content Management Systeme […]
Der Parallax-Effekt ist einer der beeindruckendsten Scroll-Animationen. Es besteht aus einem großformatigen Hintergrundbild, von welchem man, je nach Scroll-Position, immer […]
Eine effektive Website ist für den Erfolg eines Unternehmens von großer Bedeutung. Sie dient als Kommunikationsinstrument. Aus diesem Grund spielen […]