4

Although line numbers in code have generally been discussed (for example, in Why are there no line numbers in the code listings?), one issue that has not come up is that the current code block style gives no visual indicator of length.

The problem: When the end of a method aligns with the bottom of the code block frame, users can miss code:

Code Block frame aligned with end of method brace

This can even cause users to request that the OP post code which has already been posted:

A user requests the OP post code that has already been posted

I've seen this issue a few times. Line numbers along the side is not a great solution, mostly since they change as the post gets edited.

This is a bit worse on mobile browsers. When looking at the desktop site on iOS, the speed of your finger determines whether you can scroll in the box. Scroll too quickly on the gray box and the whole page slides up.

Three possible solutions:

  1. Add a header listing the total number of lines at the top (this could at least give you a hint that more content is available). Github does this:

    Github line numbers in header

    One drawback of this is that you only know it means that you should scroll if you know the maximum number of lines in a code block (which may change depending on Stack Exchange site).

  2. Add a scroll indicator in the bottom corner, like so:

    Arrow indicator in bottom right corner of code block

    (This would disappear when scrolling begins.)

  3. Remove the code block "windows" entirely and just show all the code. (This is what the Stack Overflow mobile site does to avoid the issue I mentioned above)

My questions:

  1. Do you think this is worth improving?
  2. If so, which solution do you prefer?
  • Is this with a normal browser on a decent hardware or is this on mobile/apps? – rene Feb 16 '14 at 22:43
  • 6
    I see a scroll bar next to the code block. Doesn't it solve the entire issue? – Guilherme Bernal Feb 16 '14 at 22:45
  • My screen shots are with the newest version of Chrome on the newest version of OS X. The issue may be OS-specific; it exists, at the very least, on iOS and OS X. – Aaron Brager Feb 16 '14 at 22:45

You must log in to answer this question.

Browse other questions tagged .