3

I'm currently designing an online book reader.

I have two options:

  1. Every page of the book has its own webpage. This would mean millions of webpages. Upsides: it saves a lot of bandwidth as an average user only reads a few pages. Downsides: the user has to click to view the next page and then wait 1 second for it to load.

  2. Every book has only 1 webpage. This would mean thousands of webpages. Upsides: the navigation is easier since the user only has to scroll and everything is already loaded (I could make the images load only when they're visible.) Downsides: more bandwidth, original page load takes a little longer.

Which would be better for user experience and which would be better for SEO? Would Google ignore the pages since they'd be massive, an entire book of content on one page... or perhaps Google would like that?

  • How about both: example.com/books/some-random-book#page-42 – Martijn Dec 28 '15 at 10:11
  • Another option would be a web page per chapter. – Stephen Ostermiller Apr 26 '16 at 13:48
  • Way back in the day, I converted about 100 or so Gutenburg Press books into HTML versions and posted them online. You do not want a web page per book web page nor do you want an entire book as a single web page. Chapters worked well at the time with only a few being rather large. Of course, you can use other technologies such as AJAX and JS, Java, to get the same work done. – closetnoc Aug 24 '16 at 18:42
  • Can you please check my answer and revert, if that suits your design – abhinsit Aug 25 '16 at 6:13
1

If I were you, I would go for one book per page to favour the user because this is currently one of the most important point to successfully launch a site (UX rocks). Indeed, I think your users wouldn't appreciate to load the book page per page with one old-fashioned HTTP request (I mean non asynchronous). I think it could be a good solution to load each page dynamically (I mean one page / one Ajax request); it can be loaded fast.

Regarding Google, I wouldn't display the entire text of the book on one page. Therefore, it would display a lot of text with possible duplicate content with other sites (some sites can quote a book several times). However, Google takes into consideration pages with a lot of text but it's not always a good solution (pagination can be more desirable).

Moreover, it's easier to maintain thousands of pages than millions.

1

Every page of the book has its own webpage. This would mean millions of webpages.

Answer => Having more number of quality content is certainly a good idea. Once your site gets some visibility from Google, Even if every page gets one organic traffic in a month, then you will end up with millions of free organic traffic from Google. I am not sure about how many pages & quality of your pages.

Upsides: it saves a lot of bandwidth as an average user only reads a few pages.

Answer => Does any care of bandwidth nowadays ? You get servers with 1TB bandwidth for less than $100 in a month. Assume you still have a bandwidth concern , then go for lazy loading. It gives better user experience and also saves BW.

Downsides: the user has to click to view the next page and then wait 1 second for it to load.

Answer => go for lazy loading, It solves the problem.

Every book has only 1 webpage. This would mean thousands of webpages. Upsides: the navigation is easier since the user only has to scroll and everything is already loaded (I could make the images load only when they're visible.) Downsides: more bandwidth, original page load takes a little longer.

Answer => Explained above.

Which would be better for user experience and which would be better for SEO? Would Google ignore the pages since they'd be massive, an entire book of content on one page... or perhaps Google would like that?

Answer => You can go with individual pages with good user experience, All the problem mentioned by you can be resolved by smart UI design & program, there are solns.

  • 1
    Does anyone care about bandwidth? If you don't care, Google will downgrade your site in page rank and your visitor, sitting in the airport reading this on his phone will hate you. – Rob Mar 27 '16 at 12:11
1

Your application is online book reading. Each book has a huge content and is arranged based on pages. Each page and content inside book is relevant.

When you talk w.r.t seo, from a crawler's perspective it would rank your book pages if it is able to read the book content properly and found it useful.

So lets try and solve both user-friendliness + seo problem, because both are important.

From seo : you get users, and acquiring users make sense if they find your content good + user-friendly. More they use your site has a positive impact on seo as well.

Approach i would suggest is have one url per book. But each page of this book is a separate web url to crawler, but in a paginated way + A single page book app for the reader

Sample Url would be:

http://www.example.com/books/book1/ -> This would be the main landing url of a book webpage.(essentially page1 of your book)

This would have a next/prev or direct go to a page option, which are essentially hyperlinks of type:

http://www.example.com/books/book1/?page=2
http://www.example.com/books/book1/?page=3
http://www.example.com/books/book1/?page=4
.
.
.
http://www.example.com/books/book1/?page=N

But on clicking above links, don't reload the page. Get the content from ajax and replace that in a main-container that contains the content of the pages. (You can prefetch few pages intelligently)

So it does not disturb the user behavior. Also it helps crawler to read and index the content systematically and it would be a strong boost to your main page book url.

For analytics:

Change the browser url by history.pushState Send a virtual page view on google analytics

For Seo:

Make proper rel next/prev meta tags and make sure any url of type:

Paginated pages when opened directly :

http://www.example.com/books/book1/?page=2 as explained above if opened directly by a crawler/user should open the same page (one page for a book) with content of page 2.

On your backend you should capture this page number and send the content to front-end accrodingly and your page state should exactly match the state if a user starts from some other page and reach this via ajax. This would avoid any penalty for ajax loading + is a best practice for this use case.

More more on pagination seo best practices:

https://moz.com/blog/pagination-best-practices-for-seo-user-experience

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.