On the use of <Blockquote> <pre> and <tt> tags
Disclaimer
I'm no code purist. In fact, I barely know enough HTML to build an E2 writeup and have no idea how to create a CSS page from scratch. No doubt this will become obvious in the paragraphs below.
I feel this should be tackled by those who know, but I'm not sure it is being tackled, so I'm putting this up as a reminder.
Background
I've recently been experimenting with the layout of my writeups. I tried something which seems to have stirred a hornet's nest. Well, more of a nest of some small, not very threatening buzzy things.
After coming close to an argument, I am now a convert. With such a conversion comes zealotry. Let me explain my new over-zealous approach to the use of HTML tags on E2, and why it is important.
Use of the <Blockquote> tag
<Blockquote> is designed for use when quoting large blocks of text. Most browsers render it as an indent. The result is that some unscrupulous/lazy/ignorant web authors use the blockquote tag as a way to implement an indent as part of an 'enhanced' layout. See also blockquote
Use of the <pre> and <tt> tags
Both <pre> and <tt> tags present the enclosed text in monospace font, so that the letter 'M' occupies the same space on a line as the 'i' character. This is helpful when layout and alignment of letters is important, such as in ASCII art and sometimes in poetry. See also pre
The main difference between the two is that <tt> works on individual characters within a paragraph, while the <pre> tag works only on full paragraphs.
Less well-known tags such as <kbd> and <code> work in the same way as <tt>.
Tags, zen, stylesheets and appearance
This site is in the final stages of converting guest user and the default layout to a zen style sheet. See here for clarification.
If you are one of those users who frequently uses any of the tags mentioned above, this change will have a significant influence on how your writeups are displayed.
If you take nothing else away from this piece, take this:
The author is not in a position to specify how blocks of text will appear. Once the zen stylesheets are in place, that function will be driven entirely* by the stylesheet in use by a particular user.
* The one exception to this rule is through use of monospaced text such as <pre> and <tt> tags to permit accurate alignment of characters from line to line — see below.
Users of the <tt> and <pre> tags take note
There is a little-known bug in Firefox which makes the text within any of those monospaced tags appear smaller than the normal font*. It is a relatively easy bug to fix, but it has to be done within each and every stylesheet. Some stylesheet authors have already fixed the bug, at least for the <pre> tag. None of them (so far as I can tell) has yet fixed the bug for all the monospaced tags.
Thus, any writeup which uses those tags is likely to appear in illegibly small fonts both to guest user, and to those employing the default style sheet.
*I know nothing about it, but Sam512 told me, "By default, Firefox styles fixed-width fonts as 13pt instead of 16pt for everything else. I have no idea why it does this."
I am sure that the powers that be will take this into account before the final default zen sheet is signed off, but in the mean time, it may be helpful for users of those tags to be aware of this limitation. Those authors who feel the appearance of their writeups is important, might consider checking how their work appears under various different themes across different browsers.
Even after the default style sheet takes this bug into account, some people will continue to use style sheets which do not use the bug fixes. For these, our monospace-loving poets risk having their poems rendered illegibly small in Firefox browsers.
My guess is that the majority of E2 users prefer Firefox over Internet Explorer, Safari, Opera or any other browser.
An intelligent author might propose to use doubled <big> tags around any monospaced text. This might be a work-around if all style sheets and authors ignored the bug, but it has the unfortunate side-effect that correctly set-up stylesheets and browsers are likely to display the text in a large font. Astute observers may notice that I did this earlier in this essay.
Using blockquotes for extra space.
I have done this in the past, and felt it looked good when viewed in the Jukka theme used by guest user. I know plenty of people who continue to do it. Here is an example of bad practice. It's a great writeup and looks good in Jukka, but in other themes designed to make this site look good, it looks just a bit silly. In my new role as convert-apologist, I have to say, big and bold, for when the Zen theme is implemented on guest user,
Don't use Blockquotes to indent the whole writeup.
Please.
Just as the poets who use <pre> tags risk having their text displayed too small in some browsers and too big in others, users of the <blockquote> tag risk messing up perfectly good layouts as seen by the users of the soon-to-be-default theme.
Attempting to fix a perceived problem in one stylesheet or browser is likely to create problems for those using a different stylesheet or browser.
Obviously, if you are quoting something and want to use the blockquote tag for the purpose intended, then that remains not only acceptable, but desireable.
The answer is to get the stylesheet design right, and then the layout of each writeup will take care of itself.
In summary
- Can stylesheet designers please ensure that Firefox renders monospaced text correctly
- Can E2 authors please understand that using HTML to deliver a layout effect in their particular browser causes problems for other people using properly set-up browser and style sheets.
Thank you. Overzealous rant is at an end.