If you want to sell books, you need a website. I get that. I’ve had a personal website for close to 20 years now. It’s hand-coded and quirky, but that’s all right, because nobody ever visits it unless they’re looking for cello lessons. In anticipation of the impending release of my first new novel in many years (more than 20 years), today I sat down and did some redesign on my site. We’re not talking about this blog — I mean my actual website, musicwords.net.
I positioned the graphics showing my new book covers. Uploaded a bunch of files. Hooray, I’m a web champ!
Well, no, not quite. Tonight a friend took a look at the new pages on his phone, and wouldn’t you know it, there’s a technical problem. HTML on a phone’s browser is apparently not the same as HTML on a desktop browser. Oh, dear.
On doing a little checking, I find that the situation is even worse than that. Forget phone displays; the book covers on my nice hand-coded Books page do not show up in the same alignment in Firefox, Chrome, and Internet Explorer, all of which are running here on the same identical Windows machine. If you’re curious, you can jet over to the Books page and compare your results to the following screenshots. I grabbed only a small section of the page, right at the top of the Non-Fiction header. What’s of interest is the positioning of the book covers that’s visible to the right of the text.
First, here’s how it looks in Firefox:
Next, here’s Chrome:
And finally, in IE:
What the actual fuck? This is the same HTML code in all three browsers. The code is set up with HTML style tags that have position:absolute and values for the top of the image in pixels. But somehow each browser has its own idea about the vertical height of a pixel. And of course the alignment is far worse in my iPhone, but I’ve never learned to take screen grabs with it, and it’s an old phone, so let’s not worry about that.
And do you notice the difference in the type font? In Firefox it’s blurry, because the anti-aliasing is more aggressive. In Chrome and IE it’s crisp.
On further reflection, though, that’s the clue to the mystery. The graphics are positioned exactly the same in every browser (including a phone). What’s different is the vertical spacing of the type! And that’s not something that HTML can control. This is, I’m sure, one of the reasons why modern websites have a very modular look, with little blocks of stuff. Getting the stuff in the left column to align with stuff in the right column is not gonna happen.
So please forgive me — I’m going to whine now. HTML is supposed to be a standard, but it never was, and as the years roll on it plainly becomes less and less reliable. This is why people hire professionals to design their websites. The professionals know lots of tricks to get reliable results across many platforms. Or at least you hope they do.
As my father used to say, “It’s only money.” But he was an artist. My mother kept the household accounts. When he said that, it made her a little crazy. What truly scares me is not spending the money. What scares me is that my tax return for 2017 is going to show a huge operating loss on my writing business — and that may trigger an audit. I’ve never had an audit. Maybe I should just eat the loss and not claim it. I asked a friend who is a CPA if she’d like to do my return this year. She charges $200 an hour. It’s only money, but I’m gonna have to think about that.