Alex K wrote
I don't like the idea of hiding features based on what device you're on. I also am absolutely disgusted by the idea of a UI that reshapes and jumps around based on width. An example is apple's home page:
http://www.apple.com/ This is my experience with responsive design. I think phone needs a separate UI but I'm not sure if tablet does. There should be some way to recognize device or switch to manual mode if on phone. I don't like the idea of being able to morph into a phone version of website just by shortening width.
The Apple site home page (as I see it at the moment - no idea how long it will remain that way) on wide screens shows an image beside some text with a row of four large "buttons" below, beneath which is a site map. On narrower screens the image moves above the text and the buttons re-flow to a 2x2 block. Narrower still and the image and text become smaller and the full site map becomes a menu. Then in the final stage the buttons change to a rectangular shape in a single column.
It seems to me we have at least two issues here and perhaps some confusion with both.
1. The difference in requirements of a highly graphical site (like the Apple one) and a text-based site, like a forum.
2. Our expectations of how users might work with a forum on their device.
In my (fairly wide) experience (as a retired IT trainer) the typical user (I've watched a good many) always works with windows maximised whether on a netbook, laptop or desktop with a large high definition screen.
When working with text, even those users with large screens who do use multiple windows will tend to set windows at a size where a line of text doesn't exceed 10-12 words - the optimum for reading and never vary them in size much, but will minimise and restore them or drag them around the screen (in order to refer to other documents, perhaps to cut and paste from them).
So I would argue that the typical user will never be confronted with a screen that jumps about as, by and large, users don't constantly resize windows but rather set them once and thereafter work with them at their existing size. In short, the aspect of "responsive design" that you describe need not be a concern as it affects only we computer geeks and other more specialist users who, these days, should be prepared for such jiggling about (It's no worse than that which we used to experience in pre-wifi and pre-broadband days when a web designer would fail to specify the size of an image so page content would re-flow as the browser realised it needed to accommodate an image which now turns out to be bigger than assumed).
However, many users will use both phone and larger screens and site layout should be functionally recognisable from one device to another in spite of obvious differences caused by the difference in viewport size. I don't think that this should be a major problem on a text based site although, I accept, it could be on a more graphical site.
The conventional advice is to design for the small screen first, because generally that can only cope with a single column of content while coding in a way that allows styling to move content alongside the primary content on wider screens.
The corollary of this is that if all content that is normally displayed on a large screen is to be displayed on a phone's screen in a single column it will become excessively long and require much scrolling. The only practical solution is to reduce any page to little more than headings (similar to the Apple site's site map) and only reveal further content on request by tapping a heading or menu item.
While you may not like the effect responsive web design works when re-sizing windows, ask yourself why so many of the of the big players on the web also produce their own apps for phones, which, by and large, just echo what their web sites do. Some may leave out features of their web site that are simply impractical on a small screen. Others will add features lacking on their web site that are appropriate for people on the move. However, what they all have in common is a version of their web site that works well on a small screen. Is what you are really saying is that we should ignore responsive design and produce a web site for large screens and a dedicated app for small ones?
One further thing I'll add as it's related to responsiveness...
At my age my eyes are not what they once were. I hate the small text and poor contrast found on so many sites. It makes reading difficult. I hate sites that code text size in pixels. The main body text should always be 1em so that the visitor needs make no special adjustment on a site by site basis to make the site readable for them. Forum's seem especially prone to such coding. I find myself regularly using my desktop browser's magnify feature - with the almost invariable result that the designer's intended layout goes to pot, with content wrapping in unexpected ways.
As a result I would be quite happy to see the main body of a forum home page reduced to a list of sub-forums on initial display, with a button/zone to the right that displays all the other stuff (e.g. trending/popular topics icon, fuller description, moderator names, number of topics, number of posts, most recent poster, likes, date and time of most recent post.)
But whatever the final decision the issue comes down to how much of the information that you see on the widest screens has to appear of small screens in order to avoid excessive scrolling on those small screens, while keeping text legible and links able to be tapped easily.
On the sites I code these days, which mainly feature text rather than graphical content, I don't go as far as four stages of responsiveness as used by Apple and recommended in fschmidt's link. I stick with two, and that seems to work for my sites and the devices that I have tested. Maybe that's all that's needed for Blasma?
Oops! That's turned out longer than I intended!
-----
P.S. Just looked at some of fschmidt's sample forums. In terms of responsiveness I rate:
https://lumineboreali.net/as pretty near perfect, although in coding terms I don't like the inappropriate use of some tags and the excess of <div>s and
s when better semantic tags are available.
http://www.happierabroad.com/forum/index.php
is almost as good in terms of responsiveness and it uses definition and unordered lists for most of its code which is much to be preferred.
Locked
