67
\$\begingroup\$

It's a somewhat common habit at RPG.se to use bold sentences to make the appearance of a header for a section of text, rather than using our existing header formatting. This is probably because it's a common hack elsewhere on the Internet where heading formatting isn't available, and because the button in the editor for bold is more obvious than the button for a heading.

The problem

This habit causes problems though, and is so easily avoided.

The Internet in general has many visually-impaired users, and we're no exception — we know of a number of site members who have said they are visually impaired. Visually impaired users commonly use one or more of a variety of accessibility software to navigate a question and its answers, and to have the part of interest read aloud. The problem with bold sentences used to make fake headers is twofold:

  1. They aren't recognised as headings, so they can't be used for assisted navigation.
  2. They aren't read aloud as headings, making it harder to figure out what the text is supposed to mean when read aloud.
\$\endgroup\$
  • \$\begingroup\$ Seeing as we are using a Q&A format, should the solution to this problem (i.e. 'The Fix' and onwards) be moved to an answer? Having our accepted solution as an answer should save Community-friend from bumping it if nothing else. \$\endgroup\$ – Someone_Evil Nov 4 at 15:36
  • \$\begingroup\$ @Someone_Evil Probably! The guidance for the main SE FAQ is to frame them as a question, and I added that to our own FAQ index at some point, but we had a lot of older [faq] metas that hadn’t been written that way. It wasn’t high on the list of priorities to change them then. \$\endgroup\$ – SevenSidedDie Nov 4 at 15:49
  • \$\begingroup\$ I went ahead and made that change. If we could now get upvotes/accept mark so it shows at the top that would be lovely. (If this was out of line, please inform and/or revert) \$\endgroup\$ – Someone_Evil Nov 8 at 11:27
  • \$\begingroup\$ @Someone_Evil Thank you! \$\endgroup\$ – SevenSidedDie Nov 8 at 14:55
8
\$\begingroup\$

The fix

Fake headers are easily fixed. When you want to make a header, there are three ways to create one:

  • Click the Heading editor button:

    A screenshot of the editor toolbar. The Heading button is a stack of five horizontal lines that alternate between short and wide lines, the first two black and the last three grey, visually representing a paragraph with a heavier header on top. The button is picked out with a red freehand circle around it.

  • Select the heading text and type ctrlh.

  • Manually type the Markdown code for a header, which is either an underline made from dashes or equal signs, or one to three hash marks in front of or surrounding it (“or”, because the trailing ones are optional).

    The exact symbol used defines the logical level (and visual size) of the resulting heading:

    # Level 1 heading #
    
    ## Level 2 heading ##
    
    ### Level 3 heading ###
    
    ### No hashes at the end is also OK for any heading level
    
    Level 1 heading
    ===============
    
    Level 2 heading
    ---------------
    

If you have existing fake headings, the easiest fix is to edit the post and replace the ** around the fake headings with ##.

It's not just for human accessibility

This isn't just a matter of accessibility to visually-impaired humans either, it's a matter of accessibility to computers in general. The more we use correct formatting, the more the meaning and structure of the contents is reflected in the HTML of the post. This makes for more useful material for future uses that we might not yet have imagined.

And in the meantime, making our site less annoying to use for visually-impaired members, by avoiding easily-avoided formatting errors, is worthwhile all by itself.

What about bolding the leading sentence, thesis statement, or question summary?

That's fine! That's not a header, that's just a sentence being emphasised due to its importance in the answer, question, or paragraph. That's what our bold formatting is for. In fact, marking it as bold will correctly indicate that it's not supposed to be understood as a section header, improving meaning and accessibility. Using section heading formatting is only recommended for things that are actually section headings.

\$\endgroup\$
1
\$\begingroup\$

Be careful with level 1 headers

The title of the question is an H1 (source: I just checked), and the entire question should be subordinate to ("below") the title. If the question contains a separate H1 in its body text, then this semantic relationship will fail. Putting an H1 at the top of an answer is not necessarily wrong, since the answer is a separate object from the question. But if your answer contains an H1 and my answer does not, the semantic outline could get really messed up (read: my answer shows up as subordinate to your answer), so H1s should probably be avoided in answers as well.

\$\endgroup\$
  • 7
    \$\begingroup\$ I totally disagree. Question titles are differentiated enough—and answers are differentiated from the question and other answers enough—to make using headers of any size totally okay pretty much anywhere that a good eye for layout wants them. If the site were pure text, I'd probably agree, but with all the site's bells, whistles, lines, colors, and other indicators, there's no reason to be stingy with headers because of logic when the headers make a question or answer easier to grasp. \$\endgroup\$ – Hey I Can Chan Aug 29 '16 at 8:29
  • 2
    \$\begingroup\$ But its not just about whether it looks good to the eye. It's about logical consistency of the element types and whether the structure plays well with current and future technologies that make use of that structure \$\endgroup\$ – Wibbs Aug 29 '16 at 9:00
  • 5
    \$\begingroup\$ @Wibbs I'm not saying Just do whatever! or Be a bad person and use boldfaced for headers anyway! but, instead, saying to use the tools as they appear intended to be used. If I'm understanding this answer correctly, it's advocating not using H1 because the question's title uses H1 (in red and not indented at the page's top) so everything else should logically be less than H1. The site goes to great lengths to make it so no one mistakes one dude's answer for another's or an answer for a question without needing an H1 ban, too! \$\endgroup\$ – Hey I Can Chan Aug 29 '16 at 9:24

You must log in to answer this question.

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