Quote:
Originally Posted by Turtle91
I think that came around when the external css stylesheet made its debut in '96. The idea is that all styling goes on the stylesheet and then you only need to reference what style you need. "Naked tags", at the time, would be the 'old way' and therefore 'bad'.
As is normal when a new process gets started, zealots will push it HARD. So a naked tag <p> would be wrong, where a <p class="normal-paragraph"> would be more 'proper'. That is also the time when a lot of these software suites were created...like InDesign in '99... They put classes on everything!
As is also normal after a few years of getting used to a new process, fixes are made and a new balance point is found. Except the software had already been written, and it works, so why spend the money to change it?
A 'normal paragraph' is what makes up 98.7% of a chapter. Why have <p class="normal-paragraph"> when it is easier just to have that as a naked tag <p>?? When cleaning up a book's code, that is what I consider 'low hanging fruit', easy to fix, and makes a big improvement in readability.
Spoiler:
Which one is cleaner and easier to read/edit?
Code:
<p style="text-indent:1.2em; text-align:left; font-weight:normal; font-size:1em; ">This is a normal paragraph.</p>
<p style="text-indent:1.2em; text-align:left; font-weight:normal; font-size:1em; ">This is a normal paragraph.</p>
<p style="text-indent:1.2em; text-align:left; font-weight:normal; font-size:1em; font-style:italic; text-decoration:underline; color:red">This is a red, underlined, italic paragraph.</p>
<p style="text-indent:1.2em; text-align:left; font-weight:normal; font-size:1em; ">This is a normal paragraph.</p>
<p style="text-indent:1.2em; text-align:left; font-weight:normal; font-size:1em; ">This is a normal paragraph.</p>
-OR-
Code:
css:
p.normal-paragraph {text-indent:1.2em; text-align:left; font-weight:normal; font-size:1em;}
p.red {color:red}
p.underline {underline}
p.italic {italic}
html:
<p class="normal-paragraph">This is a normal paragraph.</p>
<p class="normal-paragraph">This is a normal paragraph.</p>
<p class="normal-paragraph red italic underline">This is a red, underlined, italic paragraph.</p>
<p class="normal-paragraph">This is a normal paragraph.</p>
<p class="normal-paragraph">This is a normal paragraph.</p>
-OR-
Code:
css:
p {text-indent:1.2em; text-align:left; font-weight:normal; font-size:1em;}
p.emphasized {font-style:italic; text-decoration:underline; color:red}
html:
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p class="emphasized">This is an emphasized paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
|
The third example is much easier to read. But one thing needs to be done to keep it simple The text-align: left, font-weight: normal, and font-size:: 1em all have to go. They are excess code.