Accessibility question

[starwatcher]

I will soon be moving my fanfic to Archive of Our Own, and to a Dreamwidth fic-site. When moving the fics, I'd like to ensure that my code is accessible for screen-readers. I know some things, but have questions about others. I asked the questions in a post at my Studio, but have had no responses; apparently no one in my reading circle uses a screen-reader.

If you do, I'd appreciate it if you could drop by and educate me. Or perhaps point me toward a site that has the answers. Feel free to pass the link on to anyone who might know the answers. After I've learned what I need to know, I'll make a new post to share with my friends, and anyone else who needs or wants the information.

Thank you.

Comments

[pne]

Are you saying that <cite will italicize on the page without spoken emphasis? Cool! That'll be much easier for me to remember (and code) than the <span code that another commenter suggested.

I thought you were going to use semantic mark-up?

Please don't go back to 1990's HTML coding where people used whichever tag got them the appearance they wanted, regardless of what the tag was supposed to mean!

Use the tag that describes what you're doing.

But what's the difference between <q> and <cite>?

"q" is for quotations; "cite" is for citations or references to other sources (links are to the HTML specification).

"q" is easy enough to understand: you can use it to indicate that something is a quotation from somewhere else. (You can even indicate the source URL if you want: Joe Smith said, <q cite="http://www.example.com/page.html">I could do with a beer</q>.) It's an inline element, so it's probably better for shorter quotations.

Longer ones (a paragraph or more) are probably better expressed with "blockquote" (which also has the optional "cite" attribute if you want to provide a source URL). That one's a block-level element, so you can wrap one or more "p" elements inside it.

Note that some browsers (e.g. Opera), but not all, enclose "q" quotations in quotation marks -- so if you add quotation marks yourself, you'll have two pairs in some browsers, but if you leave them out, then browsers which don't add quotation marks won't show where the quotation starts and ends. What I usually do is italicise the quotation with <q style="font-style: italic">...quotation goes here...</q>.

The visual browsers I'm familiar with don't apply any particular font style to "q" quotations (or to "blockquote" ones, though they usually indent them).

I find "cite" hard to pin down the exact use of; the spec merely says that "the usual meaning" is "contains a citation or a reference to other sources", and the examples given are: As <CITE>Harry S. Truman said, <Q lang="en-us">The buck stops here.</Q> and More information can be found in <CITE>[ISO-0000]</CITE>.

So I suppose it's reasonable mark-up for book titles, but not (for example) for quoting someone or representing the voice on the other end of a telephone or thoughts, even if those are things you might want to mark up with italics and even if <cite> is often rendered as italics in visual browsers. Other than book titles, I'm not sure what the "cite" tag can properly be used for. (If you're going to use it improperly, then in my opinion you might as well go ahead and use the "i" tag, which at least doesn't even claim to indicate any particular meaning.)

[starwatcher]

.
I thought you were going to use semantic mark-up?

I'm obviously not getting the meaning you're trying to convey. I thought 'semantic' was a program that puts in bolds and italics for those who don't self-code in LJ.

But, yes, I want to be accessible-compliant. I'm just trying to figure out the easiest method of achieving that goal. If something is 'bad form', I won't do it, but I have to ask to learn.


Okay, I think I get what you're saying. But when I read fanfiction, I don't pay attention to whether something is a 'cite' or a 'quote'. It's irrelevant to the story, and I don't expect other readers to care, either. (Although I can see where it would be important on an informational web-page.) So should I stick to the <span-code for non-emphasized italics, and <em> when I want the emphasis?

Thanks for the extra links; I'll add them to my study line-up.
.

[lim]

Semantic in this case means meaningful. *g* Semantics is the study of the meanings of words, phrases, texts. When web developers talk about "semantic markup", we mean using tags in a consistent way to give meaning to web pages. So h1 has a specific, particular meaning (of 'first heading') and we always use it in that way, just like words have meanings.

If we used words just because they sounded nice, or similar to the word we really meant, or completely without reason, it would be even harder to understand each other than it is already. The internet for a long time has been coded in this way, and it has caused a lot of problems. That is what pne is talking about, I would guess; for web developers it is a very frustrating situation.

[susanreads]

Note that some browsers (e.g. Opera), but not all, enclose "q" quotations in quotation marks -- so if you add quotation marks yourself, you'll have two pairs in some browsers, but if you leave them out, then browsers which don't add quotation marks won't show where the quotation starts and ends. It doesn't just vary from browser to browser, but from style to style, even within Dwth. I started using <q> for quoting the OP or another comment, and found that there was no marker of it being a quote at all in, iirc, the site-style comment page. I've used <q> here, so I'll see what it does ...

In Comment Preview, it shows up in italics (no added quotation marks). I've a suspicion the italics disappeared when I posted such a comment before, but that might be something that's been fixed. Here goes!

[susanreads]

And, it looks OK to me (so I guess that was a bug that's been fixed, or somebody's style that's not doing it right). I wonder what screen-readers make of it?

[starwatcher]

.
Well, I thought [q] or [cite] might be an easier way to produce non-emphasized italics. But the answer seems to be, "Sometimes, maybe, but you can never be sure." So, since they're not something I'll need in posting comments or fanfic, I'll just ignore them, and work on memorizing the [span italics] string.
.

[susanreads]

Oh, I just saw in changelog_digest
Make styling for the <q> tag consistent across all styles and site schemes
Consistently display the <q> tag as italics.
so on Dreamwidth, you could use that and it'll work, after the next code push.

[starwatcher]

.
Thanks for the heads-up. But I think it's safest to figure out one way and stick to it, which is to use [em] and maybe [span:italic] as necessary. (I'm still researching that one.)
.