Hướng dẫn chính cho Drupal 8: Episode 2 - Mobile Improvements

Hướng dẫn chính cho Drupal 8: Episode 2 - Mobile Improvements

Welcome to the second installment of an 8-part blog series we're calling "The Ultimate Guide to Drupal 8." Whether you're a site builder, module or theme developer, or simply an end-user of a Drupal website, Drupal 8 has tons in store for you! This blog series will attempt to enumerate the major changes in Drupal 8. Successive posts will gradually get more technical, so feel free to skip to later parts (once they're published) if you're more on the geeky side.

Please note that since Drupal 8 is still under active development, some of the details below may change prior to its release. Still, since Drupal 8 is now feature-frozen, hopefully most info should remain relevant. Where applicable, Drupal 7 contrib equivalents of Drupal 8 features will be noted.

Mobile Improvements

In addition to authoring experience improvements, another huge area of focus for end-users of Drupal websites is on features that make Drupal 8 more mobile-friendly out of the box, to keep up with trends showing a global explosion of mobile devices worldwide.

Mobile First

You'll find that everything in Drupal 8 has been designed with mobile in mind, from the installer to the modules page. Even new features such as in-place editing are designed to work on teensy screens. Give Drupal 8 a try in your device of choice, and let us know where you find bugs! (Uhhh, if. Right, I meant if you find bugs. ;))

Hướng dẫn chính cho Drupal 8: Episode 2 - Mobile Improvements

(Also, why yes, that is a search box on the modules page! Woohoo! :D Check out Module Filter for a similar experience in Drupal 7.)

Responsive-ize ALL the things (themes, images, tables…)

In order to support the unimaginable array of wacky Internet-enabled devices coming down the line in the next 5+ years, Drupal 8 incorporates responsive design into everything it does.

For starters, all core themes are now responsive, and automatically reflow elements like menus and blocks to fit well on mobile devices (if the viewport is too narrow, horizontal elements will switch to a vertical orientation instead). There's also built-in support for responsive images, so that images that show up large on a desktop shrink down to fit on a tablet or smartphone.

Bartik theme shown on the desktop as well as on a mobile device. Horizontal tabs become vertical and take up the full screen, images are shrunk down to fit.

Drupal 8 also provides support for responsive tables, so table columns can be declared with a "high, medium, low" importance. On wide screens, all of the columns show up, but as the screen size narrows, the less important columns start dropping off so everything fits nicely. This API is also built into Views module, so you can configure your own responsive admin screens.

People administration page shown in both desktop and mobile. In mobile, all columns but name and operations are dropped.

Responsive Bartik and Responsive Tables module can do a similar thing for Drupal 7. There are also numerous responsive base themes for Drupal 7 including Omega and Zen, from which you can build a responsive design for your website.

Mobile-friendly toolbar

Drupal 8 also now sports a shiny new administrative toolbar that automatically expands and orients itself horizontally on wide screens, and collapses down to icons and orients vertically for smaller screens. Like all new front-end features in Drupal 8, this one also got tons of accessibility love, so it's easy for screen reader users to jump around to various parts of the site.

Mobile navigation toolbar in both desktop (horizontal) and mobile (vertical, icons only) orientation.

If you're interested in this feature for Drupal 7, check out the Mobile Friendly Navigation Toolbar module.

Responsive preview

Though it remains to be seen if this feature will end up as part of Drupal 8 core or not, the Responsive Preview module (available for Drupal 7) provides an easy, CMS-integrated way to quickly check what your site approximately looks like in various different, customizable, form-factors without having to spend $25,000 in hardware. ;) You can flip easily between landscape and portrait mode, as well.

Responsive preview emulating an iPhone 5 in portrait mode.

Responsive preview emulating an iPhone 5 in landscape mode.

Front-end performance

One of the biggest factors that can make or break the mobile experience is the raw performance of a website. As a result, lots of work has been done in Drupal 8 to minimize its front-end footprint. For example, in many cases, jQuery was swapped out for native JavaScript, and out of the box Drupal 8 loads zero JavaScript files for anonymous visitors. Additionally, JS-intensive features such as the Overlay module have been removed in favour of lighter-weight alternatives that are mobile friendly. (A simple "Back to site" link in the admin toolbar visible while in an administrative context; see Escape Admin for a Drupal 7 equivalent.)

Back to site link showing in the admin toolbar.

Whew! That's a wrap!

Join us next week, when we'll talk about all the nifty site builder improvements coming to Drupal 8!

Bạn thấy bài viết này như thế nào?: 
No votes yet
Ảnh của Tommy Tran

Tommy Tran owner Express Magazine

Drupal Developer having 9+ year experience, implementation and having strong knowledge of technical specifications, workflow development. Ability to perform effectively and efficiently in team and individually. Always enthusiastic and interseted to study new technologies

  • Skype ID: tthanhthuy
  • Phone/Zalo: (+84) 944 225 212
  • WhatsApp: (+84) 944 225 212
  • Line Messenger: (+84) 944 225 212
  • Email: asaleotestf@gmail.com
  • Telegram Messenger: https:/t.me/tommytran0401

Quảng cáo việc làm


Thích hợp các bạn nữ mảng thợ may làm việc tại nước NGA

Đơn hàng Tuyển dụng 100 Thợ may đi Nga(đợt 1 tháng 3.2021, đợt 2 tháng 5.2021). Lương thực lãnh 800 USD, bao ăn ở, vé máy bay và visa, phí xuất cảnh(1800 USD)trả khi đi làm có lương. Bạn có thể liên hệ CÔNG TY qua Phone/Zalo: (+84) 944 225 212. Công ty sẽ tư vấn cho bạn.

Xem chi tiết: >>> https://bit.ly/3o9NOfR

Tìm kiếm bất động sản





Dich vu khu trung tphcm

Dich vu diet chuot tphcm

Dich vu diet con trung

Quảng Cáo Bài Viết

Giới thiệu những sản phẩm di động tốt nhất tại CES 2014

Giới thiệu những sản phẩm di động tốt nhất tại CES 2014

Phiên bản thu nhỏ của Xperia Z1, máy tính chạy hai hệ điều hành của Asus, máy tính bảng lớn nhất của Samsung, sạc máy tính siêu nhỏ là những sản phẩm được đánh giá cao tại triển lãm Hàng điện tử tiêu dùng diễn ra tại Las Vegas (Mỹ) vừa qua.

SEO web du lịch

SEO web du lịch : những kinh nghiệm hay

Làm thế nào để một DN nhỏ có thể Tối ưu website (SEO) lên trang đầu của Google trong thị trường cạnh tranh lớn như Du lịch với một ngân sách hạn chế ? Chắc sẽ có rất nhiều công ty, DN cần giải đáp về đề này. Hôm nay tôi sẽ giup các bạn định hướng cho website của mình để phát triển nó và tìm kiếm những khách hàng tiềm năng trên Máy tìm kiếm Google.

Hướng dẫn ghi đè cho người mới bắt đầu Drupal

Hướng dẫn ghi đè cho người mới bắt đầu Drupal

The problem with many software applications is you can't make them your own. With Drupal, however, you have the option to override how Drupal does things. From altering a form to customizing the way your pages are displayed, Drupal provides options.