Getting Paid to Create

As creative professionals, we get paid to be creative. Some of us get to illustrate; some of us design websites; some of us lay out print pieces, and so on. If you work for a small design firm (or if you are a freelancer), you likely have a constant influx of new projects to work on – and thus new things to create. This beats the heck out of getting paid to clean bathrooms, or hawk shady merchandise, etc. At its core, getting paid to be creative is pretty sweet.

Working in a Constantly Evolving Field

Design – especially of the web or tech variety – is constantly evolving. New devices bring new problems for us to solve; designers have to constantly be on top of what’s happening in the industry. This means new challenges, new techniques to learn, and an ever-growing skill set. Design is an exciting field, thanks to its never-ending march towards progression.

Helping Shape Our (Visual) World

Whether we like it or not, we live in a world where visuals are at and around every corner (piled on top of one another, all clamouring for a fleeting moment of our attention). This moves past the street corner and into our online lives as well. As designers – whether print, web, identity, or else – we all have a role in shaping the visual side of our lives. Sometimes this role is huge and sometimes this role is small, but it’s a role – and one we should be proud of.

Design for Change

If we’re lucky, designers will have an opportunity – or make an opportunity – to design for change. With this, I mean doing creative work that aims to make a positive impact on the world. Maybe this involves environmentalism, or humanitarian work. It could be as big as strategizing, creating and launching an international campaign; it could be as small as volunteering to redesign the website for your local animal shelter. Regardless, the opportunity for us to design for change is out there, and that’s a good part of being a designer of any ilk.

Helping Clients Realize Their Dreams

Somewhat cheesy subtitle? Yes. Truth? Definitely. One of, if not the, absolute best things about working in the design field is helping bring a client’s vision to life. Paper Leaf works with many small businesses and start-ups; the path taken from meeting with the client, learning about their business, helping strategize & set goals through to design roughs/mockups to completed deliverable is very rewarding. There are few things better in work life than seeing a client light up when you knock their visual identity and all related collateral out of the park. Helping clients realize their dreams is an amazing part of being a designer.

It’s easy to dwell on the negatives of something; I mean, we’ve all shared horror stories with friends over a pint. However, I do think it’s important to make an effort to recognize the positives too – an area too often overlooked. What I’ve written here are just a few of the more large-scope, positive sides of being a designer that came to mind as I was thinking about this post. What about you? What do you love about your job?

With all that in mind, the newest web design technique on the block is responsive web design. If you’re not clear on what responsive web design means, read this article. Go ahead, I’ll wait.

Alright, now that you’re back, let’s get to the million-dollar question that I was discussing with some fellow nerdy web friends over beers: should responsive web design be a standard for your web design business, or should it be a feature that can be added on (like power windows in a car)? Let’s explore the arguments.

Argument: It Should be a Standard

The main argument for “Responsive web design should be a standard” – aka every site you or your business builds from here on out should be responsive – is that it seems to be, without question, the way the industry is heading. The amount of web-powered devices out there, and their specs, is almost impossible to count. There are iOS devices, sure, but there’s also a litany of tablets and smartphones powered by Android with a myriad of screen sizes and resolutions. With that in mind, we can’t realistically serve up a completely different version of a website based on detecting the OS or browser anymore; responsive design allows us to detect the browser viewport window and serve up a modified layout based off of one website design. By and large, responsive design seems like the only realistic way at present to manage the huge range of devices, users and browsers accessing the web.

So if responsive design is the way of the future – and for the sake of argument, let’s say it is – shouldn’t we start building every site this way? Shouldn’t we strive to stay on top of the trends? Shouldn’t we be future-proofing our builds for our clients? Shouldn’t we be taking responsibility, as web professionals, to serve up the best user experience possible on every device and browser? Those are good questions that form a good argument; one that’s hard to refute.

Now let me try to do just that.

Argument: It Should be a Feature

Yes, people are accessing the internet in ways like never before: on desktops with huge monitors, on netbooks, on ten-inch tablets, on seven-inch tablets, on four-and-a-half inch smartphones. This boom in tech is why responsive design has emerged.

But with that boom in tech has come some amazing mobile browsers; any well-designed, non-responsive site looks great in mobile Safari. Yes, you have to double-tap and zoom in. Yes, it serves up content that, in some cases, is useless and weighty to user on a mobile device. A nicely designed, non-responsive site isn’t the best user experience by any means, but I would put forth that it isn’t a bad user experience either.

On top of that, designing, building and testing a responsive site takes considerably longer than doing the same for a static site. Fluid layouts means more layout break points; serving up specific layouts to specific devices (eg. desktop browser, tablet in portrait mode, smartphone) means more wireframes, more mockups, and more testing. Using advanced web design techniques – the foundation of responsive web design is the CSS3 media query declaration – means even more testing and problem-solving on older browsers. Yes, responsive design takes much more time, and we didn’t even touch on maintenance or dealing with a client-handled CMS.

We all know that, in the web design/development world, time = money. If you make responsive web design a standard for your business, you have to raise your prices to reflect all the additional time a responsive site takes over a static one. Depending on where you sit in your market, raising your prices may push you into a different range of client; perhaps a range you’d prefer not to be in. It may also push you out of the market altogether. This is the strongest argument against responsive as a standard.

So maybe responsive web design should be a feature. Maybe you don’t want your prices to push you into the next range of client, or out of your market. Maybe it’s something you don’t have the means to take on for every client, based on your workload. Maybe responsive web design is something you articulate the benefits & drawbacks of, offer it as a feature for $XXXX more dollars to your client, and let them make the decision based on their budget, business needs and website goals. By making responsive web design a standard, instead of a feature, you take the ability to choose out of your clients hands.

Pros & Cons

Let’s break down my rambling into digestible points.

Responsive Design as a Standard: Pros

• you are offering the most up-to-date web design/development practices available
• the sites you build are going to look amazing on virtually any platform
• you may get a potential leg-up on your competition
• you may make more money on less projects

Responsive Design as a Standard: Cons

• you might price yourself out of your market/current range of client
• you will have to take on fewer projects to accommodate for longer project lengths

Responsive Design as a Feature: Pros

• you are offering your clients choice
• you have an overall shorter development cycle (on average, accounting for non-responsive sites)
• you don’t risk pricing yourself out of the market

Responsive Design as a Feature: Cons

• you are offering your clients choice (yes, this is both pro & con)
• you may rarely build responsive sites, and thus fall behind technically
• you may end up doing more projects at a lower per-project cost

I’m sure I’ve missed some here and there (feel free to throw in your two cents in the comments), but I feel like that’s an alright summary of the pros and cons of each path. It’s important to not only look at how many pros and cons are there for each, but also to weigh each pro and each con. For example, offering the most advanced dev techniques out there is a huge pro. But pricing yourself out of your market is a devastating con.

The Answer

….is “I don’t know”. Or to be more specific, “it’s up to you” – I’d love to hear your thoughts in the comments. I know that Paper Leaf, at present, is offering responsive web design as a feature, not a standard. The main reason? We don’t want to raise our base prices to the extent required to compensate for the additional time responsive web design takes. We make a point to clearly articulate the fact that responsive web design is the way of the future, a better choice, etc to our clients, but ultimately we leave the decision up to them. A custom website is a big investment as-is. Some people take the responsive route, some don’t. Perhaps at some point in the future, however, responsive website design will be a built-in feature for us.

What are your thoughts? Responsive design: standard or feature?

Feedback for the presentation was positive, so I thought it might be worthwhile to share the slides on this here blog. In the presentation below, I cover the following…

• What I mean by “client-focused WordPress sites”
• Why we should make them, and
• How to start – tips, tricks, and specific areas.

The main part you’re likely interested in is the “How”. In that section, I talk about customizing the Visual Editor CSS, adding a “Styles” drop-down to tinyMCE, and how to handle advanced page layouts (amongst other things). Feel free to check out the slides below, and if you have any questions, fire away in the comments. Thanks!

Note: all these code snippets go in your functions.php file unless otherwise stated.

Remove Update Notification

The update notification is handy, but you might not always want your client (or all users of a site) to see it. Use the code below to disable it:

if ( !current_user_can('administrator') ) { add_action( 'init', create_function( '$a', "remove_action( 'init', 'wp_version_check' );" ), 2 ); add_filter( 'pre_option_update_core', create_function( '$a', "return null;" ) ); }

Note: the current_user_can tag as above allows the administrator of the site to still see the update, but no other users with different permissions (editors, authors etc).

Hide Custom Post Types from Search

Custom Post Types are an invaluable tool when using WordPress as a CMS, but you might not always want them to show up in a search. Use the code below to hide Custom Post Types in your site’s search.

function SearchFilter($query) { if ($query->is_search) { $query->set('post_type',array('post','page')); } return $query; } add_filter('pre_get_posts','SearchFilter');

Change the Logo on Admin Login Screen

There’s nothing wrong with having the WordPress logo on the admin login screen for a client site, but going that extra mile to brand it to their business is a nice touch. Add this code and edit the path to your needs:

function custom_login_logo() { echo ''; } add_action('login_head', 'custom_login_logo');

Also, you might want to change the URL of that image so that it goes to the site homepage (default is WordPress.org):

function change_wp_login_url() { echo bloginfo('url'); } add_filter('login_headerurl', 'change_wp_login_url');

Allow Custom Role Access to Menus & Widgets

Menus & widgets are great parts of the WordPress core, and often used in CMS applications. However, only Admins can see them. Here’s how to change that:

 $role_object = get_role('editor'); $role_object->add_cap('edit_theme_options'); 

“Edit This” Button on Posts/Pages

This simple little fix doesn’t seem like much, but your clients will love it. Adding this code to your page template(s) will add an “Edit This” link on the client side of the site, but one that only logged-in users with the correct permissions can see (ie. your clients editing the site, but not the site viewers). This way your clients have a nice, easy shortcut to edit a page or post’s content without having to go back through the Dashboard. It’s probably best to add this somewhere after the_content.

 edit_post_link(__('Edit This')); 

*Note: wrap in a php tag.

Remove Menu Items in WordPress Dashboard

Some of the links in the WordPress Dashboard navigation are sort of useless for most CMS builds. Like the “Links” section, which we’ve only ever used on one build. It’s easy to remove, with this code:

 add_action( 'admin_menu', 'devpress_remove_menus', 999 ); function devpress_remove_menus() { remove_menu_page( 'link-manager.php' ); } 

The slug ‘link-manager.php’ removes the link in the Dashboard. To remove a submenu item – for example, “Editor” under “Appearance”, use this:

 add_action( 'admin_menu', 'devpress_remove_menus', 999 ); function devpress_remove_menus() { remove_submenu_page( 'themes.php', 'theme-editor.php' ); } 

You can find all the slugs for the items you want to remove by simply clicking the link you want to remove and noting the URL in the browser bar.

Add Shortcode Functionality to Widgets

Shortcodes are handy, and lots of great plugins rely on them. It’s easy to add shortcode functionality to widgets too:

add_filter('widget_text', 'do_shortcode')

Add Image Sizes

Wherever possible, I like to “lock-down” the styling in the custom client WordPress builds we do. It makes for greater design consistency down the road as your clients, and potentially their employees, manage the site content. One way to do this is to add custom image sizes.

if ( function_exists( 'add_image_size' ) ) { add_image_size( 'category-thumb', 300, 9999 ); //300 pixels wide (and unlimited height) add_image_size( 'homepage-thumb', 220, 180, true ); //(cropped) } 

Then you can call it in your template files, like so (wrap the following in a php tag):

echo get_the_post_thumbnail($post->ID, 'product-thumb'); 

Sources: all of these brilliant snippets came from WP-Snippets, CSS-Tricks or DevPress!

We write a lot about WordPress on the ol’ Paper Leaf blog, since it’s our publishing platform of choice. We’re actually involved in the organization of this, Edmonton’s inaugural gathering of WordPress-ians (we are Edmontonians ourselves, after all). Hit the jump to learn more about what a Wordcamp is, who it’s for, and why you should be there (plus, tickets are only $40!).

What is a Wordcamp?

Wordcamp is a WordPress-central sanctioned event that is all about WordPress, the world’s most popular publishing platform. Various speakers come to talk on their subject of choice – subjects to be expected include:

• WordPress theming
• WordPress development tips & tricks
• WordPress for designers
• General web design topics
• Talks on SEO and content
• Beginner WordPress workshops and more.

Who is Wordcamp Edmonton For?

If you’re any of the following, you should buy your ticket to Wordcamp Edmonton now: a website content manager; blogger; general WordPress user; or a website designer or developer. You don’t have to be familiar with WordPress to benefit from attending Wordcamp Edmonton – and on the flipside, if you are familiar with WordPress, you’ll love the in-depth nature of some of the talks.

When & Where

Wordcamp Edmonton 2011 is scheduled to take place November 18 & 19, 2011, at the Shaw Conference Centre (Salon 5/6). You can buy your tickets now!

Get Involved & Stay Informed

Wordcamp Edmonton is still looking for speakers, sponsors, volunteers, and attendees too! Follow the event on Twitter, or join the Facebook group, and stay up to date on all the proceedings leading up to November 18 & 19.