Templamatic

14 Helpful Domain Name Tools

9/14/2008

It seems like it would be a pretty straightforward task, but with so many new sites being launched each day, and so many individuals buying up available domain names to sell, this can be one of the most difficult decisions you'll have to make when it comes to launching a new website.

Fortunately there are some really helpful tools for finding and researching domain names. Take some time and go through the resources listed here and your search should be much less of a headache.

Whois

Whois will give you some basic information on the owner of a domain and the servers that are hosting it.

Archive.org

The WayBack Machine from Archive.org is another useful tool for researching domains. With this tool you can see how long a domain name has been around, if at all, which is something you're always going to want to know before purchasing.

Bust A Name

Bust A Name is probably my favorite tool for finding good, available domains. You'll enter a number of words that are relevant to your site (the more you list the more results you'll get) and it will show you any and all available combinations of those words. You can set it to create two or three word domains, and it will even give you synonyms for your suggestions.

Name Boy

Name Boy is a very helpful tool for finding available domains to purchase. Enter a primary word and a secondary word and it will produce a list of available results.

Domain Hacks

If you've hit a wall finding available domains, try Domain Hacks. It will give you some creative and unconventional ideas. Many of the will be domains you'd rather stay away from, but this is a great tool for seeing the domain finding process creatively.

Instant Domain Search

Instant Domain Search is a rather unique tool. It literally is instant. As you're typing a domain it's showing you available possibilities. Keep typing and you'll get some more samples listed. This can be a quick way to get some ideas flowing.

DomainsBot

DomainsBot also works pretty quickly to give you a list of potential domains. It's not the best for finding new ideas, but it will quickly show you several domains along with information about their availability.

Just Dropped

Just Dropped is a place where you can find domains that haven't been renewed by previous owners. You may be able to find some higher quality domains with this approach. Some of them will have a history with search engines, which can be good or bad, so do some research.

URL Trends

URL Trends is a helpful tool for researching existing domains. It will give you some information such as inbound links, PageRank and more. It's a good idea to use a tool like this before you buy a domain to see if it has any history.

dnScoop

dnScoop is a fun tool with limited usefulness. Enter an existing domain and it will give you an estimate of its value. However, dnScoop is also a marketplace for domains, so in my opinion their values are going to typically be overstated. Still, the information that it gives you about the domain can be helpful.

Google Banned Checker

If you're buying an existing domain, you'll certainly want to know if it is banned by Google before purchasing. The Google Banned Checker is not going to be 100% accurate, but it might tip you off to a potential problem that you'd rather avoid.

Number of Pages Indexed

Self SEO's Number of Pages Indexed tool is a quick way to see what pages the major search engines are indexing.

Killer Domains E-Book

Daniel Scocco of Daily Blog Tips has written a detailed e-book on the subject of finding effective domain names. I personally own a copy of Killer Domains and I can say that it is a helpful guide if you're struggling to find the right domain.

Buying Premium Domains

In addition to the typical domain registrars like GoDaddy and Network Solutions, there are a huge number of marketplaces to buy premium domains for sale by the owner. Here is just a sampling of places to buy or sell.

Template Pricing Update

8/6/2008

We have rolled out our updated pricing model for template sales and wanted to fill everyone in on the changes. When we first launched Templamatic, we had an open pricing model which meant that every designer could set their own sale price on each individual template. We thought that this would promote an open market where the true value of a template could be set by the designer and passed on to the buyer. What we have found instead is that the inconsistency in pricing causes confusion amongst buyers who are trying to make the right purchasing decision based on factors such as price and quality. We also want to foster an environment where designers are being adequately compensated for their creative efforts and are not forced into a bidding war to sell their templates at the lowest price possible.

From now on templates will be sold according to the following price chart:

$0.0 Free
$20.00
$35.00
$50.00
$65.00

When a designer submits a template to Templamatic, they can choose from this list, according to the time, effort and general quality of their product. As part of our internal review, Templamatic will also validate the correct price has been chosen. Under special circumstances, a designer may indicate an alternate price if appropriate. Exceptions will be considered on a case by case basis.

We have added a new category for FREE templates. This category will be used sparingly for promotional template giveaways and not for low quality, non premium templates. We only sell the best templates available!

If you have any questions or comments on the pricing model, please feel free to leave a comment in the blog, or contact us via email or live chat.

9 Common Challenges in Blog Theme Design

7/8/2008

It's a good practice to understand the challenges that you will likely be facing so that you can plan your method for overcoming them and creating a successful blog. Let's take a look at some of the most common challenges.

Breaking the Norm

More so than other types of websites, blogs tend to be very standard in look and functionality. To those of us who visit a number of blogs everyday we're pretty familiar with the typical blog layout, and we even have come to expect it. For me it may not be boring to look at a typical blog layout with content and sidebars in the usual locations and styles, but for some people this can be very cookie-cutter and boring.

Standing out from the crowd is a serious challenge for blog theme designers. At some point creativity can interfere with usability and predictability of navigation. Many creative designers are using attractive, graphically-rich backgrounds to spice up the typical layout. This can be very effective since it gives a unique an attractive look without hurting the usability.

Whatever approach you take, standing out should be considered. Of course, it's possible to stand out with a nice design without being bold and relying on the use of a lot of images. Simplicity can also work well. Before designing your next theme, give some thought to how you can make the blog a bit different than the millions that are already out there.

Headers that Get Attention without Taking Up too Much Space

There are some excellent, creative blog headers out there that really grab your attention. However, some blogs also use a huge amount of the screen for a header image, and the content winds up starting at the bottom of the screen or even below the fold in some cases. This is really a matter of personal preference, but I think it's beneficial in most cases to start the content high on the page if possible.

If you have the whole screen to work with, creating an attractive header image isn't so difficult, but then it becomes more than just a header. Creative a nice-looking header that complements the content and takes up a small amount of screen space is certainly a challenge.

Navigation

Blogs are all about the content, and what good is the content if it can't be found? Ideally you'll want your visitors to see several pages before they leave your blog. In order for that to happen effective navigation is critical. Navigation is a challenge for any website, but it can be more so for blogs. Blog readers are often given choices of navigating through category archives, date archives, author archives, recent posts, popular posts, recent comments, and so on. Obviously you can't include all of these in your main navigation or it will be overwhelming and cluttered, but how do you know what to use and where to put it?

Part of developing navigation is understanding your readers and what they are looking for, and then giving it to them quickly and easily. This may take some research and experimentation to see what works best. Too often bloggers forget about the posts that have accumulated in the archives, and only new posts are given any attention. Making your blog theme more user-friendly and improving navigation can drastically improve the impact and effectiveness of your older posts.

Another part of the challenge with navigation and blog themes is that the content is always changing and developing, which brings us to the next point.

Scaling

Because blogs add so much new content on a frequent basis, the blog will be much different a few months from now than it is currently. An effective blog theme will scale with the blog. What good is a new theme if you'll outgrow it in 3 months?

When developing a theme, take some time to think about how the blog's content will change and expand over time, and what effect that will have on the usability and effectiveness of the design. Will the theme allow you to adapt with the changing of the blog? Can you feature different content a month from now?

Formatting Posts

After a nice theme is designed it's pretty common for most bloggers to type up a post, quickly look it over and hit the publish button. We spend a lot of time and effort getting the theme just how we want it, but the formatting and appearance of individual posts often gets overlooked.

Sure, the content is more important than how it is displayed, but the presentation can make a big difference. Take a look around at some of the blogs you visit regularly. Which ones do a good job of formatting posts and which ones don't?

An effective blog theme will include styles that make it easy to give your posts an attractive look even while emphasizing the content.

Implementation of Ads

Most blog readers are now comfortable with the fact that blogs are likely to include ads. Without advertising revenue many of the blogs you read every day would probably only exist in a fraction of their current form. With that in mind, a designer's job is to account for advertisements if they will be used in a blog theme.

When placed properly, ads can be effective without annoying visitors or deteriorating the look of the website. However, if they're not accounted for in the design process they will either annoy visitors or be placed in a spot that gets them no exposure.

Attractive Look + Readability

Some of the more creative blog designs will catch your attention based upon the quality of the design, but they'll lose you quickly because they've compromised on readability. Managing and blending both can be difficult at times.

Because blogs are so dependent on content, readability should never suffer at the hands of creating a more attractive appearance. With any changes that you make to your theme, be sure that readability has not been damaged.

Widgetitis

Widgets, buttons, and that sort of thing are obviously common on blogs today. When used in moderation they can be effective, however, some designers go overboard and wind up with a clutter, distracting look due to overuse of widgets. Most high quality designs only use widgets very modestly, or not at all.

Full Posts or Excerpts?

For bloggers this is an age-old question. When designing a theme you'll need to consider the needs of the specific blog that you're working with. Personally, I prefer excerpts because they make it easier for visitors to scan and find what they want. Excerpts can also give designers an opportunity to create a more attractive front page. Magazine-style themes use excerpts almost exclusively, which allows them to highlight more content in a small space.

Web 2.0 Photoshop Tutorial - VoiceTrader

7/8/2008

NOTE: You can download the PSD files used in this tutorial at the bottom of the page.

We will start things off by creating a new Photoshop document: 1000px wide by 980px high, on a transparent background. Next we will create three separate rectangular blocks extending across the width of the canvas, each on their own layer. The first block is white (#FFFFFF), 72 px high and placed at the top of the canvas. Directly under the white bar we'll create a orange (#FF7200) bar 158px high. Finally, we'll fill the remaining canvas with a dark-gray (#2E2926) block 750px high.

Step 1
In the interest of keeping our organizational sanity, let's take the time to label our new layers. The layer containing the white rectangle we will name "Logo Placement", the orange rectangle will be named "Header", and the brown rectangle "Body". Now we'll turn our attention to the "Logo Placement" layer. Start by selecting this layer and go to Layer > Layer Style (in the menu or by double-clicking the right side of the layer's title area in the Layers panel) and apply the Drop Shadow and Gradient Overlay settings below:

Step 2
Still working on the "Logo Placement" layer, we'll now add the VoiceTrader text and give it a logo treatment. Let's go with an all-caps Helvetica Neue LTD Condensed typeface to begin with. Now select just the "VOICE" text, give it a font weight of extra-black and a color of #2E2926. Do the same with "TRADER", using the lightest weight and a color of #877A70.

To add a subtle drop shadow to the logo type we'll select the layer with the "VOICETRADER" text and again go to the Layer Style window, applying the following settings:

Step 3
Stock image sites are a great resource for spicing up your designs. While searching for and purchasing stock artwork is beyond the scope of this tutorial, I managed to find a simple vector icon which will work perfectly sitting just to the left of the VoiceTrader text. Let's add another line of text set in 12pt Arial Regular with a color of #4A443E that reads "Home | About | Contact Us" (the "|" or "pipe" is just above the "enter" key on your keyboard). By selecting "Home" and hitting the "underline" option in the Character panel, we'll indicate that the current page is the Home page.

Step 4
Now we'll work with a stock image I found to brighten up our header. Stock.xchng (http://www.sxc.hu) is a great resource for free stock imagry, and I found this image at http://www.sxc.hu/photo/964319. Place the image on your canvas and scale it to the height of your orange header. To give it that blended "feather" effect, take out your Eraser tool, set the tip size to 150 with a hardness of 10, and erase along the directions of the arrows below:

Looking good! Now, let's spice up the header with some callout text. Let's use our Helvetica Neue LTD at 36pt and add the text "WE PRIDE OUR CLIENTS" in all-caps. Select "PRIDE" and give it a heavier font weight for added effect:
Next, we'll go to our Layer Style window and add a drop shadow to our "WE PRIDE OUR CLIENTS" text:
Just below the "WE PRIDE OUR CLIENT" text, we'll add a second line of text using the same font at 12pt reading "AND VALUE THEIR SHARE IN OUR COMPANY". Apply a Gradient Overlay along with the same Drop Shadow used in the previous step to the "AND VALUE THEIR SHARE IN OUR COMPANY":
Step 5
To finish up the header we will create two "call to action" buttons directing the audience to important areas of the site. Let's begin by creating the base shape of our button. We'll use the Rounded Rectangle tool with a corner radius of 12px (shown below) to create the desired button shape:

Open your Layer Style window, and add Drop Shadow, Gradient Overlay, and Stroke styles with the settings shown below:
Next, add the button text "FIND OUT MORE" in Helevetica Neue LTD size 12pt in the same orange as the header background (#FF7200), and add a drop shadow to the layer style:
After that, just duplicate the button (and text) and move it to the right of the original button. In the Layer Styles window for the new button, change the color of the gradient overlay to gray. Switch the new button's text to a darker shade of grey. You should now have something identical to the screen below:
Step 6
We've finished with the Header so now we're onto the Navigation! Start off by creating a new layer and naming it "Navigation". Using your Rectangular Marque Tool, select a 20px high area directly under the header spanning the entire width of the canvas. Fill the selection with the your background color (#2E2926). Take your Burn tool, set the tip size to 30 with a hardness of 0, and brush it along the bottom of your new rectangle according to the screen below:
Now we can add the navigation text. In all-caps Arial Bold 12pt, type "HOME", "ABOUT VOICE TRADER", "OUR SERVICES", "THE MARKETPLACE", "FORUMS" and "SUPPORT" on one line with a standard amount of spacing between each:
In a new layer, let's add a sample rollover state by taking our Rectangular Marque tool and creating a small rectangle 20px tall and just wide enough to cover the "HOME" text. Fill this with a lighter gray (#48403C) and use your Burn tool again to create a similar gradient effect you used on your navigation background:
Step 7
With the navigation complete, it's time for the Body of the page. Let's once again create a new layer and use the Rectangular Marquee tool to select an area from the bottom of the nav to the bottom of the page, spanning across the entire canvas. Fill this selection with the same color as your background (#2E2926) and then use the Dodge tool (with the tip set to 150px and a hardness of 0) to lighten the area according to the arrows below:
Now we'll add a small white vertical line between the Navigation and Body sections to visually separate the two. In a new layer, bring up the Pencil tool with a size of 1px and the foreground set to white. Hold the "Shift" key and drag a straight line from one side of the canvas to the other. Drop the opacity of this layer to 45%, and nudge it up or down if it's not exactly aligned with the bottom of the Nagivation section:
Step 8Let's start adding in content. I've found another site-worthy stock icon and will place it next to some welcome text for a little visual punch. In 14pt Arial Regular and a color of #9D9A99, add the text "Welcome to Voice Trader, Your Advisor in Telecom stocks":
Now we'll create an area for our first content paragraph to be held. Use your Rounded Rectangle tool with a 12pt radius setting to select an area 373px wide and 144px high, and fill it with a light gray (#3F3935):
Go to your Layer Style window and apply Drop Shadow and Stroke settings below:
Now we'll add some filler content with a headline set in white 12pt Arial Bold and the body copy in 12pt Arial Regular with a hint of orange (#CAB38A):
Duplicate our newly created paragraph along with all the headline and body copy and move the new group to the right of the original. Change the placeholder header and body copy text to indicate a different subject matter:
Step 9
In this step we will be using many of the techniques we've already established in the tutorial, so I won't go into too much detail explaining the steps. Let's begin by creating the background for our large content area... Notice on the screen below that the content area is a rounded rectangle with two separate colors. This can be done by creating one rounded rectangle area colored in white, and then duplicating it and changing the second rectangle's color to gray (#38322E). Rasterize both shapes and use the Rectangular Marquee to cut their appropriate ends off:
Apply the Layer Style settings below to the new gray layer:
Continuing with the gray area, let's add a simple introduction heading that reads "Our Solutions" and add the following icon to the right of the heading for some eyecandy:
Now select the layer with your white shape and apply the following settings in the Layer Style window:
Let's finish this area off with some filler content. Add a header set in 18pt Arial with a color of #FF7200, a subhead set in 12pt Arial with a color of #A38D71, and body text set in 12pt Arial with a color of #A5826B. Place the following stock image to the left of the header & subhead. Everything should now look like the screen below:
Step 10
In step 10, we finish putting content on the darker half of our body paragraph. Go back to the layer where we have added "Our Solutions" and create a rounded rectangle 226px wide and 36px tall and a color of #231E1B:
Now apply the following Layer Style settings to the newly created shape:
Add an icon and some label text, and then duplicate the tabs until you have a full list:
Final Step
In our last step, we will create the footer using the same tricks we did before. Use the Rectangular Marque tool and draw out a small rectangle 55px high, spreading the width of the canvas. Fill the selection with your standard background gray (#2E2926) and use the Burn tool along the top of the new shape:
Add some footer text and you're done:
Final Preview:
There you go, you've created a gorgeous website template! Using techniques you've just learned, you now have the knowledge to create an endless number of website designs.

Download the finished file for this tutorial.

9 Ways to Experiment as a Designer
(Without Messing Up a Client's Site)

6/25/2008

Sometimes it's difficult to find time for learning and situations for experimentation. After all, too much experimentation can ruin a client's site and you may get yourself into jobs that are over your head if you're too aggressive.
Fortunately, there are endless ways that you can experiment in order to benefit from the learning experience, and many of them will not even have the potential to harm a client's project. In this post we'll look at some excellent ways that you can build your skills safely.
1. Have your own sites
You can do a certain amount of experimentation with your own portfolio site (that's probably why you see so many creative portfolios), but you shouldn't stop there. Many designers, myself included, have a few other websites that are as much for experimentation as anything. Running your own sites can be a fun learning experience and you can do whatever you want and learn whatever you choose to pursue.
2. Follow tutorials
We're fortunate as designers that there is an abundance of information online about our profession (or hobby), and there are countless tutorial sites that can provide limitless learning opportunities. Take some time each week to work your way through one tutorial that will teach you something new. The guys at Eden have you covered with 3 great tutorials sites to start with: PSDTUTS, NETTUTS, and VECTORTUTS.
3. Create your own tutorials
If you're ambitious you can take on the task of creating your own tutorials for other designers. Most likely you'll learn some new things yourself along the way. Try to challenge yourself to create something better or in a different way than you have done before.
4. Create free WordPress themes
There are thousands of free WordPress themes out there, and many of them started as an experimentation of the designer. Developing your own theme can be a great learning process, and you can even help others out by distributing the end result for free. WordPress design is a great skill to master right now as it's becoming more and more popular by the day it seems. A high percentage of the inquiries I receive for design services are for custom WordPress themes, and I don't even target this type of business. Well-skilled WordPress designers have plenty of potential business.
5. Create a premium WordPress theme
If your skills are more advanced and the idea of creating a free theme doesn't appeal to you, why not work on building and selling a premium theme (of course, you can sell it here at Templamatic). By creating a theme for sale rather than for free you'll need to create something that's better than the free themes that are available, and that can be another excellent learning experience.
6. Create HTML/CSS templates
If you're not interested in WordPress or if you would just rather work on other skills, there's also a need for both free and premium HTML and CSS templates (again, you can sell them at Templamatic). You may be able to use the templates you create for future clients, or you can just give them away to the design community. Either way, you can stretch your skills and try new things to your heart's content.
7. Design wallpaper
If it's graphic design skills that you want to improve, working on creating unique wallpaper can provide great practice. Again, you can give away your work or just keep it for your own use. Wallpaper is pretty popular online, and if you offer it up for free you may be surprised at the kind of traffic you can get from it.
8. Create your own icons
Even more graphic design skills can be developed by taking on the challenge of designing your own custom icons. There's no shortage of free icons available, but sometimes you can't find exactly what you're looking for. This can be a great opportunity to enhance your skills and to get the icon that you really need. Much like wallpaper, free icon collections can draw a lot of visitors to your site if you're willing to give them away..
9. Volunteer for a non-profit
If you're looking to build some specific skills and gain general web design experience, you can always find non-profit organizations that are in need of free or low-cost design services. This may or may not be a good option for you depending on where you are at in your career. If you're just getting your foot in the door and working on building a portfolio, it may be a positive experience.
What's Your Experience?
How do you like to experiment and improve your skills?

Choosing the Right Blog Theme for You

6/19/2008

For WordPress users especially, there are just so many choices that it can be overwhelming. And to complicate matters, there are a few different types of themes and a wide variety of quality.
To start with, there are three basic types of themes: free, premium, and custom designs. For WordPress there are literally thousands of free themes available. Some are very high quality, and others are horrible. Since anyone can develop and distribute a free theme, you'll have to be very careful about the choice.
Premium themes will cost you an upfront amount, say $75, and then you will own the rights to use that theme for your blog. The licenses of different themes vary, so be sure to read the details before making a purchase. Premium themes ideally are of higher quality than free themes, and they will be used by fewer blogs, so yours will be a bit more unique.

If you want to go a step further than a premium theme, you can have a designer/developer create a custom theme for you that will be completely unique to your blog. This, of course, is the most costly option, but there is still a great deal of variety in price and quality from one designer to the next.
Factors to Consider When Choosing a ThemePrice
The first thing you want to decide is what type of budget you're working with. A blog theme is a big decision, so I'm not suggesting that you make price your number one factor in determining what you buy, but you need to know if you have the possibility of buying a premium theme, paying for a custom design, or if you need to stick to a free theme.
If your blog produces no money for you and you don't want to pay for a design, you can immediately eliminate premium and custom themes and focus only on free themes.
On the other hand, if your blog does produce income and you want to do the best job that you can with the theme to increase what you're able to earn, you may want to consider going with a custom design that will be most effective at meeting your needs.
If your blog produces moderate income or if it currently produces nothing but you're hoping to improve that, you may want to focus your search on premium themes. You can get a very high quality theme (like the ones seen here at Templamatic) for very reasonable and affordable prices. Typically you can get a much better theme than you could for free, with only a small investment.
Price shouldn't be a huge factor if you're considering two specific premium themes. There may be big differences in quality and only $20 difference in price. However, I think it's helpful to start your search by narrowing it down to the specific type of theme that you want and that you can afford.
Magazine Style?
A common trend right now in theme design, especially with premium themes, is a magazine-style of layout. However, a magazine-style approach is not a good fit for all blogs. In fact, the typical blog that is updated a couple times per week will usually benefit more from a traditional blog theme rather than a magazine-style theme.
If you publish something new every day or several times per day, or if you have a wide variety of topics from a few different authors, a magazine-style may be a good fit for you.
Now that you know whether you want a free, premium, or custom theme, plus you know if you want a magazine-style or a more traditional blog theme, you've narrowed down your focus and you can start going after the right one for you.Number of Columns
Most blog themes either have two or three columns. Magazine-style themes don't always fit into one of these categories, but most blog themes will. If you have a lot of content that you want to contain in the sidebars (including advertisements) a three-column theme may be best. Otherwise, the space for the primary content is more important, so going with a two-column theme will allow more screen real estate for the content.
Do You Want to Customize Yourself?
Some bloggers are comfortable with making some customizations on their own. If this is the case, you may want to look for a free theme or a premium theme that gives you a nice, attractive layout that you can work from. With the right theme as a starting point you won't have to make major customizations. Changing the color scheme or adding a unique header can make a big difference, and both are very simple. If you're not interested in customizing the theme you should look for one that is ready to go for you right out of the box, with no changes needed.
Do You Need Support?
Most premium themes will come with some type of support, but free themes will have a very wide range of support available. Some free theme designers will provide strong support, while others will provide none. The more popular themes also have a good bit of documentation available online from other users if you get stuck. If you won't need support, this is a non-issue. However, if you may need support at some time in the future, this should factor into your decision.
Scalable
Hopefully your blog will grow over a period of time. You may want to consider if a theme will allow you to include new features or new additions to your blog. Some themes will really only allow you to showcase typical blog posts, while others will have better options for adding pages, sub-pages, more categories and archives, etc.
Of course, if your blog grows you can always get another theme that will meet your needs, but it's nice to know that you won't outgrow your current theme too quickly, especially if it's one that you're buying.
Widget-Ready
Many themes now are widget-ready, which means you can easily drop new items into the sidebar and rearrange the sidebar contents. If you're not comfortable with altering the coding in the theme, this is something that you should look for. If you are comfortable working with the theme files, this probably isn't much of an issue since you can make the wanted changes yourself.
Readability
The heart and soul of a blog is the content itself. Some themes provide better readability than others. I suggest that you pay close attention to the readability of any theme that you are considering, and if it is not optimal, keep searching for a better theme.
Overall Look
Of course, you'll want an attractive theme. With all the other details you're considering, don't forget to gauge the overall appearance of the theme and how it will look for visitors. If you are paying for a premium theme or a custom design, ideally you should be getting a higher quality design than what you could get with a free theme.
SEO
Search Engine Optimization involves much more than just the structure of the site, but a poorly designed theme can cost you valuable exposure in the search engines. Most free themes are very poorly optimized, and in most cases the theme designers give very little consideration to SEO. This can be difficult to evaluate before buying or downloading the theme, but if possible you'll want to see how the issue is addressed by the designer. Some theme designers will explicitly state that the theme is built to be search engine-friendly, and they may even give some examples of what has been done.
Popularity
Using a popular theme can be both good and bad. On the negative side, lots of other bloggers will be using the same theme and you may have difficulty standing out. On the positive side, there may be more support available because more people are using the theme. You'll need to evaluate your goals with the blog and determine if using a popular theme will help or hurt your chances of reaching your goals. In most cases, I would say it's a good idea to avoid the popular free themes unless you are going to do some customization.
What's Your Opinion?
What factors do you consider when choosing a new theme?

Working With Feeds: 3 Options for Improved Use of RSS

6/12/2008

The typical use of RSS is to simply distribute news or blog content to subscribers. Aside from the typical approach of a blog having one feed, there are a number of creative options that can add a unique element to your blog and help it to be a more valuable resource for readers. In this article we'll take a look at 3 rather simple options for working with feeds to improve your site in one way or another.

1 - Sideblogs
Sometimes you may want to post something to your blog without having it sent out to subscribers and without it receiving prominent positioning on your front page. Maybe it's just a short message to readers that isn't critical to the blog, but just something added for fun or for extra resources. By posting a sideblog in your sidebar you can do just that. The contents of the sideblog will be very short messages to visitors that will not be included in your RSS feed (it may or may not have a feed of its own), and will also be kept out of the loop of full posts.

Why Do It?
A growing number of blogs are using sideblogs for a wide variety of purposes, including community news (example Freelance Folder), displaying your Delicious bookmarks to visitors, posting your Twitter updates, publishing random links that readers may appreciate, and simply short thoughts or statements that do not justify a full post.

Benefits:
Sideblogs can be a tremendous help for adding personality to your blog. Options such as displaying your recent Tweets can show readers a more personal side of you, the blogger. Additionally, community building and interaction are often a result of sideblogs. Take for example the community news approach. Here you are allowing visitors to submit their favorite links and others are benefiting from the exposure provided by those links. Another benefit of using a sideblog is that you can separate the RSS feeds of your main blog and your sideblog, which allows your readers to receive exactly what they want without getting too much. Lastly, a sideblog can add valuable and interesting content to your sidebar. Sidebars are often ignored by readers because they get used to seeing so many of them. Rather than just displaying links and ads, a sideblog can transform your sidebar.

Execution:
The process of setting up a sideblog is more than I can cover in this post, however, there are a number of excellent tutorials that already exist on the subject. Michael Martin of Pro Blog Design covered his approach in How to Set Up a Sideblog. Mohsin of Blogging Bits wrote about a method for showing your Delicious bookmarks in the sideblog. The official WordPress Codex has some helpful information in the article Adding Asides.

2 - Combining Feeds
Sometimes you may want to offer your readers a feed that doesn't exist as a typical blog feed. It is possible to combine two or more feeds and offer them to readers in one, all-inclusive feed.

Why Do It?
Maybe you own multiple blogs and you would like to offer readers a quick and convenient way to subscribe to all of your feeds without doing so individually. In this case, say you have three blogs, you could combine your three feeds into one and allow readers to get the content from all three blogs by only subscribing to the one feed. Another option would be combining the feed of your main blog and your sideblog. Say you use a sideblog to display community news and you'd like to offer readers the option to subscribe to both with just one feed. Yet one more option, create a combined feed that includes your Flickr feed, your Twitter feed, your Delicious bookmarks, etc.

Benefits:
Combining feeds can give more options and more flexibility to readers. If you use community news in your sideblog you can give readers three feeds to choose from, your main feed, the community news feed, and the combined feed. It's also possible to get more content to your subscribers. Say you have two blogs and a reader currently subscribes to one of them but not the other. Offering a combined feed may make it more likely or possible to get that reader to also subscribe to your other blog by using the combined feed.

Execution:
To combine feeds you can use a service like Yahoo! Pipes or RSS Mix. These services will create a combining feed for your use. I would recommend running that combined feed through FeedBurner so you get all the benefits of FeedBurner, including the subscriber count.

3 - Display RSS Feed on a Static HTML Page
There may be times and situations where you want your feed to exist somewhere outside of your blog. Maybe you want to republish your most recent posts on your portfolio site, or maybe you want to display a list of your most recent post titles. With this approach there are plenty of options.

Why Do It?
Showing all or part of your feed somewhere outside of your blog can help you to get some added exposure for your feed, and it can be used in ways that also benefit readers who are seeing the republished content or links. For example, on my homepage (which is outside the flow of my blog) I display a list of links to the most recent blog posts. This is a fairly common approach on portfolio sites to draw some attention back to your blog posts.

Benefits:
Republishing your feed can bring more traffic to your blog and it can open up some new opportunities to make your site a bit more unique and interesting.

Execution:
FeedBurner offers a simple and flexible solution for doing just this. They call it BuzzBoost. You can set up your feed for BuzzBoost by logging in to your account and choosing the options to customize it in your own way. The process of republishing the feed and making it match your site through CSS is fairly simple, but it's more than I can cover in this post. A few weeks ago I wrote a step by step tutorial of how I set it up on my own site: Display Your Feed on a Static HTML Page Using FeedBurner's BuzzBoost. Google also provides some assistance and guidance for using BuzzBoost that you'll want to check out. Another helpful tutorial is Using FeedBurner's BuzzBoost to Seamlessly Republish a Feed as HTML.

Make-or-Break Factors for Blog Theme Design

6/3/2008

When it comes to theme design there are several critical factors that will make-or-break the success of your theme. Here is a look at those that I consider to be the most important.
Readability
Blogs are all about content. Since the content is the focal point it's absolutely critical that visitors are able to easily read it. Using harsh color combinations, very small text, poor spacing and narrow content areas can all decrease the level of readability, and ultimately will lead to fewer visitors actually reading the content.
When building a blog theme, make it priority to create a template that will encourage visitors to actually read the content by making it easy on them. A large part of the responsibility for readability will fall on the blogger, in terms of using short paragraphs, bold text, bulleted lists, etc. However, the theme designer can help by using CSS to set up plenty of whitespace around headers, between paragraphs, and around the sides, top, and bottom of the content.
Navigation
Most blogs use a fairly similar navigational structure, and blog readers tend to expect and anticipate this type of navigation. Sidebars typically contain links to category pages, recent posts, popular posts, and RSS feeds. Most blogs also have a primary navigation bar, usually at the top of the page, which will include links to the most important pages on the blog.
Because visitors expect these navigational elements and they know how to use them, it's good for theme designers to develop the navigation accordingly. Navigation is sometimes used creatively or experimentally by designers, however, that can sometimes hurt the usability of the blog by confusing visitors. If you are going to stray from the typical blog navigational system, it should be clear to visitors how they can find what they are looking for.
Appearance
With millions of blogs online, and more being launched each day, it's critical for blogs to have an attractive appearance that helps them to stand out from all of the others. Most blog themes are fairly simple because the content is the focal point, however, simple can still be attractive. Other theme designers attempt to create a more unique look that will allow them to stand out.
Especially if you are attempting to develop premium themes, such as the ones being sold on Templamatic, appearance is important. With so many free themes available, bloggers will need to see something in yours that makes them feel that it's worth the money. Typically, appearance is one of the leading factors for that decision.
Consistency
Each blog has its own personality and its own unique style of content. The appearance of the blog should complement the content and should promote a consistent message to visitors. You can see good and bad examples of this throughout the blogosphere. A good example would be I Love Typography. Because the content of the blog is focused on typography, it's only fitting that the design should also rely heavily on typography to create an attractive look.
When you're designing themes to be used by multiple blogs, such as free themes or premium themes, you really can't control who will be using the theme, so the consistency is somewhat out of your control. However, you can design and develop the theme with a particular style of blog in mind. When the right bloggers choose your theme, the consistency will be present.
Priority
Because blogs contain such a huge amount of content, some of it will naturally get more attention and will be given more priority than others. For example, compare the approach of a magazine-style theme to the traditional blog theme. The whole reason for using a magazine-style theme is to feature a greater amount of content from the front page, rather than just giving one post (typically the most recent) the priority. A magazine theme may easily give 5 posts or more a chance in the spotlight on the front page. Magazine-style themes work well for some blogs, but they're not a good fit for the average blogger, because they're unlikely to produce enough content to make the magazine style work.
When developing a blog theme, consider how some content will be given priority over others. Will you include a popular posts list or recent posts list in the sidebar? Will you show full posts or excerpts on the front page? Most of the time the blogger will determine which content gets priority, but the theme designer should make that possible.
Search Engine-Friendly
Too many bloggers ignore search engine optimization when they choose a blog theme, and too many theme designers don't put enough effort into building a search engine-friendly theme. Not all themes are on the same level in terms of SEO. By taking some extra time in development to build a theme that will give the blogger the best chance of ranking in the search engines, you will be well ahead most other theme designers.
A theme will never create top search engine rankings on its own, but a poorly-constructed theme can cripple a blogs chances of ranking well.
What's Your Opinion?
As a theme designer, which elements do you focus on, and which ones do you find to be the most critical?

Diversified Income for Web Designers

5/19/2008

Obviously, Templamatic is a theme and template marketplace, so those who are selling their work here are taking advantage of one method of making money as a designer. I'd like to take a moment to look at some of the other opportunities that designers have. I'm not suggesting that any of us should try all of these. Rather, I think the best approach is to find 2 or 3 that seem like a good fit for you. Using more than 1 method of producing income will open up some new opportunities and give you a chance to increase your overall income, but trying to do too much will cause you to be spread too thin, and you'll probably be less effective with everything.
Theme/Template Sales
Premium themes and templates are very common today, and since that is the purpose of Templamatic I thought we would start here. While there are thousands of free themes and templates available online, there is a growing market of users who are interested in getting higher quality work, and they're willing to pay for it.
I feel that premium themes can be a great deal for both the buyer and the seller. The buyer gets a very high quality design for a price that's probably much lower than they could get a custom design, and the seller is able to make a good bit of money selling the themes rather than creating a unique design for every client.
There are a number of designers that make the majority of their income selling premium themes and templates, but what I think we'll see more and more of is designers using this as a secondary source of income.
Designing for Clients
Most web designers make their money by directly providing their services to clients. The clients are paying for a custom design, and the designer is working on a specialized design that caters to the needs of that client. This is the more traditional form of web design when compare to template sales.
As I just mentioned earlier, I think more designers will start to use some theme sales to supplement the income that they earn from client work. Sometimes working directly with clients can be draining, and changing things up selling some templates and themes could be a good change of pace.

Search Engine Optimization
SEO services are certainly in demand. Some designers are very knowledgeable with SEO, and some are not. In my opinion only a small percentage of designers have the knowledge to justify adding SEO services, but it can be a great addition for those who are qualified.
Design and SEO overlap in building a site that's search engine-friendly, and full service SEO will take that several steps further. For clients it would be nice to keep both the design work and the SEO under the same roof, so it makes sense for designers to provide this service if it's possible. Many times an SEO will want to change certain things about the site's design or structure, but this could be avoided if the same person or company was providing both services.
Web Hosting
Reseller hosting can be a nice add-on for web designers. Most large hosting companies now offer reseller packages, and a designer could earn a nice residual income by offering hosting to clients.
Reseller hosting isn't for everyone because it will require some work on the part of the reseller, but many designers and design firms have been able to add a supplemental income from offering web hosting. Some designers will even offer the hosting as part of a package that includes the design services.
Logo Design
Those who are skilled with graphic design can also offer logo design services in addition to web design. There is and will always be a need for skilled logo designers, and the money can be pretty significant as well. Logo design is also another service that can be a natural fit to go along with web design. Some clients will want to get a new logo at the same time they are giving their website a facelift, so if you provide both services you could have an advantage.
Writing
There are a growing number of websites and blogs that provide content related to design. If you enjoy writing and sharing your knowledge with others this could be another potential source of income. This is actually one that I've chosen to pursue, and I have found that writing provides an excellent change of pace from only providing design services.
Additionally, writing for other websites is a great way to network with other professionals and build your name recognition. Your design services can really benefit from the exposure gained by writing for a popular website or blog. Writing informative articles and tutorials is a great way to demonstrate your knowledge.
Selling Images
Graphic designers can make some extra money by selling their work at sites like iStockphoto, Stock Xpert, and Vector Stock. Create your images, upload them, and every time someone buys one of your images you'll get a commission. I imagine it would be very difficult to make the majority of your money this way, but more realistically it could be a nice supplement.
Selling Icons
Premium icons are another option for skilled graphic designers. While there is an abundance of free icons available, there are customers who are looking for something of higher quality and will be willing to pay for it. Some designers sell packages of icons in sets.
What's Your Opinion?
How do you make most of your money as a designer? Have you tried to find some supplemental sources of income?

Experimentation for Bloggers

5/15/2008

Once you have a better idea of how you can be most effective, continuing to grow your blog and satisfying your readers will be that much easier. In this post we'll take a look at a number of different things that you can test to see what works most effectively.
Posting Frequency
If you visit 5 different blogs, chances are you'll get 5 different posting schedules. Some blogs post 5 or 10 times per day, others post one per day, others maybe 3 or 4 posts per week, some post twice a month, and still others post whenever they feel like it, with no consistency at all.
There is no right or wrong method when it comes to posting frequency, but many bloggers feel like they have to live up to standards set by other blogs in order to be successful. Nothing could be further from the truth. Each blogger should determine posting frequency based on what works best for that individual situation. Some blogs have a staff of writers, so you'll never be able to publish enough content to keep up with them.
To determine the best posting frequency for your blog, experiment a little bit to see how much writing you can handle on a regular basis and how your readers respond to the frequency. Try to focus on providing quality posts regardless of how frequently you publish new content.
Days of the Week
If your experimentation shows that you'll get the best results with 3 posts per week, now you should focus on determining when you should post. Try posting on different days and track the results to see what leads to the most traffic, comments, and new subscribers. Generally, if you're not posting frequently, you'll probably want to avoid publishing on the weekends, but don't take my word for it, try it out for yourself.
Times of Day
While you may think the time of day that you publish your post has no impact, you could be mistaken. Subscribers that have a feed reader full of unread posts may not even glance at posts if they come during the busiest times of the day. To avoid this, you could try to time your posts so they arrive after those readers have cleared out their overflowing feed readers.
If you're targeting social media, the time of day that you post could make a big difference. Most social media sites send the most traffic during the work day in the U.S., so you would want to give your post a chance to get promoted at this time.
Experiment and see what works best for you. It may make a difference, and it may not, but at least you'll know.
Guest Posts/Multiple Others
More and more blogs are publishing posts from a number of different authors. Whether you are accepting guest posts or hiring freelancers to write for you, this could impact the results. Most bloggers turn to others for content because they're not ably to write enough on their own, however, some blogs just don't work well with multiple authors.
It's a good idea to test out some guest posts to see how your audience responds and what happens to your traffic levels and your subscriber count. Many audiences appreciate a different point of view, but not all do.
Topics
Of course, one of the most important experiments will be to determine what topics you should cover on your blog. Over a period of time you'll notice that readers respond better to posts on certain topics. If you can put this into practice and give readers more of what they want and less of what they don't, you'll be on your way to a more successful blog with a more enthusiastic and involved community of readers.
Styles of Posts
There are so many different styles of blog posts that you can write, and you should experiment to see what your readers really appreciate. You could write short news-related posts, long and detailed informative posts, resource lists, opinion posts, you can use humor, cause a reaction by using controversy, and much more. Most blog readers prefer to see a mix of a few of these types of posts, but that will vary greatly from one blog to the next. Once you know what works well for you and your readers, try not to go out of character too often as it will confuse and frustrate some of your readers.
Different Social Media Sites
Do you use social media to market your blog? Do you submit all of your posts to Digg and get no results? Do you use voting buttons on your posts? If you answered "yes" to any of these questions, try experimenting to see what brings the best results from social media.
I'm a big fan of niche social media sites because they're easier to have success with and they send higher quality traffic, but many bloggers ignore them because they don't send as much traffic as Digg. (If you're looking for social media sites in your niche, see this categorized list).
If you use buttons or widgets on your blog to get votes, experiment with using some different buttons of changing the location (i.e. bottom of the post as compared to the top).

Using Images
Do you use images in your posts? Why not experiment to determine the impact of images? Try publishing some posts with images, some with none, and also experiment with using different types of images or changing up the location of the images.
What Do You Experiment With?
What types of things do you test out on your blog? What have you learned from the experimentation?

Photoshop Video Tutorial: Clean 3D Text

5/6/2008

Download the PSD used in this tutorial

Online advertising made EXTREMELY easy.

5/4/2008

In the not so distant past, adding advertising to your site, or trying to advertise for your site was not a very friendly process. Of course there was Google AdSense and AdWords but it lacked the granular control of picking where to advertise by hand. If you wanted to advertise your site within a smaller niche, or even on a buddies website the process was all done manually and had to be custom built every time. You had to strike individual deals with site owners, and hope for the best. There was something special about this period because you could see the relationships being built by watching who was advertising where, and the process was slow enough you could get a sense of how it was moving. Over time, with the proliferation of blogging and the ever growing design niche, an opportunity arose to create a more concrete marketplace to buy and sell ads.

BuySellAds.com took full advantage of this opportunity by launching their new ad marketplace. Their marketplace is split into two groups, publishers and advertisers. The publishers side is for site owners and content publishers who have advertising space to sell on their website. They can register for an account at BuySellAds.com, add details about their website such as the url, description and set a per month price for various ad spots they have created. The other side is for advertisers who want to promote their products and services on one or many different websites.
My initial experience with BuySellAds.com has been that of an advertiser. As an advertiser, I was able to browse a catalogue of hundreds of websites with detailed information about each one. Information such as the price and url are good to have, but we also get valuable information such as the page rank, alexa rating and other details that make the decision making process much easier. By comparing the price, statistics and the overall relevance of a website to your particular product, you can get a very good sense of where to advertise. I personally found this process to be fascinating, rewarding and fun.
Once you have identified which websites you want to advertise on, the next step is as easy as clicking a buy now button and uploading your ad graphic. Each ad you buy on BuySellAds.com is essentially a monthly subscription that renews every 30 days until you cancel it. So if you use PayPal to pay for your subscription, you can actually manage your subscriptions through PayPal.com. If not, you can use a similar interface built into BuySellAds.com that allows you to view subscription details and easily cancel an ad should you find it's not bringing you the return you expected.
Perhaps the best feature of this system is that your ads will show up immediately after purchase. When you sign up as a publisher, you add code to your website that hardwires your site to the ad marketplace. So when an advertiser chooses to advertise with you, their ad shows up instantly. There is nothing like instant gratification to keep customers coming back for more! And if you are a publisher who is concerned about reviewing ad content before it goes live, you can request to manualy review and approve ads before they are published.
If you are looking for an easy and affordable way to advertise on the most relevant sites, I highly recomend BuySellAds.com.

Resources for New WordPress Theme Designers

5/4/2008

One of the reasons that WordPress is the most popular blogging platform today is because there are so many resources for users and for designers/developers. As a user, there are thousands of free themes to choose from, and plugins to do just about anything you can image. As a designer, there is an abundance of documentation that will allow anyone with some HTML and CSS knowledge to get busy customizing their own themes, and even building themes from scratch if they like.
Some of the resources for WordPress theme developers are from the people at WordPress, and others are from users like you and me. Together, all of these resources result in a truly amazing community that makes just about anything possible.
In this post I'd like to take a look at a number of resources that should be very helpful to new theme designers. If you're a more advance theme designer, some of these resources may help you and some may not. But for those who are looking to get more involved in WordPress theme development and want to do some research on their own, these resources are invaluable.
The WordPress Codex
At WordPress.org you'll find a wealth of information that has been compiled by the knowledgeable and helpful WordPress community. Almost any topic you could think of has an article. Some cover the basics of using WP as a blogging platform or CMS, and other focus on developing and customizing themes.
Here are some of the articles from the codex that I think all newish theme designers and developers should read.
Using Themes - Before you can design and develop effective themes, you need to have a solid understanding of how the theme system works. This article gets started with basics of explaining exactly what a WordPress theme is and how it works, how to add new themes and where to find them, and even gets into the basics of creating themes.
The Loop - The loop is really the heart and soul of WordPress. It has so much ability and without it functioning properly your theme is basically dead. Getting an understanding of the loop is one of the first things you need to tackle as a theme developer. This article will help, although it could be a bit more up-to-date.
Templates - WordPress websites and blogs use a variety of templates that interact with the database to ultimately create the page that is displayed to visitors. This article includes tons of links to other articles that explain how you can use templates to do just about anything with WordPress.
Theme Development - Obviously, this one is relevant to all of us. If you haven't worked on your own theme yet, be sure to read this article. It covers the anatomy of a theme, style sheets, templates, and general guidelines for theme development.
Designing Themes for Public Release - There's a big difference in designing a theme for your own use and designing one to be distributed to other users, whether it's a free theme or a paid theme. This article covers the basics of what you should be doing to prepare a theme for other users. It even goes into the topic of promoting your theme once it's developed.
Other Resources for Creating and Customizing Themes
The official WordPress codex isn't the only place to find information and tutorials regarding theme development. There are tons of blog articles that cover the topics very well. Here is a small collection of some of the better articles.
Blog Design 101: Creating Your Own WordPress Theme
Customize Your Own WordPress Theme
Secrets of WP Theming - Part 1
How to Create a WordPress Template or Theme
Optimize WordPress for Search Engines
WordPress and SEO
Color Resources
Although they are not specific to WordPress designers, there are a number of free tools online that can help you with the difficult decisions involving color schemes. Save yourself some time and allow these tools to aid you in the process
COLOURlovers
Color Schemer Gallery
Website Color Picker
What Are Your Favorite Resources?
What else have you found to be very helpful for new WordPress theme developers?

Setting Up a WordPress Blog for Testing

4/21/2008
If you're new to WordPress theme design/development, one of the first things you will learn is the importance of having a test blog for experimentation. The WordPress system is not that difficult to learn if you are already familiar with HTML and CSS (and a little PHP will help), but working on a theme that is live is not something you should attempt, unless it's just very minor changes. Reasons for having a test blog: 1. The world shouldn't see your unfinished work If you are making changes to a theme that is live, anyone visiting the blog will see your work in progress. This can confuse visitors and give them a bad impression of your site. It's much more effective to have a test blog where you can try out your changes and then implement them into the live blog once they are complete. 2. Upgrading WordPress Recently there has been a lot written about the most current release of WordPress. Some bloggers have mentioned that there themes and WordPress 2.5 didn't work together very well at first. Most bloggers upgrade WordPress and deal with any problems as they happen. Typically, you shouldn't have any major problems, but from time-to-time some unexpected issues may come up and your theme may not be ready for the latest version of WordPress. If you have a test blog somewhere else you can upgrade it to the new version of WordPress before upgrading your primary blog, and you can test your current theme there. This should help you to identify any problems with your theme in an environment that will give you more time to correct anything that can go wrong. 3. New theme development If you are a designer and you plan to work on developing new themes for yourself or for clients, you should have a test blog to develop these themes. You can have a number of different themes at one blog and then just switch back and forth according to what you are working on at the moment. 4. Testing plugins Installing some plugins may be a bit trickier than others, and sometimes you may want to experiment with a plugin in an environment away from your primary blog. Additionally, plugins are frequently a problem with new versions of WordPress, so you can test the compatibility of plugins with the latest version in a place where problems aren't going to be a big deal. Setting Up a Test Blog: There are a couple of different options for setting up a test blog. You could just add another installation of WordPress in a separate folder on your website, or you could keep the test blog in a different location altogether. I prefer to keep my test blog away from my primary domain just to avoid any potential complications. I like to have my test blog set to block search engine spiders and I've read from a few people that doing this caused a drop in search engine traffic to their primary blog when the two were at the same domain. Just to be safe and avoid that potential complication I keep my test blog at a different domain. If your hosting provider offers multiple domain hosting you can add a new domain for a test blog for no extra cost aside from the price of the domain. One you've bought the new domain you can install WordPress (most hosting providers offering an easy installation of WordPress) and start setting up your test blog. It's important to keep the test blog updated with the most recent version of WordPress in order to keep the testing environment the same as the live environment of your primary blog. Now when you want to test a WordPress upgrade to make sure that you theme will be compatible, upload the theme to the test blog, activate the theme, and test it out for errors. Once you're confident with it you can upgrade your primary blog and the theme should work as expected.

CSS Bits - Vol 2 - Date Stamps

4/21/2008
In case you missed the first post, CSS Bits is a series of downloadable packs of original CSS code and images for you to use in your projects. In Vol 2, we have a set of six datestamps (the area of a blog post that displays when the post was made). Below you'll find a list of all six styles, each with an example of the timestamp and the code you can use to create it. At the end of this post, there is a link to a zip file with all the code and images used here.

Stamp 1:

HTML:
<div class="date1">
<div class="month">JUN</div>
<div class="day">24</div>
</div>

CSS:
.date1{width:60px; height:70px; background:url(images/date1bg.gif) no-repeat; color:#fff; font-weight:700;}
.date1 .month{width:100%; text-align:center; position:relative; top:12px;}
.date1 .day{width:100%; text-align:center; position:relative; top:12px; font-size:28px;}

Stamp 2:

HTML:
<div class="date2">
<div class="month">sep</div>
<div class="day">13</div>
</div>

CSS:
.date2{width:60px; height:70px; background:url(images/date2bg.gif) no-repeat; color:#363636; font-weight:700;}
.date2 .month{width:60px; padding-left:10px; position:relative; top:22px;}
.date2 .day{ width:62px; padding-left:8px; position:relative; top:20px; font-size:28px;}

Stamp 3:

HTML:
<div class="date3">
April 26th, 2008 - Posted at: 7:42pm
</div>

CSS:
.date3{width:210px; line-height:28px; padding-left:15px; background:url(images/date3bg.gif) no-repeat; color:#808080; font-weight:700; border-right:1px solid #C8C8C8;}

Stamp 4:

HTML:
<div class="date4">
<div>December 14th, 2008 - Posted at: 12:22pm</div>
</div>

CSS:
.date4{width:250px; height:25px; padding-left:15px; background:url(images/date4bg.gif) no-repeat; color:#005e20; font-weight:700;}
.date4 div{line-height:25px; background:url(images/date4bgcap.gif) no-repeat; background-position:top right;}

The next two stamps are "overhang" style, which means they are meant to be positioned right on the edge of the layout. In each preview image, I added a line to represent the edge of your layout to give a better example of what I mean. In the download, each stamp is just the stamp itself, not the extra borders, so it should fit fine into any existing layout.

Stamp 5:

HTML:
<div class="date5">
<div class="month">JAN</div>
<div class="day">06</div>
</div>

CSS:
.date5{width:64px; height:73px; background:url(images/date5bg.gif) no-repeat; font-weight:700; padding-left:2px;}
.date5 .month{width:100%; text-align:center; position:relative; top:18px; color:#fff;}
.date5 .day{width:100%; text-align:center; position:relative; top:16px; font-size:28px; color:#e3ddc3;}

Stamp 6:

HTML:
<div class="date6">
<div class="month">AUG</div>
<div class="day">17</div>
</div>

CSS:
.date6{width:114px; height:67px; background:url(images/date6bg.gif) no-repeat; font-weight:700; color:#fff;}
.date6 .month{width:105px; text-align:right; position:relative; top:17px;}
.date6 .day{width:105px; text-align:right; position:relative; top:16px; font-size:28px;}

CSS Bits - Vol 1 - Confirmation Message Boxes

4/17/2008
Today we are starting a new series called CSS Bits. Each article will contain a downloadable pack of my original CSS code and images for you to use in your own projects. Having a bunch of pre-made bits around can really help speed up the design process. Think of it like collecting typefaces or stock images. Having more resources at your disposal means having more options and working more efficiently during a project. The CSS Bits articles will try to be pieces that a designer needs frequently but aren't always worth creating from scratch for every single project. Today's focus? Confirmation message boxes. Here is what I'm talking about:
Congratulations, your submission was accepted.

There was an error in your request. Try again.

Warning: Are you sure you want to continue?

You seem lost, would you like to see the FAQs?
You've all seen them. They are so popular right now. People have been ditching the pop-up confirmation message because its just so annoying. These styles will work anywhere you can apply a class. Here's how it works: 1. There are for class names, one for each style. They are pretty self explanatory. The class titles are: .confirmationaccept, .confirmationerror, .confirmationwarning, and .confirmationquestion, all of which can be found in the all.css file included in the download. 2. You can use the styles by applying the class name to the object you want to style. For this demonstration, I'm applying it to a div tag, but it would work fine on a p or other element. I trust you all know how to add a class to an element, but just in case you don't, its as easy as adding: class="confirmationerror" to your div tag. 3. Thats really all there is to it. The CSS is already written for you, so theres not much else to do. Here is the CSS that goes with the class: .confirmationerror { background:#ffebeb url(images/x.gif) no-repeat; background-position:7px 7px; border:1px solid #f5c1c2; font-weight:700; color:#9e0b0f; width:300px; padding:8px 8px 8px 28px; } The other classes are pretty much the same thing with slighty tweaked settings, so I won't go over them here. You can find them all in the download, which you can:

Adding 3D to Photoshop CS3 Extended

4/17/2008

Ever wish you could add 3D objects to your designs? Well now you can! Using the extended version of Photoshop CS3 you can import 3D objects and manipulate them directly.

Here is a screen cast about how to do it. This was my first screen cast ever, so please forgive the low audio recording (you may have to turn up your speakers) and other blunders. I'm still learning!

Since this video was recorded, we've learned there is much more you can do with 3D in Photoshop CS3 Extended. Stay tuned for more 3D fun!

Web 2.0 Layout Photoshop Tutorial

4/14/2008
Before we get started, let me add a little note for the readers who haven't been on Templamatic yet. Templamatic is a new online marketplace for buying and selling templates. Templamatic also has a blog where you can learn new skills (with articles like this one), and a forum where you can discuss projects with other designers. Templamatic is still in beta, and you can read more about the site in the FAQS. Ok, now that the introduction is out of the way, lets get to the template. One of the most requested tutorials I see is for trendy, web 2.0 style layouts, so I thought that'd be a good place to start with our first tutorial. Web 2.0 style is all about bright colors, smooth gradients, big text, and clean organization. Here is a preview of our finished layout, trying to include all these things: The font I'm using for the heading text is called Hit the Road, and is available for free from DaFont, but feel free to look around and pick a typeface that most matches your style. Step 1: Make a thin selection with the Rectangle Marquee Tool along the right side of the document. Create a new layer, and select the Gradient Tool. Press "D" to restore the default colors (black and white), and select the "Foreground to Transparent" gradient. Click and drag across the selection, making sure you let go while still inside the selection to ensure a complete fade. Step 2:
Lower the opacity of this new layer to 25%, then Duplicate it (Layer > Duplicate Layer, or click and drag the layer to the New Layer icon in the Layers Palette). Flip is horizontally (Edit > Transform > Flip Horizontal) and move it across the document to the other side of the layout. Merge the two layers (with the top layer selected, press CTRL + E). Step 3:
Make a thin selection across the top of the document with the Rectangular Marquee Tool. On a new layer, and fill the selection with black. Step 4:
Make a new selection with the Rectangular Marquee Tool. You'll need to pick two colors because we are going to fill it with a really subtle gradient. I picked a bright blue and a slightly darker blue. With the Gradient Tool, click and drag across the new selection. In the Layers Palette, move this new layer below the shadow layer, giving us the drop shadow effect that gives our page shape. You are going to need to keep the shadow layer at the top of the Layers Palette, so from here on out make sure all your new layers are below it. Step 5: Add the title text in with the Text Tool. I love the way Hit The Road looks in all caps, but feel free to change it. Another popular web 2.0 style is typing it all lowercase, which would work fine here too. Its really just a personal preference. To make the menu bar, use the same method as the step above. Make a new layer, pick two colors, make a selection, and fill it with the Gradient Tool. Keep the selection when you are done, you'll need it in the next step. Step 6: We need to pick a pattern to fill the menu bar with. I made my own diagonal stripe pattern, which you can grab here. You can also find a ton of patterns to use online at sites like SquidFingers and ClickPopMedia, or you can use a site like Stripe Generator to create one. To make a new pattern, open your tiling image in Photoshop, click Edit > Select All, then click Edit > Define Pattern. Now back in your layout document, create a new layer and fill it with a pattern(Edit > Fill > Use: Pattern). Lower the pattern opacity (I lowered it to 10%, but that might change depending on your pattern). Step 7: To make the active menu point, just use the Polygonal Lasso Tool. Create a new layer, and select a triangle shaped area under the link. Hold shift to make sure you get perfect 45 degree angles. Fill the selection with white, then use the Rectangular Marquee tool to snip off the extra bit hanging down into the white. Step 8: Add in some dummy content with the type tool. For the heading text, use the same font you did for the title of the site. For the body text, so you same font as you did for the menu. Using a consistent set of fonts throughout your design is a good way to make sure everything ends up looking clean and connected. The body text is made with two type boxes, so I can block of a small area for an image. Step 9: This layout has a couple previews of web sites in it, and they are built with a vector version of Safari. Its a downloadable vector file, so its complete scalable. You can open it in Photoshop at any size you wish, or you could open in it Illustrator and manipulate the layered document. It was originally made by Dave Simon, but lately I haven't been able to find the download on his site or any other, so I uploaded the AI file, and you get grab it here. Its a really nice file to have around, it really helps in creating clean looking preview images. I use it on my personal site to show my latest work. To make a site preview image, open the vector Safari file in Photoshop. I usually open it a little larger than I will need it, because once Photoshop rasterizes the file, it can only scale down in size, not up. Underneath the Safari layer, paste in a screen shot (you can capture what's on your screen by pressing the PrtScr key, or there are numerous screen grabbing programs out there to do it for you). Once you get the screen shot positioned, merge your layers and copy them back into your layout document. Select Edit > Transform > Scale and size the preview to fit the space. I added a drop shadow with the settings in the image. Its a really light and hard-edged, with no blur, to keep with the crisp visual style we've got so far. Step 10: Repeat the process for the featured images. If you don't want to feature web sites, you could use this same arrangement with photos, logos, drawings, anything really. I just chose web sites because Templamatic has plenty to feature. I repeated Step 9 three times, once for each new preview I'm going to use. To arrange them in an arc, take the back site and select Edit > Transform > Rotate and rotate the site a little bit counter-clockwise. I rotated it -6 degrees, which you can just enter in the toolbar. With the site in the front, I rotated the site 6 degrees, sending it in the other direction. Arrange all three images and overlap the navigation bar with them. Step 11:
To make the sidebar, make a selection and fill it with a really light green. Add a slightly darker green stroke with the above settings. Step 12: Add in some dummy sidebar content with the Type Tool. I kept the same fonts from the rest of the design: Hit The Road for the heading, and Arial for the regular text. Make a 1px selection with the Single Row Marquee tool and fill it with the same green you used as your stroke color. Step 13: To add a search box to the header, make a selection with the Rectangular Marquee tool, fill it with white, and add an Inner Shadow with these settings. It adds a hard shadow across the top, giving the text box a tiny bit of depth. Add the word "Go" in the same font as the rest of the headings. Final Results: The reason I took the time to write this web 2.0 layout tutorial is really to show that there isn't really technically hard about making layouts, its more about learning the basic techniques and putting them into practice. With these basic techniques there are countless template possibilities, only limited by your imagination. The more you practice, the more you develop your style and skills, so stay at it. If you have a request for a tutorial, or anything you want explained, leave a comment. I'll try to write about anything you suggest, so don't be afraid to ask. Download the PSD used in this tutorial...

Getting Off the Sidelines

4/11/2008

For bloggers, website owners and online entrepreneurs there is an abundance of information available intended to help you learn what it takes to run a successful online business of your own. With the vast resources that are available, why aren't more people able to make a significant income online? Personally, I think for most of us that are working towards the goal of a successful online business there is a disconnect between the information that is available and the task of actually making it happen. In many cases, I think we have the knowledge that is necessary to be successful, but putting that knowledge into action is what separates the successful from those standing on the sidelines.

Reasons for the Disconnect:
1. Some of the information out there isn't reliable or accurate. Anyone can publish online, so it's hard to know who you can trust. Knowing what is good advice and what is not is difficult if you're new to the industry. The bad information makes it hard to trust the people that actually know what they're talking about.
2. Information becomes out-of-date fairly quickly, but it is still available to be read. Many of the money-making techniques that worked online 5 years ago are not very effective today. And many of the techniques that work today are unlikely to work 5 years from now.
3. The biggest problem though, in my opinion, is people not putting what they are reading into practice. Some of us try intentionally to gather as much knowledge as possible before getting started, usually in fear of making a mistake. Others unintentionally get preoccupied with everything that is available and it takes too much time and distracts them from taking action.
Reasons to Start Acting On Your Knowledge:
1. Getting started is unavoidable if you want to succeed online. Show me any type of successful entrepreneur and I'll show you someone who took action and got started at some point. It sounds obvious, but it is a crucial step that many of us put off too long.
2. You'll never know everything there is to know. Regardless of how long you delay taking action and moving towards your goals, there will always be volumes that you can still learn. If you wait until you know everything there is to know you will never get started.
3. You'll always make some mistakes. Even top online entrepreneurs make mistakes. Having an unusually large fear of failure will not help you to deal with the mistakes that are bound to happen. Don't try to be perfect, just work with what you know for now and keep learning.
4. You'll learn more from doing than you will from reading or listening to others. There is plenty that you can learn from others who have gone before you, but most of us learn much more effectively by being involved. If you do make a mistake you'll learn from it and you'll be better off than you were before you ever got started.
5. It will put you one step closer to your goals. Whatever your ultimate goals may be, getting started will get you a bit closer to making those goals a reality. In many cases it's the hardest part, so why not jump in and get moving towards those goals?

Tips for putting your knowledge into practice:
1. Set goals with deadlines. Setting goals is important, and making those goals time-sensitive is equally important. Goals without deadlines will drag on and they'll give you little reason to put your knowledge and your abilities into action. Goals that will challenge you to get things done fairly quickly will motivate you to get moving.
2. Use a to-do list everyday. One of the productivity lessons that I've learned through my own experience is that to-do lists really work. Without one I may drift without focus, even if I am working long hours. With a prioritized list I don't waste any time figuring out what I need to do with my time and I am motivated to keep moving from one item to the next. I like to either create a list the night before, or right at the start of the day before I begin working.
3. Schedule your work time. Most bloggers and online entrepreneurs are doing so on a part-time basis, usually hoping it will lead to a full-time income. The less time that you have available, the more important it is more you to make efficient use of that time. Especially for those who have a full-time job, scheduling blocks of time throughout the week to work on your blog or website will make a huge difference in your productivity.
4. Keep reading and learning, but limit the time you spend on these activities. Don't let accumulation of knowledge distract you from learning through your own experiences. If you have a ton of RSS feeds in your feed reader, get rid of the ones that you don't need.
5. Apply what you read to your situation. After you have read an article that you think you can learn from, take a moment to think about how you can put the ideas taught in the article into practice for your own website. This will help you to take that book knowledge and turn it into real-world knowledge that has a purpose.
6. Hold yourself accountable. If your online ventures are to become a legitimate business, you'll need to hold yourself accountable for the results. I'm not saying you should beat yourself up if you don't achieve your goals, but you should approach an online business with the same dedication that you would approach a more traditional business.
7. Identify your motivation. You started a blog or a website for some reason. Whatever is your motivation, identify it and use it to help you progress towards your goal. If your motivation is to make a full-time income online, keep that motivation in mind and allow it to drive you to better results.

Templamatic Beta Update

4/11/2008

Today we decided to add "BETA" to the logo to make it more clear that Templamatic.com is still officially in beta mode.

What does this mean exactly?

It means we are working tirelessly to make the site more informative, easier to use, and more fun!

It means we are still adding templates and working with designers who want to sell templates.

If you signed up for the beta program but have yet to upload your own templates, what are you waiting for? Earn 75% commission when you submit your work during the beta period.

As always we are interested in your feedback and want to hear from you. Start a thread or drop a comment today.

Free Template Friday - WPViddler Now Free!

4/11/2008

To reward our registered users, and to help promote the newly launched templamatic.com, for a limited time only we are offering our new template, WPViddler as a FREE download.

WPViddler is a sweet new Wordpress 2.5 template that has some slick features. The inspiration behind this template was to offer a compelling interface for video bloggers who want a featured video post on their homepage that is separate from their regular blog posts. There are also different list pages for regular blog posts and video posts so you can easily see your different content types.

Not only did we design it to look like a video blog, but we've included the latest video blogging functionality as well. This template utilizes the latest and greates Viddler plugins like Viddler Companion and Viddler RSS. Now your blog can have video comments directly in a blog post, recorded through Viddler.com. You can also display a list of your most recent videos in your sidebar.

One of my favorite features of this template is the semi transparent edges which allow you to see the cool textures in the background image.There are 3 different backgrounds to go with this template for you to choose from, Cork, Grass, and Concrete.

This template is a must have for video bloggers looking to bring their blog to new heights. To download this template, simply register for free to templamatic.com, login and browse to the WPViddler page. You can add it to your cart like other paid templates, but you won't be required to pay. Checkout as normal, and the template will be available in your account section.

If you have any trouble downloading the file, please let us know. Enjoy!

Using Viddler as your video blogging platform

4/10/2008

When it comes to video blogging, not all video sharing sites are made equal. Enter Viddler.com. Viddler is a super friendly video sharing platform that's great for video blogging. Viddler has features you don't get any where else, like the ability to record video directly from your webcam, social tools like tagging and commenting and options to set the video as public or private.

When it comes to integrating your video posts into your own blog, viddler shines in this department as well. Viddler has recently launched the video comments plugin for Wordpress which allows you to record and add live video comments directly into your blog posts. It's a little hard to find the plugin (or atleast it was for me), you can find a link to the download from the viddler blog post announcing it's launch at: http://blog.viddler.com/cdevroe/wp-video-companion-1 or you can download it directly using the following link:http://chancecube.com/files/viddlercomments.zip

Another cool Viddler plugin for Wordpress is ViddlerRSS which allows you to display thumbnails of your most recent videos on your blog. You can learn more about ViddlerRSS at:http://blog.viddler.com/cdevroe/viddlerrss or you can download it directly using the following link:http://blog.viddler.com/wp-content/viral/viddlerRSS.zip

Installing these two plugins will bring your video blogging to the next level. But if you need even more control over your viddler video, there is also the Viddler API. To make use of the Viddler API, visit: http://developers.viddler.com and request API access.

As if you needed more incentive to use Viddler, they also offer a video ad revenue sharing program where you can make 50% ad commission for all of your videos.

Here is a fun video by iJustine explaining the process:

Photoshop Quicktip: Generating Color Schemes

4/9/2008
Today I've got just a quick tip aimed at making selecting colors a tiny bit easier. Basically, you take an image with some color you like, open it in Photoshop, and you end up with a saved color table file (.ACT), which you can load as a color pallete for use in Photoshop. For this example, I'm going to be using the FireFox logo:

Open the image in Photoshop, then select File > Save for Web & Devices:

In the Save for Web dialog, select GIF, then select the number of colors you want saved to your pallette. I used 8 here, but 4 or 6 would be good too, it really just depends on the image sampled. Next, click the Color Pallete Menu button (the small circle with the arrow in it).

Select Save Color Table, and you can pick a folder to save it to. Name it something you'll remember or you'll quickly end up with a bunch of unlabled files.

Now, in the Swatches window, you can click the Swatch Options (the little list and arrow icon) and load your saved color table file. I know this method isn't an exact science, but its fun to pick random images and see what colors it pulls. Sometimes you end up with some really nice stuff.

WordPress 2.5 Released - An Overview

4/2/2008

WordPress 2.5 has finally been released and after having a few days to toy with it, let me just say, if you haven't upgraded, you are really missing out. The most major changes came courtesy a major admin section overhaul from the guys over at Happy Cog. They did an amazing job redesigning the admin panel not only from a usability standpoint but from an aesthetic one as well. The thing is just beautiful. The first thing you notice is an updated login page:

I almost didn't mention the new log in page look since its not a very important change, but it shows a couple things. There is a new color scheme for the admin panel, they've dropped the super bold blues for more subtle tones. Also, the Log In button hints at what's to come, and overall friendlier interface. I know that's a lot to deduce from just the log in, so here is a shot of the new dashboard to show you what I mean:

Overall, things are much more organized and it does a fantastic job of giving you a look at your blog as a whole. Right up front, you are greeted with your number of posts, pages, categories, tags, comments, and pretty much everything else you'd want to check first. I always found the old dashboard a bit useless, just a page I had to click through to get to the good stuff, but with the update, I find myself checking the page much more often. Which brings me to the next shot, showing the new dashboard widget system:

All of the content on the dashboard is widgetized, or easily changed. You can view things like stats, news, and plugins. If you don't care about any of these things, you can swap out the feeds to any RSS feed you want, like your local news, for instance. It really does a lot to stretch the functionality of the dashboard, broadening it to content beyond just your blog. Despite how awesome the new dashboard is, we all really know why we use WordPress: the blogging, so lets check out the Write page:

The write page has a fancy new visual editor, along with a long list of other improvements. One thing I really liked is the permalink being displayed, along with the option to edit it. If you aren't super familiar with how WordPress works, permalinks can be a confusing concept, so its nice to have it displayed right up front for those who need it. Another nice addition is the Add Media buttons, which replace the old upload module I was never too crazy about. You can add images, video, and audio, all from a nice pop-up overlay:

The new module has a lot more options, like how to format and align the new image, along with links, captions, and anything else you might need. Another awesome improvement to the uploader comes with the ability to read EXIF data from your photos, which can be used as custom fields (that should lead to some exciting new functionality). Along with a new uploader, there is also a new Media Library that adds new options for sorting and searching all the media you've uploaded in the past, which is mega handy. Along with the new Media Library comes built in Galleries, which lets you build categories for your images and display them as an image gallery. Tags and categories have also been retooled:

The new tag system is really top notch, a huge improvement over the old system, which always felt a little "thrown in." You can add new tags and see a list of the existing tags, which is nice. The categories have moved down below the posts, and now there is the nice option of seeing your most used categories (I know I've only got four categories, but if you had fifty you can imagine how useful this would be). Continuing the improved tag support, the tags have made the move over to the Manage section:

The new manage section is really well thought out. They've done away with the old View Edit Delete links, which allows for a much cleaner interface. There is a lot to like here: the listing of tags right on the manage page, the showing of the post status (so you can know if the post is published or a draft), the little speech bubble comment links, and the fact that clicking on the post title takes you to the edit page, a feature I always thought was odd to be missing. Also, you can now search your page content, something that used to be reserved only for posts. Another really nice change is the Widget page:

The drag and drop interface is gone, replaced by a much nice add/subtract type function. Once you click Add, the widget is added to the list and the Add link switches to Edit, where you can set the properties of each widget. The only thing I'm sort of unsure about is having to configure one sidebar at a time. It shouldn't make a difference for most people, but some themes do have multiple sidebars, and it might be a chore to only be able to see one at a time and having to remember what you've already set on the others. The only other area of the entire redesign I want to complain about is the Theme Editor:

For some reason, the Styles have been separated out and moved to the bottom. I don't mind it be separated, but putting it at the bottom doesn't make sense to me, its easily my most edited file. Another thing I don't like are the template files name and filename being displayed, which sometimes breaks onto two lines, even when you've got plenty of space out the side, making the list not quite as clean. Also, there was already a naming convention for template files: you could add a tag at the top of each file to append a proper title, or if you choose not to, the filename would be displayed. I was happy with the system and feel listing both is a bit of overkill. I feel bad for complaining about it because overall the upgrade is amazing, this is really just a minor nitpick issue.

So, in summary, the new WordPress 2.5 is a great upgrade, with a ton of improved functionality I don't even have time to list here. The only thing I can say is you need to install it and poke around for a while to really get a feel for how much better this version is. Its prettier, much more intuitive, and there are a ton of behind the scene upgrades like security fixes, upgraded password system, new database optimization, and tons of other nerdy features the general blogger wouldn't probably notice so I won't list them here. I'd been waiting on this update for a long time, and it really doesn't disappoint. I just can't wait to see what's next...

Startup bloggers write up Templamatic

4/1/2008
We wanted to thank the bloggers who took notice of our beta launch and announced it to their readers.

Thanks to David Laubner who writes from his startup blog 93south.net for mentioning us.

We'd also like to thank http://www.universalhub.com and http://bostonblogs.com

who both asked "How much would you pay for a blog template?" to which I reply "How much would you pay for a blog template that is supported by a knowledgeable and friendly group of web designers?".

Thanks so much for the links!

Welcome Beta Testers

3/29/2008

Let the beta testing begin!

The goal of the beta period is to upload and add as many templates as possible to Templamatic.com. We are starting with a completely clean slate, with our own templates and with yours.

Rather than adding lot's of low quality templates to give the impression of having a full catalog, we are taking the opposite approach. We're starting from zero and working our way up with nothing but hiqh-quality templates that are relevant to todays market of bloggers, online businesses and individual site owners.

As part of our beta program, we fully expect you to participate in the uploading of new web templates. We also hope that during this process we can gain feedback from you about your experience, and listen to your suggestions.

We have spent over six months working on this site, but we know it is far from perfect. So if you notice something that isn't quite right, please feel free to let us know.

Leave a comment in the blog. Post a thread in the forum. Hop on live chat and talk to us directly.

Templamatic aims to be your primary tool for selling web templates online and we are committed to making this process excellent!

What do you get in for your time and effort? Apart from the joy of participating in a new and exciting community, we are giving a 5% commission bonus for all templates that are uploaded and accepted during the beta period. Need more motivation? Check out our other promotions!

We look forward to having you apart of the Templamatic team.

FREE PSD Layer Template For Your Next Design

3/28/2008

Your heart sinks as you realize it's going to take you twenty more minutes to clean up all the layers and name them right. If only you had a handy PSD Layer Template to start your project off on the right foot.

Download the FREE PSD Layer Template for your next web design project and avoid the layer nightmare.

The FREE PSD Layer Template was built for optimal control over your Photoshop layers while doing a website layout. It is not so much a visual guide, but a structural guide for how to organize your layers for maximum flexibility and organization.

Imagine, you have just added 10 text layers to the sidebar on the right side, and are now thinking it would really look better on the left. Having a ready made sidebar folder will make it super simple to flop things around until it's just right.

The real power of the FREE PSD Layer Template is the nested folder structure. Each logical section of a website is represented by a nested folder. The root folder is called "Page". Inside the page folder are sub folders for all the major elements including the header, body, sidebar and footer. And nested within the sub folders are even more folders for more specific content such as logo, navigation, feature areas and more.

Having a folder structure that mimics how most websites are actually laid out gives you a lot of modular control over your elements and makes moving them around much easier. It also helps with the design process as you can turn off folders, or groups of folders to see how it impacts your over all design.

Having the entire site nested within a single page folder also makes it extremely easy to separate the site from it's background, and drag it around and center it on the page.

No more losing layers, or getting confused. Just open the FREE PSD Layer Template, ctrl click on the layer you want to work on, replace it with your own design and you will be well on your way to a great design.

If you have any ideas, or feedback on the FREE PSD Layer Template, please share them in the comments below.

Templamatic

14 Helpful Domain Name Tools

Whois

Archive.org

Bust A Name

Name Boy

Domain Hacks

Instant Domain Search

DomainsBot

Just Dropped

URL Trends

dnScoop

Google Banned Checker

Number of Pages Indexed

Killer Domains E-Book

Buying Premium Domains

Template Pricing Update

9 Common Challenges in Blog Theme Design

Web 2.0 Photoshop Tutorial - VoiceTrader

9 Ways to Experiment as a Designer (Without Messing Up a Client's Site)

Choosing the Right Blog Theme for You

What's Your Opinion?

Working With Feeds: 3 Options for Improved Use of RSS

1 - Sideblogs

2 - Combining Feeds

3 - Display RSS Feed on a Static HTML Page

Make-or-Break Factors for Blog Theme Design

Diversified Income for Web Designers

Experimentation for Bloggers

Photoshop Video Tutorial: Clean 3D Text

Online advertising made EXTREMELY easy.

Resources for New WordPress Theme Designers

Setting Up a WordPress Blog for Testing

CSS Bits - Vol 2 - Date Stamps

CSS Bits - Vol 1 - Confirmation Message Boxes

Adding 3D to Photoshop CS3 Extended

Web 2.0 Layout Photoshop Tutorial

Getting Off the Sidelines

Reasons for the Disconnect:

Reasons to Start Acting On Your Knowledge:

Tips for putting your knowledge into practice:

Templamatic Beta Update

Free Template Friday - WPViddler Now Free!

Using Viddler as your video blogging platform

Photoshop Quicktip: Generating Color Schemes

WordPress 2.5 Released - An Overview

Startup bloggers write up Templamatic

Welcome Beta Testers

FREE PSD Layer Template For Your Next Design

9 Ways to Experiment as a Designer
(Without Messing Up a Client's Site)