View Full Version : Designing for Kobo


AlexBell
01-09-2013, 08:02 PM
I've just designed an ebook which works well on my Sony PRS T2 and on my iPad with iBooks, and after being converted by calibre works well on my Kindle3 both in old mobi and azw3. I design my ebooks by hand with an HTML editor, and the html files and CSS validate to W3C standards. The ebook validates with ePubCheck and Flightcrew.

But a friend has tested it on her Kobo Touch, and it seems to be an absolute disaster - links don't go to the right page, the font size is too small, and there are several other problems. It's also a disaster using the Kobo app on my iPad2. The friend has tested other ebooks I've designed for me, and found although links didn't work the rest of the ebook worked well.

Can anyone suggest where I might have done wrong? Is there a difference between how Kobo renders ePubs and how Sony renders ePubs?

Are there any ePub designers here who read their ebooks on a Kobo?

davidfor
01-10-2013, 01:28 AM
I'm not book designer, but a Kobo Touch and Glo user. I do edit my copies of ePubs to improve my reading experience, so I have some knowledge of the ePub structure.


But a friend has tested it on her Kobo Touch, and it seems to be an absolute disaster - links don't go to the right page, the font size is too small, and there are several other problems. It's also a disaster using the Kobo app on my iPad2. The friend has tested other ebooks I've designed for me, and found although links didn't work the rest of the ebook worked well.

For the links, how much are they out? There is a navigation issue with the latest firmware (2.3.1 and 2.3.2). This is normally seen as reopening a book goes to a page or two earlier than where it was closed. I have seen some mention of links having problems, but I haven't seen them. The only books I have read lately with links were from a TOC to chapter headings. These worked perfectly. There is a workaround for the navigation problem. Setting the margins on the reader to zero sorts it out.

The only other issue with links I have seen is the actual act of selecting them. If the link is small, say a number for a footnote, and the font is small, selecting them can be next to impossible. Increasing the font size has always solved this for me. That isn't really practical and I don't know how other touch devices handle the same issue. I have seen discussion here or in the Sigil forum about how to handle the issue, so I assume it isn't just Kobo devices having the problem.

To me, font size should be set by the user. The Kobo devices have good control over font size. If an ePub uses relative sizes (em or whatever), this works very well. The same goes for the actual font. If the sized is fixed or the font is set, it can't be changed.

AlexBell
01-10-2013, 01:58 AM
Thanks, David, that's most helpful and perhaps encouraging.

The navigation problem my friend reports is that the when she selects a link from the ToC to another section she is taken to the second page of that section, not the first page of the section.

The text font size in the ebook is set in ems. Most of the headings and titles are set in percentage of em. I have set the font to sans-serif; could this be causing a problem? It certainly doesn't cause any problem with my Sony; I can's select any of the other six font option ands the text changes to whatever I've selected.

Do you know of any other forum than MobileRead which discusses Kobo problems where I could get help?

oxen
01-10-2013, 02:53 AM
Links jump error problem, may be caused by the link target setting. In order to make an accurate judgement, suggest you upload Epub document.

Font too small problems, is because you used em units and fixed font sizes. So that would be difficult to have the desired effect on non-testing machine. It is a good method to use % as a font size unit. So, different machines and reading system can adjust font size by font menu.

Thanks, David, that's most helpful and perhaps encouraging.

The navigation problem my friend reports is that the when she selects a link from the ToC to another section she is taken to the second page of that section, not the first page of the section.

The text font size in the ebook is set in ems. Most of the headings and titles are set in percentage of em. I have set the font to sans-serif; could this be causing a problem? It certainly doesn't cause any problem with my Sony; I can's select any of the other six font option ands the text changes to whatever I've selected.

Do you know of any other forum than MobileRead which discusses Kobo problems where I could get help?

davidfor
01-10-2013, 03:19 AM
I agree with oxen, it would be good to test the ePub to see what happens. To test the links, the full book is probably needed, but a sample with the stylesheet should do for the fonts.

Toxaris
01-10-2013, 03:20 AM
Font too small problems, is because you used em units and fixed font sizes. So that would be difficult to have the desired effect on non-testing machine. It is a good method to use % as a font size unit. So, different machines and reading system can adjust font size by font menu.

Sorry, that is nonsense. Fixed font size causes problems with fonts (not changeable, to big, to small, etc). Setting the font size in em or in percentages does not. In fact, for most readers percentages and ems are the same. That is, 1em is 100% and for example 1.2em equals to 120%. I always use ems for basic settings (usually p-tags) and percentages for changes within a paragraph (spans). That works well on all the readers I have seen so far.

JSWolf
01-11-2013, 02:32 AM
What I have seen done that works is instead of using a single character superscripted to make it even harder to press is to use thinks like...

Go to the footnote for this sentence[1]. This is the next footnote[2].

That way, it will be easy to hit the right spots on the screen.

Now, as for the font size being a reason why the links do not work properly is rubbish. Either they are not codded correctly or this is yet another Kobo bug. Given that they work everyplace but a Kobo Reader, I would say it is a bug in the Kobo.

AlexBell
01-11-2013, 05:26 AM
Thanks for all your comments. Just to make things even more complicated I put together a very simple ebook with only a few links, and my friend tells me the links work well on this ebook.

So the current plan is to make the ebook more complex in small steps until it stops working in the Kobo. Then I'll have a better idea, I hope, about what is causing the problems.

I'm afraid I can't upload the original ebook since it is a commercial ebook I designed for a small publisher in the UK. But as soon as the one I'm working on now for the MR library fails on a Kobo when it works well on the others I'll let you know and upload it for all to look at.

I understand that the Kobo uses different parts of the screen for different purposes - clicking on the centre I think brings up the menu. Is this a possible cause for the problems I'm having? The Kobo might be confused between bringing up the menu and moving to another part of the ebook.

I suppose I could put a link in the centre of the screen and see how the Kobo handles it.

DSpider
01-11-2013, 05:34 AM
If the links in some ePub files work, but in your ePub files they don't, I suggest you open up both files and have a look at their underline code.

This is probably the reason why they don't work:

I design my ebooks by hand with an HTML editor

It's called PEBKAC.

dgatwood
01-11-2013, 11:07 PM
Another useful tip: Don't set the left and right margins for html or body tags to zero. If you do, Kobo (at least on iOS) will dutifully render part of the next page on the current one and won't let you go to the last page of any chapter. :)

AlexBell
01-12-2013, 03:25 AM
If the links in some ePub files work, but in your ePub files they don't, I suggest you open up both files and have a look at their underline code.

This is probably the reason why they don't work:



It's called PEBKAC.

What's PEBKAC?

Whatever it is I don't think it explains why the links work on my Sony and iPad/iBooks, and on my Kindle Keyboard after conversion.

AlexBell
01-12-2013, 03:30 AM
Another useful tip: Don't set the left and right margins for html or body tags to zero. If you do, Kobo (at least on iOS) will dutifully render part of the next page on the current one and won't let you go to the last page of any chapter. :)

Thanks, that's most helpful. I have indeed set the body margins and padding to zero in the CSS:

body {
margin: 0; padding: 0; border-width: 0;
font-size: 95%;
text-align: justify;
line-height: 120%;
font-family:sans-serif;
}

@page { margin: 3pt; padding: 2pt 0 0 0; }

What values would you suggest?

Toxaris
01-12-2013, 04:15 AM
I usually set it at 5 pt. Small, but not too small.

DSpider
01-12-2013, 04:16 AM
What's PEBKAC?

Google it.

Jellby
01-12-2013, 04:17 AM
Another useful tip: Don't set the left and right margins for html or body tags to zero. If you do, Kobo (at least on iOS) will dutifully render part of the next page on the current one and won't let you go to the last page of any chapter. :)

What? Does it mean all my books display wrong there? Shame on them!

(I always add "html body { margin: 0; }".)

AlexBell
01-12-2013, 05:20 AM
Thanks, Jellby. I had hoped that the distance between the edge of the screen and the beginning of the text on the left would indeed be 5pt; 3pt margin+2pt padding.

AlexBell
01-12-2013, 05:45 AM
This post is especially for people using Kobo ereaders.

This afternoon I gave in to temptation and bought a Kobo Touch so as to be able to test how my ebooks look without having to depend on my friend to check them for me.

I have in front of me Can You forgive Her? by Anthony Trollope which I put on the MR Library recently, both opened at Chapter 1 on my Sony PRS T1 and the Kobo Touch.

On the Sony the text appears as expected - the chapter title, a horizontal rule, and the text starting immediately below.

On the Kobo touch I see the chapter title and the horizontal rule, but the rest of the screen is blank - the text doesn't start until the next page.

I've looked at other ebooks I've done on the MR library, and none of them has shown this behaviour. Chapter 2 of Can You Forgive Her? starts as expected on the Kobo Touch.

Also, text which I have italicised shows in italics on the Sony, but shows in block (emphasised but in normal font style) on the Kobo Touch.

I haven't the slightest idea where to start looking for the cause of these differences between the way the same ebook displays on two different readers. Does anyone have any suggestions? Let me repeat, if that should be necessary, that the html and CSS in the ebook validate to W3C standards, and the ebook validates with ePubCheck and FlightCrew.

Could some who uses a Kobo Touch please download Can You Forgive Her? from the MR library to see if he or she sees the same thing?

The links seem to work without problem on the Kobo Touch in this and other ebooks of mine, though footnotes take some time to work.

I think I'll take a Kobo ebook apart and see if I can find clues as to the way Kobo does things.

oxen
01-12-2013, 06:26 AM
Sorry, that is nonsense. Fixed font size causes problems with fonts (not changeable, to big, to small, etc). Setting the font size in em or in percentages does not. In fact, for most readers percentages and ems are the same. That is, 1em is 100% and for example 1.2em equals to 120%. I always use ems for basic settings (usually p-tags) and percentages for changes within a paragraph (spans). That works well on all the readers I have seen so far.

Yes you're right, it's wrong in my memory.
Fixed font size units is px/pt/cm/...

Toxaris
01-12-2013, 06:31 AM
Alex, perhaps the first paragraph is too large for the Kobo to fit under the header of chapter 1? It should not be an issue, but just to rule out stuff.
With regards to the italic, it seems that Kobo ignores 'blockquote p' but honors 'blockquote+p'

dgatwood
01-12-2013, 01:33 PM
What? Does it mean all my books display wrong there? Shame on them!

(I always add "html body { margin: 0; }".)

Interesting. I was just trying to figure out if it was the html tag or the body tag, and I can no longer reproduce the bug. I guess the Kobo folks silently fixed it in the iOS app update last week, because I know I checked out a version of the tools that reproduced it two weeks ago. :)

So never mind.

Agama
01-12-2013, 03:37 PM
What values would you suggest?

I use: @page { margin-top:6pt; margin-bottom:4pt }

and in body margin:0 6pt 0 6pt; padding:0

This ensures that the top/bottom margins still apply when the top or bottom of the current page is not being displayed, i.e. you're somewhere in the middle of a page which is longer than 1 screen. The lower figure of 4pt for the bottom-margin is because this is only to allow for letters which extend below the line, (g, p, q and y).

Left/right margins are in the body selector to allow easy override on specific pages if required.

Just don't set margins in em or they zoom with the text size and end up consuming lots of screen area. I'd say 75% of my purchased ePubs have these annoying 'zooming' margins.

AlexBell
01-12-2013, 06:23 PM
Thanks to you all, especially Toxaris about the italics. I think I've stumbled on at least part of the answer to the problems.

I have an ebook I'm developing which has italics in it. I tested the text with the italics with each of the fonts available on Kobo Touch. Some of those fonts show the text in italics but in a serif font instead of sans, some show block font instead of italic, and only one shows the text in italic and sans.

At the same time I tested footnotes with each font. Only one of the fonts enabled footnotes to work. I'll repeat the test this afternoon or evening, include a test for links, tabulate the results, and post them.

JSWolf
01-12-2013, 11:31 PM
Another useful tip: Don't set the left and right margins for html or body tags to zero. If you do, Kobo (at least on iOS) will dutifully render part of the next page on the current one and won't let you go to the last page of any chapter. :)

Well, good thing I don't design my eBooks for the Kobo iOS app as I do set the left/right margins to zero.

AlexBell
01-13-2013, 01:15 AM
Alex, perhaps the first paragraph is too large for the Kobo to fit under the header of chapter 1? It should not be an issue, but just to rule out stuff.'

Thanks again, Toxaris. That may well be the reason, since it is an Anthony Trollope book and his paragraphs may go on for pages. Do you know if there is a maximum allowable size for paragraphs in Kobo? Or where I could find this information? There are not too many designers on the Kobo forum.

With regards to the italic, it seems that Kobo ignores 'blockquote p' but honors 'blockquote+p'

But these are two totally different things, with different effects! Surely not even Kobo would make this mistake. Could you tell me please where you found this information?

PeterT
01-13-2013, 01:57 AM
Kobo is notoriously bad for widows and orphans; many, many times, regardless of the size of a paragraph it will be placed on an extra screen, even though the previous screen had more than enough room for it.

davidfor
01-13-2013, 04:27 AM
Another useful tip: Don't set the left and right margins for html or body tags to zero. If you do, Kobo (at least on iOS) will dutifully render part of the next page on the current one and won't let you go to the last page of any chapter. :)

I don't know about the Kobo iOS app, but it doesn't happen on the Touch and Glo. Both correctly handle this.

Toxaris
01-13-2013, 04:29 AM
Thanks again, Toxaris. That may well be the reason, since it is an Anthony Trollope book and his paragraphs may go on for pages. Do you know if there is a maximum allowable size for paragraphs in Kobo? Or where I could find this information? There are not too many designers on the Kobo forum.



But these are two totally different things, with different effects! Surely not even Kobo would make this mistake. Could you tell me please where you found this information?

Alex, these were both assumptions from my side. There is no official information, but from studying your ePUB these seems like possible issues. It should not be difficult to create a test ePUB to test this hypothesis.

davidfor
01-13-2013, 05:21 AM
You already have some of the answers, but...


I have in front of me Can You forgive Her? by Anthony Trollope which I put on the MR Library recently, both opened at Chapter 1 on my Sony PRS T1 and the Kobo Touch.

On the Sony the text appears as expected - the chapter title, a horizontal rule, and the text starting immediately below.

On the Kobo touch I see the chapter title and the horizontal rule, but the rest of the screen is blank - the text doesn't start until the next page.

This is a known bug in the Kobo firmware and long paragraphs. If a paragraph exceeds a screen by a few lines, it will be pushed to start on the next screen. When I first went to chapter 1, the formatting was correct. When I increased the font size a couple of steps, the first paragraph was pushed to the next screen.

Also, text which I have italicised shows in italics on the Sony, but shows in block (emphasised but in normal font style) on the Kobo Touch.

As you have discovered, it is dependent on the font A couple of the built-in fonts are missing the italics. "Avenir" is one of them. "Georgia" works fine.


The links seem to work without problem on the Kobo Touch in this and other ebooks of mine, though footnotes take some time to work.

The links work for me as well. The only problems I had is with font and finger size for the footnote link. I use a smallish font and have big fingers. Pressing the footnote link isn't reliable for me. But when I increased the font size, it worked with no problems.

I think I'll take a Kobo ebook apart and see if I can find clues as to the way Kobo does things.

From what I can see, there aren't any real problems with your formatting. You have just managed to hit two well known bugs in the firmware.

JSWolf
01-13-2013, 06:34 PM
What happens with the Kobo if widows and orphans are both set to 0 in the body style in the CSS?

davidfor
01-13-2013, 08:47 PM
What happens with the Kobo if widows and orphans are both set to 0 in the body style in the CSS?

I don't know. I normally set them in the paragraph styles.

AlexBell
01-14-2013, 08:05 PM
In earlier posts I have mentioned problems that my Kobo Touch reader is having with an ebook that works perfectly on my Sony T2. The html and CSS in this file validate to W3C standards, and the ePub validates with ePubCheck and FlightCrew.

I have tested all the fonts on the Kobo to see whether they show italics and whether the links work. The test file has some footnotes; link numbers in the text take one to a collection of footnotes in a different file, and this collection has a link back to the original text.

The results are below:

Kobo Touch Font Tests - Font size set to 10

Document Default
This is set to sans-serif in the CSS of the test ebook, but shows as a serif font.
Links: Work
Endnote links: Work going. From Endnotes return to page before the footnote source.
Italics: Work

Amasis
Links: Work
Endnote links: Work going. From Endnotes return to page before the footnote source.
Italics: Work

Avenir
Links: Go to two pages before target
Endnote links: Work going. From Endnotes return to page before the footnote source.
Italics: Show as bolded text, not italic

Caecilia
Links: Work
Endnote links: Work going. From Endnotes return to page before the footnote source.
Italics: Work

Georgia
Links: Go to one page before target
Endnote links: Go to one page before target, return to two pages before target
Italics: Work

Gil Sans
Links: Work
Endnote links: Work going, return one page before target
Italics: show as bolded text, not italic

Kobo Nickel
Links: Work
Endnote links: Work going, return several pages before target
Italics: show as bolded text, not italic

Malabar
Links: Go to one page before target
Endnote links: Work going, return one page before target
Italics: Work

Gothic MB101
This is a sans font, and is noticeably bigger than the other fonts
Links: Go to one page before target
Endnote links: Work going, return one page before target
Italics: Work, but font size noticeably smaller than normal font

Ryumin
Links: Go to target
Endnote links: Work going, return one page before target
Italics: Work, but font weight is heavier than normal font

OpenDyslexic
Links: Go to one page before target
Endnote links: Work going, return one page before target
Italics: Work

Some of the italic/not italic problems are no doubt the fault of the way the that type face is designed, or implemented in the Kobo, but I am sure that the link and footnote problems are the fault of the Kobo designers. Let me repeat and emphasise that the links work perfectly well when the same ebook is read on my Sony.

It will be interesting to see how Kobo customer service responds. That's my next stop.

davidfor
01-15-2013, 01:18 AM
That is an interesting set of results. The missing italics is a long term issue. I have no idea why Kobo haven't fixed it.

Two thoughts:

- What were the margin settings on the device when you did this? There is a bug in the current firmware that if the margin settings are not the minimum, when a book is reopened, it goes to a page or two earlier than when it was closed. I could see this affecting link navigation as well, but I'm not sure. This should be consistent across the fonts, but, there may be something else going on.

- For the page numbers, did you have the page numbers displayed in the margins? What I am wondering is if the navigation was going to the first screen for a page number.

AlexBell
01-15-2013, 01:57 AM
Thanks again, David - more useful ideas to think about.

I initially set the margin as far to the left as it would go, then clicked the + icon twice, and left it there while testing each of the margins. For some of them I noticed that the margin had reset itself about a quarter over from the left, but didn't do anything about that. It didn't seem to make any difference with the links, but I didn't test it. In fact I remember now that in one of the testing sessions not only did the indicator on the line move over but the margins of the ebook became very wide. I just set the margin back to +2 and started over.

The page numbers are not visible on the ebook right side margin as they are in ADE. There is a message at the bottom of the screen (taking up valuable reading space) saying PG 3 OF 13. Is this the page number you mean? Is there a way of turning this off?

davidfor
01-15-2013, 02:40 AM
I initially set the margin as far to the left as it would go, then clicked the + icon twice, and left it there while testing each of the margins. For some of them I noticed that the margin had reset itself about a quarter over from the left, but didn't do anything about that. It didn't seem to make any difference with the links, but I didn't test it. In fact I remember now that in one of the testing sessions not only did the indicator on the line move over but the margins of the ebook became very wide. I just set the margin back to +2 and started over.

I can see why you did it that way and as a programmer, I love seeing a tester who makes their tests consistent :)

The margins are sort of interesting. Up until FW2.3.1, if they were set in the ePub, the Kobo devices did not override them. Which I thought was good. In FW2.3.1, the margins are additive. What you set on the device is added to whatever is in the book.

Was your testing with only one book? A reason for the changes you saw is that the device stores the settings for each book if you make changes. It also save these settings as the defaults to use for any new books.

The page numbers are not visible on the ebook right side margin as they are in ADE. There is a message at the bottom of the screen (taking up valuable reading space) saying PG 3 OF 13. Is this the page number you mean? Is there a way of turning this off?

I was talking about the ADE style page numbers. There is an option to display them. When the menu is open a the bottom of the screen, select the spanner icon and then "Reading Settings". The option is on page two.

The bottom page number can't be turned off. If it could, it would be very popular, though I don't know if I would.

AlexBell
01-16-2013, 02:22 AM
Was your testing with only one book? A reason for the changes you saw is that the device stores the settings for each book if you make changes. It also save these settings as the defaults to use for any new books.



I didn't know that! I think that's stupid! If I've made changes to a book as I'm developing it I want the new settings to be in force, not what I've just corrected. And I certainly don't want the settings for the poetry book I'm working on now to be the settings for the novel I might do next.

I've had endless trouble with authors for whom I've developed mobi ebooks. Unless they do as I ask them and remove all traces of the previous version the new version won't overwrite the previous version. So they don't see the changes or correction I've made. If I understand you correctly I'm likely to have the same problem with Kobo owners.

And yes, for consistency all the testing was on one ebook.

davidfor
01-16-2013, 02:46 AM
I didn't know that! I think that's stupid! If I've made changes to a book as I'm developing it I want the new settings to be in force, not what I've just corrected. And I certainly don't want the settings for the poetry book I'm working on now to be the settings for the novel I might do next.

It is a little different, but I don't completely disagree with it. I like that I save the settings for each book. And I like I can change the default settings. But, the latter is done in a not that obvious way. I would like a way to deliberately save default settings and then reload these when I want to.

I've had endless trouble with authors for whom I've developed mobi ebooks. Unless they do as I ask them and remove all traces of the previous version the new version won't overwrite the previous version. So they don't see the changes or correction I've made. If I understand you correctly I'm likely to have the same problem with Kobo owners.

As a software developer, I completely understand the problem. :) And that's why I might seem a little pedantic in my statements above.

For the Kobo owners, telling them to delete the book using the device should be enough. This will remove the book and details from the database. When they load it again, it uses their current default settings. If they are a calibre user, they can delete it from the device using calibre and send it again. If they just send it, then the device might delete it when it processes new books after disconnection. It checks the file size, and if this is different that what it has recorded, it removes the book.

With that comment, something you might be interested in is the annotations. Any annotations made on the device to an ePub are stored in a file. These are under "Digital Editions\Annotations". Look for a file with the extension "annot" and the same directory and file names as the epub. You can copy these between the Kobo devices as long as all the names are kept the same. That way someone can make annotations while reading the book, and you can see them. You can also use it with ADE on the PC, but that is a little trickier.

And yes, for consistency all the testing was on one ebook.

I thought so, but see my comment about being pedantic above :)

AlexBell
01-17-2013, 02:02 AM
Thanks again David.

In my opinion pedantic is when one doesn't agree with it. When one does agree with it the same behaviour is admirable precision.

Turtle91
01-17-2013, 10:53 AM
It seems from your description (I don't have a kobo device) that one of the footnote links issues is that the link could be too small. A single "1" on a small screen (especially with small font) would be hard for the device to detect a touch.

Why not make the hyperlink a little larger - include more of the surrounding text. Unless there are two adjacent links that should not be a problem.

e.g.
instead of:
<p>This is a test link[<a href="..." id="link1">1</a>]</p>
you could use:
<p>This is a test link<a href="..." id="link1">[1]</a></p>
or even:
<p>This is a test <a href="..." id="link1">link[1]</a></p>

The only downside I could see is that link[1] would all be formatted as a link (ie. blue, underlined). I personally don't like links formatted like that - I remove all formatting and assume that the reader will intuit that it's a link based on it's content - but that's me. If you want just the numeral formatted that could easily be fixed with css and a span:

a {color:inherit;text-decoration:none;}
a span {color:blue; text-decoration:underline}

<p>This is a test <a href="..." id="link1">link[<span>1</span>]</a></p>

Cheers!

AlexBell
01-18-2013, 02:11 AM
Thanks, Turtle91, but I don't agree with you.

As an habitual Sony reader I am accustomed to using a stylus when I need to, and I used a stylus on all the tests I did just so I could exclude that variant. Actually, I don't need to use a stylus on my Sony, but can always get the footnote links to work - they go to the endnote when I touch the link, and go back to the right place when I touch the link in the endnote file.

For what it is worth here is the CSS I use - learned from one of weatherwax's ebooks.

<span class="fn" id="F1"><a href="Endmatter.html#N1">[1]</a></span>

<p id="N1"><a href="#F1">[1]</a> Endnote text goes here</p>

a.footnote {font-size: small; vertical-align: text-top;}

The numbers are of course changed for the individual endnotes.


A few days ago I sent a slightly changed version of my post #31 to Kobo Customer Assistance, and tonight I got a reply to the effect that the post had been sent up to the tier 2 team.

Turtle91
01-18-2013, 08:16 AM
A stylus - how novel! Lol
Well, now I'm intrigued. Please share their response when you get it. I did notice that your CSS references "a.footnote" but the class calls for "fn". Also it appears you have all the footnotes in a separate file (Endnotes.html). If you want the back link to work you need to put the filename in front of "#F1". I assumed you were just giving an example, but you might check that.

I have a question of my own. When you create your link is there a specific reason for the span tags around the <a></a>?

I usually try and absolutely minimize the number of tags and would have just put the class and id within the link:
<a class="footnote" id="F1" href="...">...</a>

Is using a span tag a specific requirement for Kobo/Sony??

Thanks!

Toxaris
01-18-2013, 08:21 AM
Not for Sony at least, I don't use spans for my anchors/links and they work.

AlexBell
01-19-2013, 01:16 AM
Thanks to you both

@Turtle91 Looks like I need to clean out the CSS. The one I use now is

.fn { font-size: 67%; vertical-align: text-top; } /* With thanks to Weatherwax */

The one I quoted earlier is old stuff.

I have indeed put the filename in front of the #F1, just as I've changed the number as more endnotes were added. As I've mentioned in earlier posts the test file I used works perfectly well on my Sony. The questions I'm asking are about designing for the Kobo, not about html or ePub.


About the span: here is a fragment from the html

<p> ..... country quiet, of his mother,<span class="fn" id="F2"><a href="Endmatter.html#N2">[2]</a></span> of poetry &ndash; ....</p>

I'm not sure how I could set both the features of the a and its id without a span. What do you do?

Turtle91
01-20-2013, 01:48 AM
I figured you were just making an example, but wanted to make sure.

As far as the link I have seen them done this way many times. That's how I do them. And I'm not aware of a reason to put a span around them - that's why I was asking. You never know what Feature will be added to these readers...
I would just use:

<p> ..... country quiet, of his mother,<a class="fn" id="F2" href="Endmatter.html#N2">[2]</a> of poetry &ndash; ....</p>


Cheers!

oxen
01-20-2013, 10:10 AM
Thanks to you both

@Turtle91 Looks like I need to clean out the CSS. The one I use now is

.fn { font-size: 67%; vertical-align: text-top; } /* With thanks to Weatherwax */

The one I quoted earlier is old stuff.

I have indeed put the filename in front of the #F1, just as I've changed the number as more endnotes were added. As I've mentioned in earlier posts the test file I used works perfectly well on my Sony. The questions I'm asking are about designing for the Kobo, not about html or ePub.


About the span: here is a fragment from the html

<p> ..... country quiet, of his mother,<span class="fn" id="F2"><a href="Endmatter.html#N2">[2]</a></span> of poetry &ndash; ....</p>

I'm not sure how I could set both the features of the a and its id without a span. What do you do?

The following codes are useful for you? They are automatically generated by EpubSTAR.

Main.html:
<p> ..... country quiet, of his mother <a href = "Endmatter.html#ftn_2" id = "ftnref_2"><sup>[2]</sup></a> of poetry &ndash; ....</p>

Endmatter.html:
<p><a href = "Main.html#ftnref_2" id = "ftn_2">[2]</a>note text...</p>

dgatwood
01-20-2013, 10:59 PM
I take back what I said about the margin bug being fixed.

It turns out that in iOS, even if you delete a book entirely from within Kobo, if you then re-add the same book without explicitly killing Kobo in the task switcher, you'll find yourself looking at the old copy of the book. This fooled me into thinking that the bug was fixed, when in fact I was actually looking at a newer copy where I had worked around the bug.

So if you want compatibility with Kobo for iOS, do not under any circumstances set the left and right margins on the body tag to zero. :)

AlexBell
01-21-2013, 02:09 AM
I figured you were just making an example, but wanted to make sure.

As far as the link I have seen them done this way many times. That's how I do them. And I'm not aware of a reason to put a span around them - that's why I was asking. You never know what Feature will be added to these readers...
I would just use:


Cheers!

Thanks again. That looks good, and I'll give it a try.

Regards, Alex