Direkt zum Inhalt
Bild
lg.png

Drupal 8 ist Mobile Responsive. Aber was bedeutet das für Sie?

AI-Translated
article publisher

Shubham

Drupal

Das Internet steht kurz davor, von Smartphones dominiert zu werden, und wir müssen vorbereitet sein.

Laut den von Statecounter veröffentlichten Statistiken entfallen 52,64 % des gesamten Traffics auf mobile Seitenbesuche, und diese Zahl steigt exponentiell an. Quantitativ gesehen ist das fast die Hälfte des Traffics im World Wide Web, was uns einen klaren Anreiz gibt, mehr responsive Websites zu erstellen. Drupal hat sich mit seinem neuen und leistungsstarken Upgrade, nämlich Drupal 8, darauf konzentriert, Websites "Mobile First" zu gestalten. Für Drupal-Nutzer ist Drupal 8 eine völlig neue Erfahrung, da das neue Upgrade eine mobilfreundliche Entwicklung für Content-Management-Systeme (CMS) und Open-Source-Software (OSS)-Branchen bietet.

Zu den wichtigsten Schwerpunkten von Drupal 8 gehören eine responsive Admin-Oberfläche, dynamische und anpassbare Menüs sowie sich selbst anpassende Bilder, was aus der Perspektive von Handheld-Geräten eine enorme Zeitersparnis bedeutet. 

Im Vergleich zu Version 7 hat Drupal 8 eine neue und verbesserte Theme-Engine hinzugefügt, die gleichzeitig schnell und sicher ist. Es bietet außerdem responsive Bilder, die sich automatisch in der Größe anpassen können. WYSIWYG - ein Texteditor und viele weitere nützliche Funktionen machen es zu einem würdigen Kandidaten für die beste derzeit verwendete CMS-Plattform.

Drupal 8 Funktionen - Out-of-the-box 

Diese neueste Version von Drupal hat den Vorteil von 200 neuen und erweiterten Funktionen gegenüber ihrem Vorgänger. Eine überraschende Tatsache ist, dass sich von diesen 200 Funktionen mehr als die Hälfte darauf konzentriert, die Plattform für mobile Geräte geeignet und maßgeschneidert zu machen. Einige wenige Funktionen, die eine größere Rolle im responsiven Schema der Dinge spielen, sind:-   

  • Mobile-Responsive Theme-Engine
  • Responsive Bilder
  • Website-Barrierefreiheit
  • Flexible Tabellen
  • Mobile Administration

Mobile-Responsive Theme-Engine 

Twig - Die Community hat eine neue Theme-Engine auf PHP-Basis entwickelt, die es den Programmierern ermöglicht, Vorlagen mit einer einfacheren Syntax zu erstellen und auch Vorlagen zu erstellen, die sowohl schnell als auch unglaublich sicher sind.

Diese neuen responsiven Themes haben Websites plattform- und geräteunabhängig gemacht, d. h. sie sind nicht nur auf Mobiltelefonen, sondern auf allen Geräten verfügbar.

Bartik Drupal Theme
Bartik Drupal Theme

Alle Drupal 8 Themes wurden ebenfalls von reinen Desktop-Themes zu "Mobile First"-Themes umgewandelt, zusammen mit einer nützlichen Backend-Plattform und einem neuen Standard-Theme Bartik. Das ist bemerkenswert!

Responsive Bilder 

Drupal hat es nicht nur einfacher gemacht, auf das Web-Ökosystem für mobile Nutzer zuzugreifen, sondern auch für Drupal-Entwickler, diese zu erstellen. In Drupal 7 mussten Entwickler jedes Bild einzeln für Plattformen mit Bildstilen anpassen, aber mit Drupal 8 müssen Sie nur das responsive Bildelement eingeben, unabhängig von seiner Verwendung auf der Seite, und es passt sich automatisch an das Gerät an, das auf das Bild zugreift.

Drupal 8 verfügt über eine integrierte Breakpoint-Zuordnung und einen Bildformatter, der nicht nur die Dateigröße reduziert und das Laden beschleunigt, sondern das Bild auch optisch ansprechender macht.

Website-Barrierefreiheit 

Um Websites sowohl auf Mobilgeräten als auch auf Desktops besser zugänglich zu machen, wird in Drupal 8 HTML5 eingeführt, was es Entwicklern erleichtert, ihre gewünschten Ziele zu erreichen.

Um die Zugänglichkeit von Rich-Internet-Anwendungen zu verbessern, wurde außerdem die WAI-ARIA-Unterstützung hinzugefügt, die mit mehreren verbesserten Funktionen ausgestattet ist, die Websites auf verschiedenen Geräten besser zugänglich machen.

Flexible Tabellen 

Die integrierten Breakpoints in Drupal 8 überwachen die Höhe, Breite und Auflösung aller Elemente, was der Plattform hilft, einen idealen Übergang zwischen verschiedenen Plattformen erfolgreich zu bewirken.

Das Tabellenformat ist enthalten, mit dem Spalten priorisiert werden können, die beim Erreichen der Breakpoints automatisch ausgeblendet werden. Es wird in niedrige, mittlere und hohe Prioritäten eingeteilt, wobei die Spalten, die zu mittel und niedrig gehören, am mobilen Breakpoint ausgeblendet werden, was zu einem schnelleren Rendering und damit zu einer besseren Benutzererfahrung führt.

Mobile Administration 

Mit dem Aufkommen von Drupal 8 war die Verwaltung von Inhalten auf dem Handy noch nie so einfach. Die Symbolleisten und Layouts passen sich an das Gerät an, an dem Sie arbeiten, so dass es einfacher ist, Änderungen von jedem Gerät aus vorzunehmen, unabhängig von seiner Bildschirmgröße.

Drupal 8 mobile administration; example of mobile responsive website;

Wenn beispielsweise über ein Mobiltelefon auf die Website zugegriffen wird, wird die mobilfreundliche Navigationsleiste angezeigt, die das Administrationsmenü ausblendet und umgekehrt.

Einige Module, die die mobile Reaktionsfähigkeit unterstützen:

Retina Bilder

Retina Images löst dieses Problem für Drupal, indem es den Bildeffekten, die mit dem Drupal-Kern geliefert werden, eine Option hinzufügt, um hochauflösende Bilder auszugeben, die auf diesen Retina-Displays gut aussehen. Ich bin sicher, Sie haben in dem einen oder anderen Zusammenhang schon von dieser ganzen Retina-Sache gehört. Nun, es geht um Displays mit hoher Pixeldichte, die Ihre Bilder im Grunde schlechter darstellen als normale Displays, wenn die Bildauflösung nicht hoch genug ist.

FitVids

FitVids ist ein Modul, das Videos für Ihr fließendes Layout verarbeitet, so dass Sie sich darüber keine Gedanken machen müssen. Sie wissen schon, wenn Sie YouTube- oder Vimeo-Videos einbetten, haben diese eine bestimmte Größe. Nun, das kümmert sich darum und lässt sie automatisch in der Größe an den Container anpassen, in dem sie sich befinden. Und dafür wird die FitVids.js-Bibliothek verwendet.

Tinynav

Hier geht es um die Navigation. Tinynav implementiert die tinynav.js jQuery-Bibliothek, um Ihr Menü auf kleinen Geräten in ein Select-Dropdown umzuwandeln. Ich bin sicher, Sie haben es schon auf Websites gesehen. Sie ändern die Größe des Browsers und das Hauptmenü verwandelt sich in eine HTML-Auswahlliste mit Optionen, die zu den Menüseiten verlinken. Ziemlich cool, also schauen Sie es sich an.

Mobiles Theme

Mobile Theme ist ein interessantes Modul, mit dem Sie ein anderes Theme auswählen können, das auf mobilen Geräten angezeigt werden soll. Es gibt ein paar Themes, die speziell für Mobiltelefone entwickelt wurden, die Sie für diesen Zweck verwenden können. Und ich weiß, das ist nicht gerade responsiv, aber ich habe mich entschieden, es wegen seines mobilfreundlichen Charakters hinzuzufügen.

 

Der Rest

Das Verständnis der aufkommenden Trends der digitalen Welt und deren Ausgewogenheit ist eine der Eigenschaften, die Drupal zu einem idealen CMS für mobile Geräte macht. Die gesamte Anerkennung für die Aufrechterhaltung des Tempos der Trends und die Weiterentwicklung mit ihnen gebührt seiner lebendigen und florierenden Community, die bestrebt ist, Webnutzern auf der ganzen Welt die besten Erfahrungen zu bieten. Wir von Opensense Labs liefern responsive Drupal-Plattformen an Unternehmen in Not. Für Ihre Entwicklungsbedürfnisse erreichen Sie uns unter [email protected].

Abonnieren

Ready to start your digital transformation journey with us?

Related Blogs

Zurück von der DrupalCon Atlanta 2025: Ein Meilenstein für OpenSense Labs

DrupalCon Atlanta 2025 OpenSense Labs

„Fit. Schnell. Für die Ewigkeit gebaut.“ Das war nicht nur ein Slogan, sondern die Denkweise, mit der wir zur DrupalCon…

Erklärbare KI-Tools: SHAPs Stärke in der KI

Explainable AI tools Explainable AI And SHAP OpenSense Labs

Wissen Sie, was erklärbare KI-Tools sind? Erklärbare KI-Tools sind Programme, die zeigen, wie eine KI ihre Entscheidungen…

KI-Chatbots: Präzision und Persönlichkeit in Perfektion

Creating AI Chatbot OpenSense Labs

In der Welt der künstlichen Intelligenz ist die Entwicklung eines KI-Chatbots, der nicht nur akkurate Informationen liefert…