02-25-2020, 03:05 PM | #1 |
Running with scissors
Posts: 1,552
Karma: 14325282
Join Date: Nov 2019
Device: none
|
html img tag versus svg wrapped image tag
1) Why do some books use an html img tag for the cover page while Calibre's cover page generator, Calibre's Generate Cover plugin, and Sigil all use the svg wrapped image tag? (With an img tag Calibre's editor's preview window shows it full size with scroll bars when the image is too big for the window while Sigil's preview window and Calibre's reader resize it to fit the window.)
2) In the body of a book what are the advantages or disadvantages to using an svg wrapped image tag versus an html img tag? Complexity of the svg method is probably one disadvantage with it. I've never seen this done so I'm assuming that the advantages aren't there. |
02-25-2020, 06:06 PM | #2 |
A Hairy Wizard
Posts: 3,095
Karma: 18727053
Join Date: Dec 2012
Location: Charleston, SC today
Device: iPhone 11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire
|
SVG wrapped images will be able to fill the screen without distorting the aspect ratio. Great for full page images like cover/title/maps.
Some devices don't like svg in anything except the cover. Also, if you want an embedded image that doesn't take up the whole page, I would just style a div as a container. There are several discussions of this topic on MR if you do a quick search. |
02-25-2020, 07:31 PM | #3 | |
Bookmaker & Cat Slave
Posts: 11,462
Karma: 158448243
Join Date: Apr 2010
Location: Phoenix, AZ
Device: K2, iPad, KFire, PPW, Voyage, NookColor. 2 Droid, Oasis, Boox Note2
|
Quote:
Hitch |
|
02-25-2020, 11:18 PM | #4 | |||
Wizard
Posts: 2,297
Karma: 12126329
Join Date: Jul 2012
Device: Kobo Forma, Nook
|
Quote:
Also read the rest of the discussion in that thread. Quote:
If you're creating a pure EPUB, or designing the EPUB for personal use, then you may want to use the SVG wrapper. Quote:
InsertImageSVG You rarely see it because people are usually designing books for max compatibility across devices (plus conversion to Kindle). SVG Wrappers also have some other advantages such as "keeping image and caption together", like RbnJrg has written about many times over the years (especially his Post #5): https://www.mobileread.com/forums/sh...d.php?t=314639 Last edited by Tex2002ans; 02-25-2020 at 11:31 PM. |
|||
02-26-2020, 05:03 PM | #5 | |
Resident Curmudgeon
Posts: 73,998
Karma: 128903378
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Quote:
The default of Calibre is to make the cover full screen even if that is not aspect ratio correct. You have to change the option to make it the correct aspect ratio. |
|
02-26-2020, 06:24 PM | #6 |
Bibliophagist
Posts: 35,461
Karma: 145525534
Join Date: Jul 2010
Location: Vancouver
Device: Kobo Sage, Forma, Clara HD, Lenovo M8 FHD, Paperwhite 4, Tolino epos
|
As long as the image size is specified correctly and the code included 'preserveAspectRatio="xMidYMid meet"', I've never seen an SVG wrapped image use an incorrect aspect ratio. Fail to fill the screen yes since the image aspect ratio may not be the same as the screen aspect ratio.
|
02-26-2020, 07:21 PM | #7 | |
Resident Curmudgeon
Posts: 73,998
Karma: 128903378
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Quote:
Covers don't fill the screen (in most cases) because of the aspect of pBooks vs. the aspect of Readers, Also, given that pBooks aspect has gotten taller, the cover will fill even less of the screen. |
|
02-26-2020, 09:31 PM | #8 | |
Bibliophagist
Posts: 35,461
Karma: 145525534
Join Date: Jul 2010
Location: Vancouver
Device: Kobo Sage, Forma, Clara HD, Lenovo M8 FHD, Paperwhite 4, Tolino epos
|
Quote:
As for your second point, considering the number of ebooks that do not have a pbook variant but still use a 16:9 or higher aspect ratio for the cover image, I'm not sure if the pbook aspect ratio has much if anything to do with the odd choices used by whomever created the cover image. I tend to suspect that they wanted the cover image to fill a 16:9 or 16:10 phone/tablet display. As the 18-19.5:9 phone displays get more common, I suspect we will find more covers sized to fit those displays. And here we are with our humble eInk ereaders with a 4:3 (though I've seen one referred to as having a 12:9) aspect ratio. |
|
02-27-2020, 03:16 AM | #9 | |
Resident Curmudgeon
Posts: 73,998
Karma: 128903378
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Quote:
|
|
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
How to show books with only 1 tag? Dynamic tag or virtual library? | cd2013 | Calibre | 4 | 03-01-2019 06:41 PM |
How to keep a Header and svg wrapped img on the same page | nodestar | ePub | 8 | 05-08-2017 08:05 PM |
svg image inside span tag in mobi file not display numbers | Hala Aly | Workshop | 3 | 09-12-2012 08:00 AM |
HTML Meta tag for cover image URL? | MrPLD | Conversion | 5 | 01-29-2012 12:15 AM |
img tag question.. | scott.a.andrew | ePub | 9 | 02-18-2010 02:38 PM |