Verstehen Sie, wie die Drittelregel im Design verwendet wird, um Designs zu erstellen, die von Natur aus angenehm für das Auge sind. Die Drittelregel bietet ein Rahmenwerk, das Ihnen bei der Komposition Ihrer Designs hilft.


Grafikdesigner, Künstler und Fotografen verlassen sich auf dieses Prinzip, das Anweisungen zur Struktur, Hierarchie und Balance der Designelemente bietet. Folgen Sie der visuellen Anleitung der Drittelregel, um dynamische Designs zu erstellen, die die Aufmerksamkeit des Betrachters auf wichtige Elemente lenken.


Entdecken Sie unsere Tipps und bearbeitbaren Vorlagen, um mehr zu erfahren und Ihre Reise zu beginnen, eigene faszinierende Designs zu erstellen.

Was ist die Drittelregel?

Die Drittelregel ist eine Methode, um Bilder oder Grafiken in neun Drittel zu unterteilen, indem ein gleichmäßig verteiltes Raster mit drei Spalten und drei Reihen erstellt wird. Designer und Fotografen können diese Richtlinien erstellen oder sich vorstellen, um die Elemente in ihrem Design anzuordnen oder um den Blick auf das Foto zu positionieren, das sie gerade aufnehmen möchten.


Die Asymmetrie, die durch das Komponieren eines Bildes nach der Drittelregel entsteht, macht es auffälliger. Wenn zum Beispiel das Hauptmotiv im Bild in der Mitte positioniert ist, wirkt es statisch, aber wenn es näher an einem der Ränder ist, folgen die Augen ihm. Dies erzeugt ein Gefühl von Bewegung.

Wie wird die Drittelregel im Design verwendet?

hand drawing design graphics - Image

Im Design hilft die Drittelregel, Elemente innerhalb einer Komposition harmonischer, ausgewogener und ästhetisch ansprechender anzuordnen. Indem man zwei horizontale und zwei vertikale Linien in gleichem Abstand über das Design legt, erhält man ein Raster aus neun identischen Kästchen. Dies hilft, Text auszurichten, Fotos zu positionieren und andere Designelemente zu platzieren.


Das Raster der Drittelregel enthält vier Schnittpunkte oder Sweet Spots in der Mitte. Diese zeigen den natürlichen Fokus des menschlichen Auges beim Betrachten eines Bildes. Designer und Fotografen nutzen dies, um ihre Fotos und Designs auf natürliche Weise ansprechend zu arrangieren. Richten Sie den Hauptfokus Ihres Designs an mindestens einem der vier zentralen Schnittpunkte des Rasters aus, und die Betrachter werden dies automatisch zuerst sehen.


Zum Beispiel kann die Drittelregel im Webdesign helfen, Informationen für Website-Besucher effektiver zu strukturieren und zu vermitteln. Die wichtigsten Elemente Ihrer Landingpage, wie Überschriften oder ein Call-to-Action, sollten entlang der vier Schnittpunkte platziert werden, damit Benutzer sie sofort erkennen und handeln können. 


Es ist wichtig zu bedenken, dass die Drittelregel eine Richtlinie ist, die für Kreativität gebogen werden kann. Kreative verwenden sie als mentales Bild, wenn sie ihre Komposition betrachten, wenden aber dennoch ihre individuelle Sichtweise und Kreativität auf ihre Designs an.

Verwenden Sie das Raster als Leitfaden, um Ihr Design zu strukturieren.

Erstellen Sie ein Drittelregel-Raster, um Ihr Design entlang seiner Linien zu strukturieren. Verwenden Sie die Rasterlinien, um Elemente auf Ihrer Leinwand zu positionieren und sie in einer Reihenfolge anzuordnen, die es den Betrachtern ermöglicht, die Informationen sofort aufzunehmen. Stellen Sie sicher, dass Sie das Hauptmotiv Ihres Designs innerhalb des zentralen Feldes Ihres Rasters platzieren und kleinere wichtige Elemente in der Nähe der vier Schnittpunkte des Rasters.


Eine andere Möglichkeit, die Drittelregel zu verwenden, ist in Verbindung mit der bewährten F-förmigen Struktur im Webdesign. Untersuchungen haben gezeigt, dass die Augen zuerst auf den oberen linken der vier Sweet Spots gezogen werden, dann zum unteren linken Schnittpunkt und zurück zum oberen rechten Punkt wandern, wodurch die Linien eines großen F entstehen. Das bedeutet, dass Ihr wichtigster Inhalt auf einer Webseite im oberen Drittel platziert wird und der obere linke Schnittpunkt der Bezugspunkt ist, von dem aus sich Ihre Struktur erstreckt.

Landscape with a forest and sunset in the background and 'Travel with Us' written in the foreground - How is the rule of thirds used in graphic design - Image

In dieser herunterladbaren Design Wizard-Vorlage haben wir den Call-to-Action im mittleren Abschnitt des Rasters und zwischen den oberen beiden Schnittpunkten ausgerichtet. Dies platziert den Text in einer zentralen Position, wo die Betrachter zuerst hinschauen und sofort die Hauptbotschaft lesen. Es verdeutlicht die spezifische Bedeutung von Reisen vor der atemberaubenden Kulisse einer Waldlandschaft, die auch mit der Natur oder der Umwelt im Allgemeinen in Verbindung gebracht werden könnte. 

Landscape with a forest and sunset in the background and 'Travel with Us' written in the foreground with a 3x3 grid - How is the rule of thirds used in graphic design - Image

Wählen Sie Ihren Fokuspunkt, um Hierarchie zu schaffen

Movie poster with the title 'The Last War' - How is the rule of thirds used in graphic design - Image

Verwenden Sie visuelle Hierarchie, um die Betrachter durch Ihr Design von den wichtigsten Informationen zur nächsten zu führen. Anstatt dass alle Designelemente gleichzeitig um Aufmerksamkeit konkurrieren, ermöglicht eine gut definierte Hierarchie Ihrem Publikum, Informationen innerhalb von Sekunden in einer klaren Reihenfolge aufzunehmen. 


Ein Rahmen wie die Drittelregel bietet die Unterstützung, auf der Sie Ihre Designhierarchie aufbauen können. Verwenden Sie die Linien, um Ihre Entscheidungen zur Priorisierung von Elementen zusammen mit dem Muster, dem die Augen natürlich folgen, zu leiten. Die Betrachter beginnen am Schnittpunkt der Drittel oben links, bewegen sich nach unten links, dann nach oben rechts und schließlich nach unten rechts.


Um mit der Gestaltung Ihres Designs zu beginnen, wählen Sie Ihren Fokuspunkt. Alle anderen Elemente, die Sie hinzufügen, unterstützen Ihren Fokuspunkt. Ihr Fokus muss nicht in der Mitte des Bildes liegen. Experimentieren Sie und richten Sie Elemente auf jeder Seite der Leinwand aus, während Sie die Mitte leer lassen, oder platzieren Sie die meisten Ihrer Designelemente auf einer Seite und streben Sie ein Layout im Zwei-Drittel-Stil an. Verwenden Sie die Gitterlinien der Drittelregel, um Elemente auszurichten und verschiedene Kompositionen auszuprobieren.

Movie poster with the title 'The Last War'with a 3x3 grid - How is the rule of thirds used in graphic design - Image

In unserer bearbeitbaren Design Wizard-Vorlage haben wir die wichtigste Information, nämlich den Titel des Films, im mittleren Drittel zwischen den vier Sweet Spots platziert. Die großen und fettgedruckten Buchstaben in der modernen serifenlosen Schriftart Advent Pro und der vergrößerte Abstand zwischen ihnen ziehen sofort die Aufmerksamkeit des Publikums auf sich. Das Veröffentlichungsdatum, die Besetzung und der Slogan, die in der oberen und unteren Hälfte positioniert sind, schaffen die Hierarchie zwischen dem Filmtitel und den unterstützenden Informationen.

Verwenden Sie die Drittelregel, um Balance zu erreichen.

Flyer for a travel agency with an image of a lake and mountains and contact information at the bottom - How is the rule of thirds used in graphic design - Image

Bevor Sie darüber nachdenken, Balance in Ihrem Design herzustellen, sollten Sie verstehen, dass ein gut ausbalanciertes Stück sowohl symmetrisch als auch asymmetrisch sein kann. Symmetrie ist sofort ansprechend, kann aber vorhersehbar werden, während Asymmetrie einen interessanten Punkt hinzufügt und ein Gefühl von Bewegung in einem Bild erzeugt. Beide haben ihren Reiz und können verwendet werden, um ein ausgewogenes Design zu schaffen.


Wenn Sie an einem symmetrischen Stück arbeiten, verwenden Sie das Raster der Drittelregel, um das genaue Zentrum für Ihr Hauptobjekt zu finden. Wenn Sie ein asymmetrisches Design anstreben, erreichen Sie Balance mit Hilfe der Drittelregel, indem Sie Interessenspunkte nahe einer der vier Schnittpunkte platzieren. Platzieren Sie mehr auf der rechten oder linken Seite anstatt in der Mitte, um ein attraktives Design zu schaffen. 


Die Drittelregel hilft auch dabei, ein Gleichgewicht zwischen Bild und Text zu schaffen. Verwenden Sie das Raster, um zu identifizieren, welcher Teil Ihrer Leinwand mehr Aufmerksamkeit auf sich zieht als andere. Dies ermöglicht es Ihnen, Entscheidungen entsprechend der Wichtigkeit des Textes in Ihrem Design zu treffen. Zum Beispiel wird jeder größere, wichtigere Text nahe den Schnittpunkten platziert, während zusätzliche Informationen in einem der unteren Drittel untergebracht werden können.

Flyer for a travel agency with an image of a lake and mountains and contact information at the bottom with a 3x3 grid - How is the rule of thirds used in graphic design - Image

In unserer bearbeitbaren Design Wizard-Vorlage haben wir den Horizont im Foto verschoben, um ihn an die obere Linie des Drittelregel-Rasters anzupassen. Dies ist eine häufig verwendete Technik in der Fotografie, um mehr vom Motiv und weniger leeren Raum zu zeigen. Der Fokus liegt auf dem Bild, während die Kontaktdaten und der Handlungsaufruf zusätzliche Informationen sind, die im unteren Drittel platziert werden. 


Das Leseverhalten von links nach rechts und von oben nach unten in der westlichen Welt hat unsere Augen auf einen diagonalen Scan von oben rechts nach unten links konditioniert. Die Idee hinter unserem Design ist, dass die Betrachter die Seite scannen, den Handlungsaufruf unten rechts lesen und dann nach links gehen, um die Kontaktdaten zu finden, die sie benötigen, um zu handeln.

Komplexere Designs erstellen

Graduation party flyer with a baby blue background and students throwing their hats in the air - How is the rule of thirds used in graphic design - Image

Im Grafikdesign hilft die Drittelregel Designern, komplexere Kompositionen mit mehreren Elementen zu arrangieren. Mithilfe der Kästchen und Gitterlinien können Sie Objekte und Text entsprechend ihrer Wichtigkeit platzieren. Dies hilft, Raum zu schaffen und ein überladenes Design oder eine visuell überwältigende Wirkung auf Ihr Publikum zu vermeiden.


Erzeugen Sie mehr Spannung und Energie, indem Sie wichtigen Text und andere Designelemente entlang der Linien der vier Schnittpunkte platzieren. Behalten Sie das westliche Lesemuster oder den diagonalen Scan im Hinterkopf, wenn Sie Ihr Design layouten. Etablieren Sie einen Fluss von oben links nach unten rechts, wobei die wichtigsten Informationen oben links und der nächstwichtigste Punkt unten rechts platziert werden.

Graduation party flyer with a baby blue background and students throwing their hats in the air with a 3x3 grid - How is the rule of thirds used in graphic design - Image

In unserer herunterladbaren Design Wizard-Vorlage haben wir den Text entlang der Linien nahe den vier Schnittpunkten platziert, was es dem Betrachter erleichtert, ihn zu scannen und zu lesen. Der Titel sticht in der fetten Schrift Alfa Slab One hervor und bildet einen Kontrast zum Slogan in der dünneren Advent Pro. Das Drittelregel-Raster hilft dabei, den Raum zu schaffen, der in diesem Design benötigt wird, um das Gefühl der Freiheit zu vermitteln, das mit einer Abschlussfeier verbunden ist.


Wenn Sie die Drittelregel in all Ihren Designs effektiv nutzen möchten, verwenden Sie das Raster, um sich leiten zu lassen, und arrangieren Sie Ihre Komposition um die Rasterlinien herum. Entwickeln Sie ein Auge für dieses Designprinzip, indem Sie Ihre Designs ein paar Mal überlagern, bis Sie sich wohl fühlen, es sich nur vorzustellen.

Wie man die Drittelregel im Design Wizard anwendet

Schritt 1: Registrieren und Einloggen bei Design Wizard

Step 1 Sign up and Log into Design Wizard - How is the rule of thirds used in graphic design - Image

Gehen Sie zu designwizard.com. Wenn Sie noch kein Konto haben, klicken Sie oben rechts auf Registrieren. Geben Sie Ihre E-Mail-Adresse ein und erstellen Sie ein Passwort. Um Ihr neues Konto zu verifizieren, klicken Sie auf den Link in der Bestätigungs-E-Mail in Ihrem Posteingang. Melden Sie sich mit Ihren Design Wizard-Daten an.


Schritt 2: Wählen Sie eine Vorlage oder benutzerdefinierte Größe

Step 2 Choose a Template or Custom Size - How is the rule of thirds used in graphic design - Image

Auf Ihrem Design Wizard-Dashboard finden Sie Ihre Größen und MEHR GRÖSSEN. Wählen Sie die benötigte Größe aus und wählen Sie eine Vorlage oder klicken Sie auf Benutzerdefinierte Größe, um benutzerdefinierte Abmessungen einzugeben.

Schritt 3: Ein Raster anwenden

Step 3 Apply a Grid - How is the rule of thirds used in graphic design - Image

Um die Drittelregel auf Ihr Design anzuwenden, klicken Sie auf das Raster-Symbol über der Leinwand. Geben Sie die Zahl 3 in Spalten und Zeilen ein. Klicken Sie auf den Schieberegler, um das Raster anzuzeigen. Passen Sie Ihr Design entlang der Linien des Rasters und gemäß der Drittelregel an.

Die Drittelregel ist ein einfaches Rahmenwerk, das Ihnen hilft, auffällige Designs zu erstellen. Anstatt das Raster von drei Reihen und drei Spalten über Designs zu legen, haben erfahrene Designer die Struktur verinnerlicht. Üben Sie, das Raster zu verwenden, um Ihre Kompositionen anzuordnen, bis Sie es nicht mehr benötigen. 


Während die Drittelregel eine Anleitung für Designs bietet, die von Natur aus angenehm für das Auge sind, experimentieren Sie mit den Rasterlinien und nutzen Sie Ihre Kreativität, um die Regeln zu brechen. Um attraktive Designs zu erstellen, spielen Sie mit verschiedenen Platzierungen. Haben Sie keine Angst, Risiken einzugehen und neue Wege der Komposition von Elementen auszuprobieren.

Elisabeth Strasser

Elisabeth Strasser

Lizzie ist eine professionelle Content-Autorin. Sie ist leidenschaftlich an SEO und Content-Marketing interessiert, seit sie ein lebensveränderndes Praktikum bei einer Digitalmarketing-Agentur absolvierte, während sie ihren BA in Englisch und Amerikanistik machte.

Nachdem sie ihren Master in Professionellem Schreiben mit Auszeichnung abgeschlossen hatte, machte sich Lizzie daran, ihre Erfahrungen im Copywriting und Digitalmarketing in Cork City zu sammeln.

Als Österreicherin mit einer Liebe für Irland begeistert sich Lizzie für die Erforschung irischer Folklore und Erzählkunst. Ihre Lieblings-DW-Tools sind:
Youtube Outro Maker und Add Logo to Video Tools.