Edit file File name : index.html Content :<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Home page</title> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet"> <link rel="stylesheet" href="style.css"> </head> <body> <header class="header"> <div class="header__fader js-menu-close"></div> <div class="header__container container"> <div class="header__logo"> <a href="#"> <img src="./assets/img/logo.svg" alt="img"> </a> </div> <nav class="header__navigation"> <div class="header__close js-menu-close"><button></button></div> <ul class="header__menu"> <li> <a href="#">Leistungen</a> </li> <li> <a href="#">Über Uns</a> </li> <li> <a href="#">Blog</a> </li> <li> <a href="#">Karriere</a> </li> </ul> <div class="header__btns"> <a href="#" class="lang"><img src="./assets/img/icons/flag.svg" alt="img">EN</a> <a href="#" class="login">Login</a> <a href="#" class="btn">Termin vereinbaren</a> </div> </nav> <div class="header__burger burger js-menu-open"> <span></span> <span></span> <span></span> </div> </div> </header> <main> <section class="hero"> <div class="hero__back"> <img class="cloud" src="./assets/img/icons/cloud.svg" alt="img"> </div> <div class="hero__dots"> <img class="dots" src="./assets/img/icons/dots.svg" alt="img"> </div> <div class="hero__container container"> <div class="hero__title"> <h2>Über €30 Millionen zusätzlichen Umsatz für unsere Kunden</h2> <h3>Wir beschleunigen E‑Commerce Wachstum</h3> <p>Wir sind eine datengetrieben E‑commerce Conversion Optimierungs Agentur. Wir nutzen Wissenschaftliche Methoden & A/B Tests, um die Shops unserer Kunden zu optimieren und zu verbessern.</p> <div class="hero__btn"> <a href="#" class="btn">Termin vereinbaren</a> </div> </div> <div class="hero__img-list"> <div class="hero__img"> <img src="./assets/img/icons/tel.png" alt="img"> </div> <ul class="hero__list"> <li> <h4>105+</h4> <p>A/B-Tests in 2 Jahren</p> </li> <li> <h4>+14%</h4> <p>Revenue Per User</p> </li> <li> <img src="./assets/img/logos/sn-dark.svg" alt="img"> <p>Case Study ansehen <img src="./assets/img/icons/arrow-purple.svg" alt=""></p> </li> </ul> </div> </div> </section> <section class="logos"> <div class="logos__container container"> <div class="logos__flex"> <div class="logos__item"> <img src="./assets/img/logos/snocks.svg" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/purelei.svg" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/giesswein.svg" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/got-bag.svg" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/livefresh.svg" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/mac.svg" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/tree.svg" alt="img"> </div> </div> <div class="logos__bottom"> <p>Mehr als 1000 A/B Tests bei unseren Kunden</p> <a href="#"> Alle Case Studies ansehen</a> </div> </div> </section> <section class="card-with-animation"> <div class="card-with-animation__container container"> <div class="card-with-animation__wrapper"> <a href="#" class="card-with-animation__card"> <div class="card-with-animation__title"> <div class="card-with-animation__svg"> <svg width="123" height="82" viewBox="0 0 123 82" fill="none" xmlns="http://www.w3.org/2000/svg"> <path class="animation" d="M1.87109 42.8811H61.4999L84.9047 17.7656H103.843" stroke="#6658FF" stroke-width="1.5" stroke-miterlimit="1.5"/> <path class="animation" d="M15.7383 42.8633L39.4347 68.2892H48.9522L59.8241 79.9583H80.4177" stroke="#6658FF" stroke-width="1.5" stroke-miterlimit="1.5"/> <path class="animation" d="M15.7383 42.8788L39.1431 17.7634H48.9522L63.7668 1.86719H82.4233" stroke="#6658FF" stroke-opacity="0.5" stroke-width="1.5" stroke-miterlimit="1.5"/> <path class="animation" d="M48.7383 17.7656L63.6408 33.7597H93.4115L102.176 43.1629" stroke="#6658FF" stroke-width="1.5" stroke-miterlimit="1.5"/> <path class="animation" d="M48.7383 68.2892L62.8245 53.1751H92.8283L102.439 42.8633H120.215" stroke="#6658FF" stroke-opacity="0.5" stroke-width="1.5" stroke-miterlimit="1.5"/> <path class="animation" d="M61.6445 42.8633L85.3409 68.2892H103.12" stroke="#6658FF" stroke-opacity="0.5" stroke-width="1.5" stroke-miterlimit="1.5"/> <path class="animationFill" d="M1.98619 44.5056C2.83935 44.5056 3.53098 43.7636 3.53098 42.8481C3.53098 41.9327 2.83935 41.1904 1.98619 41.1904C1.13304 41.1904 0.441406 41.9327 0.441406 42.8481C0.441406 43.7636 1.13304 44.5056 1.98619 44.5056Z" fill="#6658FF"/> <path class="animationFill" d="M16.3378 44.5056C17.1909 44.5056 17.8825 43.7636 17.8825 42.8481C17.8825 41.9327 17.1909 41.1904 16.3378 41.1904C15.4846 41.1904 14.793 41.9327 14.793 42.8481C14.793 43.7636 15.4846 44.5056 16.3378 44.5056Z" fill="#6658FF"/> <path class="animationFill" d="M48.8299 69.9636C49.6831 69.9636 50.3747 69.2216 50.3747 68.3061C50.3747 67.3907 49.6831 66.6484 48.8299 66.6484C47.9768 66.6484 47.2852 67.3907 47.2852 68.3061C47.2852 69.2216 47.9768 69.9636 48.8299 69.9636Z" fill="#6658FF"/> <path class="animationFill" d="M48.8299 19.405C49.6831 19.405 50.3747 18.663 50.3747 17.7475C50.3747 16.8321 49.6831 16.0898 48.8299 16.0898C47.9768 16.0898 47.2852 16.8321 47.2852 17.7475C47.2852 18.663 47.9768 19.405 48.8299 19.405Z" fill="#6658FF"/> <path class="animationFill" d="M102.373 44.5056C103.226 44.5056 103.918 43.7636 103.918 42.8481C103.918 41.9327 103.226 41.1904 102.373 41.1904C101.52 41.1904 100.828 41.9327 100.828 42.8481C100.828 43.7636 101.52 44.5056 102.373 44.5056Z" fill="#6658FF"/> <path class="animationFill" d="M80.3846 81.5612C81.2378 81.5612 81.9294 80.8192 81.9294 79.9038C81.9294 78.9883 81.2378 78.2461 80.3846 78.2461C79.5315 78.2461 78.8398 78.9883 78.8398 79.9038C78.8398 80.8192 79.5315 81.5612 80.3846 81.5612Z" fill="#6658FF"/> <path class="animationFill" d="M102.373 69.9636C103.226 69.9636 103.918 69.2216 103.918 68.3061C103.918 67.3907 103.226 66.6484 102.373 66.6484C101.52 66.6484 100.828 67.3907 100.828 68.3061C100.828 69.2216 101.52 69.9636 102.373 69.9636Z" fill="#6658FF"/> <path class="animationFill" d="M120.553 44.5056C121.406 44.5056 122.097 43.7636 122.097 42.8481C122.097 41.9327 121.406 41.1904 120.553 41.1904C119.699 41.1904 119.008 41.9327 119.008 42.8481C119.008 43.7636 119.699 44.5056 120.553 44.5056Z" fill="#6658FF"/> <path class="animationFill" d="M82.787 3.51046C83.6401 3.51046 84.3318 2.76845 84.3318 1.853C84.3318 0.937554 83.6401 0.195312 82.787 0.195312C81.9338 0.195312 81.2422 0.937554 81.2422 1.853C81.2422 2.76845 81.9338 3.51046 82.787 3.51046Z" fill="#6658FF"/> <path class="animationFill" d="M104.783 19.405C105.636 19.405 106.328 18.663 106.328 17.7475C106.328 16.8321 105.636 16.0898 104.783 16.0898C103.93 16.0898 103.238 16.8321 103.238 17.7475C103.238 18.663 103.93 19.405 104.783 19.405Z" fill="#6658FF"/> </svg> </div> <h5>Advanced A/B-Testing</h5> <p> Unsere Haupt Dienstleistung - wir erstellen eine Optimierungsstrategie & Roadmap, designen, entwickeln und analysieren jedes Experiment. </p> </div> <div class="card-with-animation__btn"> Mehr Erfahren <img src="./assets/img/icons/arrow-large.svg" alt="img"> </div> </a> <a href="#" class="card-with-animation__card"> <div class="card-with-animation__title"> <div class="card-with-animation__svg"> <svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg"> <path class="animation" d="M37.2919 59.1879C33.6838 61.7253 29.3243 63.2045 24.6286 63.2045C12.2455 63.2045 2.19141 52.8972 2.19141 40.1963" stroke="#6658FF" stroke-opacity="0.5" stroke-width="1.5" stroke-miterlimit="1.5" /> <path class="animation" d="M2.19141 40.1602C2.19141 23.1399 15.6501 9.33594 32.2446 9.33594C36.6081 9.33594 40.7638 10.2947 44.5134 12.0191" stroke="#989AE6" stroke-width="1.5" stroke-miterlimit="1.5" /> <path class="animation" d="M40.587 79.5538C61.7923 79.5538 78.9827 61.9222 78.9827 40.1727C78.9827 18.4232 61.7923 0.791992 40.587 0.791992C19.3817 0.791992 2.19141 18.4232 2.19141 40.1727C2.19141 61.9222 19.3817 79.5538 40.587 79.5538Z" stroke="#989AE6" stroke-width="1.5" stroke-miterlimit="1.5" /> <path class="animation" d="M16.0599 54.403C23.7193 54.403 29.9285 48.0344 29.9285 40.1785C29.9285 32.3225 23.7193 25.9541 16.0599 25.9541C8.40055 25.9541 2.19141 32.3225 2.19141 40.1785C2.19141 48.0344 8.40055 54.403 16.0599 54.403Z" stroke="#6658FF" stroke-width="1.5" stroke-miterlimit="1.5" /> <path class="animation" d="M24.6283 63.1973C37.0199 63.1973 47.0654 52.8941 47.0654 40.1845C47.0654 27.4749 37.0199 17.1719 24.6283 17.1719C12.2367 17.1719 2.19141 27.4749 2.19141 40.1845C2.19141 52.8941 12.2367 63.1973 24.6283 63.1973Z" stroke="#989AE6" stroke-width="1.5" stroke-miterlimit="1.5" /> <path class="animation" d="M2.19141 40.1848C2.19141 27.4838 12.2455 17.1719 24.6286 17.1719C37.0118 17.1719 47.0658 27.4838 47.0658 40.1848C47.0658 48.2898 42.9676 55.4279 36.783 59.5259" stroke="#6658FF" stroke-width="1.5" stroke-miterlimit="1.5" /> <path class="animation" d="M44.5512 12.0283C55.0065 16.8525 62.2979 27.644 62.2979 40.1598C62.2979 57.1704 48.8296 70.9843 32.2446 70.9843C15.6501 70.9843 2.19141 57.1704 2.19141 40.1598" stroke="#6658FF" stroke-width="1.5" stroke-miterlimit="1.5" /> <path class="animation" d="M30.0404 41.4646C30.7445 41.4646 31.3152 40.8793 31.3152 40.1572C31.3152 39.4351 30.7445 38.8496 30.0404 38.8496C29.3364 38.8496 28.7656 39.4351 28.7656 40.1572C28.7656 40.8793 29.3364 41.4646 30.0404 41.4646Z" fill="#6658FF" /> <path class="animationFill" d="M2.19668 41.4646C2.90073 41.4646 3.47148 40.8793 3.47148 40.1572C3.47148 39.4351 2.90073 38.8496 2.19668 38.8496C1.49263 38.8496 0.921875 39.4351 0.921875 40.1572C0.921875 40.8793 1.49263 41.4646 2.19668 41.4646Z" fill="#6658FF" /> <path class="animationFill" d="M47.1381 41.4646C47.8421 41.4646 48.4129 40.8793 48.4129 40.1572C48.4129 39.4351 47.8421 38.8496 47.1381 38.8496C46.434 38.8496 45.8633 39.4351 45.8633 40.1572C45.8633 40.8793 46.434 41.4646 47.1381 41.4646Z" fill="#6658FF" /> <path class="animationFill" d="M36.6889 60.6883C37.3929 60.6883 37.9637 60.103 37.9637 59.3809C37.9637 58.6587 37.3929 58.0732 36.6889 58.0732C35.9848 58.0732 35.4141 58.6587 35.4141 59.3809C35.4141 60.103 35.9848 60.6883 36.6889 60.6883Z" fill="#6658FF" /> <path class="animationFill" d="M44.6029 13.3768C45.307 13.3768 45.8777 12.7914 45.8777 12.0693C45.8777 11.3472 45.307 10.7617 44.6029 10.7617C43.8989 10.7617 43.3281 11.3472 43.3281 12.0693C43.3281 12.7914 43.8989 13.3768 44.6029 13.3768Z" fill="#6658FF" /> <path class="animationFill" d="M42.0717 80.7869C42.7757 80.7869 43.3465 80.2016 43.3465 79.4795C43.3465 78.7574 42.7757 78.1719 42.0717 78.1719C41.3676 78.1719 40.7969 78.7574 40.7969 79.4795C40.7969 80.2016 41.3676 80.7869 42.0717 80.7869Z" fill="#6658FF" /> <path class="animationFill" d="M62.3295 41.4646C63.0335 41.4646 63.6043 40.8793 63.6043 40.1572C63.6043 39.4351 63.0335 38.8496 62.3295 38.8496C61.6254 38.8496 61.0547 39.4351 61.0547 40.1572C61.0547 40.8793 61.6254 41.4646 62.3295 41.4646Z" fill="#6658FF" /> <path class="animationFill" d="M79.099 41.4646C79.8031 41.4646 80.3738 40.8793 80.3738 40.1572C80.3738 39.4351 79.8031 38.8496 79.099 38.8496C78.395 38.8496 77.8242 39.4351 77.8242 40.1572C77.8242 40.8793 78.395 41.4646 79.099 41.4646Z" fill="#6658FF" /> </svg> </div> <h5>Beratung</h5> <p> Unsere Haupt Dienstleistung - wir erstellen eine Optimierungsstrategie& Roadmap, designen, entwickeln und analysieren jedes Experiment. </p> </div> <div class="card-with-animation__btn"> Mehr Erfahren <img src="./assets/img/icons/arrow-large.svg" alt="img"> </div> </a> </div> </div> </section> <section class="calculator"> <div class="calculator__container container"> <div class="calculator__title"> <h2>CRO Rechner</h2> <h3>Lohnt sich A/B-Testing für dich?</h3> </div> <div class="calculator__wrapper"> <div class="calculator__calculator"> <div class="calculator__value"> <div class="calculator__item calculator__item--full"> <label> Monatliche Besucher <span>pro Monat</span> <input type="number" placeholder="2000000" class="monat"> </label> </div> <div class="calculator__item"> <label> Conversion Rate <span>%</span> <input type="number" placeholder="2,6" class="rate"> </label> </div> <div class="calculator__item"> <label> Umsatz / Besucher <span>€</span> <input type="number" placeholder="72" class="umsatz"> </label> </div> </div> <div class="calculator__calculator--botton"> <ul> <li> Umsatz pro Monat <div class="result1">-</div> </li> <li> Käufe pro Monat <div class="result2">-</div> </li> </ul> </div> </div> <div class="calculator__result "> <div class="calculator__preview"> <div class="calculator__img"> <img src="./assets/img/calculator.svg" alt="img"> </div> <p> Trage links deine Daten ein, um deinen Effekt von Conversion Optimierung zu berechnen </p> </div> <h6>Deine Zahlen mit einem Uplift von 10%</h6> <p> Ein Großteil unser Kunden erreicht mit unserer Hilfe einen Uplift von 10% oder mehr. Sieh dir an welchen Impact das auf dein Business hat. </p> <div class="calculator__flex"> <div class="calculator__main-result"> <div><span class="result3">5.000.000</span>€</div> <p>Mehrumsatz pro Jahr </p> </div> <div class="calculator__box"> <div class="result4">323536</div> <p>zusätzliche Käufe</p> </div> <div class="calculator__box"> <div><span class="result5">332.233.235</span>€</div> <p>Umsatz pro Jahr</p> </div> </div> <div class="calculator__result-button"> <p> <span>Super!</span> Bei diesem Umsatz macht eine Zusammenarbeit mit Drip Agency Sinn. </p> <a href="#" class="btn">Termin vereinbaren</a> </div> </div> </div> </div> </section> <section class="slider"> <div class="slider__container container"> <div class="slider__title"> <h2>Case Studies</h2> <h3>Die Ergebnisse unserer Kunden sprechen für sich</h3> </div> <div class="slider__slick"> <a href="#" class="slide"> <div class="slide__top"> <div class="slide__icon"> <img src="./assets/img/logos/sn-dark.svg" alt="img"> </div> <div class="slide__btn"> mehr dazu </div> </div> <p> Zusammen mit DRIP haben wir in unseren Onlineshop in den letzten Monaten extrem große Fortschritte gemacht und konnten unseren Umsatz Pro Besucher deutlich steigern. </p> <div class="slide__author"> <div class="slide__ava"> <img src="./assets/img/icons/kliesh.png" alt="img"> </div> <p> Johannes Kliesch <span>Gründer SNOCKS GmbH</span> </p> </div> <ul> <li> <img src="./assets/img/icons/graph.svg" alt="img"> <p>16.9% Uplift auf den Umsatz</p> </li> <li> <img src="./assets/img/icons/circle-dots.svg" alt="img"> <p>2.5 Jahre Zusamenarbeit</p> </li> <li> <img src="./assets/img/icons/tests.svg" alt="img"> <p>55 / 102 erfolgreiche Tests</p> </li> </ul> </a> <a href="#" class="slide"> <div class="slide__top"> <div class="slide__icon"> <img src="./assets/img/logos/gie-dark.svg" alt="img"> </div> <div class="slide__btn"> mehr dazu </div> </div> <p> Zusammen mit DRIP haben wir in unseren Onlineshop in den letzten Monaten extrem große Fortschritte gemacht und konnten unseren Umsatz Pro Besucher deutlich steigern. </p> <div class="slide__author"> <div class="slide__ava"> <img src="./assets/img/icons/markus.png" alt="img"> </div> <p> Markus Giesswein <span>CEO Giesswein Walkwaren AG</span> </p> </div> <ul> <li> <img src="./assets/img/icons/graph.svg" alt="img"> <p>16.9% Uplift auf den Umsatz</p> </li> <li> <img src="./assets/img/icons/circle-dots.svg" alt="img"> <p>2.5 Jahre Zusamenarbeit</p> </li> <li> <img src="./assets/img/icons/tests.svg" alt="img"> <p>55 / 102 erfolgreiche Tests</p> </li> </ul> </a> <a href="#" class="slide"> <div class="slide__top"> <div class="slide__icon"> <img src="./assets/img/logos/tree-dark.svg" alt="img"> </div> <div class="slide__btn"> mehr dazu </div> </div> <p> Zusammen mit DRIP haben wir in unseren Onlineshop in den letzten Monaten extrem große Fortschritte gemacht und konnten unseren Umsatz Pro Besucher deutlich steigern. </p> <div class="slide__author"> <div class="slide__ava"> <img src="./assets/img/icons/nicholas.png" alt="img"> </div> <p> Nicholas Hänny <span>Gründer NIKIN AG</span> </p> </div> <ul> <li> <img src="./assets/img/icons/graph.svg" alt="img"> <p>16.9% Uplift auf den Umsatz</p> </li> <li> <img src="./assets/img/icons/circle-dots.svg" alt="img"> <p>2.5 Jahre Zusamenarbeit</p> </li> <li> <img src="./assets/img/icons/tests.svg" alt="img"> <p>55 / 102 erfolgreiche Tests</p> </li> </ul> </a> <a href="#" class="slide"> <div class="slide__top"> <div class="slide__icon"> <img src="./assets/img/logos/sn-dark.svg" alt="img"> </div> <div class="slide__btn"> mehr dazu </div> </div> <p> Zusammen mit DRIP haben wir in unseren Onlineshop in den letzten Monaten extrem große Fortschritte gemacht und konnten unseren Umsatz Pro Besucher deutlich steigern. </p> <div class="slide__author"> <div class="slide__ava"> <img src="./assets/img/icons/kliesh.png" alt="img"> </div> <p> Johannes Kliesch <span>Gründer SNOCKS GmbH</span> </p> </div> <ul> <li> <img src="./assets/img/icons/graph.svg" alt="img"> <p>16.9% Uplift auf den Umsatz</p> </li> <li> <img src="./assets/img/icons/circle-dots.svg" alt="img"> <p>2.5 Jahre Zusamenarbeit</p> </li> <li> <img src="./assets/img/icons/tests.svg" alt="img"> <p>55 / 102 erfolgreiche Tests</p> </li> </ul> </a> <a href="#" class="slide"> <div class="slide__top"> <div class="slide__icon"> <img src="./assets/img/logos/giesswein.svg" alt="img"> </div> <div class="slide__btn"> mehr dazu </div> </div> <p> Zusammen mit DRIP haben wir in unseren Onlineshop in den letzten Monaten extrem große Fortschritte gemacht und konnten unseren Umsatz Pro Besucher deutlich steigern. </p> <div class="slide__author"> <div class="slide__ava"> <img src="./assets/img/icons/markus.png" alt="img"> </div> <p> Markus Giesswein <span>CEO Giesswein Walkwaren AG</span> </p> </div> <ul> <li> <img src="./assets/img/icons/graph.svg" alt="img"> <p>16.9% Uplift auf den Umsatz</p> </li> <li> <img src="./assets/img/icons/circle-dots.svg" alt="img"> <p>2.5 Jahre Zusamenarbeit</p> </li> <li> <img src="./assets/img/icons/tests.svg" alt="img"> <p>55 / 102 erfolgreiche Tests</p> </li> </ul> </a> <a href="#" class="slide"> <div class="slide__top"> <div class="slide__icon"> <img src="./assets/img/logos/tree.svg" alt="img"> </div> <div class="slide__btn"> mehr dazu </div> </div> <p> Zusammen mit DRIP haben wir in unseren Onlineshop in den letzten Monaten extrem große Fortschritte gemacht und konnten unseren Umsatz Pro Besucher deutlich steigern. </p> <div class="slide__author"> <div class="slide__ava"> <img src="./assets/img/icons/nicholas.png" alt="img"> </div> <p> Nicholas Hänny <span>Gründer NIKIN AG</span> </p> </div> <ul> <li> <img src="./assets/img/icons/graph.svg" alt="img"> <p>16.9% Uplift auf den Umsatz</p> </li> <li> <img src="./assets/img/icons/circle-dots.svg" alt="img"> <p>2.5 Jahre Zusamenarbeit</p> </li> <li> <img src="./assets/img/icons/tests.svg" alt="img"> <p>55 / 102 erfolgreiche Tests</p> </li> </ul> </a> </div> <div class="slider__arrows"> <div class="slider__arrow slider__prev"> <img src="./assets/img/icons/slick-arrow.svg" alt="img"> </div> <div class="slider__arrow slider__next"> <img src="./assets/img/icons/slick-arrow.svg" alt="img"> </div> </div> </div> </section> <section class="text-with-another-block"> <div class="text-with-another-block__container container"> <div class="text-with-another-block__text"> <h2>Warum Drip Agency</h2> <h3>Deshalb vertrauen uns große Brands</h3> <div class="text-with-another-block__cards"> <div class="text-with-another-block__card"> <div class="text-with-another-block__icon"> <img src="./assets/img/icons/flask.svg" alt="img"> </div> <h6>State of the Art Tools </h6> <p> Hier werden einmal die ganzen Tools aufgelistet (Kameleoon etc.) Nunc et aliquam aliquet quis. </p> </div> <div class="text-with-another-block__card"> <div class="text-with-another-block__icon"> <img src="./assets/img/icons/circle-three.svg" alt="img"> </div> <h6>Design, Umsetzung, Analyse</h6> <p> Enim molestie vel euismod risus tristique platea cras vitae. Nunc et aliquam aliquet quis. </p> </div> <div class="text-with-another-block__card"> <div class="text-with-another-block__icon"> <img src="./assets/img/icons/chartbar.svg" alt="img"> </div> <h6>100% Datenbasiert</h6> <p> Enim molestie vel euismod risus tristique platea cras vitae. Nunc et aliquam aliquet quis. </p> </div> <div class="text-with-another-block__card"> <div class="text-with-another-block__icon"> <img src="./assets/img/icons/fokus.svg" alt="img"> </div> <h6>Fokus aut DTC Ecommerce</h6> <p> Enim molestie vel euismod risus tristique platea cras vitae. Nunc et aliquam aliquet quis. </p> </div> </div> <div class="text-with-another-block__comment"> <p> Zusammen mit DRIP haben wir in unseren Onlineshop in den letzten Monaten extrem große Fortschritte gemacht. </p> <div class="text-with-another-block__author"> <div class="text-with-another-block__avatar"> <img src="./assets/img/icons/johannes.png" alt="img"> </div> <p> Johannes Kliesch <span> Gründer SNOCKS GmbH </span> </p> </div> </div> </div> </div> <div class="text-with-another-block__img-and-list"> <div class="text-with-another-block__img"> <img src="./assets/img/icons/tablet.svg" alt="img"> </div> <ul class="text-with-another-block__list"> <li> <div class="text-with-another-block__list-icon"> <img src="./assets/img/icons/tick-purple.svg" alt="img"> </div> <div class="text-with-another-block__list-content"> <h6>1500+</h6> <p>abgeschlossene Tests</p> </div> </li> <li> <div class="text-with-another-block__list-icon"> <img src="./assets/img/icons/tick-purple.svg" alt="img"> </div> <div class="text-with-another-block__list-content"> <h6>30 Mio+</h6> <p>Mehrumsatz pro Jahr</p> </div> </li> <li> <div class="text-with-another-block__list-icon"> <img src="./assets/img/icons/tick-purple.svg" alt="img"> </div> <div class="text-with-another-block__list-content"> <h6>45%</h6> <p>Winrate bei Tests</p> </div> </li> </ul> </div> </section> <section class="text-with-another-block text-with-another-block--reversed"> <div class="text-with-another-block__container container"> <div class="text-with-another-block__text"> <h2>Advanced self-learning Optimization</h2> <h3>Unser einzigartiger Prozess</h3> <div class="text-with-another-block__cards"> <div class="text-with-another-block__card"> <div class="text-with-another-block__icon"> <img src="./assets/img/icons/database.svg" alt="img"> </div> <h6>Selbstlernende Datenbank</h6> <p> Unser selbstentwickelte Datenbank wird mit jedem Test selber optimiert. So werden neue Test immer präziser. </p> </div> <div class="text-with-another-block__card"> <div class="text-with-another-block__icon"> <img src="./assets/img/icons/eye.svg" alt="img"> </div> <h6>Konstantes Monitoring</h6> <p> Enim molestie vel euismod risus tristique platea cras vitae. Nunc et aliquam aliquet quis. </p> </div> <div class="text-with-another-block__card"> <div class="text-with-another-block__icon"> <img src="./assets/img/icons/process.svg" alt="img"> </div> <h6>Eingespielte Prozesse</h6> <p> Enim molestie vel euismod risus tristique platea cras vitae. Nunc et aliquam aliquet quis. </p> </div> <div class="text-with-another-block__card"> <div class="text-with-another-block__icon"> <img src="./assets/img/icons/guade.svg" alt="img"> </div> <h6>Schnelle Testzyklen</h6> <p> Enim molestie vel euismod risus tristique platea cras vitae. Nunc et aliquam aliquet quis. </p> </div> </div> <div class="text-with-another-block__comment"> <p> DRIP is one of the few agencies that truly lives Experimentation in its own processes as an agency. </p> <div class="text-with-another-block__author"> <div class="text-with-another-block__avatar"> <img src="./assets/img/icons/ruben.png" alt="img"> </div> <p> Ruben de Boer <span> Master of AB Testing </span> </p> </div> </div> </div> </div> <div class="text-with-another-block__animation-circle"> <div class="circle rotate1" style="--dotsDeg: 0deg; --itemDeg: 0deg"> <div class="circle__back"> <img src="./assets/img/back-circle.png" alt="img"> </div> <div class="circle__pulse"> <img src="./assets/img/circle-pulse.svg" alt="img"> </div> <div class="circle__dots"> <img src="./assets/img/circle-aniamtion.svg" alt="img"> <ul class="circle__items"> <li class="circle__item ">Design</li> <li class="circle__item">Development</li> <li class="circle__item">Monitoring</li> <li class="circle__item">Analysis</li> <li class="circle__item">Learnings</li> <li class="circle__item">Design</li> <li class="circle__item">Development</li> <li class="circle__item">Monitoring</li> </ul> </div> </div> </div> </section> <section class="text-and-img-to-bord"> <div class="text-and-img-to-bord__container container"> <div class="text-and-img-to-bord__text"> <h2>Über Uns</h2> <h4>Das Team hinter Drip Agency</h4> <div class="text-and-img-to-bord__img"> <img src="./assets/img/Group.png" alt="img"> </div> <p> Quam amet neque habitant vitae lobortis at ut diam. Nisl scelerisque nullam eu at erat. Auctor sit egestas nunc, adipiscing ac non. In pellentesque quis nam vel etiam amet, proin. Molestie nisl in ornare </p> <p> ac purus. Pretium placerat aliquam in lobortis facilisis. Elit commodo, facilisi urna aliquet. Odio viverra cursus in montes, amet, ornare turpis. Facilisi libero odio nisl egestas aliquet sit. Tortor pellentesque. </p> <div class="text-and-img-to-bord__references"> <img src="./assets/img/icons/group-people.png" alt="img"> <a href="#">Mehr über das Team erfahren <img src="./assets/img/icons/arrow-purple.svg" alt="img"></a> </div> </div> </div> </section> <section class="two-column-with-links"> <div class="two-column-with-links__container container"> <div class="two-column-with-links__grid"> <div class="two-column-with-links__list"> <div class="two-column-with-links__top"> <div class="two-column-with-links__title"> <img src="./assets/img/icons/article.svg" alt="img"> <h6>Aktuelle Artikel</h6> </div> <div class="two-column-with-links__btn"> <a href="#">Alle ansehen</a> </div> </div> <ul> <li> <a href="#"> <div class="two-column-with-links__icons"> <img src="./assets/img/categories/list5.png" alt="img"> </div> <div class="two-column-with-links__content"> <h6> Est adipiscing maecenas et quam massa massa nullam vitae arcu. Nunc vel leo in massa nisi. </h6> <ul> <li><time>27. Dezember 2021</time></li> <li>Kategorie</li> </ul> </div> </a> </li> <li> <a href="#"> <div class="two-column-with-links__icons"> <img src="./assets/img/categories/list6.png" alt="img"> </div> <div class="two-column-with-links__content"> <h6> Eget ut quis egestas quisque gravida dui nulla gravida. Tortor orci dictumst accumsan tortor. </h6> <ul> <li><time>27. Dezember 2021</time></li> <li>Kategorie</li> </ul> </div> </a> </li> <li> <a href="#"> <div class="two-column-with-links__icons"> <img src="./assets/img/categories/list7.png" alt="img"> </div> <div class="two-column-with-links__content"> <h6> Elit commodo sed tortor, habitasse egestas tempor phasellus viverra faucibus. Tellus. </h6> <ul> <li><time>27. Dezember 2021</time></li> <li>Kategorie</li> </ul> </div> </a> </li> <li> <a href="#"> <div class="two-column-with-links__icons"> <img src="./assets/img/categories/list8.png" alt="img"> </div> <div class="two-column-with-links__content"> <h6> Quisque leo magna ac fringilla molestie maecenas. Sed a elit nunc quam aliquam sit. </h6> <ul> <li><time>27. Dezember 2021</time></li> <li>Kategorie</li> </ul> </div> </a> </li> </ul> </div> <div class="two-column-with-links__list"> <div class="two-column-with-links__top"> <div class="two-column-with-links__title"> <img src="./assets/img/icons/linkedin.svg" alt="img"> <h6>Aktuelle Tests</h6> </div> <div class="two-column-with-links__btn"> <a href="#">Alle ansehen</a> </div> </div> <ul> <li> <a href="#"> <div class="two-column-with-links__icons"> <img src="./assets/img/categories/list9.png" alt="img"> </div> <div class="two-column-with-links__content"> <h6> Wie du deine Conversion Rate durch Lob um 11,9% steigern kannst </h6> <ul> <li> <img src="./assets/img/icons/like.png" alt="img"> 72 Interaktionen</li> <li>28 Kommentare</li> </ul> </div> </a> </li> <li> <a href="#"> <div class="two-column-with-links__icons"> <img src="./assets/img/categories/list10.png" alt="img"> </div> <div class="two-column-with-links__content"> <h6> Wirkt die Angabe von bereits gepflanzten Bäumen wirklich als Trust Faktor? </h6> <ul> <li> <img src="./assets/img/icons/like.png" alt="img">128 Interaktionen</li> <li>22 Kommentare</li> </ul> </div> </a> </li> <li> <a href="#"> <div class="two-column-with-links__icons"> <img src="./assets/img/categories/list11.png" alt="img"> </div> <div class="two-column-with-links__content"> <h6> Est adipiscing maecenas et quam massa massa nullam vitae arcu. Nunc vel leo in massa nisi. </h6> <ul> <li> <img src="./assets/img/icons/like.png" alt="img">108 Interaktionen</li> <li>32 Kommentare</li> </ul> </div> </a> </li> <li> <a href="#"> <div class="two-column-with-links__icons"> <img src="./assets/img/categories/list12.png" alt="img"> </div> <div class="two-column-with-links__content"> <h6> Wie du deine Conversion Rate durch Lob um 11,9% steigern kannst </h6> <ul> <li> <img src="./assets/img/icons/like.png" alt="img">270 Interaktionen</li> <li>72 Kommentare</li> </ul> </div> </a> </li> </ul> </div> </div> </div> </section> <section class="grid-cards-on-back"> <div class="grid-cards-on-back__back"> <img src="./assets/img/icons/back-dots.svg" alt="img"> </div> <div class="grid-cards-on-back__container container"> <div class="grid-cards-on-back__grid"> <div class="grid-cards-on-back__card"> <h6>Kontakt</h6> <ul> <li><a href="mailto:info@dripagency.de"><img src="./assets/img/social/mail.svg" alt="img">info@dripagency.de</a></li> <li><a href="+4915111435858"><img src="./assets/img/social/tel.svg" alt="img">+49 1511 1435858</a></li> <li><img src="./assets/img/social/calendar.svg" alt="img"><time>Termin vereinbaren</time> </li> </ul> </div> <div class="grid-cards-on-back__card"> <h6>Karriere</h6> <p> Wir sind immer auf der Suche nach motivierten Leuten für unser Team. Melde dich bei uns :) </p> <a href="#" class="btn">offene Stellen ansehen</a> </div> <div class="grid-cards-on-back__card"> <h6>LinkedIn</h6> <p> Wir sind immer auf der Suche nach motivierten Leuten für unser Team. Melde dich bei uns :) </p> <a href="#" class="btn">folge uns auf LinkedIn</a> </div> </div> </div> </section> </main> <footer class="footer"> <div class="footer__container container"> <div class="footer__logo-and-social"> <div class="footer__logo"> <a href="#"><img src="./assets/img/logo.svg" alt="img"></a> </div> <ul class="footer__social"> <li><a href="#"><img src="./assets/img/social/linkedin.svg" alt="img"></a></li> <li><a href="#"><img src="./assets/img/social/youtube.svg" alt="img"></a></li> </ul> </div> <div class="footer__lists"> <div class="footer__list"> <h6>UNTERNEHMEN</h6> <ul> <li> <a href="#">Über Uns</a> </li> <li> <a href="#">Karriere</a> </li> </ul> </div> <div class="footer__list"> <h6>Dienstleistung</h6> <ul> <li> <a href="#">Aktuelle A/B Tests</a> </li> <li> <a href="#">Services</a> </li> </ul> </div> <div class="footer__list"> <h6>Kontakt</h6> <ul> <li> <a href="#">Termin vereinbaren</a> </li> <li> <a href="#">Email schreiben</a> </li> </ul> </div> </div> </div> </footer> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="js/main.js"></script> </body> </html>Save