Some Notes on Site Migration to WordPress

I have a tiny site, sign-in-sheet.com, that was an experiment to see if ads can pay; they can, but it’s a tiny site, with tiny revenues.

I ported it over to WordPress, and it took several hours. It took 9 and 1/3 hours, more or less.

The trade off is that it’s now easier to update.  I have a bunch of modified files that should be uploaded.

The site gets little traffic, but I basically spent less than a day making the initial site. It drives ad clicks, because you don’t have these dense, endless lists of options.  You search, land on a page, and see, along with the content, a big ad. Odds are, a vendor is remarketing something to you, so you are more likely to click.

Webmaster Tools Dinged Me

I found some unpublished printable forms, so added them to the site, growing the footprint. Since this site can now grow, with some effort, I decided to install the Yoast plugin to coach my writing.

Yoast produces an XML Sitemap, so I went over to Google Search Console, aka Webmaster Tools to see if the site was being indexed. As expected, it was out of date… but there were some improvements to the tools, one of them being some tools to analyze how the site will perform in a mobile phone.

There, I had some bad news. Google wants sites to be mobile-friendly. My theme was not.
At least not Google’s version. My CSS and HTML were responsive, and acceptable to my eyes… but Google couldn’t tell.

The lesson here is that you need to get into the search tools asap – meaning as you release the theme. It’ll add a few hours of work to the theme, though.

Converting HTML Layouts into a WordPress Theme

A few companies sell this service, and I looked into it. While conversion and existing layout to a WordPress theme isn’t too hard to create a rudimentary theme that replicates an existing website. Is this a valuable service? Is it going to help the site? Answers withing. Continue reading Converting HTML Layouts into a WordPress Theme

Yet Another Parallax Effect, but This One Wastes Fewer Pixels and Bytes.

Everyone loves the parallax effect, and I’ve been swiping snippets of code to do it for a long time, but never really thinking about it too much. You load it, set some parameters, and that’s it. I was having a little glitch with one, and was tweaking it, and I started to wonder why the effect didn’t just start at one end of my image, and end at the other end.

After all, if I don’t show all the pixels, I’ve “wasted” all those network bytes to load the data, and all the memory to hold the data.

This parallax effect is stingy with network bytes.
Continue reading Yet Another Parallax Effect, but This One Wastes Fewer Pixels and Bytes.

Responsive Design + Mobile First = Automated Layouts

I’m shocked at how many businesses still have websites that don’t work in mobile. For the average person, reading web pages on a smartphone is the primary way they read content on the web.

Though I’m not 100% on board with “mobile first”, it should soon be the norm. To CSS hackers, “mobile first” just means implementing the mobile layout first, then making the wider-screen layout the exception.
Continue reading Responsive Design + Mobile First = Automated Layouts

CSS Animations using Transitions with Conditional CSS, Stacked Rectangles

This is a somewhat elaborate example of how to use conditional CSS and transitions to create a fluid, responsive stack of rectangles that are polite enough to stack up when the screen is narrow. The idea is I’m working on is to have a menuing system that stacks when the screen shrinks.
Continue reading CSS Animations using Transitions with Conditional CSS, Stacked Rectangles