proper use and setting of text direction CSS vs structural in epub3

KevinH · 03-23-2018, 10:45 AM

I need help. What I know about using rtl text in general would not fill a thimble. I have been searching up on this to help "fix" how Sigil handles it.

Based on a web search, there seems to be a conflict about whether to use CSS or use the html5 attributes instead. I am talking about epub3 here but would also like to know what holds for epub2 as well.

From what I have been able to deduce is that under html5/epub3 the best way to set a direction for all text is to use the dir="rtl" attribute in the "html" tag itself (no dir attribute defaults to "ltr") and it will be inherited by all children of the html tag.

Then if your text contains words in "ltr" format, you simply add the dir="ltr" to a span or block level tag which encloses the text in the reverse direction.

No CSS is used.

This all seems well and good ...

BUT I have found lots of places that use CSS either in stylesheets or in inline style attributes to set the text direction such as the following:

Code:

<p style="direction: rtl;">blah</p>

along with no mention of the dir attribute on the html tag or any other tag.

This seems really confusing as I could be inheriting a text directions from an enclosing tag with the dir attribute and then directly conflict it by setting the opposite text direction with an inline style.

So can someone who knows about rtl text and the rules for epub3 and epub2 (if they differ) and what is really recommended and what passes epubcheck 4 under both versions please enlighten me.

Doitsu · 03-23-2018, 03:07 PM

Quote:

Originally Posted by KevinH

I need help. What I know about using rtl text in general would not fill a thimble. I have been searching up on this to help "fix" how Sigil handles it.

I haven't noticed any RTL issues with Sigil. Have other users reported specific problems?

Quote:

Originally Posted by KevinH

Based on a web search, there seems to be a conflict about whether to use CSS or use the html5 attributes instead.

IMHO, adding a dir="rtl" attribute to the html/body tag seems to be the most robust solution for epub3 and epub2 books. (For more information see this W3C FAQ.)

BTW, in the semi-official IDPF epub3 sample files, the authors used:

Code:

<body style="text-align:right" dir="rtl">

in [israelsailing]

and

Code:

<html xml:lang="ar" lang="ar" dir="rtl">

in [regime-anticancer-arabic]

If you want to run your own tests, here's a simple Arabic MR epub3 file that passes epubcheck 4.0.2.

Quote:

Originally Posted by KevinH

I am talking about epub3 here but would also like to know what holds for epub2 as well.

dir="rtl" body/html attributes also work fine in epub2 books, and books that contain them pass epubcheck 4.0.2., however, AFAIK, there's not a single epub2 app that actually supports valid epub2 RTL epubs. I.e., there's nothing you have to do because epub2 books with dir="rtl" body/html attributes display fine in Sigil and pass epubcheck 4.0.2.

jhowell · 03-23-2018, 03:09 PM

Someone else with more knowledge about this can clarify, but my understanding is that EPUB 2 allows the HTML5 css properties "direction" and "unicode-bidi" for handling text direction, but EPUB3 instead uses the attributes "dir", "bdi" and "bdo" for the same purpose.

The EPUB 3 Accessibility Guidelines states:

Quote:

direction - The direction property is not supported in EPUB 3. HTML5 markup, such as the bdi and bdo elements and dir attribute, should be used to express directionality

Doitsu · 03-23-2018, 04:14 PM

Quote:

Originally Posted by jhowell

Someone else with more knowledge about this can clarify, but my understanding is that EPUB 2 allows the HTML5 css properties "direction" and "unicode-bidi" for handling text direction, but EPUB3 instead uses the attributes "dir", "bdi" and "bdo" for the same purpose.

You're correct. AFAIK, in epub2 books either the direction css property or the dir attribute can be used (in xhtml1.1 files). However, epubcheck 4.0.2 will flag the direction css property in epub3 books:

Quote:

ERROR(CSS-001): The 'direction' property must not be included in an EPUB Style Sheet.

KevinH · 03-23-2018, 10:01 PM

And that is Sigil's issue. The Format menu has rtl and ltl menu items that instead of adding a dir attribute to the encosing tag under epub3 instead tries to use epub2 in-line styles.

That menu functionality should probably be changed to use the inline styles in epub2 and the dir attribute in epub3.

That was what I was trying to figure out.

Doitsu · 03-24-2018, 02:04 AM

Quote:

Originally Posted by KevinH

That menu functionality should probably be changed to use the inline styles in epub2 and the dir attribute in epub3.

Since the dir attribute can be used both in XHTML1.1 and HTML5 files, it might be easier to add it for both epub2 and epub3 files.
In reality, it doesn't really matter what option you choose for epub2 files, because there are no epub2 apps with RTL support.

Sarmat89 · 03-24-2018, 06:17 AM

Styles should be avoided for specifying direction, as the direction is the part of the text semantics and should be expressed in physical markup.

KevinH · 03-24-2018, 09:04 AM

So I will just replace all use of inline style direction setting with structural dir attributes for both epub3 and epub2 since style use of direction is to be avoided and epub2 does not support rtl anyway.

KevinH · 03-24-2018, 10:13 AM

One last question ... what about calibre? Does it support rtl text in epub2 and if so is it done via CSS? My guess is yes, and that explains why Sigil's rtl format menu item supports CSS text direction since it is a leftover from when Sigil was epub2 only.

So just for backwards compatibility, I should use CSS for text direction in epub2 and dir attributes in epub3.

Doitsu · 03-24-2018, 11:44 AM

Quote:

Originally Posted by KevinH

One last question ... what about calibre? Does it support rtl text in epub2 and if so is it done via CSS?

Based on my limited tests, both Calibre E-book viewer and Calibre editor support epub2 books in which RTL text was marked via css or dir attributes. I don't know whether @kovidgoyal used any special css for this, because, AFAIK, Webkit natively supports RTL text with the exception of final sentence punctuation characters.

You can test this with this sample sentence:

a) without dir and lang attributes:

Code:

<p>أنا قادر على أكل الزجاج وهذا لا يؤلمني.</p>

b) with dir and lang attributes.

Code:

<p xml:lang="ar" dir="rtl">أنا قادر على أكل الزجاج وهذا لا يؤلمني.</p>

If you copy both paragraphs into an empty epub and look at them in the Preview/Book View window, both sentences will look pretty much identical, because all characters are automatically correctly shaped and all words are displayed in the correct order. However, if you look real close you'll see that in the first example the final period is displayed on the right side (as in LTR text) and in the second example it's displayed on the left side (as it should be).

HarryT · 03-29-2018, 08:01 AM

It's worth bearing in mind that (to the best of my knowledge) none of the commercial ePub2 reading devices support RTL languages, because they use ADE, which doesn't support it.

It would probably be best to restrict this to ePub3 books, otherwise people are going to use it in ePub2, and then find that it doesn't actually work on most reading devices!

KevinH · 03-29-2018, 10:51 AM

Except for Calibre’s ebook reader which does support both versions. Perhaps, restricting those menu items to epub3 is the right answer but rtl and ltr support was added by someone to Sigil long before I joined the dev team and long before epub3 support so there must have been some call for support for rtl and ltr support for epub2.

Thanks

HarryT · 03-29-2018, 10:55 AM

Quote:

Originally Posted by KevinH

Except for Calibre’s ebbok reader which does support both versions.

Oh, I know

. That's why I said "commercial ePub2 reading devices". Ie ADE-baed readers. Should work fine in any app that uses Webkit, such as Calibre (and Sigil!).

03-23-2018, 10:45 AM	#1
KevinH Sigil Developer Posts: 8,467 Karma: 5703586 Join Date: Nov 2009 Device: many	proper use and setting of text direction CSS vs structural in epub3? I need help. What I know about using rtl text in general would not fill a thimble. I have been searching up on this to help "fix" how Sigil handles it. Based on a web search, there seems to be a conflict about whether to use CSS or use the html5 attributes instead. I am talking about epub3 here but would also like to know what holds for epub2 as well. From what I have been able to deduce is that under html5/epub3 the best way to set a direction for all text is to use the dir="rtl" attribute in the "html" tag itself (no dir attribute defaults to "ltr") and it will be inherited by all children of the html tag. Then if your text contains words in "ltr" format, you simply add the dir="ltr" to a span or block level tag which encloses the text in the reverse direction. No CSS is used. This all seems well and good ... BUT I have found lots of places that use CSS either in stylesheets or in inline style attributes to set the text direction such as the following: Code: <p style="direction: rtl;">blah</p> along with no mention of the dir attribute on the html tag or any other tag. This seems really confusing as I could be inheriting a text directions from an enclosing tag with the dir attribute and then directly conflict it by setting the opposite text direction with an inline style. So can someone who knows about rtl text and the rules for epub3 and epub2 (if they differ) and what is really recommended and what passes epubcheck 4 under both versions please enlighten me. Last edited by KevinH; 03-23-2018 at 11:10 AM.

03-29-2018, 10:51 AM	#12
KevinH Sigil Developer Posts: 8,467 Karma: 5703586 Join Date: Nov 2009 Device: many	Except for Calibre’s ebook reader which does support both versions. Perhaps, restricting those menu items to epub3 is the right answer but rtl and ltr support was added by someone to Sigil long before I joined the dev team and long before epub3 support so there must have been some call for support for rtl and ltr support for epub2. Thanks Last edited by KevinH; 03-29-2018 at 11:25 AM.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Cool Reader GL CSS setting	VelvetElvis	Android Devices	2	06-28-2017 08:53 AM
Proper justification of text and aligned margins	Mcmac	Kindle Developer's Corner	1	01-22-2015 11:49 PM
Epub3 CSS not implemented on Google Play Books	leijoninna	ePub	0	04-11-2014 08:45 AM
Sigil Proper Case Setting	Themus	Sigil	14	04-26-2013 03:47 AM
CSS visiblility setting throws off TOC generation in MOBI	Guido Henkel	Calibre	1	11-02-2010 05:16 AM

03-23-2018, 10:01 PM	#5
KevinH Sigil Developer Posts: 8,467 Karma: 5703586 Join Date: Nov 2009 Device: many	And that is Sigil's issue. The Format menu has rtl and ltl menu items that instead of adding a dir attribute to the encosing tag under epub3 instead tries to use epub2 in-line styles. That menu functionality should probably be changed to use the inline styles in epub2 and the dir attribute in epub3. That was what I was trying to figure out.

03-24-2018, 06:17 AM	#7
Sarmat89 Fanatic Posts: 515 Karma: 2268308 Join Date: Nov 2015 Device: none	Styles should be avoided for specifying direction, as the direction is the part of the text semantics and should be expressed in physical markup.

03-24-2018, 09:04 AM	#8
KevinH Sigil Developer Posts: 8,467 Karma: 5703586 Join Date: Nov 2009 Device: many	So I will just replace all use of inline style direction setting with structural dir attributes for both epub3 and epub2 since style use of direction is to be avoided and epub2 does not support rtl anyway.

03-24-2018, 10:13 AM	#9
KevinH Sigil Developer Posts: 8,467 Karma: 5703586 Join Date: Nov 2009 Device: many	One last question ... what about calibre? Does it support rtl text in epub2 and if so is it done via CSS? My guess is yes, and that explains why Sigil's rtl format menu item supports CSS text direction since it is a leftover from when Sigil was epub2 only. So just for backwards compatibility, I should use CSS for text direction in epub2 and dir attributes in epub3.

03-29-2018, 08:01 AM	#11
HarryT eBook Enthusiast Posts: 85,544 Karma: 93383099 Join Date: Nov 2006 Location: UK Device: Kindle Oasis 2, iPad Pro 10.5", iPhone 6	It's worth bearing in mind that (to the best of my knowledge) none of the commercial ePub2 reading devices support RTL languages, because they use ADE, which doesn't support it. It would probably be best to restrict this to ePub3 books, otherwise people are going to use it in ePub2, and then find that it doesn't actually work on most reading devices!