4

I've been using <blockquote>, <q>, and <cite> for formatting scripture quotes and references, but I'm wondering if there's a more proper way.

There are 3 typical kinds of Biblical references I've run into: block quotes, inline quotes, and references (aka "chapter & verse" references). Here's how I've been formatting each one:

Blockquotes

<blockquote class="scripture">
    <p>Then God said, <q>Let there be light,</q> and there was light.</p>
    <cite>Genesis 1:3</cite>
</blockquote>

Inline Quotes

<p>As it says in the Bible, <q class="scripture">God said, <q>Let there be light,</q></q> (<cite>Genesis 1:3</cite>) and it just happened.</p>

Scripture References

<p>The account of creation is listed in <cite class="scripture">Genesis 1</cite>.</p>

So my question is, are these the most appropriate HTML tags to be using in these scenarios? I'm pretty sure <blockquote> and <q> tags are fine, but I'm less sure about the usage of the <cite> tag. Being an inline element, can it be used as a direct descendant of a <blockquote>, or should it be encased in another tag of some sort?

FWIW, the reasons I have been using <p> tags inside of <blockquote>s is so I can get proper and automatic quote styling and nesting (regardless of the language of the scripture quote, too).

Sandwich
  • 475
  • 1
  • 8
  • 16
  • 2
    I think this is a tad subjective. I'm not sure that there is a "right" way or "most appropriate" way. – David Feb 22 '13 at 14:09
  • @DavidStratton You could even say it's the sort of thing that could lead to a *cough* religous argument *cough*. – RB. Feb 22 '13 at 14:09
  • 1
    You know, I'm not sure there is a StackExchange site that is appropriate for this question, but if you want to get opinions from programmers that also happen to be Christians (and therefore care about Biblical references), go to the Christianity.stackexchange.com site and ask something like this in ***chat*** (not on the main site, and not in Meta) I can't go to that site from work (non-work use and all) but the main chat room is called "The Upper Room". I'd wager that some of the regulars there would have helpful opinions. – David Feb 22 '13 at 14:28

1 Answers1

3

Formatting for the scriptural references depends on your personal preference in how you want it displayed, but to display it in a professional-looking manner without requiring special CSS, I believe a structure like this is the better choice:

John 6:5,10:

  1. When Jesus looked up and saw a great crowd coming toward him, he said to Philip, “Where shall we buy bread for these people to eat?”

  1. Jesus said, “Have the people sit down.” There was plenty of grass in that place, and they sat down (about five thousand men were there).

To achieve this, you can use an ordered list with custom numbering, as described at "Is it possible to specify a starting number for an ordered list?".

If the verses to be cited are consecutive, you just need to use the start attribute on the ol start-tag:

<h2>John 1:5,6,7</h2>    
<ol start="5">
  <li>passage here</li>
  <li>passage here</li>
  <li>passage here</li>
</ol>

If they are non-consecutive, you can use the value attribute on each li start-tag:

<h2>John 1:5,9,13</h2>
<ol>
<li value="5">passage here</li>
<li value="9">passage here</li>
<li value="13">passage here</li>
</ol>

This will cause the list items to take the values set for each of them.

You can wrap the above with a <blockquote></blockquote> tags if you want. You can also style the ordered list anyway you want with CSS.

With these attributes, you avert unneeded CSS styling.

Community
  • 1
  • 1
Mark2090
  • 143
  • 1
  • 8
  • 1
    That's an interesting approach; I hadn't thought of using ordered lists to get verse numbering. Similarly, one could also use CSS counters to achieve some interesting results. – Sandwich Jun 19 '16 at 11:56