Menu

Colin Devroe

Reverse Engineer. Blogger.

Not so random after all

November 17, 2008

When I switched to this theme in April of this year I had created two header images that would display at random on each page refresh. I had aspirations “to some day find the time to have as many as ten random header images”. Later that month I had 10 total header images. As of today I have created about 40 header images for this site, 24 of which are active.

In August of this year, after visiting a Peter Lik gallery in Las Vegas, I had decided to spruce up the random header images on this site by also changing the color of the background, or frame, of the site based on the image being displayed. This added a lot of fun to creating the images for me and I hope that as people found this site they too enjoyed the display of them.

As of today, however, we’re kicking it up a notch.

The first update that I made is that now the link color also changes when the header image and background color do. This small adjustment makes it feel just a little bit more refined then just changing the background color. Some of the background colors I had originally chosen were a little too light to read on white. So I had to make a few small adjustments to the color choices I made. This has two interesting side effects the first being that I now have 4 or 5 brand new “looks” for this site. Just by making a new color choice for each. The other side effect is that I now have to choose colors that are readable on white. For better or worse, I’m not sure yet.

The second update is one I’m really excited to talk about because I have yet to see how it will effect the site overall. The headers are no longer totally random. The way it worked prior to today was that when the page loaded I allowed PHP ((The programming language this site is written in.)) to choose a random number between 1 and 24 – and I’d use that number to determine the header image to show. It was incredibly simple, worked well, and made for each refresh to be a surprise!

In an effort to make the selection of which header image to show a smarter process I’ve added two layers of complexity to how a header image is chosen in addition to the random selection. This might get confusing, if it does, sorry.

If you visit the home page of the site, or any sub-page like the about page, it will figure out what time of day it is ((Here in the eastern United States.)) and display one of many images I’ve designated for that time of day. I have images categorized as morning, day, evening, and night. I’ve split up the hours using the 24-hour clock this way; 6am-12pm = morning, 12pm-5pm = day, 5pm-9pm = evening, 9pm-6am = night.  I may adjust those time slots but that is where they are now. I have several images for each time of day. So on these pages you will still be getting a randomly selected header, but it will be randomly selected based on the current time of day, rather than from the entire pool.

If you visit a note, photo, mobile photo, etc. on this site you will be shown an image contextually. What I mean is that for each header image I have associated a tag to it. The tag may describe what is in the image, where the image was taken, or something the image has to do with. I then compare the tags that are associated to the post you’re currently reading and create a list of matching headers.  If there are one or more matches the site randomly displays one of those matches.  If there are no matches the site reverts to the time of day method.

So what does this all mean? Well, I’m not sure yet as the system still has some randomness to it. But generally speaking, if you are reading a post about my trip to Hawai’i, like this one, or this one, you should see a header related to Hawai’i. If you are reading a post about animals, you’ll see a header that probably has animals in it. If you are watching a video about food, then a header relating to food will most likely be displayed. And, again, if you are reading about New York City or Philadelphia – those headers will show up.

I’m still fine tuning the way that the site decides which header best fits the current post being shown but so far in my testing it has done a pretty good job.