Every 1-2 years I like to give this site a facelift. Most of the time it's really just about the UI: changing CSS, adding a new banner or other image, and maybe tweaking some of the topmost links or sidebar items. This time, however, I made changes all the way down to the site's lowest levels.
I'm still with the same web hosting company, GoDaddy, but in order to facilitate some other changes I needed to "upgrade" my hosting plan from a legacy plan to a new Windows Hosting plan. What this really boiled down to is a change from IIS 6.0 to 7.0. Behind the scenes, my site content was migrated to a new server and DNS entries were updated, but this was all transparent to me. I initiated the process, then waited about 10-15 minutes for the change to complete processing. This hosting "upgrade" was necessary in order for me to able to take advantage of some newer technologies (namely .NET 4.5). GoDaddy made the process easy and I'm not having to pay anything more per month to host my site, which is always a bonus.
As for GoDaddy itself, I know a lot of people don't recommend them for one reason or another, but I've been with them from the start, running this site in addition to two others, and I've never had any significant issues with them.
I've run the blog portion of this site on BlogEngine.NET pretty much right from the start. Long time readers might remember that I actually started my blogging career on Blogger.com. Given Blogger's limitations, I migrated over to Wordpress, thinking for some reason that platform wouldn't have the same issues. Both are great platforms for people who don't want to deal with the plumbing, but since I like plumbing, I found out real fast that I what I needed was a platform where I could tweak things down as far as the code level if needs be. Also, if it was written in a programming language I was already familiar with, then all the better. BlogEngine.NET, written in C# and ASP.NET, fit the bill perfectly.
My downfall came when I got off the BlogEngine.NET team's release schedule and onto my own. Effectively having forked the code into my own personal branch, I made a lot of customizations and other tweaks. Life was good. But meanwhile the BE.NET team, and the community as a whole since the software is open source, was doing the same thing, albeit at a much faster pace. This was OK for a while; their changes were minor enough that I wasn't missing anything. But then the platform was handed over to a new team and, fast-forward a couple of years, and my forked version was woeful in comparison in terms of look and feel as well as functionality. I had a decision to make: stick with BE.NET vScott or make the switch to the latest version of BE.NET, 2.9. I chose the latter.
In the end, it wasn't too difficult to make this switch. I merged my App_Data folder in with the new base content there and then selectively pulled in those controls and other pieces I wanted to retain from my old codebase. I ran into some issues during deployment, but as far as local debugging, everything pretty much worked right out of the box with my pre-existing content. Kudos to the BlogEngine.NET guys for making this such an easy upgrade process.
The impetus for all of this change originated, of course, because I wanted the site to have a new look. Not only that, but I wanted to ensure the site was going to not only look good on mobile devices, but remain functional as well. With nearly 40% of all web browsing done on mobile devices, mobile first is where it's at. Originally conceived by Luke Wroblewski, mobile first means exactly what it says. The primary tenets of this design approach include responsive enhancement and responsive web design. Condensed down, what these mean is that a site should provide an optimal experience to users based on their current browsing device. A user on a desktop or laptop can take advantage of their larger screen and see content in a wider format. Those browsing on a phone, where screen real estate is at a premium, don't see a scaled down version of the full site, but a unique blend of functionality fitted together perfectly for a mobile experience. Let's take a look at a few examples so you can see what I mean.
Here's my new site in all its glory. The site as shown is at its widest level with all content displayed.
Now, if you narrow the browser window, you'll see the site begin to change a little.
The "Email Sign-up" block moved down and widened out. It's a small change (one could argue an unnecessary one as well), but, regardless, this is the screen tablet users will see.
Further narrowing of the browser window causes the site's width to continue shrinking to accommodate the smaller viewing port until you get to this point:
Here the header has completely changed to a more concise version. The search input box is gone and the usual header links are now contained within a dropdown menu accessible at the upper right of the window. Social icons are moved under the site's title info.
If you narrow further still, you'll see the smallest configuration, with my author image removed and a larger font size to make for easier reading on smartphones.
Looking at my novels page, it starts with all product info displayed and the cover images laid out at the side of each book description.
Narrow it down to what a smartphone user will see, and the cover image is moved on top of the book description, you're back to the more concise header format, and the font is larger.
I was fortunate enough to have CSS libraries like Bootstrap to fall back on to handle most of the responsive behavior for me. Throw in that BE.NET already supported Bootstrap right out of the box and that people with far more design skill than myself often work up free, custom themes (like Bootswatch's Superhero theme), and most of the heavy-lifting had already been done for me.
A new look is just the start. As you can see, the subtitle under my name states three things: Author, Engineer, Technologist. The first refers to the fact that I've now written several fantasy novels and short stories. The second, that I've been a software engineer for over 20 years now. As for the Technologist title, that just refers to the fact that much like many of the characters in my novels, I like to tinker. Up to this point, those three roles have been separate from one another, but as I get started with this new look for the site you're going to see them blend a bit together as I explore new topics beyond the usual reading and writing topics. Stay tuned.