In this article, we gonna see What Drupal offers as Responsive Web Design within Drupal Core for developers. While Drupal 8 was out and it had a buzz of being responsive, mobile friendly. And yes, the Internet is on the verge of being dominated by smartphones & Drupal needs to be prepared.
Mobile friendly will also mean the content is first. From a big screen to a little screen, elements would look different, Images would be responsive, menu items would render as drop-downs, columns are moved to top/bottom based on flexibility of view on different screens.
If Drupal is providing mobile friendly means, one should be able to use it as 100% responsive with at least the core drupal code. Let’s take a closer look at what Drupal is providing to say itself as Responsive web design.
Just Drupal Core
With fresh Drupal you get Bartik as front end theme & Seven as the admin theme where both the themes are really responsive. In one word if you wanna say, one can manage content from the mobile device with Seven theme. As long as you are just adding content then you are good to go with Seven & Bartik.
Modules in Drupal Core
We have two modules in the Drupal core, Breakpoint and Responsive Image which are making the site responsive. On fresh drupal installation you can see the Breakpoint module already enabled which will help the admin toolbar to be responsive.
Breakpoint module will provide the ability to make the site change at different screen sizes. This module will provide a way to identify and use the breakpoints, based on this the front end developers and site builders can make the site look more responsive.
Even though we have a way to define breakpoints for our theme, we still need to do something for images to look responsive. And for this Responsive Image module can be enabled.
Responsive Image module requires Breakpoint module to be enabled, because it uses the breakpoints that are defined in the theme along with image styles.
In the older version of Drupal, there was a module called Picture, which was helping to create responsive images. Now this module is the same as a Responsive image module. And there is still configuration that must be set up for the Responsive image module, but unlike Breakpoint there is a user interface to do your configuration.
These are responsive design benifits would be available from the Drupal Core. Thanks to that, Drupal CMS is more responsive and provides better efficiency for Content teams.
