Making an e-book sales page readable on phones

Nash Radway sells an e-book through one sales page. On phones the text was tiny and the page scrolled sideways, so visitors had to pinch and drag to read the offer. Another freelancer had started a responsive version and left it half-done, in code that was hard to work with.

Before the contract started I saw that the page had no viewport tag, and sent the client the line that fixes it. Then I made the whole page responsive by hand: the headline, the image and text groups, the lists and the reader comments, with font sizes in the same proportions as the desktop page. I checked the page at each width and gave it the rules it needed, instead of a generic «all devices» snippet. I also found what caused the sideways scroll and removed it.

I checked the checkout provider’s bar against its documentation, which rules it out below 480 px. I made the cart-button image transparent and the same size as the others. The page read properly on phones, and the contract closed with a 5.0 review.

Later the bold text started spreading down the page after every save. The cause was the hosting panel’s editor, which rewrote the markup, so I advised editing the file locally and uploading it instead, and that fixed it. The responsive version ran on the live page from February 2019 to at least September 2021.