{% extends "page.html" %} {% block content %} <div class="w-100 mt5-ns cclr-mid-yellow"> <div class="mw8 center" id="bg-intro"> <div class="flex flex-wrap pt6-ns pt-3 ph4"> <div class="mw5 pr4 pb3"> <img src="/theme/images/offen-logo-white.svg" alt="Offen logo" width="146" height="90"> </div> <div class="mw6"> <h1 class="f1-ns f2 lh-solid ma0 mb3"> Transparent <span>web analytics</span> </h1> <p class="ma0 mb4"> Offen is an open source analytics software for websites <span>and web applications. It allows respectful handling of data </span> <span>for operators and users.</span> </p> <div class="pb6"> <a class="b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black fnt-cclr-mid-black" href="{{GITHUB_ORG}}" rel="noopener" target="_blank">Get involved</a> </div> </div> </div> </div> </div> <div class="w-100 cclr-mid-mint"> <div class="pt3 pb6 ph3" id="bg-feature"> <div class="mw8 center"> <div class="flex flex-wrap justify-around"> <div class="w55 mh3 pt5 tc"> <h2 class="f25 lh-solid ma0 mb3"> <em>Free & Open</em> </h2> <p class="ma0"> Anyone can audit our open source code to verify it works as intended. Offen will always be available for free. </p> </div> <div class="w55 mh3 pt5 tc"> <h2 class="f25 lh-solid ma0 mb3"> <em>Fair & Secure</em> </h2> <p class="ma0"> Pay respect to your website visitors and gain insights as a user at the same time. All data is encrypted end-to-end. </p> </div> <div class="w55 mh3 pt5 tc"> <h2 class="f25 lh-solid ma0 mb3"> <em>Easy to use</em> </h2> <p class="ma0"> Simply paste our code into the source of your website. Users can visit the auditorium to access their data. </p> </div> </div> </div> </div> </div> <div class="w-100 cclr-mid-black white"> <div class="pt3 pb6 ph4" id="bg-cta-top"> <div class="flex justify-end mw6 center pt5"> <div class="w55 tr"> <h2 class="f25 lh-solid ma0 mb3"> In the making </h2> <p class="ma0 mb4"> Offen is still in alpha. Discover what is already up and running and where we want to go in the coming months. </p> <a class="b link dim ph4 pv2 dib b--solid bw2 b--white white" href="/blog/">Project status</a> </div> </div> </div> </div> <div class="w-100 bg-white gray"> <div class="flex flex-wrap justify-center pt5 pb6"> <div class="mw7 mw8-l center ph5-ns ph3"> <h2>Summary</h2> <div class="columns mb3"> {{ page.content }} <a class="b link dim ph4 pv2 mt3 dib b--solid bw2 brd-cclr-mid-yellow fnt-cclr-mid-yellow" href="/deep-dive/">Deep dive</a> </div> </div> </div> </div> {% endblock %} {% block outro %} <div class="w-100 cclr-mid-yellow"> <div class="pt3 pb6 ph4" id="bg-outro"> <div class="flex justify-end mw6 center pt5"> <div class="w55 tr"> <h2 class="f25 lh-solid ma0 mb3"> Ethical internet </h2> <p class="mb4"> We're working hard to ensure that Offen is independent, cutting-edge and can be sustained for years to come. </p> <a class="b link dim ph4 pv2 dib b--solid bw2 brd-cclr-mid-black fnt-cclr-mid-black" href="{{PATREON_URL}}" rel="noopener" target="_blank">Support us</a> </div> </div> </div> </div> {% endblock %}