Questions on Responsive WordPress Theme Design

I’ve been giving a lot of thought to Responsive Web Design lately and how it affects — and ought to affect — WordPress Theme Design. Mark Boulton’s latest article A Richer Canvas has me thinking about it even more. Designing from the content out is something I always strive to do. I think all good designers should strive for it. That said, Designing WordPress Themes is an interesting challenge for someone that believes in designing from the content out. It becomes even more interesting when you start creating a responsive layout that adapts to different screen sizes without knowing what content will fill that space. But it’s not exactly a problem. It’s just … interesting. :)

What do you think? Have you started to bring Responsive layouts into your WordPress Themes? How do you approach good design without content? I’d love to hear your thoughts.

Bonus: If you’re looking for some examples of Responsive Web Design in WordPress Themes check out Sara Cannon and Dan Gavin’s Responsive Twenty Ten, Theme Foundry and Jon Hick’s gorgeous Shelf, and our very own — soon-to-be-released on the WP.org theme directory — Duster.

Can I Make a ‘Premium’ Theme My Own? And Then Release It?

Can you make a ‘Premium’ Theme your own? And then release it? For free? Or for a fee? The answer is simple. Yes.

That is, if the ‘Premium’ WordPress Theme in question—premium meaning you have to pay for it—is licensed under the GPL. The GPL is the GNU General Public License; a document included with a bunch of different open source projects, like WordPress, that covers the terms of the release and makes sure that it always remains open source. Anyway, what does this mean for ‘Premium’ Themes, you ask.

It means you can take a ‘Premium’ WordPress Theme you bought and do whatever you want with it—except release it again as a ‘closed source’ project. The really cool thing? This gives you the freedom to take that project and improve on it.

Here’s an example. You’re a designer and you love working with Photoshop. But it doesn’t have an instant rainbows-and-unicorns button. Adobe won’t put it in. If Photoshop were an open source project you could take the code and add in the technology to instantly add rainbows and unicorns to every one of your photos—and then give your customized Photoshop [RaU Edition] to anyone who wanted it. Presumably, anyone who loved rainbows and unicorns as much as you.

Same thing with GPL WordPress Themes.

But is it right? Not everyone thinks so. Some people have suggested it’s sleazy (mostly in response to people buying a Theme and immediately turning around to release it for free). What follows is my answer to the question. It’s something I posted earlier on the WordPress Tavern forums and here now where everyone reading ThemeShaper can easily find it.

Ian Stewart’s 4 Ideas About Modifying Premium Themes and Releasing Them

1. Redistributing unmodified GPL code over the internet is not sleazy. Redistributing unmodified GPL code is what the GPL is all about—even if the author of that code is charging for it and depending on that income.

2. Redistributing unmodified GPL code over the internet is pointless and stupid. If you’re doing it as a matter of free open source principles, sure, I could see that—but you’re muddying up the web. It doesn’t add any value to the code and unless you plan on keeping up with updates to that code you’re actually doing everyone who sees that redistributed code a huge disservice. Way to go.

3. I say “everyone who sees that redistributed code” because that will be a small amount of people. A small amount of people who will be rightfully wary of downloading that code. The vast majority of people will choose to download that code from the original author. Anyone want to start downloading WordPress from “www.crazywpdownloadsite.com”? I thought so. Remember that “trust” and “authority” are huge things on the web. People selling GPL WordPress Themes: stop worrying about this.

4. Now that we know that people redistributing unmodified GPL WordPress Themes over the internet are stupid we need to recognize how awesome it is that people can modify GPL WordPress Themes and redistribute them online. Theme-sellers: this is how you got started selling themes. Every single one of you. Remember when you were nervously trying to lock up the code for your first theme options pages behind a restrictive license? The code that you essentially copy-pasted from the same 2 online tutorials I and countless others did? I’m looking at all of you. Anyway, where would you be if that code wasn’t given to you in the first place? Where would you be if you didn’t fork the Default Theme? Or Sandbox? Or Classic Theme? Where would you be if Matt didn’t fork b2? Don’t worry about people forking your code. The freedom to redistribute modified code is incredibly awesome and, no exaggeration, is quite literally making the world a better place.

What Now?

You can find a whole whack of people releasing their Premium Themes under the GPL License on the official WordPress Commercial Themes Directory. You can find all my commercial Child Themes for Thematic in the ThemeShaper Thematic Theme Store.

Anyone ready to start making WordPress Themes awesome-er?

So You Want To Create WordPress Themes, Huh?

Update: It’s live! It’s happening! Go read How To Create a WordPress Theme and learn how to code up something awesome.


Does that title sound familiar? Over 2 years ago the now defunct WPDesigner.com published a series of posts under that banner, teaching beginners how to create WordPress Themes from scratch.

2 years ago is a long time online: Things have changed.

Starting next week, ThemeShaper will publish a series of daily lessons that will teach you how to create your very own modern WordPress Theme—from scratch—using the latest best practices.

And it won’t be just any old WordPress theme you’ll have in your hands. In a lot of ways it will surpass what’s been done with the popular Thematic Theme Framework. Except, it’ll be a little leaner, a little meaner, and it’ll be all yours.

Here’s the laundry list of features your finished theme will be able to boast of.

  • Search-engine optimization
  • Microformats
  • Localization support for translation
  • Robust dynamic body and post classes
  • Separated Comments and Trackbacks
  • Gravatar support
  • A valid, logical, semantic XHTML structure you can use to build ANY layout
  • Valid CSS
  • A strong typographical foundation
  • Smart default layouts (that we can adapt for later layout generation)
  • 2 widget areas, with NO hard-coded widgets, that “disappear” from the markup when they’re empty.
  • Styling for WordPress Image Classes
  • And pretty much all the typical WordPress stuff

When you’re done you’ll have a complete—and completely powerful—WordPress Theme that you can edit further or build on with a WordPress Child Theme. The choice is yours.

Are you ready?

How To Design A Popular WordPress Theme: Chris Pearson’s Secret

Want to design a popular WordPress Theme? Then you better take a look at what Chris Pearson is doing. He knows the secret of designing a popular theme.

Chris is arguably the most popular and successful WordPress Theme designer in the short history of blogging. Press Row, Cutline, The Copyblogger Theme, Neo-Classical, and now Thesis, have all struck a resounding chord with the WordPress community. It’s impossible to find a blogger that hasn’t run across at least 1 of these 5 themes and admired them.

What’s his secret? Why are his simple-looking themes more successful than others? Can any theme designer duplicate his success?

Continue reading

The Future of WordPress Themes 2009

Last year’s Future of WordPress Themes (read it here) found 11 people committed to thinking creatively about WordPress themes stopping to look where WordPress theming was heading—and now we’re doing it again! These 15 people—designers, developers, and WordPress enthusiasts—are some of the people who will shape WordPress themes, and what they mean, into version 3.0 and beyond.

Here is how they answered the question “What is the future of WordPress Themes?”

Brian Gardner

brian-gardner1I think the future of WordPress themes is heading into a very positive direction – there are a lot of designers who are developing some really great themes. It seems that a lot of us have our own unique style, which makes it great for users to enjoy a wide selection of quality themes. Another thing that I have personally experienced is building plugin-type functions into a theme, which enhances it that much more. Special thanks go to guys like Nathan Rice who are focusing more on the code/functionality of a theme, because they are adding to the overall impact that themes are making. Overall, I’d say that the next year of WordPress themes should be as productive, if not more than the last, and the ability to use WordPress as a content management system only seems to become an easier thing to achieve.

Brian Gardner has made many a WordPress theme and currently releases his pay-to-download GPL themes over at StudioPress.

Continue reading

Personality and WordPress Themes

What will happen to the WordPress Themes community as the main portal for theme downloads moves from a host of developer sites and their interlinked communities to the individual WordPress administrator’s Theme Panel—much like what has happened, and is happening, with WordPress Plugins?

I imagine this will have an effect on pay-to-download WordPress themes. Every year there are more and more new WordPress users, and every year there will be more and more users using only the Themes Panel to find their WordPress themes. And likely limiting their search to the top 15. I predict these users will rarely seek out, or even consider, other theme choices.

But what will happen to the free WordPress Theme community that produces the themes hosted on the current directory? What will happen when the personality of the theme designer is muted? When their ego can’t be fed with traffic and links and what have you? When no one knows or cares about them. When their theme is just another thing on WordPress.org?

What then?

Don’t get me wrong, I like the WordPress theme directory and I’m anxiously looking forward to Theme update notifications and automatic download-updates. I just worry that where we’re gaining a strength we’re also gaining a major weakness.

Blog Design That Works

In this post we take a look at four excellent, and popular, designs, from simple to complex, that can help inform your next blog design. The sites we’re going to look at are Lifehacker, PSD Tuts, Smashing Magazine and Canada’s National Post.

We’ll look at the general layout in great detail, via a wireframe of the main sections, and the details generally, with a bit of a writeup, in the form of notes, on what’s going on. Clicking on the wireframe opens up a full-size version. Feel free to use the wireframes in your own projects to help you get a handle on just where your stuff should be in a successful blog design.

Studying the masterworks and previous success is one of the key ways to breed success in your own designs. Let’s study up.

Lifehacker

My favorite thing about the Lifehacker template is the top posts of the day featured for maximum (literal, even) effect at the top of every page. Each featured item gets a thumbnail image, a category, a title and a cool hover effect.

The blog branding is almost a secondary item here but is still highlighted and serves to further highlight the search which is almost exactly in the middle of the above-the-fold screen. And note that the search takes up just as much visual area as the site logo. Can you make search anymore prominent? Anyway, the real Lifehacker brand is the reams and reams of excellent content. A fat logo and pretty header just gets in the way. In fact, all of the sites we’ll look at, mostly eschew cuteness and large headers that only serve to brand their site.

This is the only layout in this little study with a sidebar on the left. But the sidebar on the right is mostly negative space and really helps to focus your eye on what’s happening in the main content area.

Continue reading

WordPress as a CMS: How To Think About Building a Website With WordPress

Plan your WordPress site design

Figure out what sort of pages we’ll need

Before a visual design can begin, you need to do content design. Determine what exactly you’re going to say. Words, sentences and paragraphs are the building blocks of your site’s foundation. Make sure you’ve put them together correctly. And make sure you know what you need that foundation to do. I mean, think about how those words, sentences and paragraphs are going to effect your bottom line. Remember, we’re making this site for a reason. Whether it’s to get a laugh or make a buck, all those words, sentences and paragraphs need a reason for being there. They mean something.

Anyway, you’ve done all that right? We need to think about how we’re going to present that content. To put things really simply, once you know what you’re going to say with your content and what you want it to do site design comes down to designing series of page templates. That’s it really. As a practical matter, site design becomes a series of templates. Continue reading