Anzeige
Google Web Designer ausprobiert: HTML5-Inhalte erstellen für lau
(Bild: Google)

Google Web Designer ausprobiert: HTML5-Inhalte erstellen für lau

Google Web Designer ausprobiert: HTML5-Inhalte erstellen für lau
(Bild: Google)

Google hat seinen kostenlosen Google Web Designer in einer ersten Betaversion veröffentlicht. Er erstellt in der aktuellen Version hauptsächlich Bannerwerbung, ist aber langfristig auch für Webseiten gedacht.

Flash-Werbung ist rechenintensiv und fehleranfällig. Viele Nutzer deaktivieren solche Inhalte. In der Werbeindustrie gibt es trotzdem kaum Bemühungen, die Alternative HTML5 zu nutzen. Woran liegt das? Zum einen fehlt es an guten Werkzeugen zur Erstellung von HTML5-Werbung. Mit Programmen wie Adobe Edge lassen sich zwar Standardwerbemittel in hoher Qualität erstellen, die Ergebnisse sind aber oft noch so umfangreich, dass sie nicht von Vermarktern akzeptiert werden.

Anzeige
  • Enthaltene Vorlagen für Bannerwerbung der hauseigenen Werbeplattformen Doubleclick und Admob (Screenshots: Matthias Mett)
  • Eine Bilddatei wird als Vorlage zur Animationserstellung per Drag-and-Drop in den Web Designer hineingezogen.
  • Die Eigenschaften eines Objektes wie zum Beispiel die Größe oder Füllfarbe im Eigenschaftsfenster werden angepasst.
  • Die Zeitleiste im einfachen Animationsmodus wird auf "Erweitert" umgeschaltet.
  • Die Zeitleiste im erweiterten Animationsmodus mit gesetzten Keyframes
  • Drehen eines Objektes auf allen drei Achsen mit dem 3D-Objektdrehungs-Tool
  • Die im Easing angegebenen Kurven bestimmen die Beschleunigung und das Abbremsen eines Objektes.
  • Animationsvorschau im Browser
  • Erstellen eines Textfeldes mit dem Text-Tool auf einer neu erstellten zweiten Seite
  • Ereigniserstellung per Assistent zum Einblenden der zweiten Seite nach Beendigung der Animation
  • Die zweite Seite gleitet nach Beendigung der Animation in das Bild.
  • Das automatisch erstellte Script nach Umschalten in die Codeansicht
  • Die Anzeige der Dateigrößen beim Veröffentlichen
Enthaltene Vorlagen für Bannerwerbung der hauseigenen Werbeplattformen Doubleclick und Admob (Screenshots: Matthias Mett)

Dazu kommt, dass zwischen einem Werbekunden und seiner Agentur und der Website, die die Werbung ausspielen soll, oft Vermittler stehen, die technische Lösungen bereitstellen, die mit HTML-Code nicht umgehen können. Manche Agentur, die sich frühzeitig auf die neue Technik eingelassen hat, musste feststellen, dass sie die Werbung nur auf wenigen Websites ausspielen konnte.

Google will mit seinem Web Designer in Kombination mit seinen Adserver-Plattformen Doubleclick und Admob zumindest die technischen Hürden beseitigen. So sollen sich mit dem Google Web Designer Werbebanner in HTML5 ohne Programmierkenntnisse erstellen lassen, die dann direkt über die weit verbreiteten Systeme von Doubleclick und Admob ausgespielt werden können, auch auf mobilen Endgeräten.

Dabei bietet der Google Web Designer für Google-Plattformen fertige Projektvorlagen, es ist aber auch problemlos möglich, Onlinewerbung für andere Werbeplattformen zu erstellen, gibt der Web Designer doch Dateien mit HTML, CSS und Javascript aus. Und die Erstellung von Onlinewerbung soll nur der erste Schritt sein, langfristig sollen sich mit dem Web Designer auch Webseiten erstellen und bearbeiten lassen. Derzeit ist es aber noch nicht möglich, mit anderen Editoren erstellte HTML-Dateien mit dem Web Designer zu öffnen.

Wysiwyg-Editor

Im Grunde ist der Google Web Designer ein Wysiwyg-Editor, der HTML5-, CSS3- und Javascript-Code generiert. Google will damit eine Alternative zu Adobe Flash bieten, das mittlerweile zwar auch über einen HTML5-Export verfügt, für die Erstellung von Onlinewerbung derzeit aber eigentlich nicht einsetzbar ist.

Auch Adobe hat erkannt, dass sich der Trend weg von Flash hin zu HTML5 entwickelt. Daher hat Adobe eine Reihe von neuen Werkzeugen entwickelt, zusammengefasst unter dem Oberbegriff Adobe Edge. Dem Web Designer am ähnlichsten ist das Programm Adobe Edge Animate, das ebenfalls HTML5, CSS3 und Javascript Code generiert. Edge Animate hat einen etwas anderen Funktionsumfang. Demgegenüber enthält der Web Designer Funktionen wie 3D-Werkzeuge und fertige Komponenten, die man so in Adobe Edge nicht findet.

Für Programmierer bietet Edge Animate einen Javascript-Code-Editor mit Funktionsbausteinen und eine gute Javascript-API-Dokumentation. Dagegen kann der Nutzer im Web Designer direkt in die HTML-Code-Ansicht umschalten, wobei der Code-Editor Syntaxhervorhebung beherrscht. Außerdem kennt der Code Editor Autovervollständigung, indem er zum Beispiel nach dem Erstellen des Start-Tags das Ende-Tag automatisch ergänzt. Zur Erstellung von Ereignissen bietet der Web Designer einen Assistenten an, in dem Ereignisabläufe ausgewählt werden können. Er erstellt automatisch Javascript-Code, der sich im Code-Editor bearbeiten lässt.

Der wichtigste Programmteil zur Animation von Objekten ist die Zeitleiste. Diese steht im Web Designer im erweiterten Animationsmodus zur Verfügung. Darin lassen sich Keyframes für die Objekte zu einer bestimmten Zeit im Ablauf setzen, so dass damit eine Animation entsteht. Diese ist direkt abspielbar. Keyframes lassen sich in der Zeitleiste per Drag-and-Drop verschieben, außerdem kann der Nutzer die Eigenschaften einzeln anpassen. Die Verzögerung von Bewegungen zwischen Keyframes lässt sich durch Kurveneigenschaften beeinflussen.

Automatischer Schlüsselbildmodus 

eye home zur Startseite
Realist_X 22. Nov 2013

Macht ja nichts, kann passieren. Aber die Stelle im Artikel lautet immernoch wie zuvor :)

Zwangsangemeldet 21. Nov 2013

Das ist in meinem Fall unwahrscheinlich, da sie von dort aus nicht hier vorbeikämen. Es...

freddypad 21. Nov 2013

Das ist ja gerade das schöne an der IT! Alles ist möglich! Man kann absolut und...

Lemo 21. Nov 2013

Wenn Google es schafft eine gratis MUSE-Konkurrenz zu basteln dann Hut ab, ich wäre...

vol1 20. Nov 2013

Da ich im Moment mit ganzen 32 KB/s surfe, bin ich quasi gezwungen einen Werbeblocker zu...

Kommentieren



Anzeige

  1. Projektleiter/in - Frontend, Backend
    Bosch Engineering GmbH, Abstatt
  2. Medizininformatiker / Fachinformatiker (m/w) für Medizinische Informationssysteme
    Landeskrankenhaus (AöR), Andernach
  3. (Senior-)Berater (m/w) SAP Business Intelligence
    Capgemini Deutschland GmbH, verschiedene Einsatzorte
  4. Projektingenieur/in im Bereich Computer System Validierung (CSV)
    Valicare GmbH, Frankfurt

Detailsuche



Anzeige
Top-Angebote
  1. NUR HEUTE: Samsung UE49KU6409UXZG 49 Zoll-UHD-Fernseher (Triple Tuner, Smart TV) silber [Energieklasse A]
    734,00€ inkl. Cashback (Preis erscheint am Ende des Bestellvorganges) - Vergleichspreise ab ca...
  2. VORBESTELLBAR: Dishonored 2: Das Vermächtnis der Maske - Collector's Edition [PC & Konsole]
    109,99€ (Vorbesteller-Preisgarantie)
  3. NUR HEUTE: Saturn Super Sunday
    (alle Angebote versandkostenfrei, u. a. Samsung Galaxy J3 119,00€ u. UEFA Euro 2016 PS4 14,99€)

Weitere Angebote


Folgen Sie uns
       


  1. Förderung

    Telekom räumt ein, dass Fiber-To-The-Home billiger sein kann

  2. Procter & Gamble

    Windel meldet dem Smartphone, wenn sie voll ist

  3. AVM

    Routerfreiheit bringt Kabel-TV per WLAN auf mobile Geräte

  4. Oculus App

    Vive-Besitzer können wieder Rift-exklusive Titel spielen

  5. Elektroauto

    Supersportwagen BMW i8 soll 400 km rein elektrisch fahren

  6. Keine externen Monitore mehr

    Apple schafft Thunderbolt-Display ersatzlos ab

  7. Browser

    Safari 10 soll auch auf älteren OS-X-Versionen laufen

  8. Dota

    Athleten müssen im E-Sport mehr als nur gut spielen

  9. Die Woche im Video

    Superschnelle Rechner, smarte Zähler und sicherer Spam

  10. Axanar

    Paramount/CBS erlaubt Star-Trek-Fanfilme



Haben wir etwas übersehen?

E-Mail an news@golem.de


Anzeige
Vorratsdatenspeicherung: Vorgaben übertreffen laut Eco "schlimmste Befürchtungen"
Vorratsdatenspeicherung
Vorgaben übertreffen laut Eco "schlimmste Befürchtungen"
  1. Vorratsdatenspeicherung Alarm im VDS-Tresor
  2. Neue Snowden-Dokumente NSA lobte Deutschlands "wesentliche" Hilfe im Irak-Krieg
  3. Klage Verwaltungsgericht soll Vorratsdatenspeicherung stoppen

E-Mail-Verschlüsselung: EU-Kommission hat Angst vor verschlüsseltem Spam
E-Mail-Verschlüsselung
EU-Kommission hat Angst vor verschlüsseltem Spam
  1. Netflix und Co. EU schafft Geoblocking ein bisschen ab
  2. Android FTC weitet Ermittlungen gegen Google aus
  3. Pay-TV Paramount gibt im Streit um Geoblocking nach

Rust: Ist die neue Programmiersprache besser?
Rust
Ist die neue Programmiersprache besser?
  1. Oracle-Anwältin nach Niederlage "Google hat die GPL getötet"
  2. Java-Rechtsstreit Oracle verliert gegen Google
  3. Oracle vs. Google Wie man Geschworene am besten verwirrt

  1. Re: Dvb-c

    johnripper | 11:48

  2. Re: Getrennte Datenströme

    lear | 11:45

  3. Re: neues Thunderbolt Display mit Grafikkarte...

    rabatz | 11:42

  4. Also - das ist doch mal eine Meldung ,-)

    jo-1 | 11:41

  5. Sind Eltern dafuer ueberhaupt zertifiziert ?

    EWCH | 11:38


  1. 10:36

  2. 09:50

  3. 09:15

  4. 09:01

  5. 14:45

  6. 13:59

  7. 13:32

  8. 10:00


  1. Themen
  2. A
  3. B
  4. C
  5. D
  6. E
  7. F
  8. G
  9. H
  10. I
  11. J
  12. K
  13. L
  14. M
  15. N
  16. O
  17. P
  18. Q
  19. R
  20. S
  21. T
  22. U
  23. V
  24. W
  25. X
  26. Y
  27. Z
  28. #
 
    •  / 
    Zum Artikel