Wednesday, January 9, 2013

An html title page


Over the course of five years and nearly two dozen books, I have settled on this simple and (in my opinion) handsome format for the title page:

<p class="large">Title</p>

<p class="medium">Sub-title</p>

<p class="small">Author</p>

<p class="small">Publisher</p>

Just copy and paste it to a convenient file, where you can substitute your information for the rudimentary stuff here. With the style sheet posted earlier on this blog, your title will be displayed at twice the size of the text in your book, bold-faced, centered on the page, and dropped down just a small bit from the top of the page. The sub-title, author name, and publisher name will follow in the same format and in progressively smaller type.

If you want to get fancy, you can italicize the title, or put the entire title in capital letters, or both. You can also use a publisher's colophon or logo (a small symbol) to separate the author and publisher names. This is mine:

<div class="icon"><img src="njlogo.gif" alt="Image of book"></a></div>

Again, the style sheet specifies that the colophon will be centered on the page and dropped down a bit from the author name.





32 comments:

  1. What is the maximum pixel size I should be using to format sheet music for Kindle that will not split the music across two screens? Amazon tells me the Kindles are not set up to accept sheet music, yet I see a lot of sheet music being published. Thanks!

    ReplyDelete
  2. I don't think anything goes across two screens unless you use fixed format. (Since I don't do fixed format, I can't be sure about that.)

    The recommendation is for 600 pixels wide. I have been using 800 pixels for better appearance on the larger tablets. I also use a width=100% instruction.

    ReplyDelete
  3. Notjohn, I love the wallpaper here! How can I get it?

    And by the way, you look like someone very famous. Ever been told that?

    dk

    ReplyDelete
    Replies
    1. The bookshelf? It just came with the blog. As for my personal beauty, my mother always assured me it would take me to the top.

      Delete
  4. Good day sir,
    I have a couple of e-books up already and after getting your guide, I can acknowledge they need a lot of work! My question to you is, how would you go about editing/styling a book that doesn't have paragraphs per say; my e-books are basically broken into sections with each page containing an image (diagram) and text pertaining to that image. Thank you in advance for any advice or tips.

    CB

    ReplyDelete
  5. This is difficult in a reflowable e-book. I don't do fixed-format books, so I can't advise you about that. If an image is vertical, you are very likely to wind up with the image on one "page" and the caption on another. If I can, I try to finesse this by putting the caption information first, as part of the text; then the reader sees the image, probably on the next "page." That won't work very well for you. Probably the best approach would be to make each image and caption a discrete chapter or section. (I would do this in Sigil.) This would avoid the possibility, which I have seen in a couple of picture books, where the caption appears on a following "page" along with the next, unrelated image, and so on for page after page.

    ReplyDelete
    Replies
    1. Thank you for the advice. That is exactly what happened to my third book, which is why I took it down. The images and text where not 'lining' up properly.

      Delete
  6. OK, so let me try and see if I have got this correct (and I promise this will be my last question).
    You write the book in Word. You combine all of these templates and style sheet into one file in Note++. You convert Word into HTML using the website. You then edit the templates by adding your book information from the conversion into the appropriate areas. You save that as an html file and open in Sigil. You then add the page breaks, Pretty Tidy, and validation there. Do one more validation on the web again. Then publish in the appropriate places. Correct?

    ReplyDelete
    Replies
    1. Well, I streamline this a lot. I write the book in Word (usually). I paste the Word doc into Word2CleanHtml dot com online. I open the html in Sigil and add the separate style sheet, which requires me to add a line to the basic Sigil heading. But I have been doing this for years, and if something goes wrong, I know how to fix it on the fly. Unless you are very comfortable working in html, it's much safer to do it by the numbers, the first few times anyhow.

      (That's Notepad++ and Pretty Print Tidy. Don't blame me! I didn't name them!)

      Delete
    2. Again thank you so much. I have everything working properly except the publisher logo; that will not appear. My other three images show fine. I've tried rewriting the code different ways. I even eliminated the closing A html tag that you have listed (as that I could not find the open A tag and it keep putting up an error for it). Any ideas??

      Delete
    3. Again thank you so much. I have everything working properly except the publisher logo; that will not appear. My other three images show fine. I've tried rewriting the code different ways. I even eliminated the closing A html tag that you have listed (as that I could not find the open A tag and it keep putting up an error for it). Any ideas??

      Delete
    4. You're right; it doesn't need a closing tag. I'll fix that. If you are using the div.icon class in your CSS, then in the html it should say something like this:

      div class="icon" img src="xxxx.jpg" alt="Publisher Logo" /

      where xxxx is the name of your publisher logo.

      With the usual angle brackets on either side. (If I include the brackets, the software won't allow them.)

      Does that work?

      Delete
    5. That is what I have; at least I think so. I'm copying and pasting what the actual code is from Sigil (minus the brackets); maybe I'm not seeing something:
      div class="icon" img alt="publisher logo" src="smcebpresslogo.gif" / /div

      Delete
    6. Okay, but your image is in the Images folder, right? So make it src="../Images/smcebpresslogo.gif"

      Delete
  7. Tried with and without image folder (actually all but the publisher icon appeared fine when not using the image folder). Some how now, the alignment of the title page and toc are off. I think it might be time to scrap the current version and start from scratch. :D

    ReplyDelete
    Replies
    1. Go to the Images folder in the file list on the left. Right-click and choose Add Existing Files. You can add all the images at this point.

      You can also use the top menu: File > Add > Existing Files

      There's an online help manual at http://web.sigil.googlecode.com/git/files/OEBPS/Text/introduction.html though it's not up to date.

      Delete
  8. Do you see anything wrong with the following code? The one for the logo works fine but the one for all the other images do not. Help please. {opening/closing brackets replaceded so I can post here}

    Logo
    {div class="icon"}{img alt="image of logo" src="../images/smcebpresslogo.gif" /}{/div}

    Other Images
    {div class="image" id="court"}{img alt="tennis court" src="../images/image001.jpg" width="100%" /}{/div}

    ReplyDelete
  9. If you have image001.jpg in Sigil's Images folder, and if you have div.image in your style sheet, that ought to work. Is it an external style sheet, or if included in the file does it appear in every file?

    Try it without id= and alt= (which aren't absolutely necessary). Does it render now?

    (And you are looking at it in Sigil?)

    ReplyDelete
  10. Hi, N. J. I was hoping you could help me. Does your book have instructions on how to strip the source file within the mobi.file? I've managed to find kindleunpack through Calibe, and I've unpacked the mobi file. I then found kindlestrip, but it is a python script and I don't know python at all. The representative at Amazon is saying we need to remove the original source file in order to have the book priced at 99 cents. I can't find any directions anywhere on exactly how to do this. Would you happen to know or is it in your book? I find it strange though that they're asking this when I can submit and epub file.

    Thank you!

    ReplyDelete
  11. Well, you can't price at 99 cents if the book is over a certain size, so what they're saying makes a kind of sense, except that it is not you but the KDP that puts the source file into the final "mobi" (which contains a Mobi 7 file for the old Kindles, a KF8 file for the newer ones and apps, and most of the time the original source file). I wouldn't know how to remove the source file (except possibly by uploading bare html with a style sheet included) and I'm not sure that anyone else does. Sorry!

    ReplyDelete
  12. Just a note to say "Thank you" for sharing your knowledge so generously.

    ReplyDelete
  13. This comment has been removed by a blog administrator.

    ReplyDelete
  14. Thank you for all your helpful advice. Do you know of a way to aggregate the monthly sales data into one spread sheet or similar?

    ReplyDelete
    Replies
    1. No, I obsessively look at my month-to-date sales, print screenshops, add them up, but then next month I throw the score card away. In July and January, I download the Prior Month reports for the previous six months, squeeze the columns so they fit on a single page, and print them. Then I add them up by sales for each title, which I enter on a file going back to my first e-book in 2005, something called Fatbrain. Probably I'll throw away that file some day, too. What purpose does it serve?

      Delete
  15. I want to publish my ebook in hindi language. Then do amazon / KDP publish ebook in hindi language. If publish then please tell me the process , how to i publish my new ebook on amazon / KDP.

    ReplyDelete
    Replies
    1. Alas, Hindi is not a supported language for self-publishers. (Amazon probably sells Hindi e-books, but they come from commercial publishers.) The problem is that it's not possible for Amazon to compare the text for possible violations of copyright or other rules. At present, only western European languages are supported -- including some rather obscure ones!

      Delete
  16. Hi Notjohn

    Thank you for a great and easy to read and understand/use book :)

    I have a question regarding converting to .mobi for Kindle. When using Calibre, "justify" is lost, no equal margins. Do you know what to do about that ?

    All the best
    Carsten

    ReplyDelete
    Replies
    1. I don't use Calibre. As I understand it, to create an e-book you're better off with Calibre Editor (I haven't used that, either). I much prefer Sigil. You can get the latest well-tested version at https://github.com/Sigil-Ebook/Sigil/releases/tag/0.8.6

      But however you do it, you should be able to use justification. Note that it's not terribly important, because Amazon's default is justified, so if you upload a book that is ragged right, it will appear that way on the Look Inside sample but the downloaded book will be justified. The only way to over-ride that is to SPECIFY left-aligned in the style sheet or inline style.

      Delete
  17. Hello Notjohn,
    I have just purchased your guide, after I wrote three books with Word 2007 and converted them with KDP, with a long lasting process to reach a minimum acceptable level of quality.
    Somebody has suggested me to try the road of HTML-EPUB, which I do not know.
    Well, I find your guide and your template very useful to start; after reading twice your book I am beginning to convert part a book of mine into your template for drilling, but I am facing a difficulty: any suggestion for the foot-notes?
    Thanks in advance
    A.C. Milan

    ReplyDelete
    Replies
    1. First of all, they should be end-notes, since there's no "page" in a Kindle book, hence no foot! Word will convert footnotes to endnotes with a click or two.

      This is the only place where I really appreciate Word when it comes to building an e-book. If your citations work in Word, they'll work in html when you run the Word doc through Word2CleanHtml dot com online.

      Incidentally, since it can be hard to click on a superscript numeral, I prefer to number notes in the same font as the text, enclosed in brackets, like this: [16] and if you have a lot of them, maybe even [001], [016], [116], and so on.

      Delete
  18. I am a first-timer who has been trying for two weeks to submit a kids' book to KDP. My source document is a Word file converted to html. It looked great in my copy of Kindle Previewer but the jpeg illustrations don't render when I preview the KDP mobi file using the download preview option on KDP. Very frustrating.

    ReplyDelete
    Replies
    1. Alas, I've never done a fixed-format book and know nothing about the process. The usual reason for not seeing images is that they are not included in the file you have uploaded. Images travel with a Word doc, with an epub, and with a mobi, though not with an html file. As I understand it, fixed format is simply a PDF, and that too ought to carry the images with it. Why don't you ask on the KDP forum at https://kdp.amazon.com/community ?

      Delete

English only. No links. Keep it clean.