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

Go Back   MobileRead Forums > E-Book General > Writers' Corner

Notices

Reply
 
Thread Tools Search this Thread
Old 08-03-2023, 02:49 PM   #1
IvorT
Junior Member
IvorT began at the beginning.
 
Posts: 6
Karma: 10
Join Date: Aug 2023
Device: none
Help! Advice on discography layout...

Over the last 30 or so years I've helped a mate out with DTP on several of his musical encyclopedia's. For his current project he's wanting to go down the Ebook route rather than print and I'm struggling to find a way to approximate the layout we've used for the discographical & band personnel listings.

Is there anyway to do this? I've tried tables & CSS but haven't found a solution that I'm happy with.

Attached is a screen grab extract showing the kind of layout we've used, although for the Ebook it'll be one-column rather than two...

Any suggestions much appreciated.
Thanks
Ivor
Attached Thumbnails
Click image for larger version

Name:	layout_sample.jpg
Views:	128
Size:	223.5 KB
ID:	202955  
IvorT is offline   Reply With Quote
Old 08-03-2023, 05:40 PM   #2
Karellen
Wizard
Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.Karellen ought to be getting tired of karma fortunes by now.
 
Karellen's Avatar
 
Posts: 1,038
Karma: 4911876
Join Date: Sep 2021
Location: Australia
Device: Kobo Libra 2
I would also use tables, as you have done. Maybe some parts you could style with larger indents?

What didn't you like about your attempt with the tables? Maybe you can post the code you used and there may be a way to improve it.
Karellen is offline   Reply With Quote
Old 08-03-2023, 08:26 PM   #3
Sarmat89
Evangelist
Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.Sarmat89 ought to be getting tired of karma fortunes by now.
 
Posts: 482
Karma: 2267928
Join Date: Nov 2015
Device: none
In E-books, you don't need to cram the stuff into the page. Use vertical space, it is limitless.
Sarmat89 is offline   Reply With Quote
Old 08-03-2023, 09:01 PM   #4
Aleron Ives
Guru
Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.
 
Posts: 862
Karma: 10345020
Join Date: Sep 2022
Device: Kobo Libra 2
Yes, the way you have information aligned in rows won't work on an e-book. If the reader increases the font size too much or simply has a small screen, the rows will be forced to wrap onto new lines, thus breaking your table layout. Unless you want to use PDF to prevent the text from reflowing (boo! hiss!), you'll need a new layout that doesn't rely on fixed-width tables.
Aleron Ives is offline   Reply With Quote
Old 08-05-2023, 05:00 AM   #5
IvorT
Junior Member
IvorT began at the beginning.
 
Posts: 6
Karma: 10
Join Date: Aug 2023
Device: none
Quote:
Originally Posted by Karellen View Post
What didn't you like about your attempt with the tables? Maybe you can post the code you used and there may be a way to improve it.
Thanks - I had another go with tables & managed to get something which is more promising... Part of the problem I had was due to my initial attempt using Scrivener to import an RTF file & then Calibre to add HTML tables. I'd missed some of the CSS formatting that had been automatically added & that was preventing me from seeing any changes I'd made. e.g. a border setting meant that tables had a persistant black border on the bottom edge.

(I've now discovered Sigil, which I'm finding much more straight forward)

I'm not sure on the etiquette of posting code, but have attached a test epub with two different table layouts. At the moment I'm leaning towards the "Alternate" layout at the end of the example band entry.

So far I've only tested with Kindle Previewer, Calibre e-book viewer, and Icecream.

Many thanks
Ivor
Attached Files
File Type: epub test 1d.epub (9.4 KB, 72 views)
IvorT is offline   Reply With Quote
Old 08-05-2023, 06:13 AM   #6
Quoth
the rook, bossing Never.
Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.
 
Quoth's Avatar
 
Posts: 10,401
Karma: 82723493
Join Date: Jun 2017
Location: Ireland
Device: All 4 Kinds: epub eink, Kindle, android eink, NxtPaper11
Use LO Writer (edit in ODT) and extra Save As in docx for Calibre. The styles to CSS is 1:1 and accurate. Only some image CSS needs edited where you for example want image-height: auto; image-width: 90%; (or whatever).

Test also on Lithium on a 6″ or less Android phone, or iOS equivalent if you don't have small eink ereaders.

Scrivener and Apple Pages are more suited to paper. LO Writer works well for paper or epub (via docx and Calibre). I always make a new copy of final proofed version for epub (and thus Kindle) and edit styles for paper. Then PDF direct export. Have Style & Outline windows open. No direct formatting except italic, superscript and subscript (inside a paragraph).

Last edited by Quoth; 08-05-2023 at 06:18 AM.
Quoth is offline   Reply With Quote
Old 08-26-2023, 04:08 AM   #7
IvorT
Junior Member
IvorT began at the beginning.
 
Posts: 6
Karma: 10
Join Date: Aug 2023
Device: none
Thanks all... I thought I was getting somewhere. @Quoth's recommendation to test on Lithium/small screen was useful & I added a media query to reduce the font size in the tables. However, when I test on both a large iPad & small iPhone most of the CSS looks like it is ignored & the result is no good. The attached shows a sample displayed in an my wife's old Android phone, iPad & Kindle, delivered using the Kindle app & 'send to Kindle' to website.
Is there any way to solve the problem on Apple devices?
Attached Thumbnails
Click image for larger version

Name:	3 devices - 01.jpg
Views:	69
Size:	558.9 KB
ID:	203366   Click image for larger version

Name:	3 devices - 02.jpg
Views:	66
Size:	566.6 KB
ID:	203367  
IvorT is offline   Reply With Quote
Old 08-26-2023, 08:12 AM   #8
Quoth
the rook, bossing Never.
Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.
 
Quoth's Avatar
 
Posts: 10,401
Karma: 82723493
Join Date: Jun 2017
Location: Ireland
Device: All 4 Kinds: epub eink, Kindle, android eink, NxtPaper11
You can't make it work by reducing the font! One of the best features of ebooks is the user's ability to change font size.

You need to make information be in sequential blocks.

The iOS (iPad and iPhone) rendering depends almost entirely which app is used.
Quoth is offline   Reply With Quote
Old 09-02-2023, 05:17 AM   #9
IvorT
Junior Member
IvorT began at the beginning.
 
Posts: 6
Karma: 10
Join Date: Aug 2023
Device: none
In the media query for small screens I increased the % column width & reduced the font % size, which improved the overall look.

As a text book, it won't be read sequentially but the discography/personnel details need to have a clear layout.

I've now tested the book using Apple books on the ipad/iphone & they're acceptable but with 'Kindle for ios' (using Send to Kindle webpage & download app) I can't even get vertical space to show between the tables. I'm not sure if this is a problem with the delivery method I'm using, or a limitation of 'Kindle for ios'. So far I've tried:-
  • specifying 'margin-top' / 'margin-bottom' separately in the CSS
  • adding "!important" to the CSS
  • using em & px spacing
  • placing tables inside div tags with the CSS class applied to the div
  • blank paragraphs with non-breaking space between tables
If I apply the CSS class to a para tag or a div tag own, then 'Kindle for ios' displays the vertical space correctly...

There's obviously other problems with the tables in 'Kindle for ios' but getting a space between them is pretty basic. Not sure what to do from here?

I've checked the book using Calibre's 'Check Book' option; Kindle Previewer's 'Quality Check'; ePubcheck cmd line; and W3CSS validation...

Thanks!
Ivor
IvorT is offline   Reply With Quote
Old 09-02-2023, 03:53 PM   #10
IvorT
Junior Member
IvorT began at the beginning.
 
Posts: 6
Karma: 10
Join Date: Aug 2023
Device: none
Hmm... this doesn't bode well:
https://www.jutoh.com/bookv2/html/section-0018.html

"Kindle for iOS is less capable when rendering tables than other KF8 Kindle apps and devices. Cell widths cannot be specified as percentages, and the table width attribute is not recognised. However, it does recognise the min-width attribute, so when generating Mobipocket files, Jutoh adds a min-width attribute to the table."
IvorT is offline   Reply With Quote
Old 09-02-2023, 04:35 PM   #11
Aleron Ives
Guru
Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.
 
Posts: 862
Karma: 10345020
Join Date: Sep 2022
Device: Kobo Libra 2
You have two options:

1) Keep the table layout you're used to and use PDF to set the table layout in stone, the way you would on a printed page. This forbids the user from changing the formatting at all, so the user can only zoom the PDF and pan around the virtual page.

2) Abandon your table layout and adopt a new layout that supports reflowable text and arbitrary font sizes.

Quote:
Originally Posted by IvorT View Post
As a text book, it won't be read sequentially but the discography/personnel details need to have a clear layout.
In order to do #2, you must abandon this idea and accept that the user can and will break your formatting decisions by changing the font face, font size, and margins to his liking. If you can't accept this and require a fixed format, you must use PDF to simulate a printed page and prevent the user from overriding your formatting decisions.

You will never be able to do what you're trying to do with tables and CSS. You're trying to force an e-book to look like a printed page, and e-books can't do that. That's what PDF is for.
Aleron Ives is offline   Reply With Quote
Old 09-16-2023, 04:39 AM   #12
IvorT
Junior Member
IvorT began at the beginning.
 
Posts: 6
Karma: 10
Join Date: Aug 2023
Device: none
Thanks @Aleron Ives. I've now replaced all the tables with lists for the discographies / personnel sections. Formatting some sections in italics and adding a UTF-8 character between each section seems like a reasonable compromise.
Many thanks!
Ivor
Attached Thumbnails
Click image for larger version

Name:	mr_temp.jpg
Views:	54
Size:	105.8 KB
ID:	203776  
IvorT is offline   Reply With Quote
Old 09-16-2023, 05:42 AM   #13
Aleron Ives
Guru
Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.Aleron Ives ought to be getting tired of karma fortunes by now.
 
Posts: 862
Karma: 10345020
Join Date: Sep 2022
Device: Kobo Libra 2
Kudos for sticking with EPUB and adjusting your formatting techniques for reflowable text. Your users with small screens will be grateful that they don't have to zoom and pan around a PDF.
Aleron Ives is offline   Reply With Quote
Old 09-16-2023, 11:23 PM   #14
azimuth
Enthusiast
azimuth plays well with othersazimuth plays well with othersazimuth plays well with othersazimuth plays well with othersazimuth plays well with othersazimuth plays well with othersazimuth plays well with othersazimuth plays well with othersazimuth plays well with othersazimuth plays well with othersazimuth plays well with others
 
Posts: 32
Karma: 2538
Join Date: Aug 2023
Location: NW US
Device: none
Filament Group Tablesaw has a toggle method where you can switch on/off various columns with a mere click.
Filament Tablesaw

Another nice one is RWD Table Patterns which has a similar toggle off/on method.
RWD Tables
azimuth is offline   Reply With Quote
Old 09-17-2023, 08:10 AM   #15
Quoth
the rook, bossing Never.
Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.
 
Quoth's Avatar
 
Posts: 10,401
Karma: 82723493
Join Date: Jun 2017
Location: Ireland
Device: All 4 Kinds: epub eink, Kindle, android eink, NxtPaper11
Quote:
Originally Posted by azimuth View Post
Filament Group Tablesaw has a toggle method where you can switch on/off various columns with a mere click.
Filament Tablesaw

Another nice one is RWD Table Patterns which has a similar toggle off/on method.
RWD Tables
Won't work on end users ereaders.
Quoth 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
Converting two-page layout pdf into one-page layout Gergely PDF 3 03-08-2019 10:03 PM
Seeking Layout Advice GrannyGrump ePub 8 12-13-2012 10:03 AM
Layout Questions ebenjamin30 Workshop 3 11-27-2012 07:45 PM
Technical eBook Layout Advice Reg22 Writers' Corner 7 08-20-2010 02:10 PM
Layout format? Seligman Sony Reader Dev Corner 9 06-19-2008 06:29 AM


All times are GMT -4. The time now is 09:38 AM.


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