8

I understand, from reading other Meta questions on this topic, that the StackOverflow administrators have good reasons for keeping the site to a fixed-width layout. However, one disadvantage of this layout that regularly frustrates me is the poor readability it imposes on code snippets. Horizontal scroll bars are a terrible thing, especially when trying to read code, when I often need to see both ends of the text at once (as opposed to letting my view flow from the end of one line to the beginning of the next). And unless the author of a StackOverflow post has been very careful to cut their code down to 80 characters per line, code blocks nearly always have horizontal scroll bars because the fixed width of the post column is so narrow.

The horizontal scroll bars are even more frustrating when I consider that I have a nice big 1920x1080 monitor that can easily display 256-character lines in my IDE, and yet I'm forced to view the code in a tiny window with scroll bars, surrounded by empty space.

Sure, I know that 80 characters is a standard width for formatting code, and StackOverflow is trying to discourage posting huge chunks of code, but some code snippets simply can't conform to that width even when reasonably-sized. In particular, code in Java, C#, and Objective-C tends to force the scroll bars to appear simply because standard type names, identifiers, and function signatures are very verbose.

Since most people these days have a wider monitor than the 1024-pixel width the StackOverflow layout was designed for, can the site somehow enable code snippets to use more of this width when the user desires it? Possibilities include:

  • Code blocks can "pop out" into a separate, resizeable browser window
  • Code blocks can temporarily (either with a toggle button or on-hover) expand dynamically to fill the width of the screen, pushing sidebar content out of the way if necessary
  • The user can reduce the font size of text in code blocks relative to other text on the site (this would allow more characters to fit in the same fixed-width column, and the user could then zoom-in the page to maintain the same effective text size).
  • The site has both the standard fixed width layout and a "wide" fixed width layout, where the "wide" layout is designed for at least 1440-pixel screen widths (yes, this is a much more heavy-weight solution).

EDIT:

I do not think this is a duplicate of View code in new window because that question is a request for one particular solution to this problem. I'm making a more general request for any solution to the problem, even if it isn't specifically "viewing code snippets in a new window."

Improve this question
5

1 Answer 1

Reset to default
6

I edit a LOT of posts primarily to remove unnecessary horizontal scrollbars from code samples. It's not that hard to format code for a vertical layout; most people are just too lazy or indifferent to do so.

Also, as I use mobile more and more, making the code snippets even wider is not going to be very productive. As it is I have a very difficult time scrolling because the user or editor made it fit into the fixed space in a regular browser window, not thinking about how it would render on a mobile browser, or even a shrunken tablet-based "regular" browser.

Seriously, if you double the width of the code window, people will still continue to post horrible code samples devoid of any thought to carriage returns, skinny monitors or, quite frankly, any sort of readability at all. The real solution is to have people put a little more thought into the code samples they post, and there isn't a technical way to do that. There probably isn't a non-technical way to do that, either; these are the same people that publish code in their own environments with little or no thought put to formatting or readability.

Improve this answer
15
  • Nice summary, my reading: Little or no thought put to formatting or readability, or just too lazy or indifferent to do so.
    – brasofilo
    Jul 9, 2013 at 2:52
  • I would think that a fair number of people posting wide code don't even think about mobile since they are posting from a computer. Perhaps a warning message explaining why it is better to post code that fits in the box if it is too wide would help inform people.
    – lnafziger
    Jul 9, 2013 at 3:24
  • 1
    @lnafziger warning aside (which will also be discarded as an annoyance and probably difficult to implement) but do you think they are more likely to think about it if you make the code area wider or make it customizable? There will still be people with skinnier monitors than them (or with different options if customizable), even if you completely forget about mobile.
    – Aaron Bertrand Staff
    Jul 9, 2013 at 3:28
  • I was actually agreeing with you, and offering a possibility to help with the problem as it is.... So no, I don't think that it will help if you make the code area wider. :) (After reading your answer, it helped me to reconsider my original support of the idea.)
    – lnafziger
    Jul 9, 2013 at 3:29
  • @lnafziger right, I'm saying that even with the warning, if people on a big monitor are putting code in a wide code area and it looks fine to them on their big monitor, they'll dismiss the warning because "works on my machine."
    – Aaron Bertrand Staff
    Jul 9, 2013 at 3:31
  • I would think that at least some of them would pause and say "hey, that would be nice..." and fix it, especially if it was past 80 characters and they had to scroll on their monitor (no matter how big it is).
    – lnafziger
    Jul 9, 2013 at 3:32
  • This answer is very naive, and ranty. I go to a lot of trouble to format my code nicely, but it is sometimes better to use more than 80 characters. I suspect you write ugly code :)
    – Carl Smith
    Jul 9, 2013 at 17:24
  • @Carl how is it naïve? And are you saying that scrolling horizontally is somehow better than scrolling vertically?
    – Aaron Bertrand Staff
    Jul 9, 2013 at 17:26
  • 2
    Nope. I'm saying using more than 80 chars, like GitHub Gists allow for, is normal, and it does not mean that people format their code badly at all. I'm suggesting allowing more chars on the site, not going around editing other people's code because the site is too narrow to display it nicely.
    – Carl Smith
    Jul 9, 2013 at 17:31
  • @CarlSmith unfortunately we are limited on this network by other factors than whether you like longer lines of code or not.
    – Aaron Bertrand Staff
    Jul 9, 2013 at 17:32
  • 1
    It's not a case of like, so much as need, insofar as I need my code to read as easily as possible.
    – Carl Smith
    Jul 9, 2013 at 17:34
  • @CarlSmith well I don't know what kind of code you write or how much need is actually relevant on a volunteer site where you're reading other people's code for the most part, but if you think carriage returns make code less readable I'm afraid you're going to be in the minority in a lot of circles.
    – Aaron Bertrand Staff
    Jul 9, 2013 at 17:35
  • What's wrong with a button to open the code in a pop out? Surely this would be an easy feature to add, and has no effect on the existing CSS. Some method names in PyObjC are more than 80 characters. I'm pretty sure a newline in a method name will suck.
    – Carl Smith
    Jul 9, 2013 at 17:36
  • @Carl I replied about that on the other question.
    – Aaron Bertrand Staff
    Jul 9, 2013 at 17:37
  • let us continue this discussion in chat
    – Carl Smith
    Jul 9, 2013 at 17:38

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .