Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 11-26-2010, 10:21 AM   #1
Man Eating Duck
Addict
Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.
 
Posts: 252
Karma: 69784
Join Date: May 2006
Location: Oslo, Norway
Device: Kobo Aura, Sony PRS-650
Layout for grammar examples

Hi! I'm trying to adapt a spanish grammar book for epub publication. I've run into a challenge: language researchers have a specific way of presenting sentence analysis (see the examples in the attached picture, given with permission from the author), and these are giving me a real headache. This is pretty much an accepted standard in grammar books, and according to the author this layout can not be changed.

For paper publications this is solved by judiciously applying tab stops, for epub I don't know of a good solution that will not look awful on a variety of devices. As the source Word document contains more than 1000 examples a scriptable/grepable solution is the only thing that's realistic.

The approaches I've considered so far is:

- Rendering the examples as images

Slow, looks ugly, might be very awkward on smaller screens, and don't handle text resizing.

- Using a monospace font

Looks ugly, doesn't work on devices which don't support monospace/embeddable fonts

- SVG

Slow, limited device support

- Invisible tables

Does not seem to render consistently across devices, time consuming

I'm starting to think that epub is not a feasible format, but any suggestions would be welcome
Man Eating Duck is offline   Reply With Quote
Old 11-26-2010, 07:17 PM   #2
jgray
Fanatic
jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.
 
Posts: 512
Karma: 1018067
Join Date: Mar 2008
Device: Galaxy Tab 10.1 & Note II
Since your picture didn't make it, I can't tell exactly what format you need. However, you can simulate tab stops in CSS/XHTML using "margin-left".

In your CSS, define the needed pseudo-tab stops:
Code:
.indent1 { margin-left: 5em; }
.indent2 { margin-left: 10em; }
In your XHTML, use span tags:
Code:
<p>Some text<span class="indent1">indented text</span><span class="indent1">another indent</span><span class="indent2">and another indent</span></p>
You may have to try using pixels, points or percentages instead of ems. See what works best on different size screens at different font sizes. Don't assume a specific screen size and font size. Of course, depending on how long each line is, things will wrap sooner or later. You can't avoid this with a reflowable format.

For one example of this technique, see how I used it to format some poetry: http://www.zianet.com/jgray/nessmuk/..._runes/19.html. There are other ways to accomplish the same thing. CSS is fairly flexible.

Edit: I was going from memory and it wasn't "text-indent", but "margin-left" that gives the desired result. With spans, the margin is counted from the end of the previous text.

Edit: See a better method below.

Joe

Last edited by jgray; 11-26-2010 at 09:51 PM.
jgray is offline   Reply With Quote
 
Enthusiast
Old 11-26-2010, 07:24 PM   #3
jgray
Fanatic
jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.
 
Posts: 512
Karma: 1018067
Join Date: Mar 2008
Device: Galaxy Tab 10.1 & Note II
Again, just guessing what you need... Also look at the dl and ul XHTML tags. These may be of use and will handle the indenting of wrapped text.

Joe
jgray is offline   Reply With Quote
Old 11-26-2010, 09:42 PM   #4
jgray
Fanatic
jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.
 
Posts: 512
Karma: 1018067
Join Date: Mar 2008
Device: Galaxy Tab 10.1 & Note II
Forget my previous example. This example will give you absolute tab stops, relative to the left margin.

Code:
.indent1 { position:absolute; left:10em; }
.indent2 { position:absolute; left:20em; }
Code:
<p>Some text<span class="indent1">indented text</span><span class="indent2">another indent</span></p>
<p>Another line of text<span class="indent1">more indented text</span><span class="indent2">another indent</span></p>
<p>Even more text<span class="indent1">even more indented text</span><span class="indent2">another indent</span></p>
Joe
Attached Thumbnails
Click image for larger version

Name:	example.gif
Views:	61
Size:	3.8 KB
ID:	61891  

Last edited by jgray; 11-26-2010 at 09:59 PM.
jgray is offline   Reply With Quote
Old 11-27-2010, 05:32 AM   #5
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 5,906
Karma: 4269879
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Ideally (I think) you would use "display: inline-block" and set a fixed width to the element, but alas, inline-block is not in the current ePUB spec, although it might be supported by some reading systems.

In any case, you have to think a few times before formatting, because anything you use might break badly when the screen or font size changes.
Jellby is offline   Reply With Quote
Old 11-27-2010, 09:14 AM   #6
Man Eating Duck
Addict
Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.Man Eating Duck juggles neatly with hedgehogs.
 
Posts: 252
Karma: 69784
Join Date: May 2006
Location: Oslo, Norway
Device: Kobo Aura, Sony PRS-650
I don't know why the picture didn't upload, I think it's because I tarried quite a while between uploading and actually posting. You guys guessed correctly anyway, but here's a second try

Quote:
Originally Posted by jgray View Post
Forget my previous example. This example will give you absolute tab stops, relative to the left margin.
Joe
Thanks a lot! I'll try this. It might still be too much work in order to avoid a pdf, but I'll give it a try. Since we're talking about a large amount of different examples I think I'll do the css inline.
Attached Thumbnails
Click image for larger version

Name:	grammar.png
Views:	74
Size:	79.4 KB
ID:	61903  
Man Eating Duck is offline   Reply With Quote
Old 11-28-2010, 12:40 AM   #7
jgray
Fanatic
jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.
 
Posts: 512
Karma: 1018067
Join Date: Mar 2008
Device: Galaxy Tab 10.1 & Note II
Attached is an HTML/CSS sample, using your picture for the text. I was too lazy do do the accented characters. This method works until you either exceed the line length of the reading device (word wrap doesn't work), or you use a font size that also forces things off screen.

I used two different methods to bold text. Use whichever one you like. Since I was using a class for underlining the column headings, it just made sense to do the same for bold in those span tags. I used ems, but you may want to see if another unit of measure works better under varying font and screen sizes.

I didn't try this code on my Sony reader, but see no reason it wouldn't work, provided you use a small enough font to fit the screen. The previously mentioned method of setting "margin-left" on the spans would work better for line wrapping, but things wouldn't line up as well. If anyone can think of an alternate method that handles large fonts and word wrap, please post. I suspect that getting columns to line up regardless of font size will not be possible.

Joe
Attached Files
File Type: zip Vocab.zip (1.1 KB, 44 views)
jgray is offline   Reply With Quote
Old 11-28-2010, 12:56 AM   #8
jgray
Fanatic
jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.
 
Posts: 512
Karma: 1018067
Join Date: Mar 2008
Device: Galaxy Tab 10.1 & Note II
Never Mind

Although what I just posted works fine in a web browser, it seems that ADE does not support the absolute positioning. Sony Reader Library (which I assume uses ADE) doesn't handle it either. So, the ADE based readers aren't going to work with this.

Next!

Joe
jgray is offline   Reply With Quote
Old 11-28-2010, 05:28 AM   #9
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 5,906
Karma: 4269879
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Those samples would better be done with tables.
Jellby is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Young Adult Hancock, H. Irving: Grammar School Boys Omnibus (Illustrated). v3. 4th Aug 2011 HarryT Kindle Books 2 08-04-2011 06:48 AM
Young Adult Hancock, H. Irving: Grammar School Boys Omnibus (Illustrated). v3. 4th Aug 2011 HarryT BBeB/LRF Books 2 08-04-2011 06:47 AM
Stylesheet examples? Skitzman69 Sigil 15 09-24-2010 08:24 PM
Examples kafkaesque1978 iRiver Story 1 07-26-2010 03:49 PM
English Grammar books astrodad Reading Recommendations 16 08-17-2008 04:45 PM


All times are GMT -4. The time now is 11:55 PM.


MobileRead.com is a privately owned, operated and funded community.