Site Version 7.0 (2016)

February 23, 2016

Information

It's been about four years since I took a serious look under the hood. And in that time, a lot of things about this site had begun to annoy me.

The last redesign was in March 2012, and it was easily the biggest personal web project I've ever done, requiring me to recode essentially the entire site, page by page. But doing it right it meant I would never have to go back and do it again, and that fortunately turned out to be the case, at least for most of the content itself. But because site architecture was my primary focus in 2012, I left the actual look and feel of the site basically alone, which hasn't really been significantly changed since Version 4.0 was launched way back in 2006 — a whole decade ago. (And that version was largely based on the 2002 look.) That's a seriously long time.

So now I've finally gone back and given the site a visual facelift to bring it into the modern age. Even though I didn't have to touch most of the content, the master template and styles rework (which was a complete-from-scratch redesign and rewrite) was still a LOT of work — much more than I had bargained for when I started on this a month ago. As always, these sort of projects tend to have a domino effect. I still have some tweaks to make in the coming weeks, but it's ready for rollout.

Let's take a look.

Responsive design

Image of the 2016 site design

The 2012 version offered an improved mobile experience, but it was not a truly responsive design. With 2016, now it is. The site will resize (based on CSS media queries) to virtually any viewport width you throw at it. Some widths are more optimal than others, but all should be acceptable. The whole design was really geared toward the "mobile first" philosophy. This has allowed me to build a single platform that adjusts to any screen size, and allow a richer, fuller mobile experience, rather than treating mobile as a stripped-down second tier. The truth is that I access my own site via mobile more often than on a desktop computer, so I wanted the experience for both to be equally good. You will notice this most with the home page, which is way better than the previous version's mobile home page (which was actually kind of embarrassing).

Less is more

I've pared a lot of stuff back for a more streamlined here's-what's-important approach, most especially on the home page, which has long suffered from needless clutter. (Busy was once fashionable, but not for years.) The left rail had links to site info pages but needlessly explained to you what each and every link was for. It was completely unnecessary, so I've killed it in favor of a simpler list of self-explanatory links. Meanwhile, the right rail used to be filled with links to my most recent 10 or so blog posts. Well, considering my level of inactivity these days, displaying 10 "recent" posts has meant pulling in content going back years — certainly not my intention when I created it. So all of those are gone as well.

I've slashed and burned the home page down to just a top story image, a few recent headlines, and then image links to the various series pages. Then in the right rail are additional links and my ad slots. It's very simple and very much scaled back to what is actually needed, rather than being a slew of obligatory links and verbiage. The less-is-more philosophy was carried forward through the entire site, which now is based on a single wireframe. (I've somewhat reduced the verbiage on a lot of the site information pages as well, and rewritten large parts of the site policies.)

Modern typeface

After stubbornly clinging to Verdana since, well, the turn of the century, I've finally jettisoned it in favor of a better, more modern typeface (Open Sans). This is probably the most noticable reading change to the site and I think it's a big improvement. Following current trends, the fonts are noticeably larger on desktop screens than in the previous design. On mobile, the text should be nice and sharp and readable at a fairly small size. My font usage was easily the most outdated (and awful, on certain browsers) thing about this site, so the change really makes the whole site feel more elegant and easier to read.

On-demand site menu

Keeping with the whole mobile ease-of-use is a new site menu that is always available and optimized for mobile and accessible from any page by touching the menu icon. This saves space on mobile layouts rather than sacrificing it to always-there navigation links.

Improved image quality

Because most smartphones today have high-pixel-density screens, I've created larger, sharper images to help account for that. The home page images, which I went back and painstakingly re-created, should look much better on your hi-res display.

Blog also reworked

Jammer's Blog has been an equal embarrassment to me lately, particularly the mobile version. But I finally bit the bullet, dug into the WordPress templates and reworked those too. Now the blog looks just like the review site, creating a much more unified experience. The sites are still technically separate, but they now employ an identical layout.

Core identity retained

Even though I've made some notable changes, I've also retained some key things about this site's identity — even things one could argue should have gone away. I still use light text on a black background, which may be ill-advised from a readability standpoint. But what can I say; I still like it. (I've opted for gray now instead of tan, which should be easier on the eyes.) Also, the blue gradient that has been this site's most obvious visual trademark since 1999, as well as a site logo typeface that evokes Star Trek, have been retained. This is still the same site you've always been coming to, with the content still being the top priority. It's just the next, better version now.

Feedback welcome

Let me know what you think of the new design in the comments below. I hope you like it.

◄ Design History

Comment Section

26 comments on this post

    Howdy howdy Jammer!

    So far so good. It's a better read than it was before. The blue line to the left makes my eyes a little buggy though, trying to read the first line in a sentence, but I've a bit of weird colorblindness and some shades of blue make it hard for me to see. But, that wouldn't be a problem many folks have.

    Thanks for taking the time to work on the site. It does indeed appear more modern and streamlined, and I like the changes. :)

    Have a Great Day... RT

    I love the new design, it looks really good on my phone. On my laptop the writing looks huge, but I always take it down to a 90% zoom for browsing anyway as it's the trend with modern websites to be mobile friendly.

    Your update is a welcome change! Thanks for keeping this site up with the times. I've been reading your Voyager reviews as I watch the episodes. It's fun to have your perspective from when the show aired, really brings me back to watching it in those days.

    I thought something was wrong with my browser at first, but the site looks great! I was a TNG fan who only got into the other TV treks streaming the last couple of years. I've enjoyed reading your reviews after each episode, and it seems really odd yet fitting that you changed everything up the day after I finally finished all of the TV treks (just finished ENT last night). Feels like the end of an era for me. On the other hand, maybe this will get me to start BSG, haha....keep up the good work!

    Mobile version is so much better! The old mobile version was too awkwardly sized on my smartphone (text was way too large for ease of reading) to the point when I wanted to browse the reviews on mobile it was easier for me to just go to the regular site. Thankfully this upgrade fixed that. A bit jarring at first (the loss of the Verdana font feels like the end of an era) but I think I'll get used to it - looks really nice! Thank you for your hard work!

    Well after about 2 minutes of frantically trying to fix my view % I saw this post lol.

    At least I can SEE everything way better now, damn my eyes.

    Jammer -- I've been reading your reviews for the past few years and I wanted to finally say thank you. Even though I've seen every episode of ST:TNG and DS9, I always use your site to jog my memory and decide which episodes I want to re-watch. Brilliant. Thank you.

    I don't get why everyone is so happy with the redesign. For me using a samsung galaxy ace tablet in portrait view the text is way to small to read despite my settings in Firefox. If i enlarge it then it doesn't reflow so text goes off the page which is hopeless. So now I have to view the site in landscape mode to be able to read it which is uncomfortable. Personally life was much easier for me before the redesign. Sorry.

    Matty, I am sorry that your experience has been diminished. This is one of the unfortunate side effects when so many different device types are part of the equation. I cannot promise anything, but let me think about whether there might be some way to address this as a variable setting. Either way, I do appreciate your feedback so I know there are problems out there.

    Using a Droid Maxx and the upgrade looks fantastic!!

    Now that this is done, hopefully you can review STID :-)

    Thanks Jammer, appreciate that most people seem to be pleased with the changes but anything you might be able to do about the text size problem I'm having would be appreciated too as I'm currently watching whole of DS9 for first time and always like to come here to see what you and everyone else thinks about each episode. The changes have made that much more difficult for me I'm afraid but I'll struggle on anyway. Thanks for your consideration.

    Nice redesign. Glad you kept the white script on a black background. The relative dimness makes yours the best site to visit when my toddler wants me to stay in bed with her until she's asleep.

    Have enjoyed the site for a while now. Incidentally, I found you on my first watch-through of Voyager. I got to "Threshold" sat on my couch going "buhhhhhhh...What?!?" A quick Google search led me here, confirming that I was not alone in my utter befuddlement at that episode.

    I like the redesign, but can you restore the "Hide all comments" option please?

    SA, I think that can be arranged. I removed the hide/show comments links because I didn't figure they were being used and I was trying to scale back everything. But I think that can be added back in a way that fits in with my streamlined goal. Give me some time.

    Q: On my mobile phone this looks fantastic! I see an "x" in the upper right hand corner of each post. Does that just remove it from the que after I read it?

    Thanks

    Never mind Jammer, I see it on the computer.

    "Set Bookmark: hide this and all older comments"

    In all honesty the pale yellow text of the episode titles and star ratings is unpleasant on my eyes. D

    Thanks Jammer. If the toggle doesn't end up in the same place, can you please update the news item here? Thanks for your thoughtful reviews and upkeep of this site through the years.

    SA, the hide/show comment feature has been restored in a slightly different (and streamlined) manner, such that there is only one link for it (in the same location as before) rather than multiple links. If you hide the comments, they are automatically hidden on all pages until you click the link to show them again. As before, JavaScript is required for this feature. The hide/show links are not shown at all if JavaScript is disabled.

    You may need to refresh the page for the changes to take effect.

    Matty (and anyone else), I have a solution for those having problems with the font size, which will allow you to adjust the font size in your browser. At the moment I am not going to roll it out wide/publicly, but if you are interested in trying it out, please email me.

    Is it just me or is the site really slow these last few days? Even scrolling through pages and typing comments is slow.

    Jammer,

    I'd like to make a suggestion.

    When you are in the comment stream and hit an "X", all the posts chronologically before that are not visible.

    I recommend that when you select and "X" you remove just that one post from view.

    Thanks. (STID is still waiting :-) )

    Yanks, thanks for your suggestion. Unfortunately, it's not a feasible possibility. The bookmark feature uses a simple marker that remembers just the comment you marked and hides that one and all older ones. To hide them based on which ones you individually marked would require that I create some way of storing a list of every comment you marked and then hid the ones that are compared against and match your list. That is not something that I could easily accomplish.

    Hi Jammer,

    would it be possible to remove the background-image from the comment boxes?
    I found the text a little hard to read on my monitor, so I tried to disable it.

    Something I liked:

    body
    line-height: 1.45em;


    #commentsearchbox, #comments .commentbox

    border: 1px #444 solid;
    border-radius: 5px;
    background-color: rgba(0, 2, 53, 1);

    or

    border: 1px #567 solid;
    background-color: rgba(64, 64, 64, 1);

    Submit a comment

    ◄ Design History