# Prof Energie > Ein unabhängiger Energieberater in Freiburg vermittelt Strom-, Gas- und Wärmetarife — und konkurriert dabei mit Vergleichsportalen. Der Auftritt stellt deshalb nicht den Tarifrechner in den Vordergrund, sondern die Person dahinter: zehn Jahre Laufbahn als Zeitstrahl, 31 Anbietereinträge als Beleg, vier Schritte als Versprechen. Hinter dem Login liegt die Auftragsverwaltung, in der aus einer Anfrage ein bearbeiteter Vorgang wird. Quelle: [https://www.arytechsolutions.com/blog/profenergie-energieberatung-freiburg](https://www.arytechsolutions.com/blog/profenergie-energieberatung-freiburg) - Kunde: Erdal Gücün - Veröffentlicht: 2026-09-24 - Aktualisiert: 2026-09-30 - Autor: Ali Ramazan Yıldırım - Lesezeit: 5 Min. - Technik: Next.js 16, React 19, TypeScript, Tailwind CSS, GSAP ScrollTrigger, next/font, next/image, Cloudflare R2, Cloudflare Turnstile, Vercel > Kundenprojekt, live nachprüfbar: profenergie.de ist der Webauftritt von Erdal Gücün, freier Vertriebspartner der TeleSon Vertriebs GmbH. Alles, was hier beschrieben wird, lässt sich auf der Seite selbst nachsehen — bis auf den geschützten Innenbereich. Von dort gibt es aus gutem Grund keine Aufnahme mit echten Daten. ## Ausgangslage Wer heute den Stromanbieter wechseln will, landet zuerst bei einem Vergleichsportal: ein Rechner, eine Liste, ein Bonus — und zwölf Monate später dasselbe Spiel von vorn. Ein unabhängiger Berater bietet etwas an, das ein Portal nicht kann: einen Menschen, der den Vertrag auch nach der Unterschrift noch kennt und die Kündigung beim alten Anbieter gleich mit erledigt. Genau das sah man im Netz nicht. Zehn Jahre Laufbahn, tausende vermittelte Verträge und ein fester Ansprechpartner statt einer Hotline — all das lebte in Telefonaten, nicht auf einer Seite, die man vor dem ersten Anruf findet. Dazu kommt die andere Hälfte der Arbeit, die von außen niemand sieht. Aus einer Anfrage wird ein Auftrag, der erfasst, zugeordnet und weitergemeldet werden muss. Ein Webauftritt, der nur Anfragen erzeugt und danach aufhört, hätte diese Hälfte unangetastet gelassen — und damit den Engpass verschoben statt ihn zu lösen. ## Die Herausforderung - Vertrauen ohne Rechner: Die Seite muss in den ersten Sekunden erklären, warum ein Mensch die bessere Wahl ist als ein Vergleichsportal — ohne das Vergleichsportal nachzubauen. - Zwei Zielgruppen, ein Auftritt: Privat- und Gewerbekunden suchen einen Tarif, angehende Vertriebspartner eine Geschäftsmöglichkeit. Beide sollen sich wiederfinden, ohne dass die Seite in zwei Seiten zerfällt. - Fremde Marken korrekt zeigen: 17 Anbieter für Privathaushalte und 14 für Gewerbe gehören zum Beleg. Nennen darf man sie — für jedes einzelne Logo die Nutzungsrechte zu klären wäre ein eigenes Projekt gewesen. - Nach dem Klick hört es nicht auf: Der öffentliche Teil und der interne Teil mussten zusammengehören — ein Zugang, eine Codebasis, ein Betrieb statt zweier Systeme nebeneinander. ## Die Lösung Die Startseite führt nicht mit einem Tarifrechner, sondern mit der Laufbahn: sieben Stationen von Dezember 2015 bis heute, als Zeitstrahl, der sich beim Scrollen Station für Station aufbaut. Erfahrung wird dort nicht behauptet, sie wird abgezählt. Danach laufen die Anbieter als zwei Bänder durch das Bild, die sechs Leistungsbereiche stehen als gleichwertige Karten nebeneinander, und der Ablauf ist auf vier Schritte heruntergekürzt, die beim Scrollen einzeln in den Blick rücken: Rechnung schicken, vergleichen lassen, beauftragen, beliefert werden. Die Reihenfolge ist die eines Gesprächs, nicht die eines Produktkatalogs. _Sechs gleich große Karten nebeneinander: Ökostrom, Gas, Wärme, Photovoltaik, Privat und Gewerbe, jede mit Symbol, kurzem Text und drei Stichpunkten. — Kein Bereich ist hervorgehoben: Ein Gewerbekunde mit fünf Zählpunkten liest dieselbe Seite wie ein Haushalt mit einer Wärmepumpe._ (https://pub-ee92c923c9954077b449900193b4651f.r2.dev/blog/52337381-f2b2-4cd1-9791-7cf0d7fccd87-profenergie-energieberatung-freiburg-leistungen.webp) ## Zwei Laufbänder statt fremder Logos Die Anbieter sind der stärkste Beleg der Seite und zugleich ihr heikelster Teil: Es sind fremde Marken. Gelöst ist das mit Schrift statt Bild — jeder Name ist gesetzter Text mit der Angabe, ob dort Strom, Gas oder Wärme vermittelt wird. Das vermeidet die Lizenzfrage jedes einzelnen Logos, bleibt auf jedem Bildschirm scharf, kostet keinen einzigen Bildabruf und ist für einen Screenreader vorlesbar. Zwei Bänder laufen gegenläufig, getrennt nach Privat und Gewerbe, mit der Zahl daneben: 17 und 14. Darüber sitzt eine Schaltfläche »Laufband anhalten« — Bewegung, die man nicht stoppen kann, ist für manche Menschen keine Gestaltung, sondern ein Hindernis. _Zwei Laufbänder mit Anbieternamen als Schrift, oben »Privat« mit 17 Anbietern, darunter »Gewerbe / Individual« mit 14, dazwischen die Schaltfläche »Laufband anhalten«. — Die Zahl neben der Überschrift ist kein Schmuck: Sie sagt, wie breit verglichen wird, bevor überhaupt jemand anruft._ (https://pub-ee92c923c9954077b449900193b4651f.r2.dev/blog/c23f1b9d-561a-4319-a7c9-ba71bf8541f3-profenergie-energieberatung-freiburg-anbieter.webp) ## Zwei Anliegen, ein Formular Die zweite Zielgruppe hätte leicht eine zweite Website ergeben. Stattdessen entscheidet der erste Klick im Kontaktformular: »Tarifanfrage« oder »Vertriebspartnerschaft«. Die Felder bleiben dieselben, die Hinweise darunter ändern sich, und die Nachricht landet mit dem passenden Betreff im Postfach. Für die Vertriebsseite gibt es zusätzlich eine eigene Seite mit zwei Videos — die aber erst nach einem ausdrücklichen Klick von Vimeo geladen werden. Vorher verlässt kein Byte die Domain. Gegen automatisierte Abschickversuche steht Cloudflare Turnstile davor, das ohne Cookie und ohne seitenübergreifendes Profil auskommt. _Kontaktseite: links erklärende Blöcke zu Tarifanfrage und Geschäftsmöglichkeit mit Telefon, E-Mail und Anschrift, rechts das Formular mit der Auswahl »Tarifanfrage« oder »Vertriebspartnerschaft« über allen weiteren Feldern. — Die Auswahl steht ganz oben, weil sie alles darunter einordnet — und nicht, weil ein Formular mit einer Pflichtfrage beginnen müsste._ (https://pub-ee92c923c9954077b449900193b4651f.r2.dev/blog/5fa3cc56-36ca-4035-8b26-40003ea60da2-profenergie-energieberatung-freiburg-kontakt.webp) ## Der Teil hinter der Anmeldung Unter derselben Domain, mit derselben Codebasis und demselben Gestaltungsraster liegt die Auftragsverwaltung: Import, Übersicht und Benachrichtigung an einer Stelle. Sie ist kein zweites Produkt, sondern die Fortsetzung des Formulars — was vorne hereinkommt, wird hinten zu einem Vorgang. Der Zugang ist entsprechend eng: Jeder Aufruf unterhalb von /dashboard wird auf die Anmeldung umgeleitet, die Suchmaschinen sind per robots.txt ausgeschlossen, vor dem Anmeldeknopf steht dieselbe Prüfung wie vor dem Kontaktformular, und ein automatisches Zurücksetzen des Passworts gibt es bewusst nicht — ein selbstbedienbarer Rücksetzweg ist bei einem einzigen berechtigten Konto mehr Angriffsfläche als Komfort. _Anmeldeseite der Auftragsverwaltung: links eine dunkle Spalte mit Logo und dem Hinweis »Interner Zugang«, rechts Felder für E-Mail und Passwort mit der Sicherheitsprüfung darunter. — Weiter geht es hier nicht: Aus dem Innenbereich gibt es kein Bild, weil dort echte Kundenvorgänge liegen._ (https://pub-ee92c923c9954077b449900193b4651f.r2.dev/blog/b76ca9bc-54e3-4324-8248-ae714047f849-profenergie-energieberatung-freiburg-zugang.webp) ## Technik, die nicht auffällt Die Seite wird vorab gerendert und über ein Netz von Auslieferungsknoten ausgegeben; die Bilder liegen als WebP in einem eigenen Speicher und werden je nach Browser als AVIF in der passenden Größe zugestellt. Das Titelbild hat für schmale Bildschirme einen eigenen Hochkant-Zuschnitt, nicht nur eine verkleinerte Fassung — von sieben Motiven wird genau eines sofort geladen, die übrigen sechs erst, wenn sie an der Reihe sind. Beim Laden verschiebt sich dadurch nichts: Höhe und Breite jedes Bildes stehen vorher fest. - Keine Cookies, keine Zählpixel, kein Einwilligungsbanner: Beim Aufruf der Startseite wird kein einziger fremder Server kontaktiert. - Bildstrecke und Laufbänder lassen sich anhalten, jeder Abschnitt trägt eine vorlesbare Überschrift, und wer »weniger Bewegung« eingestellt hat, bekommt sie auch. - Die Schriften werden mit der Seite ausgeliefert statt nachgeladen — kein Umbruchsprung, sobald sie ankommen. - Die Pflichtangaben stehen vollständig: Impressum, Datenschutzerklärung nach Art. 13 DSGVO und eine ladungsfähige Anschrift auf jeder Seite. ## Gemessen Die folgenden Werte stammen aus einer Messung der Startseite mit Chromium, ohne künstliche Drosselung — sie zeigen, was der Aufbau hergibt, nicht was ein bestimmter Anschluss daraus macht. - **0,9 s** — bis zum großen Titelbild am Schreibtisch, 1,8 s auf dem Telefon - **0** — Layout-Sprünge beim Laden (CLS) - **0** — Cookies, Tracker und Einwilligungsbanner - **7 + 1** — öffentliche Seiten plus geschützter Innenbereich ## Was das für Ihren Vertrieb bedeutet Der geschäftliche Kern dieses Aufbaus ist nicht die Technik, sondern die Reihenfolge der Beweise. Wer beraten wird, vergleicht nicht nur Preise, sondern Personen — und braucht dafür etwas Nachprüfbares: eine Laufbahn mit Datum, eine Anbieterliste mit Zahl, einen Ablauf mit vier statt zwölf Schritten. Wer vermittelt, braucht danach einen Ort, an dem der Auftrag nicht wieder zur Handarbeit wird. Beides in einem System zu halten, spart nicht nur Lizenzen: Es hält den Weg von der Anfrage bis zum Vorgang kurz genug, dass eine Person ihn allein gehen kann. [Lösungen für Vertrieb ansehen](/solutions/sales)