6.14. Konzept: Responsive Bildstile
Das Modul Responsive Image, welches mit dem Kernsystem ausgeliefert wird, stellt responsive Bildstile bereit. Dies ermöglicht Ihnen Bilder auf Ihrer Website zu erzeugen, die speziell für verschiedene Bildschirmgrößen optimiert sind. Dies hilft beispielsweise dabei Ihre Website auf mobilen Geräten schnneller zu laden, da unter Verwendung des Moduls responsive Imagae erzeugte Bilder für kleinerere Bildschirme optimiert sind.
Ein responsiver Bildstil ist die Zuordnung eines Bildstils oder mehrerer Bildstile zu einem Breakpoint. Breakpoints sind die Umbruchpunkte, an denen sich ein responsives Design anpassen muss, um auf unterschiedliche Bildschirmgrößen zu reagieren. Responsive Bildstile können entweder mit Breakpoints funktionieren, die in Ihrem Theme definiert sind, oder mit Breakpoints, die über die Einstellungen für responsive Bilder festgelegt wurden.
Wenn ein responsiver Bildstil definiert ist, kann er in den Anzeigeeinstellungen von Bildfeldern ausgewählt werden. Auf diese Weise kann die Website Bilder mittels des HTML5 picture-Tag oder unter Verwendung der Attribute srcset und sizes in einem img- Tag ausliefern, je nachdem, wie der responsive Bildstil eingerichtet ist.
- Drupal.org Community-Dokumentationsseite „Reaktionsfähiges Webdesign"
- Drupal.org_ Community-Dokumentationsseite „Responsive Bilder in Drupal 9 (englisch)"
- Drupal.org Community-Dokumentationsseite „Arbeiten mit Breakpoints in Drupal 9“ (englisch)
- Blog-Post „Responsive Bilder in Drupal 8 mit srcset“ (englisch)
Mitwirkende
Adaptiert von Boris Doesborg von Responsiv Bilder in Drupal 9 (englisch), copyright 2000 - 2025 von den einzelnen Mitwirkenden an der Dokumentation der Drupal-Community.
Ins Deutsche übersetzt von Joachim Namyslo.
Source file: structure-image-responsive.asciidoc
Help improve this page
You can:
- Log in, click Edit, and edit this page
- Log in, click Discuss, update the Page status value, and suggest an improvement
- Log in and create a Documentation issue with your suggestion
