Animation in Headerbild und Einbindung mehrere Buttons im Headerfoto

  • Hallo,

    auf der genannten Website ist der Headerbereich als Slider angelegt. Beispielsweise beim Header "Drucksachen für Ihr Geschäft" wir die Überschrift (nebst Untertitel) animiert eingeblendet und zusätzlich in selber Weise auch zwei Buttons ("Geschäftsdrucksachen", "Angebot einholen"):

    https://www.comartist.de/

    Ist es möglich, so etwas mit Zeta Producer 13 schnell zu realisieren?


    Grundsätzlich fände ich eine solche Funktion auch in der nächsten Zeta Producer-Version interessant - unabhängig vom gewählten Layout. Also eine Umsetzung mit "Hausmitteln", ohne zusätzliche Programmierung.

    Besten Dank vorab!

  • Hallo,

    ja, das sollte möglich sein. Sowohl in der normalen Kopfgrafik (Header) als auch im Slider-Widget kann ja text eingegeben werden. Und im Textfeld kann man über Quelltext auch einen Button einfügen. Der Text wird halt bei uns, im Gegensatz zum Beispiel, gleichzeitig mit dem Bild animiert. Zum Beispiel:

    HTML
    <a class="button" href="meineseite.html"><span>Mein Button</span></a>

    Freundliche Grüße
    Stefan S. (Zeta Producer-Support)

  • Hallo Herr Seiz,

    vielen Dank! Werde das gleich mal ausprobieren!

    Ist es auch möglich, statt eines Fotos ein Video in den Headerbereich zu bringen und darüber ein Logo zu legen? Die Auswahl beim ZP bezieht sich ja lediglich auf Bilddateien, soweit ich das sehen kann.

  • Hallo Herr Seiz,

    ich habe gerade dies auf https://www.zella.de/code/video-header-hintergrund.html gefunden. Sieht toll aus! Ob das bezgl. des Header-Videos so meinen Vorstellungen entspricht, werde ich ausprobieren. Jedenfalls sind solche Dinge (mit zusätzlicher Programmierung) wohl im ZP umsetzbar. Neben den schönen Umsetzungen auf zella.de fanden sich damals ja auch tolle Ideen auf ZP Widgets.

    Grundsätzlich möchte ich daher anfragen, weswegen solche Features nicht in der ZP-Software zur Verfügung gestellt werden, denn man nutzt ja eine Software nicht zuletzt, um den Workflow zu optimieren und wiederkehrende Dinge nicht manuell tätigen zu müssen.

    Es hat wohl seine guten Gründe, weswegen offensichtlich gerne von den Usern solche Features genutzt werden, wie auf den erwähnten Seiten zur Verfügung gestellt.

    Im genannten Zusammenhang z.B., dass man statt eines Fotos ein (oder mehrere) Videos einfach in den Header-Bereich laden kann.

    2 Mal editiert, zuletzt von Joerg (14. Februar 2017 um 18:39)

  • Hallo,

    mit Videos ist halt nicht so einfach wie mit Bildern, da verschiedene Browser z.B. verschiedene Video-Formate unterstützen und es hier bislang kein Format gibt, das alle Browser durchgängig unterstützen. Zudem können Videos extreme Ladezeiten nach sich ziehen. Daher gehen wir hier sehr mit Bedacht vor. Wir nehmen das Feedback aber gerne entgegen.

    Freundliche Grüße
    Stefan S. (Zeta Producer-Support)

  • Hallo Jörg,
    Der Code von zella.de/code/video-header-hintergrund.html ist wohl noch nicht so perfekt. Das responsive verhalten ist nicht so das wahre.
    Ich hatte da vor ein paar Wochen noch etwas anderes gebastelt. Mal sehen ob ich es heute noch schaffe das auf code.zella.de zu veröffentlichen.

    Das Video wird in mehreren Formaten für die gängigen Browser angeboten.
    Der Text unten im Video wird einfach im Widget darunter eingebunden ,per margin-top nach oben verschoben und in der Mobilen Ansicht wieder nach unten. Ebenso der der Pfeil nur das dieser in der Mobilen Ansicht ausgeblendet wird. Sicher kann man hier auch per position:absolute Button, Text oder Bilder über dem Video platzieren. Diese müssen dann allerdings wieder für die Mobile Ansicht angepasst werden.
    LINK

    Bezüglich der Ladezeiten hat @sseiz natürlich recht. Man könnte eventuell in der Mobilen Ansicht das Video gegen ein Bild austauschen. Dies passt aber Google wieder nicht. Obwohl schnelle Ladezeiten gewünscht sind möchte man dem mobilen Nutzer den Gleichen Input wie dem Sofa-User bieten.

  • Hallo Herr Seiz,

    danke für Ihr Feedback!

    Was die Videoformate angeht, stehen aber andere CMS wohl vor demselben "Problem", denke ich. Dennoch finden sich etliche (Unternehmens)websites (z.B. erstellt mit WordPress), wo eben solche Videosequenzen genutzt werden.

    Natürlich sollte man solche Video-Sequenzen auch sparsam einsetzen.

    Diese Site bspw. nutzt solche Sequenzen und ist auch auf dem Smartphone bei mäßiger Bandbreite recht schnell geladen, das Video ist etwa 4 MB groß:

    https://www.dunckelfeld.de

    Ich finde das recht ansprechend gelöst.

    Und wenn sich solche Features bereits in einem CMS befänden und man nicht für jedes Kundenprojekt manuell eingreifen müsste, würde das ein effektiveres Arbeiten sehr unterstützen.

    Zumindest für mich ist das eines der wichtigsten Kriterien bei der Software-Auswahl und damit stehe ich wahrscheinlich nicht alleine. Es macht meiner Ansicht nach diesbezüglich bereits einen Unterschied, ob ich lediglich meinen eigenen Webauftritt gestalte und bearbeite oder dies als Dienstleister für Dritte tätige. Gerade hier ist ein effektiver Workflow von großer Bedeutung.

    Deswegen hatte ich auch meine Anfrage geäußert, weswegen man nicht solche Features, wie sie sich auch auf zella.de (und damals auch ZP Widgets) realisiert fanden, auch in ähnlicher Form in ZP einfließen lassen könnte, um den Nutzern Mehrarbeit zu ersparen und die Arbeitsschritte zu vereinfachen.

    Wenn ich mich hier "kritisch" äußere, ist das nicht negativ gemeint. Damit möchte ich lediglich darstellen, wo meiner Einschätzung nach noch Potential vorhanden ist.

    Nach wie vor unverständlich und hinderlich finde ich - worauf ich bereits schon einmal hinwies - die "Eigenheiten" bei den (responsiven) Layouts. Bei Layout X sind Features/Einstellungen vorhanden, beim Layout Y sind diese nicht oder nur eingeschränkt vorhanden.

    Als Nutzer fragt man sich: Weshalb eigentlich? Warum wird hier nicht so programmiert, dass diese Einschränkungen nicht vorhanden sind? Eine Antwort hierauf fehlt mir bislang leider immer noch.

    Die Vorgehensweise ist ja so, dass man sich zunächst an einem Layout orientiert, weil es (das eigene) Gefallen findet. Man hat eine bestimmte Vorstellung, welche Funktionalität das neue Webprojekt beinhalten soll. Dann wählt man eben jenes Layout und stellt dann im Nachhinein fest, dass sich die Website - wegen eben diverser Layout-Einschränkungen - damit nicht realisieren lässt.

    Das ist kontraproduktiv, zumal auch die entsprechende Dokumentation zum jeweiligen Layout fehlt und man dadurch unangenehm "überrascht" wird, dass sich Einschränkungen ergeben.

    Auch hierauf sollte man bei einer zukünftigen Version (wünschenswerter Weise schon bei der nächsten) einen Fokus setzen.

  • Hallo Mario,

    herzlichen Dank!

    Immer wieder bemerkenswert, was Du da aus der Feder zauberst! Kann Zeta nicht einen weiteren Mitarbeiter gebrauchen?! :thumbup:

    P.S.: Tolle Video-Sequenzen! Hast Du eine eigene Drohne? :)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!