Best Way for Drop Caps

[jackie_w]

Originally Posted by RbnJrg

This solution is ONLY for older Kindle devices. Does Kindle 2 (or Kindle DX) have text-to-speech? If they don't, then you won't worry

I'm not a Kindle owner but I thought very old Kindles did have TTS.

[Turtle91]

Originally Posted by jackie_w

As a frequent user of text-to-speech on most of my epubs, I'm afraid using images to replace text is a big thumbs-down from me

I thought the whole purpose of the alt="" portion of the <img> tag was to provide alternatives if the image wasn't available, or to provide guidance for TTS functions. It has become habit for people to just leave that blank, or for some silly apps to put the filename in there (alt="qawsedrf.jpg") which does no good at all for the user. When filled in properly doesn't the TTS simply substitute that field??

eg. <p><img alt="T" src="../Images/T.jpg" />his is the first sentence of the chapter.</p>

should be pronounced properly...does this not work??

[Hitch]

Originally Posted by RbnJrg

This solution is ONLY for older Kindle devices. Does Kindle 2 (or Kindle DX) have text-to-speech? If they don't, then you won't worry

They certainly DO have TTS. IMO, their TTS is far more accessible, in many ways, than on the later models.

Hitch

[Hitch]

Originally Posted by Turtle91

I thought the whole purpose of the alt="" portion of the <img> tag was to provide alternatives if the image wasn't available, or to provide guidance for TTS functions. It has become habit for people to just leave that blank, or for some silly apps to put the filename in there (alt="qawsedrf.jpg") which does no good at all for the user. When filled in properly doesn't the TTS simply substitute that field??

eg. <p><img alt="T" src="../Images/T.jpg" />his is the first sentence of the chapter.</p>

should be pronounced properly...does this not work??

Turtle--it's been a while since we tried that, but, if memory serves, it comes out from TTS as "Tee his is the first sentence..."

Is that right? Anyone worked on that more recently than, say, 2010? Because I think that's the last time I tried that.

Hitch

[jackie_w]

Originally Posted by Turtle91

I thought the whole purpose of the alt="" portion of the <img> tag was to provide alternatives if the image wasn't available, or to provide guidance for TTS functions. It has become habit for people to just leave that blank, or for some silly apps to put the filename in there (alt="qawsedrf.jpg") which does no good at all for the user. When filled in properly doesn't the TTS simply substitute that field??

eg. <p><img alt="T" src="../Images/T.jpg" />his is the first sentence of the chapter.</p>

should be pronounced properly...does this not work??

Should work is the problem. All the Android popular reading apps with TTS that I've tried do not work. But the other point you make is also relevant, in most retail books I've seen the <img> alt text has been totally mis-used by the book creator.

I also think that Hitch is correct that even if it did work a leading dropcap-type letter image would be pronounced separate from the rest of the first word. Properly alt-labelled chapter heading images would stand a better chance of being pronounced correctly.

ETA: TTS has a long way to go, but there isn't much incentive to make it work better when so many people seem happy to pay Audible etc for retail audiobooks read by professionals.

[Hitch]

Originally Posted by jackie_w

Should work is the problem. All the Android popular reading apps with TTS that I've tried do not work. But the other point you make is also relevant, in most retail books I've seen the <img> alt text has been totally mis-used by the book creator.

I also think that Hitch is correct that even if it did work a leading dropcap-type letter image would be pronounced separate from the rest of the first word. Properly alt-labelled chapter heading images would stand a better chance of being pronounced correctly.

I'm reasonably certain that that's what happens. Yes, it's been a while since I tested it, but the KF7s still are the same, really. I find that their TTS is actually easier to access and use and test, than the later versions.

In this instance, I should be MOST delighted to learn that I'm wrong.

ETA: TTS has a long way to go, but there isn't much incentive to make it work better when so many people seem happy to pay Audible etc for retail audiobooks read by professionals.

And there it is. That's the other point I meant to add, earlier--that there's little or no incentive for Amazon to make it work "better." IN fact, there's an outright disincentive, as they're paid for Audible, and not paid to fix the TTS in the devices.

My $.02, for what it's worth.

Hitch

[JSWolf]

Originally Posted by Hitch

AND, what happens when you put this file on a Paperwhite, Voyage, or Oasis and change it from Publisher font, please?

ETA: And, as we all know, setting line-heights on the body is strictly verboten at Amazon, so....not sure how this would stand up. I realize it's the ePUB forum, but...{shrug}.

Hitch

And now on some Kindles, there is the feature of user fonts. And some fonts have a more narrow line hight and some a larger line height. And then there are the different settings where the line height is different.

So really, drop caps os a crap shoot that when it doesn't work, you lose.

[JSWolf]

Originally Posted by Wlan

Here is the file for the tests.

Thanks!

You also need to test letters with a descender such a Q.

[sherman]

One day I live in hope that someone, somewhere will create an ebook reader which supports the CSS "initial-letter" property.

Or that an ebook reader would support the Adobe dropcap.js solution.

Unfortunately, I don't see either of these solutions working anytime soon...

[RbnJrg]

Originally Posted by JSWolf

You also need to test letters with a descender such a Q.

It's the same. Why? Because first at all, you are "floating left" a square of 1em x 1em and then you are enclosing inside that square a svg image with the letter. So, if the square is consistently showed, then the letter will be showed consistently. I attach a new epub with the letter Q so you can test it.

[Hitch]

Originally Posted by JSWolf

And now on some Kindles, there is the feature of user fonts. And some fonts have a more narrow line hight and some a larger line height. And then there are the different settings where the line height is different.

So really, drop caps os a crap shoot that when it doesn't work, you lose.

Wolfie is right about the situation with the user-defined fonts. That is definitely going to throw a bigger monkey wrench in the works.

Hitch

[kso]

Originally Posted by Hitch

Turtle--it's been a while since we tried that, but, if memory serves, it comes out from TTS as "Tee his is the first sentence..."

Is that right? Anyone worked on that more recently than, say, 2010? Because I think that's the last time I tried that.

Hitch

There's also the issue of searchability (or findability). Granted, most dropcaps are used on stop words, but not necessarily. So if a chapter starts with a significant term, finding it might be difficult due to the first letter not being part of the first "drop-capped" word. Most web browsers get this right, but they have first-letter now, whereas readers are due to their nature somewhat behind.

klaus

[Pyjam]

Originally Posted by Turtle91

...FWIW...just throwing in my .02 cents.

If you are using a newer device then it'll likely support pseudo-elements. This makes the CSS and tags much simpler - see below. Of course you can adjust the CSS as desired for your preferences and it sometimes isn't supported by older devices. Also, IMHO, it doesn't treat leading punctuation as well as I'd like. Leading punctuation follows the same styling as the initial letter itself. eg. An open quote symbol would be 3 times as large (font-size:3em) /bold/italic etc as the first letter. I'm used to it, but it would be nice to have a built-in styling option for that frequent occurrence.

/* First Para in lieu of Drop Caps */
p.first               {text-indent:0; font-size:1em; line-height:1; clear:both}
p.first::first-letter {font-family:serif; font-size:3em; font-weight:bold; float:left;
                       margin:-.1em .05em -.1em .1em}
p.first::first-line   {font-variant:small-caps; font-size:1.15em}


HTML:
<p class="first">Just type a normal first paragraph without the requirement to add
&lt;span&gt; tags. The device will automagically adjust formatting to apply
only to the first-letter and first-line of the paragraph - no matter how wide 
the display is, only the first line is small caps.</p>

This is a clever solution!

Unfortunately, many signs like ’ , - don't render very well with small-caps.

I've tried text-transform: uppercase; instead of font-variant:small-caps; but is has no effect on my Kindle Voyage. Is it normal?

[Turtle91]

I think it may be better if you have a font that includes small caps instead of relying on the device to 'fake' small caps.

[Pyjam]

Sure, but even the built-in fonts don't include small-caps.
And none of my favorites additional fonts neither.

EDIT:
With some minor adjustments, it doesn't look bad.

Image 1: Kindle Voyage, AZW3, font Gentium Plus Mali.
Image 2: Apple's iBooks app for Mac, EPUB, font Georgia.