--- title: "Zweispaltige Bühne – Flexibles Layout mit Medien" url: "https://web.destination.one/destinationbase/buehne-zweispaltig" description: "Entdecke die zweispaltige Bühne für moderne Websites: flexibel, responsiv und ideal für Bilder, Videos oder Text. Perfekt für eine klare, ästhetische Contentstruktur." language: "de" breadcrumb: "Root > Startseite > destination.base > Bühne (zweispaltig)" keywords: - "zweispaltige Bühne" - "2 spaltige Bühne" - "Webdesign Layout" - "responsives Design" - "Contentaufteilung" - "Hintergrundbild" - "Hintergrundvideo" - "transparente Textbox" - "Bühnenlayout" - "Spaltenlayout 2/3 1/3" - "1/2 1/2" - "Störer Animation" - "Medienintegration" - "UX Optimierung" - "Website Gestaltung" --- Zweispaltige Bühnen =================== DAS Inhaltselement für ästhetische Contentaufteilung Badgeinfo **Worum geht's?** Eine zweispaltige Bühne auf einer Website bezieht sich auf das Layout, bei dem der Inhalt in zwei parallelen Spalten angeordnet ist. Dieses Layout bietet mehrere Vorteile, die zur Verbesserung der Benutzererfahrung und zur effektiven Präsentation und Organisation von Informationen beitragen können. Glühbirne neben der Überschrift Gut zu Wissen **Gut zu wissen** Die zweispaltige Bühne verhält sich responsiv, d. h. bei kleineren Bildschirmen werden beide Spalten untereinander angeordnet, damit eine gute Präsentation des Inhalts gewährleistet wird. Filmklappe neben der Überschrift Live Demo Live-Demo --------- 2 spaltige Bühne mit Hintergrundbild und Text in einer transparenten Box ------------------------------------------------------------------------ - - 2 spaltige Bühne mit HG-Bild + Text Fließtexte lassen sich gut mit Bildern auflockern. Das Bild wurde in dieser zweispaltigen Bühne als Hintergrundbild in der Rahmenbühne hinterlegt und der Text hat einen farbigen Hintergrund bekommen. Die Position des Hintergrundbildes und des Textes können getauscht werden, sodass der Text in der linken Spalte erscheint. - - 2 spaltige Bühne mit HG-Video + Text Fließtexte lassen sich gut mit Videos auflockern. Das Video wurde in dieser zweispaltigen Bühne als Hintergrundvideo in der Rahmenbühne hinterlegt und der Text hat einen farbigen Hintergrund bekommen. Die Position des Hintergrundvideos und des Textes können getauscht werden, sodass der Text in der linken Spalte erscheint. - - 2 spaltige Bühne mit zwei Hintergründen und Abstand zwischen den Spalten 2 spaltige Bühne Hintergrund: links Bild mobile Darstellung: Reihenfolge der Darstellung der Spalten getauscht, d.h. es wird erst die rechte Spalte (Text), dann die linke Spalte (Bild) dargestellt. Hier steht eine Überschrift die direkt im Text mit Medien-Element gepflegt ist Duis arcu tortor, suscipit eget, imperdiet nec, imperdiet iaculis, ipsum. Nulla consequat massa quis enim. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi consectetuer lacinia. Maecenas malesuada. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo. Cras sagittis. Nulla facilisi. Morbi mollis tellus ac sapien. Aenean viverra rhoncus pede. Sed lectus. Vivamus consectetuer hendrerit lacus. > "Hier steht ein Zitat passend zum Thema. Dadurch lassen sich Seiten optisch auflockern. Statt eines Zitates könnte hier auch eine Gästestimme oder ein Tipps der Redaktion stehen." von Max Mustermann 2 spaltige Bühne mit HG-bild + Text Fließtexte lassen sich gut mit Bildern auflockern. Das Bild wurde in dieser zweispaltigen Bühne als Hintergrundbild in der Rahmenbühne hinterlegt und der Text hat einen farbigen Hintergrund bekommen. Die Position des Hintergrundbildes und des Textes können getauscht werden, sodass der Text in der rechten Spalte erscheint. - Das Bild und der Text nehmen die gesamte Breite des Bildschirms ein. - Der Text bricht nicht um und hinter dem Text können Hintergrundfarben genutzt werden. - Es können Elemente wie Button, Checkliste vertikal, Überschrift, Text, Fakten vertikal platziert werden - - Hier steht eine Headline in Styling M und hier steht ein Untertitel in Styling XL die dadurch größer wirkt In die Rechte Spalte ist im Text mit Medien Element ein Bild als PNG eingefügt worden, damit das Logo keinen zusätzlichen Hintergrund hat. Als Hintergrund der Bühne ist eine Farbe gewählt worden. Alternativ könnte als Hintergrund auch ein Hintergrundbild gewählt werden, das eine Struktur wie Stoff, Holz, Tapete etc. zeigt und dadurch nur dezent als Hintergrund wirkt. Grafisches Element des Logos von team neusta in grün-gelber Farbgebung Hier steht eine Überschrift die direkt im Text mit Medien-Element gepflegt ist Duis arcu tortor, suscipit eget, imperdiet nec, imperdiet iaculis, ipsum. Nulla consequat massa quis enim. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi consectetuer lacinia. Maecenas malesuada. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo. Cras sagittis. Nulla facilisi. Morbi mollis tellus ac sapien. Aenean viverra rhoncus pede. Sed lectus. Vivamus consectetuer hendrerit lacus. 2 spaltige Bühnen sind eine tolle Sache 100 % anspruchsvoll bis auf den letzten Buchstaben 1000 Zeilen Text optisch ansprechend dargestellt 2 spaltige Bühne mit animiertem Störer Der Störer wird in den Bühneneinstellungen gepflegt. 2 spaltige Bühne mit überlappendem Störer Der Störer wird in den Bühneneinstellungen gepflegt. Dies ist eine 2/3 1/3 Bühne In dieser Bühne sind die Spalten 2/3 1/3 aufgeteilt und es wurde redaktionell ein Abstand zwischen den beiden Spalten gepflegt. Dies ist eine 1/3 2/3 Bühne Bei dieser Bühne sind die Spalten in 1/3 2/3 aufgeteilt. In der 2/3 Bühne befindet sich ein Video und der Test ist mit einer transparenten Box hinterlegt. zweispaltige Bühne mit einzelnem Medienelement (Bild, Video, Audio) und Farbverlauf im Hintergrund *Video abspielen* 00:00