Yep, just when you thought I was moving on with my life, I spend another month on a new theme. My problem is that I tend to listen to criticism. And my previous theme received plenty of it. People just thought it was too much, too sloppy, too busy, too colorful, too ugly, too lame, and you get the idea. For the record, I think the Unicorner theme is fun and awesome, looking great and visually appealing on my iMac. I think if I would’ve spent more time testing and tweaking for PC/Win and other setups, the response would have been better. Live and learn..

It’s a new theme!

After realizing that my previous theme was a bomb, I had several choices:

New theme

Just tone it down with some new styles

Just forget about the critics and keep on rockin’

It’s SO easy to follow your gut and take the rebel attitude, “screw ’em, their designs all look like cheap trash anyway, so who cares..” or something along those lines. But I didn’t want to go out like that, so I listened to the harsh reviews and realized, simply, that I had missed the mark with the Unicorner theme. And I do care about what people think, so new theme it is..

Things that are better with the new theme

I wish I had time to write all of the little details involved with the new theme, but I don’t, so here’s a summary of some highlights:

Relaxed – much quieter, more laid-back, chill

Simpler – less color, texture, background imagery, et al

Less code – around 40% less code for this new theme

Cleaner – zero hacks, no workarounds, nothing weird

Basically the previous theme did a great job at unifying the new site structure, I think, paving the way for this theme to really smooth everything out in a more responsible, standards-based fashion. The new theme, Volume, is the theme that should’ve followed the Tether theme as it’s more of a natural progression, stylistically speaking, than the boldly-colored Unicorner. For those familiar with my work, you’ll find the new theme contains many elements from 21 previous themes, including stuff like:

In my experience, good designs just sort of “happen”, once they get rolling tend to take on a life or momentum of their own. That’s the case with this new theme, quite organic in many respects.

Features of the new theme

Here is the rundown on the new Volume theme:

Built with HTML5, CSS3, jQuery

Responsive, adaptive design via @media queries

Lightweight design (less than 500KB total size on average)

Clean separation of content, structure, behavior, and presentation

Micro-optimized, focused asset loading, compressed content, etc.

No hacks, but some basic browser detection is used for details

The main goals for the new theme are usability and something that inspires me to post content. I’ve been working my butt off over here and have tons of new stuff to share, but can’t get there with a theme that everyone hates. So hopefully the new theme works for you, because there’s no going back now – time to use it ;)

Thoughts?

Everyone’s a critic, and as mentioned I value critical feedback. Just keep in mind that my time for playing with new themes is up, so I won’t be implementing a bunch of changes at this point (unless something is broken or whatever). Even so, themes tend to build on top of each other, so shout out any suggestions or concerns for the next exciting theme design here at Perishable Press.

Huge shout out to Daniel Pataki for his helpful feedback and suggestions for the new theme!

About this post

Check it out

Comments

Excellent work on this new theme, Jeff. This is MUCH MUCH MUCH better. I especially love how the comments section adapts depending on the resolution. It’s great to be able to see the comments next to the post on my 24″ but have it at the bottom of the post on my 13″ laptop. Well done!

Kinda like what you did with the site with the new theme. I have liked all the themes you have used to be honest!

Once again I am here to help you solve a problem that I am seeing with your new theme. If you remember I had the scrolling issues with your last theme that I helped you fixed.

OK so the issue I am seeing is your Heading font (Abril Fatface) seems to me that its not rendering right. rough edges is what I see. Even the Google demo page for Abril Fatface seems to have rough edges. Now when I got to the font makers site and see Abril Fatface in graphics it is smooth: http://www.type-together.com/Abril

The smooth graphics you see at the font-maker’s site, are those from an image or from actual text? I tried to get the custom fonts to smooth on all browsers, but no luck.. if you have any ideas for doing so, please let me know!

Yes, this is much more of a natural progression from the longstanding Tether theme, which as you mention was also contains brown-ish colors.. I got carried away for that last design, so glad to hear this one is easier to look at :)

As for IE8, honestly I just don’t have the stomach for it.. After a month on a theme that people hated, and then another month trying to make this one halfway decent, to have to even open anything IE would make me sick.. although I did test in IE9 and it looks reasonably OK. IE8 peeps will just have to understand that they’re using a horrible, horrible browser.

Jeff… using the most common kind of desktop monitor – I am grateful for your responsive design which utilizes all the space above the fold that a browser can display. My hot button is themes which call themselves responsive, but think that 960 is where the world ends; yours seems to be *<IE10. Me, I'm a bit more tolerant as many (if not most) of my friends use IE8-9 somewhere in their day; and funny thing, as I've actually tried to assist most of them "see the light," I've found that not one of them does it without an acceptable reason (at least to me) or just to make developers lives miserable.

And, FYI – I've followed your posts for years and frankly never even considered there was an issue with your previous theme (after all it used all of my screen which is what REALLY counts) – although, I have to say this one is a LOT easier to read and follow [except for the font size seems too small to me (I use default firefox font/zoom settings)]

Let me tell you, honestly, that this is WAY better than the other. Now I recognize your “OMG perfect” themes. ;) The last one was not so bad (I’d pay to be able to do something like that) but this one feels more natural. :)
If I can add a small thing, I would suggest to add target-densitydpi=medium-dpi in the viewport, so that QVGA devices (as mine) can always find the right zoom level (and on the iPhone and similar, the zoom is untouched). To be clear, I have an HTC Wildfire.

Projects

About the site

Perishable Press is the work of Jeff Starr, professional developer, designer, author, and publisher with over 10 years of experience.
Check out some of Jeff's books and projects, follow on Twitter, or learn more »

Fun fact: Perishable Press has been online since 2005, and features over 800 articles and more than 11,000 comments. More stats »