Is there a recommended maximum line length for HTML or JavaScript? [closed]
Most style guidelines for most programming languages recommend a maximum line length, typically 80 characters. This seems impractically short for HTML and JavaScript (when it is embedded in HTML). Is there a consensus on a practical line length limit for HTML/JavaScript? Or is it generally left up to the developer's common sense?
Solution 1:
Since you mention JavaScript, this is what Douglas Crockford has to say on the topic:
Avoid lines longer than 80 characters. When a statement will not fit on a single line, it may be necessary to break it. Place the break after an operator, ideally after a comma. A break after an operator decreases the likelihood that a copy-paste error will be masked by semicolon insertion. The next line should be indented 8 spaces.
From: Code Conventions for the JavaScript Programming Language
Solution 2:
This limit seems to be a legacy from ancient IBM punch cards. Why is 80 characters the 'standard' limit for code width?
I really find it hard to work with only 80 characters for HTML. It gets unreadable really fast. So I decided for myself to take the line length on GitHub as measurement.
There seem to be different character limits depending on OS and/or browser. But 120 should be a quite safe value.
On Ubuntu:
- Firefox: 126
- Opera 12.16: 126
- Chromium: 113
On OSX 10.9:
- Google Chrome: 125
- Firefox: 122
- Safari: 121
Source: What is Github's character limit, or line length for viewing files on github?
On the other hand sometimes choosing your own standard doesn't work. Coding standards or linters for your language or framework might force you to stick to 80 characters. Which at least can be really helpful when it comes to reading code on mobile screens.
But for HTML I'd devo rise this number to 120 characters. For the sake of readability. I mean think of all the CSS-class-heavy frameworks like Bootstrap, what would your template look like in the end with only 80 characters line length? (Apart from that you'd better choose Bourbon Neat which won't pollute your HTML with tons of classes.)