[RFC] Responsive layout

[johnmurrayus]

Ticket: http://tracker.phpbb.com/browse/PHPBB3-11552
PR: https://github.com/phpbb/phpbb3/pull/1719


This is an alternative to [RFC] Mobile style.

There are several ways to make forum mobile friendly, two of them are:

• Create separate mobile style
• Create responsive layout for existing style

What is responsive layout?

Responsive web design is creating style sheet for existing design that changes the way design looks depending on device and/or screen resolution. You can read long article that explains it here: http://en.wikipedia.org/wiki/Responsive_Web_Design

If you'll browse web, you might find some responsive design examples. Problem is, all of them are applied to simple designs. Forum design is far from simple, so can it be done?

In last few months I have created responsive layout for forum design that is even more complex than prosilver, so yes, it can be done. It is fully functional, including user control panel, moderator control panel, popup windows. You can see it here: http://www.artodia.com/forum/

How to test it if you don't have mobile device? Just change browser window width to smallest possible and see what happens.


Responsive layout vs mobile style

While you can have both responsive layout and mobile style, creating both would be waste of time, so one has to be selected. Both methods have its advantages and disadvantages.

Advantages of mobile style:

• It is faster. Responsive layout is addition to existing style, so mobile browsers get all data that desktop browsers get. Proper mobile style will have only data relevant to mobile layout. Browsers cache images and scripts, so it mostly affects first page load.
• No matter how much forum admin will mess up wrapping forum style into his ancient table driven website layout, mobile layout will work just fine.

Advantages of responsive layout:

• No need to maintain yet another style.
• Style authors will customize it, so forums will look the same on mobile and desktop browsers.
• Browser will automatically use correct CSS rules based on resolution. No need for user agent sniffing. phpBB will not have to include mobile device detection function.

What do you think: responsive design or separate mobile style?

Hi, arty

In recent years, mobile web has changed the scenario of how we previously used to sell or buy online. With tablets and smartphone, the internet of today has revolutionized. In this era, now if you want to convert customers online, make sure that your website performs perfectly on these three channels; smartphone, tablet and desktop.

If we talk about Adaptive or responsive Layout:

As mobile web went mainstream, the adaptive layout became a common mode of web design and development that enabled a website to serve to mobile and tablet visitors. However, this technique was more complex when building a website from scratch. This is the reason most of the business owners choose adaptive technique only to retrofit an existing normal website for mobile.

In Adaptive layout technique, developers used to target commonly three resolution viewports to retrofit a website. This process also involved pre-designing analytics to track down which resolutions gave a larger number of visitors to a website. This allowed the error free completion of development on every viewport.

[Khaos-Rage]

Well as you can see by this site, and by the date of that quote this is old. phpBB's prosilver is responsive.