BRUX

Das Bild zeigt ein Monitor, der auf einem weißen Tisch steht. Der Monitor ist schwarz und zeigt ein Bild von einem Restaurant mit einem langen Holztresen. Auf dem Bild ist der Text

Böll Architekten GmbH

Webseiten Relaunch für das Architekturbüro Böll Architekten aus Essen.

Als 2023 die Anfrage kam den Relaunch für Böll Architekten vorzunehmen, freute ich mich ganz besonders, denn schon 2014 durfte ich für Böll die erste Version der Seite umsetzen.

Böll Architekten stehen mit ihrer Architektur für den Strukturwandel im Ruhrgebiet. „Orten und Gebäuden, die in der Bedeutungslosigkeit zu versinken drohen, soll wieder zu Ausdruck und Form verholfen werden.“

Leistungen

  • Konzept
  • Design
  • Entwicklung

Jahr

2024

Design

Gibt es ein besseres Kompliment für einen Designer als ein Kunde der nach 9 Jahren einen Relaunch machen möchte ohne dabei aber das zugrundeliegende Design der Seite zu verändern? Einfach weil das Feedback zur Website immer positiv war und sie einfach gut funktioniert. Nachhaltiges Design wie es sein sollte.

Im Relaunch behielten wir also das Grundlayout der Website bei und überarbeiten Typography und Abstände marginal. Zudem wurde die Website um einen Bereich „Team“ ergänzt und das „Büroprofil“ überarbeitet. Kontraste wurden zu Gunsten von Barrierefreiheit nachjustiert.

Das Bild zeigt ein Farbrikett mit vier Farben, die als Palettenfarben für eine Website oder ein Design verwendet werden können. Die Farben sind schwarz, grau, weiß und ein dunkles Grau. Die Farben sind in einer quadratischen Form angeordnet und haben eine gleichmäßige Farbintensität. Die Farben sind mit ihren Farbnamen und Farbkode in den jeweiligen Farben beschriftet. Die Farben sind in einer dunkel- und hellen Farbpalette angeordnet. Die Farbpalette ist in einer quadratischen Form angeordnet und hat eine gleichmäßige Farbintensität. Die Farbpalette ist mit dem Farbcode #000000, #787878, #FFFFFF und #F7F7F7 beschriftet. Die Farbpalette ist in einer dunkel- und hellen Farbpalette angeordnet. Die Farbpalette ist mit dem Farbcode #000000, #787878, #FFFFFF und #F7F7F7 beschriftet. Die Farbpalette ist in einer dunkel- und hellen Farbpalette angeordn.
Ein ipad vor grauem Hintergrund. „Tablet-Darstellung der Website von Böll Architekten mit einem Artikel vom 10. November 2025. Die Überschrift lautet: 'Anerkennung in Westfalen!'. Das Bild zeigt fünf Personen, die auf einer Bühne stehen und Urkunden in den Händen halten. Unter dem Bild folgt ein Fließtext, der über die Verleihung des Westfälischen Preises für Baukultur 2025 im LWL-Museum für Kunst und Kultur in Münster berichtet. Im unteren Bereich des Tablets ist das Logo 'WESTFÄLISCHER 25' zu sehen.“
● Aktuelles aus dem Büro wird nicht als einzelner Post sondern als chronologischer Newsstream angezeigt.

Die Website als Werkarchiv

Die Webseite sollte ein Überblick über das gesamte Schaffen des Büros in den letzten Jahren geben. Herzstück wurde somit, wie schon in der bestehenden Version, das Projektarchiv, welches sich nach Kategorien filtern lässt.

Screenshot der Website von Böll Architekten. Im oberen Bereich ist ein großes Foto eines modernen Backsteingebäudes mit großen Fenstern und umgebender Vegetation zu sehen. Darunter folgt eine Übersicht der Projekte, die in Kategorien wie 'Alfa-Akademie', 'Wohnen', 'Arbeiten', 'Ruhr', 'Lernen', 'Bauen im Bestand', 'Denkmal', 'Machbarkeitsstudien' und 'Salzlager' unterteilt sind.
Smartphone-Ansicht einer Webseite mit dem Titel 'PROJEKTE'. Die Seite zeigt eine Liste von Kategorien, darunter 'Alle Arbeiten', 'Arbeiten', 'Lernen', 'Zollverein', 'Städtebau', 'Wohnen', 'Kultur', 'Bauen im Bestand', 'Machbarkeitsstudien', und 'Denkmal'. Unter der Liste ist ein schwarz-weißes Bild eines architektonischen Projekts zu sehen, das eine Treppe und moderne Bauwerke zeigt.
Smartphone-Ansicht der Website von Böll Architekten. Im oberen Bereich des Bildschirms ist das Logo 'BÖLL ARCHITEKTEN' zu sehen. Darunter befindet sich ein ausgeklapptes Menü mit den Navigationspunkten 'Projekte', 'Büroprofil', 'Team', 'Aktuelles' und 'Kontakt'. Im Hintergrund ist ein Ausschnitt der Startseite mit einem Bild und dem Text 'Salzlager' sichtbar.

„Alles sollte so einfach wie möglich gemacht werden, aber nicht einfacher.“

— Albert Einstein
Laptop-Darstellung der Website von Böll Architekten, das auf einem schwarzen Ständer steht. Auf dem Bildschirm ist ein Projekt mit dem Titel 'Dampfgebläsehaus, Bochum – Probebühne der Ruhrtriennale, 2011' zu sehen. Das Projekt zeigt ein Foto des Innenraums des Gebäudes mit sichtbaren Backsteinwänden und einer orangefarbenen Tür. Unter dem Foto sind Informationen zum Bauherrn (NRW Urban, Dortmund) und Standort (An der Jahrhunderthalle 1, 44793 Bochum) aufgeführt. Darunter folgt ein Fließtext, der das Projekt beschreibt: Die ehemalige Dampfgebläsehalle des Bochumer Vereins steht unmittelbar neben der Jahrhunderthalle und wurde zu einer Probebühne umgebaut.

Technik

Die meiste Arbeit am Relaunch fiel im Backend der Seite an. 9 Jahre sind im Web technisch gesehen eine kleine Ewigkeit.

Aufgebaut als Werksarchiv war es die Herausforderung, trotz der vielen Bilder die damit einhergehen, die Website schnell zu halten. Dies gelang durch eine konsequente Optimierung der Bilddaten und Lazy-Loading. Da dies komplett serverseitig passiert gibt es keinen Mehraufwand bei der Arbeit mit der Website für den Kunden.

96%

Sauberer als alle auf websitecarbon.com getesten Seiten. Stand: Nov. 2025

0.02g CO²

Produziertes CO² pro Aufruf der Website.

Tablet-Ansicht der Website von Böll Architekten. Im oberen Bereich ist eine Navigationsleiste mit den Kategorien 'Alle Arbeiten', 'Wohnen', 'Arbeiten', 'Kultur', 'Lernen', 'Bauen im Bestand', 'Zollverein', 'Städtebau', 'Denkmal', und 'Machbarkeitsstudien' zu sehen. Darunter sind sechs Miniaturbilder von verschiedenen Architekturprojekten angeordnet:  Salzlager Kokerei Hansa Grugabad Grundschule Lauenförde Niederweniger Straße 56-58 Gastiefkühlanlage Seilbahn Koblenz Rechts befindet sich eine vertikale Navigationsleiste mit den Menüpunkten 'Projekte', 'Büroprofil', 'Team', 'Aktuelles', und 'Kontakt'.
Tablet-Ansicht des Backends einer Website von Böll Architekten. Im oberen Bereich ist der Titel 'Projekte' zu sehen. Darunter befindet sich eine Liste mit der Überschrift 'Veröffentlichte Projekte', die als Miniaturansichten dargestellt sind. Die Projekte umfassen unter anderem 'Salzlager Kokerei Hansa', 'Grugabad', 'Grundschule Lauenförde', 'Niederweniger Str. 56-58', 'Gastiefkühlanlage', 'Seilbahn Koblenz', 'Kita Kleine Quelle', 'Löschturm Mitte', 'Kulturzentrum Bottrop', und 'Villenweg 22'
(Backend-Ansicht): „Screenshot der Backend-Ansicht eines Büroprofils einer Architekturfirma. Drei Personen stehen nebeneinander vor einem Gebäude. Unter dem Foto befindet sich eine Liste mit Projekten und Auszeichnungen, die in einer tabellarischen Übersicht dargestellt sind. Die Tabelle enthält Spalten für Projektname, Überschrift und Textausschnitt. Es gibt Buttons zum Hinzufügen weiterer Einträge.“ Alt-Text für das rechte Bild (Frontend-Ansicht): „Screenshot der Frontend-Ansicht einer Website des Architekturbüros Böll Architekten. Im oberen Bereich ist ein Foto von drei Personen zu sehen, die durch ein Fenster von außen fotografiert wurden. Darunter folgt eine Liste mit Auszeichnungen und Projekten, die in einer klaren, textbasierten Übersicht präsentiert werden. Jeder Eintrag enthält den Projektnamen und eine kurze Beschreibung der Auszeichnung.“
● Das Kirby CMS sorgt im Backend für Struktur und Übersicht. Projekte lassen sich wie hier in den Auszeichnungen bequem quer verlinken.

Dir hat diese Arbeit gefallen und du möchtest ein ähnliches Projekt realisieren? Dann vereinbare jetzt deinen unverbindlichen Beratungstermin. Ich freue mich auf das Gespräch.

Dipl. Des. Oliver Brux

Weitere Projekte

  • ONP

    Neue Website für Otte Nöcker Planung, Architekten + Ingenieure