font-size headings

[DaleDe]

If the title page as an image contains only text letting it change the ratio may be better than having bars on the edges of the screen. It all depends on which you prefer. Fat letters or tall skinny ones might be ok. For an actual picture then maintain aspect ratio is more important as to not distort the image.

Dale

[JLius]

Toxaris

Tried your code:

<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 992 1403" width="100%">
      <image height="992" width="1403" xlink:href="Titelblad.png"/>
    </svg>

Toxaris

Result: The text does not fit in the screen. It's all in the upper right corner. I also lose some text at the bottom, even though the titlepage seems smaller than the viewscreen. Where do I go wrong? Height and width is exactly the same aspect ratio as I saved the png in.

[RbnJrg]

Originally Posted by JLius

Toxaris

Tried your code:

<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 992 1403" width="100%">
      <image height="992" width="1403" xlink:href="Titelblad.png"/>
    </svg>

Toxaris

Result: The text does not fit in the screen. It's all in the upper right corner. I also lose some text at the bottom, even though the titlepage seems smaller than the viewscreen. Where do I go wrong? Height and width is exactly the same aspect ratio as I saved the png in.

Why don't you try what I told you in

https://www.mobileread.com/forums/sho...7&postcount=42

Just do a try and tell us your results.

[Toxaris]

Originally Posted by JLius

Toxaris

Tried your code:

<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 992 1403" width="100%">
      <image height="992" width="1403" xlink:href="Titelblad.png"/>
    </svg>

Toxaris

Result: The text does not fit in the screen. It's all in the upper right corner. I also lose some text at the bottom, even though the titlepage seems smaller than the viewscreen. Where do I go wrong? Height and width is exactly the same aspect ratio as I saved the png in.

That is because you did not make the change correctly...

<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 992 1403" width="100%">
      <image height="1403" width="992" xlink:href="Titelblad.png"/>
    </svg>

The height and width are reversed in the viewBox and in the image. Also, the height should be bigger than the width.

[JLius]

RbnJrg: Tried yours at first, but didn't work either.
Just now discoverd that the png didn't fit the screen either when I opened it in windows.
Tried saving it with 'interlaced' disabled (don't know what that is), and now your code worked just fine, thank you!

Toxaris: your code still does not. What's the advantage of your svg wrap?

[JLius]

Toxaris: my bad, good call :-)

What's the advantage of that svg wrap as oposed to RbnJrg's?

[JLius]

I'll answer that one myself: it's the preserve ratio isn't it.

[JLius]

I 've learned a lot, yet again. Thanks all!

[Toxaris]

Originally Posted by JLius

I'll answer that one myself: it's the preserve ratio isn't it.

Not only that, but also resizing depending on the screen size. So, if your screen is smaller, it is reduced and if your screen is bigger, it gets enlarged. All while keeping the aspect ratio.

[JLius]

I'll do that for my covers also then. Calibre, by default, inserts "none" for the aspectratio.

[RbnJrg]

Originally Posted by JLius

I'll answer that one myself: it's the preserve ratio isn't it.

The svg wrapper has a lot of properties, do a search in this forum and you'll find a lot of info. But in this case, if the image is used without a svg wrapper (as I told you) it also maintains the ratio because the "height" of the image is set to "100%" and the "width" is set to "auto". Do the try by setting your device reader in portrait and landscape mode and you'll always see the whole image and with its ratio preserved. But don't take this as if I don't want you to use svg wrappers Personally I use them a lot and that was my first conceil to you (but to use text ) You gave me your reasons to use a image as title page and at this case I think that a svg wrapper could not help significantly (especially if you didn't understand its operation). Unless that your title page has arranged the text of that way that you can use the svg property "preserveAspectRatio" with different values than "meet" (that is "slice") and "xMidYMid" (for example "xMidYMax"). Then, the svg wrapper will have a lot of meaning and you should used it without thinking a lot

Regards
Rubén

[DaleDe]

Originally Posted by JLius

Toxaris: my bad, good call :-)

What's the advantage of that svg wrap as oposed to RbnJrg's?

One advantage is that is scales better than just a bitmap image. It can also maintain image ratio although setting width to 100% in a bitmap will often do the job. It can scale without maintaining aspect ratio. It also permits cropping the image which can be useful if you hate bars at the top/bottom or sides when the screen aspect ratio doesn't match the picture. It can also permit captions or text to be placed with the image or canvas area and still be searchable. This will also stop the caption or text from moving to another page.

[theducks]

Originally Posted by JLius

I'll do that for my covers also then. Calibre, by default, inserts "none" for the aspectratio.

There is a setting in Calibre conversion to maintain aspect
Preferences:Output Options: (tick box)

Remember, this only applies to the first time conversion unless you use the defaults tick box on the individual books)

[roger64]

@RbnJrg

One friend reported to me a jumbled output (akin to the one of ADE 1.7.3) of your "title page", both for Kindle4 and Paperwhite1. Have you the same information? Is yes, how do you explain it?

[RbnJrg]

Originally Posted by roger64

@RbnJrg

One friend reported to me a jumbled output (akin to the one of ADE 1.7.3) of your "title page", both for Kindle4 and Paperwhite1. Have you the same information? Is yes, how do you explain it?

Hi Roger:

I did the try in my K4NT and all looks ok; here you can see the respective screenshots (in portrait and landscape mode):



Below you can see the respective .azw3 file. If you open it with Kindle Previewer, you'll see that the KPW preview is also ok. Maybe your friend compiled my original epub with Calibre instead of kindlegen/Kindle Previewer and for that reason he got what he got. Send the .azw3 attached to this post to your friend to know how this file appears in his Kindles.

Regards
Rubén