Someone recently asked whether it would help his business if they purchased a new domain with the .com or another type of extension for his website.

The issue is not whether his website is on a .com or .net domain or gaining any benefits.

The real issue is the business name (DBA) and website domain URL do not match. The website URL is missing a plural “s” that is in the DBA.

An example is the following situation. The business name is SEO Professionals but the url is www.seoprofessional.net.

This presents a couple user experience disconnects and problems for the business. This got me thinking about how the user will interact and the best way to handle the experience.

<2>Problem 1: Confusion For Clients
Every time you hand a business card, the business name and logo is typically much larger than the website URL. If the potential client only remembers one thing, its the name of your business. In this case, SEO Professionals.

Should they automatically assume your URL is your business name and type in www.seoprofessionals.com in a browser, then you potentially send them to a non-existent page or worse, a competitors’ website.

Now you don’t want to give business away by marketing for another business, do you?

Problem 2: Search Engine Dilemma

Say the same client loses your forgets the URL but remembers the business name. They launches his or her favorite search engine and types in “SEO professionals”.

There is a likelihood www.seoprofessional.net will not rank high enough. Most tests have shown domain matching URL is powerful indicator for search engine results.

Again, this is a case where if the user reads only the Page Title and ignores the URL variations a potential client may be lost.

Optimizing The Website

Its important that the website will need to be optimized for search engines and potential clients.

The meta information that search engines display in results pages will need the correct page titles and descriptions. So even if the URL and business name do not match, a searcher will find exactly what they are looking for visually.

The homepage or any landing page will need to have every possible indicator that the right destination has been reached. A clear legible logo or recognizable symbolmark.

By writing optimized page title headlines and descriptions, chances are search engines will pick up on the title over the URL and so will searchers (potential clients) too.

This is just scratching the surface of optimization for websites but the lesson here is that its a good idea that your business name and website URL’s match.

When deciding to update a website by creating a whole new information architecture, one easily falls to temptation to use a 301 redirect on web pages that no longer are useful.

The reason is because you want to let search engines know that the page has been permanently moved to a new location, new URL. However, you want to retain and be able to pass the link juice, page authority, or page ranking that was associated to the original page.

Be Mindful When 301 Re-Directing Pages

You don’t want to lose all your SEO efforts from the past. But it’s also important to have a content strategy for your website.

This is definitely a helpful trick for useful pages that had page ranking with link juice but pointless for junk pages that never passed much value to begin with or contained lots of duplicate content.

If you’ve paid any attention to how Google see duplicate content with its Panda update, you would think twice before launching a 301 campaign.

Proper and Improper 301 Situations

The proper use of a 301 re-direct is to give search engine spider crawlers the signal that a web page has permanently moved to a new location.

Improper use is to re-direct any page no longer used, not found, etc. back to the homepage or root URL.

For SEO purposes, I would advise against this strategy for the following reasons:

• Re-directed web page has low content or page rank value.  Shouldn’t be associated back to most important page on your site, the homepage.
• Too many different off topic pages re-direct back to homepage can effect your domain authority.  Different Page Titles, Meta Descriptions and Keywords are still in the index yet are 301 re-direct to your most important page which may not always relate.
• Pages no longer useful should be removed from the search engine index with proper 404 or Page Not Found. Let the page die out on its own naturally.

What are your thoughts when it comes to using a 301 re-direct?

The hottest trend these days in web design is Content Strategy. It has a certain buzz to it like how search engine optimization (SEO) was like in years past. But what role does it play in our web projects. I’ll try to uncover how Content Strategy combines SEO and copywriting techniques and why web designers should practice it.

What Exactly Is Content Strategy?

Whats so important about Content Strategy? Effectively, Content Strategy is the planning, management and delivery of a website’s content formats such as text, images, videos and anything else you put on a it. It is closely related to SEO and copywriting.

How SEO and Copywriting Play Into Content Strategy

SEO is the art of designing a structured page meaning clean HTML markup that can be easily interpreted by search engines but filled with content that is helpful to people. A single web page is not very useful but a combination of pages that relate to each other so people using search engines can find a site based on keywords provided within each page and topic to help generate topical authority for a site.

By planning ahead what topics will be on the site, what headlines will be written and the supporting text and images prepared it’ll make our lives as web designers much easier.

Copywriting relates to SEO because effective writing highlights the topic, the web pages intention and is able to attract search engines algorithms and peoples’ search terms. With our content strategy plan, we have the blue print to stay focused on these topics.

Implementing SEO and Copywriting Techniques

By planning and organizing your content first such as declaring your marketing message, business purpose or goals; you’ll create pieces of content that help support the website. Each section of text will support a topic and these category topics will support the main topical theme of your site or micro-site. Other supporting contents are images with proper tags, internal links to pages so information architecture and site navigation has a good flow and well written copy to attract people and search engines’ attention.

As web designers, we should know and understand a combination of skills so we can create better sites that are both aesthetically pleasing and functional as well as being able to educate our clients. We already know basics to SEO and how to effectively write copy content for websites. We can create and prepare graphic images and photos. Most likely you have a blog and write to it regularly on your website as well.

Incorporating these skills together and planning a client’s or your own content for the web is how content strategy becomes part of the design process. Its a control mechanism to ensure that no task is left behind so we can minimize delays on our web design projects.

Further Reading On Content Strategy

Discipline On Content Strategy – From A List Apart, this article describes the discipline of practicing Content Strategy and why as web designers we should incorporate it into our design process. There are several other great articles on this subject at A List Apart and I recommend you reading them.

Content Strategy: The Philosophy of Data – From Boxes and Arrows offers how Content Strategy is not just about text but all data that pertains to a site. It is a great article to learn more about this topic.

Content Strategy For The Web Professional – From Lucid Plot gives a great summary for Content Strategy and how we should, as web professionals, practice this discipline and use them in our projects.

As I delve deeper into the design process I finding watching art and design film documentaries to be very helpful. Rather than just read books, magazines and blogs on web design, web development, graphic design, content strategy, etc; I needed to give myself a break.

Its a visual treat to watch art and design film documentaries because they are easy to process, short in length and offer good narratives. I draw inspiration from all the films for my own web projects listed below as they are great references to art and design. I highly recommend you to watch these films and hopefully they’ll inspire your next web project.

Exit Through The Gift Shop

Great art documentary film on the background of street art. At first I thought this film documents the history of graffiti. Instead, it let me discover a fascinating world to art and design in pop culture through street art.

It has a good story narrative besides just documenting street art. There is a sense of irony after watching this film because its similar to the state of web design. What makes you an artist and what is art?

Same can be said about web design. If you have the tools to create a website, does that make you a web designer?

This is definitely a must watch documentary film about street art. I think it’ll inspire you to yearn to learn more and getting better at your craft.

Art & Copy

Documentary on the greatest marketing advertisement campaigns and the clever masterminds behind them. Art & Copy is one of the coolest documentaries for me personally. It has a nostalgic feel thanks to showcasing the great advertisements of my generation such as the “Got Milk” campaign, or Nike’s “Just Do It’ slogan and Apple Macintosh 1984 Super Bowl ad.

Credit goes to the agencies responsible for creating these viral marketing campaigns. The combination of creating clever messages and the use of powerful graphic designs produced memorable advertisements. Even more inspiring is that these campaigns took place prior to all the technology hoopla available to us now such as using social networking, YouTube videos and mobile technology.

I strongly recommend Art & Copy because it will give you a nice background in advertisement marketing and it’ll definitely give you a few ideas to work with for your next online marketing and graphic design project.

Helvetica

The origins of Helvetica, the world’s most popular and widely used font. Hate it or love it, it is here and many swear its perfection. I am amazed there is enough material to fill a film documenting just one single typeface. And even more amazed on how entertaining the movie was for me.

As a web designer, its important to learn more about typography and the type design process including knowing the difference between font and typeface. Unlike designers that specialize in print, web designers deal with what is on the screen.

However, print design has been around much longer and there is much to be learned for a web designer from it. A web designer should incorporate the knowledge, usages and design processes taken from print designers.

Helvetica is a great movie to learn more about typography, graphic design and global visual culture.

Objectified

Every day things we use and usually take for granted all went through a design process. Simple things like household items from fruit peelers to laptops. Objectified is an interesting film documentary about the design of things.

The subjects discussed in Objectified relate to web design because we can incorporate the though processes to how to improve user experience and creating better user interfaces for sites. To cut out the garbage and unnecessary elements in our web designs. To not over design and losing focus of the purpose of the site.

Milton Glaser: Inform and Delight

Into the mind and history of great designer, Milton Glaser. If you don’t know, this man is responsible for the iconic “I ♥ NY” and Bob Dylan album cover. You’ll draw inspiration from one the greatest minds in graphic design for over forty years.

As a web designer, we’re still uncertain on how the web and Internet will continue to evolve. However, great design is timeless. And creativity should not be restricted.

It makes me want to sign up and spend my summer learning from him. And to visit New York because it is such an awesome city with so much to discover.

Between The Folds

Amazing origami documentary that will introduce you to the amazing world of folding paper into any object imaginable. It is crazy to see some of the origami designs and art pieces created.

A lesson to be learned from this film documentary is that web design starts with an open canvas like a piece of plain paper. With your ideas, you can take that canvas to great heights. But you will need to thoroughly plan, practice and continue to learn and be inspired like these origami artists.

Bonus Documentary Film: Botany of Desire

Botany of Desire is a film documenting plants and nature. It specifically shows how nature copes with re-designing itself to continue evolving so humans will interact with it.

Design and nature is conflicted. What is designed cannot be natural right? Well, in nature both can happen. This really isn’t an art and design documentary but I enjoyed watching it.

You draw clues from how nature deals with seducing humans to act. Like our graphic designs, web designs or marketing messages; we want it to interact and offer a memorable experience for our viewers and users.

Like plants dealing with re-inventing itself, as web designers we need to evolve and continue to add new skills to our repertoire so we can display them in our projects.

Take The Lessons Learned and Employ Them

After watching all these film documentaries, each one offers a lesson for me to help further my skills in design. It’s a nice break from reading or coding or composing.

I enjoyed these films so much I decided to write a post to share. I highly recommend you watching these, in no particular order but just to watch and enjoy. If your a designer in any field, you’ll definitely enjoy these art and design film documentaries.

If you have any other film documentary recommendations, I’d love to hear from you. Hopefully, they’ll inspire you to do better work and create more creative web projects.

As I update the DesignRJC site, I run into a query issue for my Custom Post Types in WordPress 3.1 where the previous_posts_link() and next_posts_link() are not displaying properly. If you’ve been working with custom post types in WordPress 3.1 and have this issue, hopefully this will help resolve it.

Researching The Issues With previous_posts_link() And next_posts_link

Basically, the previous_posts_link() and next_posts_link() functions allow you to display the next set of posts being queried. In this case, it is a custom post type of portfolio items I created for DesignRJC to display projects, client work and concepts. You can read more on using the these functions on the WordPress Codex here and here.

Its maddening when something so simple as using a built-in WordPress function does not work properly and I had several hunches to try and debug.

At first, I thought it was the theme.  Currently testing the capabilities of building out a child-theme using Justin Tadlock’s Prototype Theme. Unfortunately, not being an exclusive member of their support forums doesn’t get me much help.  Still not 100% sold on child-themes and relying on a framework but it definitely has its positives.

Began double-checking the custom post type registration functions to make sure the re-write slug name for portfolio post type is different than the page template name used.

Everything checked out okay on that end as well.

I then study the query itself within the page template.  The query I use for the portfolio post type is:

<?php
    $paged = ( get_query_var( 'paged' ) ) ? get_query_var('paged') : 1;
    $args = array( 'post_type' => 'portfolio', 'posts_per_page' => 2, 'paged' => $paged );
    $loop = new WP_Query( $args );
    while( $loop->have_posts() ) : $loop->the_post();
?>

From reading other people’s experiences, it seems that my query is correct because of creating the variable $paged = ( get_query_var( ‘paged’ )) ? get_query_var( ‘paged’ ) : 1; line of code. This didn’t resolve my problem.

Solution For Fixing previous_posts_link() And next_posts_link() Properly For Custom Post Types

I came across another solution for displaying next_posts_link() and previous_posts_link() functions correctly.  It required the use of a second parameter of $max_number_pages. In short, it passes the total number of pages to be paginated within this custom query. This solved my issues and here is the snippet of the code I used:

<?php previous_posts_link('« Previous', $loop->max_num_pages); ?>
<?php next_posts_link('More »', $loop->max_num_pages); ?>

Notice in both functions, the second parameter is used.  By default, it is set to zero to display all pages.  Pagination for custom post types require extra finesse.

Where it is $loop->max_num_pages, $loop is the original query variable object from above and by using max_num_pages, I pass the total number of pages to be paginated into the second variable from the query.

Very helpful hint and fix to working with WordPress custom post types. Credit goes to WPCanyon for coming up with this solution.

As a creative person, you will often see a photo that is pretty interesting  to begin with.  By making a few minor adjustments you are able to fix any flaw or add details.  Photoshop is a great tool in preparing images or for editing web graphics.  It is also a fun tool for an exercise like this.

A good example is this photo of this lady sitting at the pool; when turned 90 degrees, it appears that she’s sitting on a ledge and there is a wall of water.  It is fun a to take a cool photo like this and make it even better.

The original photo, shown below, has some background distractions that take away the “wall of water” sensation.

Original Photo Before Photoshop Image Editing

After Editing in Photoshop

Everything was done in Photoshop CS4 using masks, patch tool and healing brush as well as rotating a layer to make the lady’s head look as if she’s not struggling to keep still in water.

Here’s a side by side comparison.  What do you think?

When it comes to design, it is normal to quickly develop mock up websites or sample web graphics for clients.  We often use dummy text  or placeholder content known as “lorem ipsum”.  Lorem ipsum are the first two words typically used for any dummy text that is auto generated.  It is a sample text that is used to mimic content without any meaning.  It provides a natural flow of characters grouped together to mimic the flow of real content giving clients an idea of how a block of text will look in a given space, content box, web browser screen or web page.

How To Generate Your Lorem Ipsum

Rather than doing a search for dummy text or lorem ipsum and then copying and pasting it every time it is needed; there are definitely faster and more efficient ways.  Several ways of quickly generating lorem ipsum dummy text are widely available on the internet either as a website application, a browser add-on extension or software plug-in.

This old-school way involved  avoiding repeat visits to your dummy text website by creating a new text document and saving the generic lorem ipsum paragraph.  Have it on your desktop to be  handy so you can use it at any time for your copy and paste action.  However, this is an inefficient way.

If your looking for quickly generating while working in a browser, you can head on over to this website, the lorem ipsum generator site.   It provides several options so you are able to generate based on number of paragraphs, words, bytes or lists.  Not bad as its pretty customizable but how custom does it need to be since it is only dummy text used for a mock up website design or web graphic.

Better yet, if you are using Google’s browser, you can use this lorem ipsum Chrome extension to quickly access your placeholder content anytime.

If your working in Photoshop, you can download an extension plug-in that generates placeholder text.  This plug-in adds an additional panel that helps generate a “lorem ipsum” paragraph.  This is useful especially when designing the look and feel of a website theme without any content.   The plug-in can be found at the Lorem Ipsum Photoshop CS4 Extension, and it is easily integrated and installed.

Now, many text editors like TextMate, Note++ or my current favorite IDE (internal development environment) Coda allows you to save snippets of code and quickly access them via a set command text.  For example:  In Coda, I have it set so when I type “lorem”+ tab button, it automatically generates a paragraph of placeholder text.

The options are endless and if you really want, you can even do a system wide setting such as using an application like TextExpander.

How to Properly Use Dummy Placeholder Content

We’ve shared several locations on the internet to find lorem ipsum text but let’s not go overboard slapping dummy text all over your designs now.  So when does one use placeholder content?  Here are some general rules to follow:

• Use dummy text when the client has not provided any content
• Before using lorem ipsum for headings in your designs; it is better to establish your style guidelines
• Placeholder content should be used in wire frames, not visual themed designs (hopefully you already have some established content)

How Do You Use Lorem Ipsum In Your Design Work?

How and where do you get your dummy text?  Do you also use some sort of plugin for your programs?

I miss the days actually excited to go to my mailbox and see the famous Netflix envelopes.  I would already know what movie is arriving and that is the reason I chose Netflix over Blockbuster.

Unfortunately, these days, the movies arriving in the Netflix envelope is not exactly on my top ten list of movies.  Movies in my top ten are usually new releases in Blu-ray format.

That’s why I pay that extra $1 or $2 to get Blu-ray.  It is such disappointment now because either Netflix has a short supply of actual discs available to ship out or they are holding back on new releases.

My top 10 list (its more like top 20 movies) I would like to see that are new release and in Blu-ray have been sitting in my queue since last year with a “Long Wait” status.  Even the “Short Wait” status movies are not arriving as quickly as before.

Decision to Downgrade

So I made the decision, to not cancel Netflix but to downgrade my account from the 3 disc to the most basic single disc with unlimited streaming for $9.99 a month.

The reason?  I’m not getting the 3 movies I actually want and most of the time I am just streaming.  Netflix has been so focused on changing its business platform from DVD/Blu-ray rental to streaming content.

It’s nice but content selection is still sparse.  I do hope they will either provide better service for their disc service where the queue wait time is shorter or have a more complete selection of streaming movies and television shows.

At this point, I’m not quite ready to cancel Netflix but if once I’m done watching most shows or movies; there’s not point.  Especially if some of the shows are available at Hulu, YouTube or network television sites.

I love reading Smashing Magazine as it is extremely helpful for an aspiring graphic designer slash web developer.  When they were advertising the release of their book Smashing Book, I pre-ordered right away.  I had great hopes and they sure delivered a book chock full of ideas, concepts and smashing content.

The Good

As always from the writers, content is key.  This book touches upon most topics that are relevant for any designer focused on the web as its medium.  The topics range from taking full advantage of CSS for layouts to typography options as well as color theory.  It covers on the fundamentals of user interface design and usability concerns that may not be something we may care as much as typical graphic artists.

Besides the graphical topics it covers, the book also covers the operations and business aspects that one may neglect.  From learning pieces of good coding for optimizing SEO to optimizing performance on websites.  There is also references to utilizing the free analytical tools to track metrics and conversion rates.  Finally, it teaches you to be aware of marketing and branding.

Another highlight subject is the insight Q&A from the authors.  This definitely provided ample rations of food for thinking.  It ends with a story of the Smashing Magazine.

Its a good amount of tips and insights that you may not gain from another book.  In addition, there are the references for you to further develop and learn on the topics the books chapters touches on.

The Bad

I can’t really fault any of the content in the book.  After all, its written by some of the leading minds in this industry.  However, I would have expected the book itself to be much better constructed.

The book is smaller than what I’d like.  I mean, the content is colorful full of graphics, screen shots and examples, it just begs to be done in a proper format like a coffee  table book.

The binding of the book, as others have reviewed, is horribly constructed as you have to be extremely careful when reading or else the pages may come apart.  Add to the problem is that the page layouts are tight where padding is minimal for the amount of content crammed in.  It makes reading the content much more difficult without opening the book up.

There is definitely some errata as well in terms of spelling and reference.  Particularly of note, in the chapter on usability, they reference a website that is clearly of the Korean language but state it as Chinese.  Small error but being international; they need to recognize this.  Korean and Chinese writing is completely different.

Finally, this book took way too long to arrive.  I pre-ordered in August and hoped it would have arrived in October.  It did get to me until December, in time for Christmas.  But had I known, I could have probably picked up all the content in the book from other resources already.

Looking Forward to the Next Installment

I am fairly critical but I do look forward to the next installment from Smashing Magazine.  I hope Smashing Book Vol. 2 will be even better; from content to presentation to construction.  It’s been three months since I’ve received the book and just about the same amount of time since I’ve read through.  I guess, like their shipment problems, it just took me awhile to get to actually putting up my thoughts on book.

***I hear the book binding issue has been resolved, unfortunately, my book has not been fixed.  Perhaps they can send me a electronic .pdf version so I can actually use this wonderful book as a reference manual.***

Default WordPress allows you to display recent posts and recent comments through a widget.  However, as I develop my own theme, I want to be able to customize as much as possible without using a widget in my sidebar at all.

The problem is, displaying recent posts and recent comments is not as simple as just using a WordPress template tag found in WordPress Codex.  Instead, you will need to get creative and create a bit of custom code to grab the data from the database.

There are definitely some common code snippets used for WordPress but I found the ability to control and display recent posts and recent comments to be what I need most.

Displaying Most Recent Posts

There are several ways to display the most recent posts from just using the wp_get_archives tag to query_posts tag which involves using the WordPress loop.  There is a more customized solution that I found from Dino Latoga and its as follows:

<?php
$recentposts = get_posts('numberposts=12&category=4');
	foreach ($recentposts as $post) :
	setup_postdata($post);
?>
<li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
<?php endforeach; ?>

Displaying Most Recent Comments

Also from Dino’s post on commonly used WordPress code snippets is being able to display recent comments.  Unlike displaying most recent posts, it doesn’t necessarily uses any WordPress tags.  Instead, you are actually querying your database to grab the necessary information you want to be displayed.

Here is the code for displaying most recent comments:

<?php
global $wpdb;
$sql = "SELECT DISTINCT ID, post_title, post_password, comment_ID,
comment_post_ID, comment_author, comment_date_gmt, comment_approved,
comment_type,comment_author_url,
SUBSTRING(comment_content,1,30) AS com_excerpt
FROM $wpdb->comments
LEFT OUTER JOIN $wpdb->posts ON ($wpdb->comments.comment_post_ID =
$wpdb->posts.ID)
WHERE comment_approved = '1' AND comment_type = '' AND
post_password = ''
ORDER BY comment_date_gmt DESC
LIMIT 7";
$comments = $wpdb->get_results($sql);
$output = $pre_HTML;
$output .= "\n<ul>";
foreach ($comments as $comment) {
$output .= "\n<li>".strip_tags($comment->comment_author)
.": " . "<a href=\"" . get_permalink($comment->ID) .
"#comment-" . $comment->comment_ID . "\" title=\"on " .
$comment->post_title . "\">" . strip_tags($comment->com_excerpt)
."&hellip;</a></li>";
}
$output .= "\n</ul>";
$output .= $post_HTML;
echo $output;?>

There a tons of custom codes to make your WordPress installation that much more feature and content rich, but these two code snippets have helped me create a better user experience when combined with Tabbed Menu in the sidebar.