Opener: Stage

Hinweis

Für die Eröffnung einer Seite eines Auftritts, empfiehlt sich ein auffälliges und einnehmendes Element, das den Zweck oder Inhalt der Seite vermittelt. Hierfür gibt es verschiedene Möglichkeiten (Opener), die abhängig von dem bezweckten Kommunikationsauftrag der Seite gewählt werden können. Es darf jeweils nur ein Opener auf einer Seite verwendet werden und das Element muss das erste Inhaltselement der Seite sein.

Note

For the Opener for a page of a site, you should use an eye-catching and engaging element that conveys the purpose or content of the page. There are various possibilities (Opener) for this; the choice should be made according to the communication task of the page. Only one Opener can be used on a page and the element must be the first content element on the page.

Bühne

.modul-buehne

Die Bühne ist ein Bildslider mit Teaser-Texten, der einen kurzen und visuellen Überblick über die Inhalte einer Seite liefern kann. Sie wird im Bereich layout-grid__area--maincontent des Layout Grids verwendet und sollte das einzige Element im layout-grid__area--herounit oder das erste Element im layout-grid__area--maincontent sein.

The Stage is an image slider with teaser texts and should be the only Element in layout-grid__area--herounit or the first element in layout-grid__area--maincontent. This module should offer entry via a combination of an image and text.

  • Alternative Bildbeschreibung

    Teaser 1

    Philosophy is considered a science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists.

    Mehr lesen Bild: @photograph
  • Alternative Bildbeschreibung

    Teaser 2

    Philosophy is considered a science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists.

    Mehr lesen Bild: @photograph
  • Alternative Bildbeschreibung

    Teaser 3

    Philosophy is considered a science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists.

    Mehr lesen Bild: @photograph
HTML

<div class="modul-buehne">
        <div class="swiper-container swiper">
        <div class="swiper-controls">
            <div class="swiper-button-prev" title="Vorheriges Bild"></div>
            <div class="swiper-button-next" title="Nächstes Bild"></div>
            <div class="swiper-pagination" aria-hidden="true"></div>
        </div>
        <ul class="swiper-wrapper">
            <li class="swiper-slide"><!-- Slide 1 -->


                <div class="modul-teaser_buehne" data-add-clickable-area="smart">
                    <div class="teaser_buehne__left">
                        <div class="image">
                                    <div class="image__image">
            <img src="../../styleguide/static/placeholder_2x1.jpg" alt="Alternative Bildbeschreibung" >
        </div>
                        </div>
                    </div>
                    <div class="teaser_buehne__right">
                        <div class="inner">
                            <h2 class="title">Teaser 1</h2>
                            <p class="text">
                                Philosophy is considered a science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists.
                            </p>
                            <span class="action">
                                <a href="#3682" class="more" data-mainlink="true" aria-label="Teaser 1" title="Teaser 1">Mehr lesen</a> 
                            </span>
                            <span class="image__copyright">Bild: @photograph</span>
                        </div>
                    </div>
                </div>

            </li>
            <li class="swiper-slide"><!-- Slide 2 -->


                <div class="modul-teaser_buehne" data-add-clickable-area="smart">
                    <div class="teaser_buehne__left">
                        <div class="image">
                                    <div class="image__image">
            <img src="../../styleguide/static/placeholder_2x1.jpg" alt="Alternative Bildbeschreibung" >
        </div>
                        </div>
                    </div>
                    <div class="teaser_buehne__right">
                        <div class="inner">
                            <h2 class="title">Teaser 2</h2>
                            <p class="text">
                                Philosophy is considered a science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists.
                            </p>
                            <span class="action">
                                <a href="#6696" class="more" data-mainlink="true" aria-label="Teaser 2" title="Teaser 2">Mehr lesen</a> 
                            </span>
                            <span class="image__copyright">Bild: @photograph</span>
                        </div>
                    </div>
                </div>

            </li>
            <li class="swiper-slide"><!-- Slide 3 -->


                <div class="modul-teaser_buehne" data-add-clickable-area="smart">
                    <div class="teaser_buehne__left">
                        <div class="image">
                                    <div class="image__image">
            <img src="../../styleguide/static/placeholder_2x1.jpg" alt="Alternative Bildbeschreibung" >
        </div>
                        </div>
                    </div>
                    <div class="teaser_buehne__right">
                        <div class="inner">
                            <h2 class="title">Teaser 3</h2>
                            <p class="text">
                                Philosophy is considered a science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists.
                            </p>
                            <span class="action">
                                <a href="#4050" class="more" data-mainlink="true" aria-label="Teaser 3" title="Teaser 3">Mehr lesen</a> 
                            </span>
                            <span class="image__copyright">Bild: @photograph</span>
                        </div>
                    </div>
                </div>

            </li>
        </ul>
       
           </div>

</div>