[RFC] Define max-width for prosilver

These requests for comments/change have lead to an implemented feature that has been successfully merged into the 3.1/Ascraeus branch. Everything listed in this forum will be available in phpBB 3.1.
Locked
User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

Re: Define max-width for prosilver

Post by callumacrae »

nextgen wrote:Have you thought as you will see on mobile devices?
Before you can modify something should also make modifications to the responsive style.
It's a max-width, not a width. It won't affect the mobile style.
Made by developers, for developers!
My blog

User avatar
nextgen
Registered User
Posts: 128
Joined: Sat Jul 24, 2010 4:59 am
Location: Guatemala
Contact:

Re: Define max-width for prosilver

Post by nextgen »

Thanks Callum
*Imagine a signature super spectacular.*

User avatar
Crizzo
Translations & International Support Teams Manager
Translations & International Support Teams Manager
Posts: 27
Joined: Sun Jul 14, 2013 11:57 am

Re: Define max-width for prosilver

Post by Crizzo »

I really don't like the idea, maybe it is already to late, but just my 2 cents to this topic:

Let me abstract, what "we" did in phpBB 3.x so fare:
- we created great css/html code with has no max-width and fits to big screens
- we created a good responsive modus, so everyone with a small display, a tablet or a smartphone can view and use the board in best performance.

So far.

Now, you are suggesting that we should limit the board to a max-width (value of pixel-width does not matter) and remove out of the box the possibility to expand the board to a FullHD or even bigger screen. So the desktop user with a big resolution will have not the same fancy behaviour, like the guys with small smartphone resolutions. Why should we want this? Does anybody need the big free, white/grey space left and right to the board for some notes or why should we do this? If i have a FullHD screen (and for godsake i have) then i will use it, like i will. So big board over 1920px or browser over 1200px and some chatting windows on the other 720px.

Then you might say: "Nobody can read those *beep* long lines, no book is print that way!" That might be right. But what if i increase the letter size to compensate my amblyopia and get really few words in a line or i don't care how books are printed and i want those *beep* long lines! There a many reasons to use bigger browser-viewports than the max-width that anyone of us can image and code into phpbb. We don't know, i don't know, you don't know.

But leave the decision to me/us/the reader of our boards, pls!

PS: I'm aware, that i can change in my style what ever i want and kick out the "max-width". But out-of-the-box phpBB should not say to any user, how they have to read and post and see the board.

PPS: Thank you for reading.

mrgtb
Registered User
Posts: 221
Joined: Wed Nov 28, 2007 10:09 pm

Re: Define max-width for prosilver

Post by mrgtb »

VSE wrote:Late to the party. But going max width without addressing the surroundings is a design oversight. Here are some options that provide content borders with reduced contrast to the background for less eye strain.

One has inset shadows to give it some pop and depth, the other is flat. (These were made in a rush so ignore the flaws at the very top of them)
Screen Shot 2014-06-24 at 11.15.45 AM.png

Code: Select all

html, body {
	min-height: 100%;
	background: #e8e8e8;
}

#wrap {
	margin: 10px auto;
	padding: 12px;
	max-width: 1080px;
	border-style: solid;
	border-width: 1px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border-color: #a0a0a0;
	background: #fff;
	-webkit-box-shadow: inset 0 -10px 15px #e0e0e0, 0 0 3px #a0a0a0;
	-moz-box-shadow: inset 0 -10px 15px #e0e0e0, 0 0 3px #a0a0a0;
	box-shadow: inset 0 -10px 15px #e0e0e0, 0 0 3px #a0a0a0;
}
Screen Shot 2014-06-24 at 11.20.51 AM.png

Code: Select all

html, body {
	min-height: 100%;
	background: #e8e8e8;
}

#wrap {
	margin: 10px auto;
	padding: 12px;
	max-width: 1080px;
	border-style: solid;
	border-width: 1px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border-color: #a0a0a0;
	background: #fff;
}
I've made a few large changes on my forum to make ProSilver look different in many areas, in some cases matching up style look on forum home listings and thread listings. You can read this thread on my site that documents all changes I've made if interested in seeing what I've done to try and improve the look of ProSilver theme.

Members list, online list, thread listings and topic listings all use same white hover colour. Thread listings and topic listings now use same "cat image" style look, rather than looking different. Font size/style has been changed for writing and reading topics.

User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

Re: Define max-width for prosilver

Post by callumacrae »

Crizzo wrote: - we created great css/html code with has no max-width and fits to big screens
We really didn't.
Crizzo wrote: So the desktop user with a big resolution will have not the same fancy behaviour
Not being able to read text properly is not fancy behaviour. I suggest doing some research on usability and user experience before chipping in on a debate on it: check out this article for starters.
Crizzo wrote: But what if i increase the letter size to compensate my amblyopia and get really few words in a line
Again, you're completely wrong. CSS pixels aren't the same as actual pixels, and zooming in will make the design wider. Allowing wide designs is bad user experience; they shouldn't have to change the width of their browser to be able to read the text on a page.
Made by developers, for developers!
My blog

User avatar
MattF
Extension Customisations
Extension Customisations
Posts: 675
Joined: Mon Mar 08, 2010 9:18 am

Re: Define max-width for prosilver

Post by MattF »

callumacrae wrote:check out this article for starters.
Great, now I wish I could redesign my previous website!!! :oops:
Has an irascible disposition.

User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

Re: Define max-width for prosilver

Post by callumacrae »

VSE wrote:
callumacrae wrote:check out this article for starters.
Great, now I wish I could redesign my previous website!!! :oops:
Don't take it as gospel, not many sites are that narrow. Sure, it's easy to read, but it's tricky to make it look good.

For reference, on my 1080p monitor (not that big, these days), phpBB allows about 170 characters per line when full screen. This pretty much makes big blocks of text unreadable (which of course, we're all used to. We use paragraphs.)
Made by developers, for developers!
My blog

User avatar
Crizzo
Translations & International Support Teams Manager
Translations & International Support Teams Manager
Posts: 27
Joined: Sun Jul 14, 2013 11:57 am

Re: Define max-width for prosilver

Post by Crizzo »

callumacrae wrote:Not being able to read text properly is not fancy behaviour.
That is not the point. I just want to let the choice to the user. I can read long lines and i do. Some don't. So you think 170 long, so everyone should not have a line longer than 100, why? If i will, i should be able to. If not, i can reduce the width of my browser. But what i'm not able to, speaking as a non developer, increase the width and get my long lines again, if i want them.
I suggest doing some research on usability and user experience before chipping in on a debate on it: check out this article for starters.
I'm on t his topic for about 8 years. Tried many things: em width, small, big, columns, big size, good line-height etc.

But i'm on the conclusion, that i give the reader of my webpages the choice how long and wide the page is.

So don't be so arrogant if my opinion does not fit to yours. ;)
callumacrae wrote:Again, you're completely wrong. CSS pixels aren't the same as actual pixels, and zooming in will make the design wider. Allowing wide designs is bad user experience;
I'm not talking about "zoom", i mean "increase the letter-size" with a browser standard function.
callumacrae wrote:they shouldn't have to change the width of their browser to be able to read the text on a page.
Exactly. They should be able to do this, not you should think for them. Or do you think most of the fullscreen-browser-user need the empty space to the left and right of the website for some paper-post-its? I don't think so. Who uses the fullscreen, wants the fullscreen. There was a nice debate at: http://www.computerbase.de/ when they forced the mainpage to 960px, for advertising reasons. The board was changed to a wide-functionallity again, after many users were complaining. Maybe we need this, to do what we should here in phpBB. ;)

User avatar
Louis7777
Registered User
Posts: 394
Joined: Fri Apr 04, 2014 12:32 am

Re: Define max-width for prosilver

Post by Louis7777 »

Crizzo wrote:
callumacrae wrote:they shouldn't have to change the width of their browser to be able to read the text on a page.
Exactly. They should be able to do this, not you should think for them. Or do you think most of the fullscreen-browser-user need the empty space to the left and right of the website for some paper-post-its? I don't think so. Who uses the fullscreen, wants the fullscreen.
I agree.

And in any case, if you guys want a max-width, why should it be a fixed value in pixels?

How about max-width: 75%; (i.e. use 3/4 of the screen)?

User avatar
A_Jelly_Doughnut
Registered User
Posts: 1780
Joined: Wed Jun 04, 2003 4:23 pm

Re: Define max-width for prosilver

Post by A_Jelly_Doughnut »

Crizzo wrote:
callumacrae wrote:they shouldn't have to change the width of their browser to be able to read the text on a page.
Exactly. They should be able to do this, not you should think for them. Or do you think most of the fullscreen-browser-user need the empty space to the left and right of the website for some paper-post-its? I don't think so. Who uses the fullscreen, wants the fullscreen. There was a nice debate at: http://www.computerbase.de/ when they forced the mainpage to 960px, for advertising reasons. The board was changed to a wide-functionallity again, after many users were complaining. Maybe we need this, to do what we should here in phpBB. ;)
I certainly don't wish to resize my browser window for every site I visit. My browser is full-screen at 1792px, and I expect sites to work at that width. Most achieve this by
a) being fixed-width
b) having a max-width
c) adding extra columns/advertisements on wider screens

I would posit that on my 1792px screen, phpBB only barely works due to the extremely long lines. On my 1920px screen at work, it doesn't work at all (although I don't usually browse full-screen there). Using the browser's zoom function creates unpleasing artifacts, especially with font smoothing and images that get zoomed in. Furthermore, using the 110% zoom removes only two words from the end of the line (as measured while previewing the paragraph you're currently reading).

It seems to me that only (b) is plausible for phpBB, and I will certainly use such when I upgrade my site to 3.1. What the distribution does is not a grave concern to me, but I personally would choose unused whitespace over horizontal walls of text.

EDITED to add: this has been a concern for a while, since prosilver in 3.0 was also fluid width, in an era where 1280px was a wide screen. But this is the first time I recall someone proposing a change to that.
A_Jelly_Doughnut

Locked