If you search for any term in Google, you will see a series of ads that appear on the right column of the search results page. These ads are driven by keywords that any individual/business can purchase according to the type of service being provided. These keywords are called Adwords and they are driven by the most powerful search engine in the world, Google.

I must confess I would have never tried them were it not for several coupons we received at the office that granted us $100 per code. As a creative, I always have reservations about being charged for exposure, but the truth is that you’ll get a lot of attention (maybe sometimes unwanted) by advertising through this channel.

So I created my Adwords accounts, discovered that I can link it to my Google Analytics account, picked several keyword combos I though were effective, and was good to go. The first few days were uneventful but pretty soon I received a “click”. A “click” means just that, someone has clicked on your ad and been directed to your website. This also means you’ve been charged. The price varies per word and I’m still trying to figure out the pricing scheme.

Below is a screenshot of what a campaign looks like on the control panel.

At the top you can see a preview of your ad unit, you can also see and edit various setting including the daily spending limit. Mine is set to $10 as you can see. In the middle of the page you have a line graph that display clicks/day. At the bottom is the keyword list you chose along with the total cost for each word on the far right.

The other two stats to note on the bottom table is clicks (how many times the ad was clicked on) and impressions (how many times the ad was displayed). These two will yield the clickthru (CTR) rate which is a good way to measure performance. The cost per click (CPC) shows how much you are paying each time someone clicks on your ad. It seems like more specific keyword combos like “custom wordpress themes” cost less than the general ones like “web design”.

When designing web layouts for information-based (as well as experiential) websites, content is king. This is why the best approach for this type of layout is to begin by dropping in all the content bits on a solid structure and seeing how those bits relate to each other before getting distracted by fancy yet less relevant things like backgrounds, navigation styles and iconography.

This is something I can’t stress enough because it’s a trap I usually fall into. Often we’re rushed to deliver comps and it’s difficult to think about the details so it’s easy to go for a fancy background with a slick navigation that will have a quicker visual impact on a client instead of focusing on the more important, yet less noticeable (at first) aspects of an interface.

Typography, page structure, hierarchy are things that really define the underpinnings of any solid content structure upon which a designer can add as many necessary additional visual elements as are required. Beware of too many of these extras though, as a friend once told me, “Don’t add too many toppings to the pizza.”.

When setting up a Wordpress blog such as this one we can begin thinking about what content we want to have on it. The approach I take is to figure out the number of pages and how many columns per page are necessary, then I define what add units or other fixed modules need to be on the pages and finally I set up a grid structure based on these constants.

Once the grid is set the next step is typography. It’s crucial to have as close to the final content as possible which is a challenge in many cases. I’ve learned to progressively update my layouts as the “final” content comes in. Ah, revisions…

Ok, so you’ve got your blog installed on your very own URL, how exciting! Now you need to figure out how to start posting entries to it or it won’t be much of a blog at all. The first thing you need to do is to go to your Wordpress Blog admin section. From here you can control all aspects of your blog. How it looks, what to display on the sidebar, and yes, creating new posts and/or pages.

You can find your Wordpress admin section by typing “/wp-admin” after your blog’s URL in your browser’s address bar. So for example “http://yourblog.com/wp-admin”. The first time you do this you will be asked for your username and password. You should have received this information via email when you first set up your blog. You might want to check your inbox now if you’ve never logged into the admin section.

Just as a side note, it’s very important that you change your default password to something that’s easier to remember. You can do this in the “Settings” section of the Wordpress admin section.

Once you’ve logged in you will land in your admin section’s dashboard. This is a sort of overview of what’s going on in your blog. On the left you will find a side navigation that will let you access the different parts of the admin section. If you click on “Posts” (the first option from the top) you will get a small dropdown, select the “Add New” option. You will be directed to a page where you will find a large text field at the top (this is for the title of your post) and a larger textarea under it for the actual written content of the post. This textarea has basic text editing tools above it and can also support html markup if you click on the “HTML” tab on the top right of it.

You can save your progress at any time by clicking the “Save Draft” button on the top right of your dashboard. This will not publish the post so it will not be visible to your audience. You can publish the post by pressing the blue “Publish” button underneath “Save Draft”. Remember you can always come back and edit the post even after it’s published by accessing the “Posts” section of the dashboard. Here’s a screenshot of what it looks like:

I’ve been setting up Wordpress-based sites for other people for years now and had never actually set one up for myself. It really is very easy to setup once you have your domain name and hosting established. Here are 5 steps to follow to get your own Wordpress blog up and running.

Step 1: Setting up a domain name and web hosting

Since we’re looking to create a Wordpress blog with it’s own distinct URL (not a .wordpress URL), we need to setup hosting and buy a domain name. You can do this through services like Godaddy, Surpasshosting, Mediatemple, etc. You will need to select the name you want then check and see it it’s available. The prevoiusly mentioned vendors have a feature which will let you check availability. Next you will need to choose a hosting plan, most vendors usually have several different ones with different price ranges. Once you have purchased hosting you will receive an email with important information about your account including email setup, FTP access and the path to your admin section.

Step 2: Downloading the Wordpress Files

You will need to download the package of Wordpress files from their site at wordpress.org. The free download include all the files you need to get started. You will get a .zip file which you can open from your desktop by double clicking on the icon.

Step 3: Setting Up a Database on Your Server

Somewhere on your server you will need to create a place where all the information gets stored. It a repository for all the posts you write, all the comments that are made and any pages you add on to your blog. You will need to locate your hosting server’s admin section (sometines called Plesk or Cpanel) and look for the Databases section. Once inside the database section you will need to create a new database and a database user with all the priviliges. Note the database, user and passwords as you will need them in the next step.

Step 4: Editing the wp-config file

In the folder you downloaded from Wordpress, there should be a file called wp-config-sample.php. You will need to rename this file to wp-config.php and open it up in any text editor (dreamweaver, bbedit, textedit, notepad,etc). Once you have the file open, change all the information regarding the database (from step 3). Save your file once you’re done.

Step 5: Getting FTP access to your server and uploading the files.

You can upload files to your server from the admin section or you can use any number of free FTP clients that are out there (I use Cyberduck for my mac). The FTP login info is provided for you in the email you receive once you have setup your hosting (Step 1). Look for the main folder (usually called public_html) in your FTP client and drop all the Wordpress files you downloaded into it. After the files upload, go to your browser and type the URL of the site and follow the simple instructions. That’s it!

Using photography is something everyone needs to do at some point and it is sometimes a challenge to find ones you can use that are reasonably priced. iStockphoto is a great resource to get images that are affordable. I’ve been using it for a while and even though sometimes it’s challenging to find images that look natural, it is possible to get good ones and you can’t beat the price. They even have a subscription model that we’ve been considering.

The images come in different sizes, from small which range from 300px-500px wide to extra large which can be as high as 5000px wide. You can buy these images with iStockphoto credits which come in bundles of 12, 26, 50, 120, 300, 600, 1000, 1500, and 2000. They have a Pay-as-you go system as well as the subscription model for individuals as well as corporate entities.

In my experience, sites such as Getty Images or Corbis will charge hundreds of dollars for their images. I’ve always worked in small web-based offices where budgets were tight and there’s no real need for large hires photos like there would be in an ad agency. In that sense this has always been a great resource. They started out with just photography but now they have illustrations, video, audio and even Flash. Be sure to check it out next time you’re pressed for time and need affordable image assets.

A bit of interesting trivia I learned recently is that the first bird illustration that Twitter used was bought on iStockphoto for $10.

This is something that I’ve recently found very useful in helping a page be easy to read. One particular recent project that I worked on was a financial website similar to Mint. The first pass I took I only used one size (14) and I began differentiate the type only by using color and weight. It helped the page feel very clean and easy to look at specially considering the amount of information that was on the page. The only other size I added on the page content itself was a larger header style to make a clear entry point.

For this Wordpress blog I made all the text 14 and the only emphasized the post and page headers by making them larger and bolder.

It’s like building a puzzle, depending on the pieces that you want to emphasize you go up or down the scale first by weight, then by color and last by size. Switching to a secondary font would create even a bigger separation and as such should be reserved for unique elements like the navigation, logo or promotional touts.

One other thing I noticed on the project I mentioned before was that selecting a font that sets narrower (such as Lucida Grande) is better for a layout with large amounts of information as opposed to one that sets a bit wider (like Arial). This became specially apparent in a spreadsheet-like page I had to put together. I was able to fit many more columns on the page with Lucida Grande.

What are pretty permalinks? A permalink is a basically the direct URL to your page or post within your blog. By default these are given an ID number that displays something like this “http://yourblog.com/?p=845″. This is definitely something that you might want to consider changing if only because it makes the address for your individual pages and posts easier to remember.

In order to do this you will need to change the permalinks settings in your Wordpress admin panel as well as modifying the .htaccess in the root folder where your blog files are located. This is the place where you dropped in the files you downloaded from wordpress.org.

An .htaccess file is basically a little text file that sits in your folder and dictates directions about the structure of URLs within your site. You can google “.htaccess” to learn more. These files are usually invisible so you will need to enable viewing of invisible files on your FTP client. In Cyberduck, which I use, you can do this in the top menu by going to View > Show Hidden Files.

Once you open the .htaccess file you will need to paste the following code into it:


# BEGIN WordPress

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]

# END WordPress


Once you do this, save the file and close it. Then go into your Wordpress admin section and navigate to the Settings>Permalinks section. Once here, select the 5th option from the top “Custom Structure” and paste the following into the text field:

/%year%/%monthnum%/%postname%/

Once you’ve done this save the settings and test it out on your blog. You should be good to go!