PSD to HTML Tutorials:

If you’re interested in learning more about doing the PSD to HTML coding yourself, these tutorials will be very helpful.

From PSD to HTML, Building a Set of Website Designs Step-by-Step

Build a Sleek Portfolio Site from Scratch

Encoding a Photoshop Mockup into XHTML/CSS

How to Convert a PSD to HTML (video)

How to Code a Clean Portfolio Design

How to Code a Grunge Web Design

Coding a Clean and Illustrative Web Design

How to Create a Dark and Sleek Web Design from Photoshop

Coding a Clean Web 2.0 Style Web Design from Photoshop

Converting a Design from PSD to HTML

Slice and Dice that PSD

The Design Lab: PSD Conversion

Converting a Photoshop Mockup (video)

PSD to HTML Providers:

Here is a look at more than 40 of the leading providers of PSD to HTML services. Additionally, some offer options to have a PSD coded into a WordPress theme, some other type of CMS template, or for a particular shopping cart system.

Snobby Slice
You can read our review to see why we recommend Snobby Slice.

Markup4U
Markup4U also did some excellent work for us. You can see our review of the services from Markup4U.

PSD2HTML

W3 Markup

Pixel Crayons

Rapid XHTML

Markup Service

Quality XHTML

CSS Ninjas

HTML Cut

HTML Rockstars

Slice ‘n Dice

XHTMLizers

XHTML4U

Slice My Design

XHTML Slicer

Choppr

XHTML Genius

XHTMLized

HTML Blender

SEO Semantic XHTML

2HTML

PSD XHTML

PSD Cutout

Image 2 Markup

PSD Slicer

YoDiv

XHTML it

XHTML Team

PSD Slicing

XHTML Chop

PSD Converter

XHTML Mania

Dr. Martian

PSD to HTM

Feather Code

Convert2XHTML

PSD to HTML/CSS

You We You Coding

PSD to HTML Ninjas

HTML Burger

We Do Markup

Yummy CSS

Finely Sliced

9XHTML

Lemberg

PSD to WordPress Providers:

The companies listed below specialize in taking a PSD file and coding it into a WordPress theme.

WPCoder
WPCoder has done some work for us, and you can read our review of their services.

PSD to WP

Theme Slice

WP from PSD

PSD to WordPress

XHTML This

PSD to Any
In addition to WordPress, they offer coding services for other CMSs.

Reviews:

Finding the right PSD to HTML provider can be a challenge. There are a few sites that exist to allow reviews of PSD to HTML companies, which may be helpful if you are trying to find a provider that comes highly recommended.

Most Sliced

PSD to HTML Reviews

Best PSD to HTML
Also see the post Tips to Choose the Right PSD to XHTML Firm.

PSD to HTML Companies

Resources:

There are a few resources that will take your PSD and automatically create the code for you. I have not personally used any of these tools, so be sure to pay attention to the code that is produced.

SiteGrinder 2
A premium Photoshop extension that will convert a PSD to HTML.

PSD 2 CSS Online
A free online tool for PSD to HTML conversion.

Divine
Converts a PSD to a WordPress theme.

For more helpful resources please see:

• Different Methods for Choosing Color Schemes in Web Design
• 14 Options for Managing Membership Websites
• 25 jQuery Image Gallery/Slider Tutorials and Plugins
• 40 Options for Converting PSD to HTML

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

Who Is Snobby Slice?

After trying a few different providers I came across Snobby Slice several months ago. Tyler and his team did a great job for me and they have established a reputation for being one of the highest quality providers in a crowded market. If you’re interested in working with a PSD to HTML provider who will produce quality code you can see more details in our review of Snobby Slice. And if you are just curious about the PSD to HTML process, I think you’ll find the information that Tyler shares in this brief interview to be a good starting point.

Why should designers hire a PSD to HTML service provider?

Why deal with code when you don’t have to? By choosing a PSD to HTML service provider, you can stick to your biggest profit center (design), and spend more time making sure the needs of your clients our met. We’ll do all the nasty coding work!

Most PSD to HTML companies primarily emphasize their price and turnaround time to potential clients. What would you advise designers to consider when choosing a provider?

I would suggest contacting them and making sure that it’s a provider that they trust. Look around their site, see where they’re based and get familiar with their service. Do they have relationships with others in the community? A little due diligence goes a long way. Making sure they’ll treat your client work with respect and secrecy is extremely important before putting your reputation at risk.

What type of research (if any) do you think a designer should do before hiring a PSD to HTML provider?

I’d start by talking with other designers, seeing if they have any experience with a few of the firms out there, and also read some of the blogs/forums on the topic to see if anyone can provide you with a solid recommendation.

What are some of the most common issues experienced by your coders that slow down the process or require them to go back to the designer?

Sometimes the designer isn’t always clear with exactly what they want. An added “comments” layer in the PSD (specifying texts, images, etc.) can really speed up turn around time.

What tips do you have for organizing layers in Photoshop to make it easier on the coder?

Just keeping things nice and neat in folders is helpful. However, a comments layer is really the most important thing.

What should designers expect to be included in the base price and what is likely to cost extra?

Unfortunately, many providers are skimping out on key features to lower their prices. Make sure your design would be compatible with a healthy variety of browsers, and that you’re not getting sold a “sub par” coding package.

What makes Snobby Slice different from other PSD to HTML providers?

We care about our clients! Our base pricing includes everything our clients could want or need. We don’t charge for every little drop down or javascript implementation. Since we offer a 100% money back satisfaction guarantee, we’ve designed our business model around keeping our customers happy – NOT just collecting their cash.

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

Getting Colors from Existing Marketing Materials

In many situations the client will already have an established color scheme from an existing website or from other marketing materials. In some cases they may want a change, but frequently you will need to work from the established color scheme. Sometimes making slight changes to the shades of colors but sticking with the same basic color scheme can make an impact, and combined with a fresh design of the website it can help to give the company some added interest to their identity.

In situations where you are not working with a client that has an established color scheme, here are some methods that you can try for finding the right one on your own.

Online Color Palette Resources

There are a number of websites and online tools available for selecting color palettes. Many of these sites allow users to upload color palettes that they have put together, and the rest of us benefit by being able to browse through those that have been uploaded. Most of these sites allow you to search or sort the color schemes by a particular hue or by keyword, which can be helpful if you have one color that you want to use but you are looking for others to use with it.

Here is a quick listing of some of the best places to find color palettes.

Adobe Kuler

COLOURlovers

ColorSchemer

ColoRotate

Others:

• ColorCombos.com
• Colr.org

Other online tools exist for helping you to put your own color palette together. Here are some of the best.

Copaso

Color Scheme Designer

Toucan

ColorMunki

The Color Wizard

Color Explorer

Taking Colors from Photographs

Photographs are a great source of color inspiration. You can easily and quickly browse through photos either of your own or random photos from sites like Flickr and deviantART. When you find one that includes a beautiful color scheme, you can upload it to one of several different online tools that will help you to determine the specific colors that are used, providing the hex value so that you can use them in your design work.

Here are some of the best resources of this kind.

ColorSuckr

Pictaculous

What’s Its Color?

Others:

• Color Palette Generator from jrm.cc
• Palette Generator from Big Huge Labs
• Color Palette Generator from DeGraeve.com

At From the Couch David Perel has a nice video tutorial where he goes over his process for choosing colors from a photograph. This is a method that can easily be applied by designers with impressive results.

Design and development blog Build Internet has a series of posts that showcase color schemes from Photographs. Check out their Motivation category to find the color scheme posts.

Taking Colors from Magazines and Other Printed Materials

Online resources aren’t the only place to find color schemes. Magazines, books, flyers, posters, brochures, cards and any other type of printed material can be another source of color inspiration. You can either find a scheme that you like and try to come close just by eyeballing it, or you can scan it in and take the colors directly from the scan in Photoshop or another program.

Browsing Web Design Galleries

One of the best ways to find color schemes that work well for the web is to browse through design galleries. As you do, you will come across some color schemes that you really like and it may give you some ideas for your own work. Of course, what is good for one site may not work very well for another, so it is a good idea to keep your particular project in mind so you can find some colors that will work well for your situation.

You can search around and take one color from a few different websites, or find a scheme that you like and work with Photoshop to find a similar color scheme that will work for you but will avoid copying the colors of the other site. One of the downsides to this approach is that you can wind up doing more copying than you intend, so be careful to make your scheme unique even if it is inspired by other sites.

I Like Your Colors is an online tool that allows you to enter a URL, and it will give you the hex value of the colors in use.

Based on Psychology of Colors

One of the factors that should be considered when choosing a color scheme is the psychology of color. There is a great deal of research that has been done over the years to indicate meanings and messages that are associated with various colors. In many cases this will vary from one culture to the next, so be sure that you are paying attention to information that is relevant to your client and their audience.

Here is a list of some online resources and articles regarding the psychology of color.

• Color Psychology in Online Marketing
• Color Wheel Pro: See Color Theory in Action
• The Meaning of Colours
• Why Color Matter
• Color Psychology
• Color Symbolism and Psychology (from Wikipedia)

Nature

Color is everywhere in nature. Step outside, look around, and you are bound to find some inspiring color schemes. Plants, animals, sunsets, color schemes can be found from just about anything in nature. Of course, getting the exact colors and shades isn’t as simple as when you are working with a photograph (although you can always take a picture) or an inspirational website, you can still get many ideas simply from observing nature and the colors that appear.

What’s Your Approach to Choosing Colors?

If you have a method that works well for you, please share in the comments.

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

There are ways to take advantage of the inspirational work that is available from other designers and use it to create something of your own, and in this article we’ll look at the subject in detail.

Get Inspiration from Offline Sources in Addition to Online Sources

Web designers are not limited to getting their inspiration from other websites. In fact, offline sources of inspiration will provide more diversity and in many cases will lead to more originality in your web design. Online sources of inspiration are plentiful and easy to find, but offline inspiration can come from just about anything around you, including nature, magazines, books, photographs, fashion, and much more.

Because most other web designers are getting their inspiration almost exclusively from online sources, taking yours from a more diverse set of sources is likely to result in work that avoids simply following the latest web design trends. With offline sources you won’t be in danger of copying what is providing the inspiration.

In Where Does Inspiration Come From? Anthony Zinni writes,

For me inspiration comes from looking at the design of other mediums or formats. When I am working on a new website I tend to open up a copy of print or STEP and see what the latest articles are about, or review the pieces I have collected over the past couple of months. Usually by observing great design outside the medium I am focusing on I am able to apply design principles that are not like current trends and are still appealing. This also often helps take my mind off of the project, which is usually when I am able to find a great solution.

Use Nodes of Inspiration

Way back in 2004 Cameron Moll wrote an article called Nodes of Design Inspiration in which he talked about his process of taking inspiration for various elements within a design from different sources. He says,

In a design sense, I use the term ‘node’ to loosely define intersecting points in a layout. The logo inside the masthead. The masthead resting above two columns. The placement of phone and web address just beneath body copy in a magazine ad. And the like.

By combining the concept of design inspiration with that of design nodes, we discover something I call ‘nodes of inspiration’ or ‘node of inspiration’ for short (*snicker). Simply put, these are points of intersection in a layout in which a designer uses another source as reference for inspiration.

In the example that Cameron uses in this article he took inspiration from five different sites for specific elements in a design of his own. As a result, while each of the sources of inspiration was helpful, the end result was an original design rather than a copy. Most designers are in the habit of seeking inspiration from more than one source, but as Cameron points out, it can often happen unintentionally without even realizing it.

Ask Yourself Specifically What You Like About a Design

When browsing through a design gallery it’s easy to find sites using designs that you like. However, it’s often harder to be able to point out the specific aspects or elements of the design that you like. Without knowing what makes a design special it’s much more difficult to take away inspiration that can be used in your own work. The only way to use this design for inspiration in your own work is to basically copy it because you will not know what to take away from it.

If you’re willing and able to take a few minutes to really think about the design and how it impacts you as a visitor, you will have a solid understanding of what makes the design work. As a result, you will have specific reasons in mind why you like the site, and these are things that you will be able to use in sites that you design.

Pay Attention to the Design Details

As you are looking at the source of inspiration to determine exactly what makes the site work so well, you’ll want to pay attention to the details that set it apart. Small details in a design may not be the first thing that you notice, but they create a polished look that makes an impact.

Liam from Function has written an excellent article, How to Spot Quality within Web Design: Examples & Tips, that is a must-read on the subject. In this article he points out the impact of design details and what makes a design work, with plenty of examples. He covers a variety of topics including spacing, pixel perfect detail, typography, organization of elements, restraint and subtlety, and color.

As you examine the details of a design, you will start to find things that you can actually put into practice in your own work. In many cases you can use these details even in work that is very different from the source of the inspiration.

In Don’t Copy a Design - Steal it, Dmitry Fadeyev writes,

When you look at an inspirational design you should be inspired. Take your time to examine its aesthetic and construction in detail — look over all the nuances and intricacies of its structure. See how the creator did this and that — extract the essence of what makes this work great.

To steal a design you must collect all the pieces of the puzzle and figure out how it all works as a whole — why did the artist use this color, why these lines, why this typeface? …. Once you’ve assimilated the principles and ideas employed by a designer in their great piece, you can use those ideas in your own work. You’re not going to copy them — you will instead use these tools only where they make sense, and only where they will work well — that’s because you understand exactly why they were employed in the first place.

Evaluate How the Design Style Works for the Purpose of the Site

Just because a site features an attractive design does not mean that it will be effective. And just because we may not particularly care for a design does not mean that it will fail. What works for one site in one industry may not be appropriate for another. In order for a design to be successful it must be a good fit for the target audience and it must work with the purposes of the site.

As you are looking at other sites as sources of inspiration for a particular project, take the time to evaluate how that design would work in the circumstances of your own project. Are the particular elements of the design that could be good to use in your work and other things that you could replace?

As you look at sources of design with this approach, you will tend to focus in on specifics that you can use, and rather than copying a design you will wind up benefiting from the elements that will have the biggest impact for your project.

Try to Find Ways to Improve the Design

As I have said earlier in this article, in order to really get the most use out of your sources of inspiration you will need to be able to determine what works and what does not. One of the best ways to get you thinking in a way that will allow you to take something useful away from the design is to critique it by trying to find some ways that you would improve it.

This will help you to really have a grasp of the design and it will be of more use to you in your own work. Additionally, you’re work will truly be inspired by it, rather than a copy of it.

Have a Lot of Inspiration at Your Disposal

We’ve talked about nodes of inspiration and the need to have multiple sources, so of course you will need to have plenty of inspiration available for situations where you need it. In a past article I wrote about keeping an inspiration notebook so that you always have things available when you are in need. Of course, there are also some great resources for cataloging you online inspiration, such as vi.sualize.us, Evernote, and Delicious.

Having resources to categorize your items of inspiration can make it easier to use nodes of inspiration. For example, maybe in your Delicious bookmarks you have tagged a bunch of websites with excellent navigation menus. Or maybe you have a tag for sites that have interesting footers. If this is the case, when you’re looking for some ideas for a particular element of the design you will have a place to turn where you can quickly get some help.

In Be Inspired, but Don’t Copy, Marko Prljic writes,

When you have found a design that you like, don’t stop there. Look further for more similar designs, in color, structure, content etc. Take the best of them all and start thinking about your new layout. When I say “thinking”, I mean try to visualize your new design with these elements that inspired you; don’t just try to recreate the same design. By the time you start drawing some mock-ups, you’ll have new ideas and will design something new and unique.

Attempt to Duplicate the Design for Practice

In order to be able to use your sources of inspiration in your own work you will first have to learn from it. Particularly for new designers, or those who are looking to improve their skills, attempting to duplicate a design can be a great learning experience. I’m not suggesting that you do this for a client project or for anything that will be displayed publicly, but for your own learning practices it can be a great way to improve your skills, and it will force you to pay attention to the details of the design.

You could attempt to duplicate a layout in Photoshop, or you could try to code the site. Whatever approach you take, focus on understanding the design and learning from it rather than simply trying to duplicate it so that you can apply this instead of just improving your technical skills.

What’s Your Advice?

If you have advice from your experience that you would like to share with other designers, please leave a comment.

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

In this article we’ll look at nine things that should be discussed between the designer and the client at the start of the project to improve the likelihood of success. These topics focus on getting to know the business and their needs, rather than contractual issues like payment and deadlines.

1. The Purpose of the Business

Almost all businesses have a mission statement and a vision statement. Understanding the basics of why a business exists and what it aims to be are imperative if you are going to be able to design a website that is truly reflective of the business and effective for its customers.

If you’re unclear about the core functions of a client or why they exist, be sure to get answers to these questions before getting into the project. It’s usually simple information, but without it, the project can lead down the wrong path.

2. The Specific Products and Services of the Business

Once you have a clear understanding of why the business exists, it’s also important to know specifically what they offer to customers or clients that generates income for the business. Whether you are building an e-commerce site, a general informational site, or any other type of site, it’s always necessary to have knowledge of what the client is offering to visitors of the website.

3. The Demographics of Their Customers/Clients

A discussion of the products and services of a business will naturally lead you to more information about the customers and clients who are paying for those products and services. An effective website will be user-focused, so it is critical that you, as the designer, and your client both have an accurate picture of who will be using the website and who is likely to be interested in what the business has to offer.

Getting as much information as possible in this area is a good practice. Information such as age, sex, occupation, income of their target customers can be extremely helpful for determining an appropriate style of design for the site. Additionally, information about why they would be interested in the products or services of the business will be equally critical for creating a website that maximizes potential.

4. Corporate Culture

A good website will be reflective of the business so that it becomes an effective part of their overall marketing and corporate identity. In order to create a site that is an accurate representation of the business, you will need to have a certain level of understanding about their corporate culture. Many times you can gain an understanding of their culture by visiting the business in person (if possible), speaking with several different employees, speaking with their clients or customers (if possible), and by looking at their existing marketing materials, such as brochures, business cards, and advertisements.

5. Needed Areas of Improvement from Their Current Website

If the project is a re-design of an existing website, one of the most important things that you will need to know is why they have chosen to re-design at this time, and specifically what are they setting out to improve through the re-design? Is their old website several years old and just in need of a general facelift? Have there been major changes in the business that require a new design and new information? Are new products and services being offered that were not a part of the old site? Has their existing site proven to be ineffective at bringing in new business? These are very logical things to consider, but you may have to ask the client for details and clarification in this area as many of them will not think about your need to fully understand why they are embarking on the re-design.

6. Their Expectations for the New Websites

If there are specific areas where their existing website is failing or out-of-date, make sure that you have an understanding of specifically how they expect the new website to improve their business. Expectations are a huge factor in determining their level of satisfaction with your work, so it’s critical that you know exactly what is expected of you and the end result of the project in order to satisfy the client.

7. The Determining Factors of Failure or Success for the Project

A new design may give the business a satisfactory feeling of improvement for their website, but ultimately there will be other factors that determine if the project was a success or a failure. As the designer, to effectively do your job and give the client a website that improves their business, it’s important that you have an understanding of exactly what will make or break the project. Maybe the success rests solely on increased sales. Maybe a website that is a more accurate reflection of the business is of primary importance. Whatever the situation, knowing how you will be measured will allow you to focus on the appropriate areas.

8. Their Reason for Choosing You as a Designer

With so many freelance designers and design firms out there to choose from, it’s clear that the client has chosen you for a reason. There is something about you that made the client feel that you were the best fit for the job. Maybe it was a specific item from your portfolio. Maybe it was the effective communication and attention to detail that you showed before signing the contract. Maybe it was your pricing.

Whatever the case may be, there is something about you and your work that encouraged the client to go with you over other designers. The reasoning behind this decision will often help you to have a better understanding of what they want or expect from you.

9. Their Plans for Maintaining the Site

Almost every website being designed and developed these days is using some type of content management system. The choice of a CMS and how you build the site should be influenced by their needs for ongoing maintenance and updates to the site.

Do they plan to add a lot of new pages and frequently change photos and text on existing pages? Will they need various templates that can be used on specific pages for different purposes? Will they only be making occasional and minor updates to pages? Understanding the ongoing needs of the client can often help to determine which CMS is right for the specific project. In some cases the client may already have a CMS in mind that they want to use, but this is often not the case.

What’s Your Approach?

As a designer, how do you approach the challenge of getting to know more about clients at the start of a project? Are there other items that were not listed here that are critical to you?

For more posts on topics related to running a successful design business, please see:

• 15 Steps to a More Productive Workday
• 12 Realities of Pricing Design Services
• Guide to Completing Projects On Time

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

Last week I wrote about some various steps to achieving a productive workday, and in many cases your days will involve the need to meet deadlines, or at least to make progress towards meeting the deadlines at a later date. In this article we’ll take a look at 10 different things that you can do to help yourself in terms of meeting deadlines on client projects.

1. Start with Realistic Expectations

One of the most important factors in completing projects on time is simply not accepting work that requires an unrealistic deadline. Of course, there will be times when a looming deadline will be a tight squeeze, but if you hope to be able to meet a deadline and to provide your highest quality of work, a certain amount of time will be needed.

If a client or a potential client is trying to get a project started with unrealistic expectations, the time line needs to be adjusted as soon as possible, or problems will follow. Most clients won’t know everything that is involved in getting a project completed and they won’t always be able to know what is realistic and what is not, so it is the freelancer’s responsibility to make sure that deadlines and schedules are reasonable.

2. Give Yourself Time to do Your Best Work

When evaluating a schedule or deadline proposed by the client, you may know that you’ll be rushed. In this case if the money is right and other factors work out, you may be tempted to move forward knowing that the time crunch will not allow you to do your best work. However, once you get in to the project and you want to produce something of quality, you’ll find that justifying a lower quality of work is not usually acceptable to yourself or to the client.

For obvious reasons it’s always preferable to come away with something that gives you a sense of satisfaction, and a piece of work that would help you to win new clients, not chase them away. When evaluating a potential project to determine if it’s one that you should accept, be sure to give yourself time for a high quality of work, or it is likely to be an issue later.

3. Get Started Right Away

Procrastination is easy for freelance designers, since there is no one around to hold you accountable. It’s a very simple concept, getting started earlier will allow you a better chance to meet your deadlines, but it’s easy to put things off.

By getting started right away you’ll have a chance to identify any potential problems while there is still plenty of time to deal with them, and you’ll reduce the pressure that will exist later as the deadline gets closer.

4. Plan for Unexpected Issues

Part of the difficulty in pricing projects and setting deadlines and schedules is that unexpected issues are almost certain to arise. Planning for the unexpected is a necessary part of the process that will usually be learned after a few bad experiences.

When extra time is built in to your schedule to deal with unforeseen problems, deadlines will not need to be missed because of these setbacks. Even though we all know that unexpected things sometimes happen when designing and building a website, explaining to a client that you can’t meet a deadline because of something you didn’t anticipate is never a good thing. Yes, there are times when it may come to this even when you have built some extra time in to the schedule, but minimizing and avoiding these situations should be a goal.

5. Communicate with Clients that Your Ability to Meet Deadlines Depends on Their Cooperation

Being held up by clients can often be a frustration for designers. When you’re building a site for a client there is a strong need for the client to be involved in the process. Whether you are being held up by waiting for content or waiting for feedback on the design, a slow response from the client is frqquently a contributing factor in delays.

To make sure that your clients have a clear understanding of what will impact your ability to meet the established deadline, take the time up front to emphasize that their input and follow up must also keep to the schedule, or else it will impair your ability to get the job done. This will help many clients to make sure that they get back to you promptly, and in cases where it doesn’t help, at least you will have covered yourself for later if deadlines are not met.

6. Get as Much Information as Possible Up Front

As was mentioned in the previous point, building a website is always going to involve some information from clients. Whether you need written content for the site, photographs to be used, a listing of pages that they want to be a part of the site, or feedback on the style of design that they want, the sooner you can get the information the better.

Of course, different projects will have various levels of involvement that you will need from the client. Whenever possible, it’s preferable to let clients know everything that you will need from them up front. This gives them a chance to go gather the information all at once, plus it makes it possible for you to have all of the information before you even really get in to the project.

Going back and asking the client for more information will usually happen at some point, but the more you can get up front, the less time you will have to wait later for a response. As deadlines get closer, these types of delays can often make the difference between meeting or not meeting deadlines.

7. Give Deadlines to Your Clients

In order to keep things moving forward, deadlines should also be given to clients for getting their part done. For example, when you communicate with the client at the start of the project, if you’re going to need content for X number of pages on the site, agree on a deadline with the client for the time when they should have all of that content in your possession.

Simply asking the client for something in an open-ended nature with no deadline will not always work. While you’re waiting you may be losing valuable time. Giving deadlines to the client can obviously help to get things moving quickly, but it also helps them to realize some of the ways that they impact your ability to meet the deadline.

8. Have Checkpoints with Smaller Goals Along the Way

Some projects, especially larger ones, will have smaller goals and deadlines built in to the schedule along the way. However, even if you’re working on a smaller project that only has one established deadline, it’s a good practice to break down the tasks and steps that are needed to get the project completed, and set some specific goals and progress points for yourself to meet along the way.

When you’re evaluating how much time it will take to complete a project, it will typically be much easier and more accurate if you can break it down in to small sections and gauge the time required for each of them. Without doing this, it’s easy to get part way through a project and feel good about where you are at, when in reality you should be much further along in order to meet the deadline.

9. Set Daily/Weekly Goals and Task Lists

If you’re starting a project with a detailed breakdown of what needs to be accomplished at specific intervals, you can evaluate your progress at any time and adjust if you’re falling behind.

Last week I wrote that having a daily to-do list is one of the keys to a productive workday, and I feel that it also has a big impact on allowing yourself to effectively meet deadlines. This way you will always know exactly what you need to accomplish in a given day to put yourself in position to get the project completed on time.

10. Evaluate Your Progress Daily

In addition to just setting goals for each day and tasks that need to be accomplished, it’s also necessary to evaluate your progress and make sure that you are still on track to meet the deadline. If you’re not on track, it’s obviously best to know that as soon as possible so that you can adjust your work as needed, and this method will allow you to do just that.

My typical practice involves spending about 5 minutes at the end of the day to go back through my to-do list and to make sure that any items that weren’t accomplished become part of the list for the next day. At this time I’m able to look at the projected schedule and determine if I’m still on track.

What’s Your Process?

How do you make sure that you’re able to meet deadlines?

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

Each of us is unique and no process will work for everyone, but all of us have plenty of things that we can do to improve our workflow. In this article I’ll cover some of the lessons that I have learned through my own experience. For me, productivity is a constant goal, and always interested in finding new ways to get more out of my time. I’m far from perfect in these areas, but making consistent improvements. Hopefully some of these things will help you in your own work.

1. Have a Task List for the Day

The best way to have an unproductive day is to work throughout the day without a clear definition of what you need to accomplish. Simply having a to-do list will go a long way in keeping you on track. One of the problems with freelancing is that there is usually a million different things that you could be doing on any given day. While all of these things may be helpful to your business in some way, they’re not all equal in terms of importance and urgency. Without a task list you run the risk of working all day on things that seem like they are benefiting your business, but in the end you’re not focusing your efforts on the right tasks.

2. Prioritize Tasks

One of my biggest frustrations in my daily work is that it seems like I’m never able to do everything I want to do in a day. In this case, a task list is likely to have a few things left untouched at the end of the day. Because of this, it’s important to not only create a task list, but also to prioritize the items that you’re looking to get done. Your tasks will differ from day-to-day, but it’s likely that you’ll have a few very important things that must get done, and then some others with varying levels of importance and urgency.

My personal approach with prioritizing is to simply to set the tasks that must get done, and then I also list a few stretch goals for the day. If and when I get all of the most important items done for a particular day, at that point I can move on to the stretch goals, which usually carry less urgency than my main tasks. This way I don’t finish my work early and have nothing to do, and I also don’t have too much on my plate that causes adverse effects when I can’t get everything done.

3. Place More Emphasis on Finishing Tasks Rather than Starting New Ones

Most freelancers have a few different projects going on at all times. On top of that, each project may have several different tasks that need to be done, and you may even have some of your own personal projects that require time. With all of these things fighting for your attention at once, it’s tempting to dig in to new tasks before completing others. By doing this you’ll usually be costing yourself more time and effort later when it comes to finishing those tasks and projects.

In order for a freelancer to keep the income flowing, it’s critical that projects are getting finished. Being able to finish a project will help you to get paid sooner and allow you to move on to another project. From my experience, when I’m struggling with too much to do, it’s best if I can devote time to tasks and projects that are near completion. Being able to get things crossed off the list feels good and helps to reduce stress and create a more productive environment.

4. Know the Strongest Times of Your Work Day

Some people work best early in the mornings, others prefer afternoons or evenings. Everyone has times of the day that are stronger than others in terms of focus and productivity. I tend to get up early, but I’m not at my peak for the first few hours of the day. I’ve found that rather than fighting this and trying to get more done at the start of my day, I’m better off to use that time for tasks that are less demanding mentally.

During the times when I struggle to concentrate I’ll clean out my email inbox, moderate and respond to comments on my blog, evaluate my overall process on current projects, or anything that requires time but not the highest amount of mental focus. With this approach I’m able to make productive use of my least productive times of the day, and that will save my best hours for more taxing activities like working on a client’s website or writing articles. With the varied tasks of a freelancer, there are always plenty of things that need to get done that require different levels of intensity in terms of work and focus. If you can match your best times for work with the most intense tasks, and your least productive times with more routine tasks, you’ll get more out of your day.

5. Give Yourself Some Flexibility

I’ve already talked about the importance of having prioritized tasks and the use of different times of the day, but it’s also important to not get so rigid with this that you don’t leave yourself some room for flexibility. There will be some days that don’t go quite as planned and when you don’t feel like you do most other days. Allow yourself to have some flexibility to change things around according to the circumstances.

6. Have a Specified Ending Time for Work

One of the biggest challenges that I face throughout the week is knowing when to end my work day. When you’re working for someone else it’s much easier to make a clear break, but as a freelancer there is always a temptation to keep working. With so many things to do and your income riding on getting things done, it seems like you will be more productive by working longer days. But from my experience I’ve found that I often feel like I get the most done when I have something going on that forces me to end the day at a specific time.

With a set ending time it’s easier to get moving quickly and to get more productivity out of each hour, since they are limited. Without a set ending time I often find myself working with a little bit less efficiency since I feel like I have plenty of time. On those days I wind up with less time away from work and I often don’t seem to get that much more accomplished, even with the extra hours of work.

7. Bulk Process

With so many different things to do, it’s likely that your day is broken up into many small blocks of time for specific tasks. In order to achieve more efficiency and productivity, try to use larger blocks of time and get similar things done all at once (depending on the nature of your work this may or may not be possible). For example, if you can avoid working with your email open you may be able to spend less time each day on email by checking in 2 or 3 times throughout the day and emptying your inbox each time. Checking email many times throughout the day may lead to more time than necessary. An example from my process is writing blog posts. My preferred method of producing content for my blogs is to have specific days set aside where this is my only focus. I can finish one post and move right on to the next. I may have a list of ideas that I want to work on so I don’t waste time trying to decide before I start writing. With this approach I feel like I’m able to get more out of my time as opposed to writing a post here and there whenever I have time.

8. Track Your Time

You might be completely surprised to know exactly how you spend your time throughout a work week. Tracking your time can help you to find inefficiencies and ways to improve your productivity. Without knowing how your time is spent, it’s hard to know how you can improve the use of your time. I’m not suggesting that you need to track your time everyday, but if you do it for a few typical days you may be surprised at how easily you can identify some areas for improvement going forward. Mashable has a post from last year that looks at 6 online resources for tracking your time.

9. Recognize Your Distractions

One of the benefits of tracking your time is that it helps you to identify things or activities that may be distracting you in your work. Whether or not you are tracking your time at any giving point, one of the first steps to working productively is to recognize your distractions. Eliminating or controlling these distractions will lead to greater efficiency, but in order to do so you’ll first have to accurately recognize and understand specifically what challenges you have when it comes to working productively.

10. Have Realistic Expectations

Ambitious freelancers will often feel the pressure to get more done than is humanly possible with a given amount of time. This can obviously lead to increased stress and pressure, not to mention a lower quality of work. Realistic expectations will allow you to be able to accomplish the things you set out to do with a day of good work.

the biggest part of having realistic expectations is the amount of work that you assign yourself for the day. Taking on too many projects at once and trying to juggle too many different tasks will result in a cluttered work day with unimpressive results. Resist the urge to try to get too much done, and focus more on doing your best work with what is currently on your plate. If you struggle in this area you may be able to increase your productivity by outsourcing some of your tasks.

11. Plan Your Next Day at the End of Each

This is probably more of a personal preference, but I have found that if I take a few minutes at the end of my day to plan for the next day, I’m typically more aware of things and I can do a better job as opposed to waiting until the next morning to plan the day. If I wait till the next morning I find that it takes me a few minutes to remember exactly where I was on certain items at the end of the last day, and I may overlook something that I would have remembered had I taken care of this the day before. At the end of each day I can look at my to-do list for the day and quickly see where I stand on the items that I wanted and needed to get done. At that point, planning for the next day is a quick process and I know exactly where I need to start, without running the risk of forgetting things. Now I’ll waste no time the next day trying to figure out what I need to do.

12. Get Enough Sleep the Night Before

During my time as a freelancer, particularly when I was freelancing part-time on top of a full-time job, I’ve averaged less sleep than at any other point in my life. However, sleep is an important part of a productive schedule. Each of us functions differently in this area, but personally I tend to notice it the most at the very beginning and end of the day. If I’m feeling well-rested I can be productive through these times. If not, I struggle to stay on task.

13. Eat Healthy

The food that you put into your body can have a big impact on your energy level and your feelings in general. I’m not going to go into detail here because I’m not that knowledgeable on the topic, but generally eating healthy foods will allow for better productivity.

14. Get Fresh Air

One of the things I dislike about working from home is the amount of time that I spend inside the house. I often find that it helps just to take a few minutes for a walk or a drive to get some fresh air. Sometimes working in a different environment and getting out of the house for a while can really lead to a boost in productivity. This is something that you can accomplish with just a few minutes of your time, but it may have a noticeable impact for the next few hours.

15. Work in a Comfortable Environment

As a freelancer, you’ll probably be spending a lot of time in a home office. Making that office a comfortable space is important in terms of increasing your productivity. What you do with the office isn’t really important, but it should be an area that allows you to focus on your work comfortably for long periods of time. I recently wrote a post at DesignM.ag on the essential qualities of a home office that takes a more in-depth look at this subject.

What’s Your Experience?

Feel free to share you own thoughts on the subject of productivity in the comments.

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

The process of designing and developing a website for clients is rather complex and involves a lot of different steps. First, there is the initial contact either through an online inquiry or maybe a referral. Then comes a quote for service, a contract, the opening stages of the design, client feedback, revisions, development, completion, final billing and record keeping. Of course, the exact steps may vary from one designer to another, but the point is that a lot goes into the complete process of taking a client from inquiry to the completion of the project.

With all of these different steps and a lot of gray area from clients about how the process will take place, creating some sort of standard process of your own can be an excellent way to improve the simplicity and effectiveness for both you and the client.

The average client will look to the designer to take the lead and have an established process. While many freelancers who have been on the job for a long period of time are likely to have set their own standards, this is an area for huge potential improvement for those who have yet to do so.

In this article we’ll take a look at the aspects of the client process that can benefit from some sort of established procedure. With established practices you’ll find that you’re able to save time, keep things more organized, make fewer mistakes in important areas like the legalities of the process and record keeping, and in general you’ll be able to provide clients with a more comfortable process.

The thoughts in this article are from my own experience. Developing a system that works for you and your clients is more important than following a set guideline. Your feedback from your own experience is welcomed and appreciated.

Aspects of the Client Process:

1. Inquiry

All client projects have to start somewhere. It may be a contact form submission through your website, a call from a friend or former client, or you may even initiate the contact. Personally, the majority of my inquiries come through my website, so that is where my own focus has been. As you receive inquiries from a number of potential clients it’s pretty easy to lose track of who has been contacted or where things stand. My own system involves setting up folders within my inbox. I have a general inquiry folder where new emails go after I have responded to them. This way I know that if an inquiry email is sitting in my inbox and not in any specific folder, I still need to reply.

I also have a few other folders that I use for inquiries. If I’ve talked to someone that shows some interest but hesitates to make a decision, I’ll usually put that email in a “follow up” folder so I’ll be reminded to get back in touch with them if I don’t hear anything in a while. I’ll browse through this folder every now and then to see who needs to be contacted.

Another option for tracking your inquires would be to keep a simple spreadsheet. This is something that I’ve done at times in the past when I wanted to track something such as the source of my leads over a period of time. A spreadsheet can be helpful because of all the options for sorting and different things that you can do once some data has been accumulated. However, I’ve found that a simple folder system in my inbox works better for me and is easier to maintain.

2. Quote

Pricing services is a challenge for most designers. Unless you use set pricing packages, you’ll need to have some type of process for developing quotes. Even if you use set prices, it’s likely that you’ll get some work that doesn’t fit within the standard box of those packages.

How you choose to price your services is up to you, but the important thing is that you actually have a standardized approach. Of course, some flexibility is needed from time-to-time, but without an established method for quoting you’ll wind up spending too much time on clients that wind up not choosing to use your services, and your prices simply won’t have much meaning behind them.

My approach is to do the best job that I can of getting information from the client about specifically what it is that they want from me. With this information I’ll make my best estimate on the number of hours that the project will require, and I’ll quote based on what I need to earn per hour. Part of my process also includes stating specifically what is involved in the service and what is covered in this quote with the explanation that additional services or time may be dedicated, but they are subject to additional charges.

It’s also helpful to have a standard form that you complete for the quote. Much of the information may be the same on most projects, so just entering the specifics rather than starting from scratch each time can help with efficiency.

Once I’ve sent the quote to the client, I save it to a “Quotes” folder so it’s easy to find in the future. If you’re working on a few projects at a time it’s easy to forget the details of the quotes, so having them easily accessible can be helpful. Also, you may find that some clients don’t make a decision right away and a few months after the quote they’ll get back in touch with you. When this happens it’s nice to know exactly where you can find the old quote without needing to start over again.

3. Payment Policies

Much like pricing your services, establishing and following policies for accepting payment is not the favorite activity of most designers. Most of us have learned the hard way that it’s necessary to get a portion of the payment up front to avoid wasting time on a client that’s not committed to the project. When dealing with clients I find that it’s easier and more comfortable if there is a standard policy and if it is communicated to clients.

Most clients will understand that you need to get some of the money up front, and many appreciate knowing that this is your standard process, so they don’t feel singled out. Regardless of the process that you choose, it’s helpful to decide on how you want to handle things and stick with it as much as possible. It will be easier for you to know when you’ve been paid and how you were paid, plus there will be less back and forth with potential clients on these issues when it is presented as your policy for doing business. Of course, you always have the right to make exceptions if you see fit.

4. Invoicing

Creating and tracking invoices is an area that all designers need to standardize in one way or another. There is obviously a need to know who you have invoiced, when it was sent, and if payment has been received. Fortunately, there are a lot of good options in this area. You can find plenty of free templates online for creating invoices and set up your own system for storing and tracking the, or you can use one of the many services that will make the process easier for you. FreshBooks is one of the leading services for these purposes, and it actually includes much more than just invoicing. You can also use FreshBooks, and many of its competitors, to create quotes or estimates, as well as to track your time and expenses. If you’re charing clients a portion up front and the balance upon completion, it’s especially important to be able to accurately track this information.

5. Contracts

Some designers have clients sign a contract and some don’t. I’m not a legal expert so I’m not going to go in depth here, but obviously it’s recommended that you use contracts for your own protection. This is an area that you’ll definitely want to standardize in terms of the actual contract that is used, and also in terms of record keeping.

6. Client Intake

Once you’ve provided the client with a quote, they’ve decided to use your services, and you’ve received the initial payment to get started, you’ll now have to get completely familiarized with the client before diving in to the project. Most likely, in order to provide an accurate quote for the client you will have already done some basic research into their business and their needs from you, but at this time you’re likely to need more specifics about what they do and what they want in a website.

From my experience, this is a critical stage in the process, and one that is best done with as much personal interaction as possible. Most designers do not meet face-to-face with every client, but at this stage a phone call is much more personal than an email, and you’re likely to get much better information over the phone. Email is great for communicating with clients, but in order to get the information that you need and to have an effective conversation at the start of the process, email communication is usually not enough.

Many of the questions you will ask to clients will be the same for almost everyone. For this reason it’s a good idea to save a document somewhere with all of the typical questions included. Personally, I prefer to take notes by hand when I’m speaking with clients on the phone, so I’ll print out a sheet with the questions and then record my notes there. Others may prefer to type directly in the document of to use a tape recorder and go back and take notes later. Regardless of your choice, you should have some sort of typical process for getting information from clients.

Once I have a client signed on and ready to go, I create a separate folder to store all of the information on their project. The quote, contract, will go in this folder, and so will the responses to intake questions if I type them.

This is a process that you won’t want to completely standardize since each client is unique. I recommend having a core set of questions, but be flexible and take the time to think about what other information you may need for this specific situation, and what information from your core questions may not be needed in this case. This will allow you to achieve efficiency without losing a personal touch.

7. Tracking Time

Whether you’re working on set pricing or charging by the hour, it can be extremely helpful to know how you are spending your time. You may have decided on a set price to charge the client for the project, but when it’s all said and done, how do you know how much time you actually spent on it? The next quote you write up may be easier and more accurate if you know how you really spent your time on your latest project. You may find that you’re spending more or less time than you realized, and this is helpful to know for pricing. If you’re charging by the hour it’s obviously critical to have accuracy in this area. Online resources like Time59 are helpful for this purpose (as was mentioned earlier, FreshBooks also offers time tracking).

8. Process of Design, Feedback and Revisions

Most of the areas we’ve looked at so far focus on the business aspect of being a freelance designer. These areas, in my opinion, are a bit easier to standardize than the design process itself. However, that doesn’t mean that there is no room for improvement in the design process. For example, it’s helpful to have some sort of established process for going about the design work, getting feedback from clients, and making the appropriate revisions.

You may want to establish a process that involves 1) sketching a basic layout after getting the initial information from the client, 2) getting approval from the client on the basic concepts of the design, 3) completing the mockup in Photoshop, 4) getting client feedback on the mockup, 5) making any changes to complete the design, 6) coding the website, and 7) testing. This is just a sample scenario, you can develop your own process. It’s helpful for you to know what the process will be for each project, and it’s also helpful for clients if that process is communicated early on so they know what to expect.

Conclusion:

At this point we’ve looked at many of the major stages of the process from inquiry to completion. I find that establishing some standardization in these areas is helpful in my work, but you’ll need to evaluate these areas for yourself and your clients.

What is involved in your standard client process?

(Just before publishing I saw that Antonio Lupetti has a new post on Woork, Simple process to estimate times and costs in a web project. If that’s an area where you’re looking for more detailed instruction, see his post.)

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

Like any site design/development, a clear set of goals and purposes should be established to direct the project. Without knowing specifically why the site is being re-designed or what needs to be improved, you may wind up with a better looking design, but it is unlikely to be more effective for the business or for the users.

I’m currently in the very early stages of re-designing a website for a client that needs a fresh look and some usability improvements. The client is a service provider and the existing site has been effective at attracting new business, but the site has grown and usability has suffered because the navigation can be difficult, and because the most important content isn’t consistently prioritized and featured throughout the site. In general, the site could be more effective for both users and for the business. The design needs to be updated and the income-generating services that drive the business need to clearly be the focal point of the website.

This situation has led me to evaluate the re-design process and how it should be approached for both the designer and the client/website owner. Throughout the post we’ll look at some steps and key points in the process and why they have a big impact on the end result.

Goal Setting

Regardless of whether you’re creating a new website or re-designing an existing one, it’s critical to identify the purpose and the key factors for determining the success of the project. Part of a designer’s job is to make things look good, but the more important part is to make the site effective for the business owner and for visitors.

Before starting a re-design, take the time, preferably with the client, to list the specific goals of the project and what needs to be accomplished. Once clarity is established in this area you’ll be able to work towards achieving the goals with confidence that the job is being done well.

Part of the goal setting process involves knowing specifically what the website should accomplish for the owner/client. This may seem pretty obvious in some cases, but it’s worth taking some time to consider because the wrong approach here can seriously damage the effectiveness of the site. What is the most important aspect of the website for the business? Selling products? Finding new clients? Is it strictly informational?

Evaluating the Current Design

In almost all cases the current website will have some strengths and weaknesses. Of course, the strengths should be maintained as much as possible through the re-design and the weaknesses should be improved to the point where they can no longer be considered weaknesses.

Here are some specific specific questions you can ask yourself to evaluate the current design:

1. How does it compare to websites of competitors?

It’s common for websites in specific industries to have some similarities, and it’s easier to compare a website to another in the same industry than it is to compare sites in two completely different industries. Take a look at some of the leaders in the industry, or maybe just some of the most significant competitors, and judge the overall design of the sites to see how yours compares. Visitors to the site are very likely to also be visiting other sites in the same niche or industry, so it’s desirable to have a site that compares favorably to others.

2. Could a new design keep the same feel, or does it need to be stripped down and totally started over?

Because websites are so important for branding, and also because re-designs can have major impacts on repeat visitors, it’s usually preferable to keep a similar look and feel to a website rather than completely going in a different direction. An example of this is the recent redesign of PSDTUTS and the other sites in the TUTS family. The new blog theme gives the site a fresh and improved look, but still keeps major elements in tact so visitors will feel at home even after the re-design.

In some cases the current design may be sufficient to the point that it can be retained in some ways, but in other situations the re-design will need to start from scratch. Of course, it’s helpful to know this as early in the process as possible.

3. What style should the new design feature?

There are obviously many different styles a designer can use to create an attractive and effective website. However, the style of the website should fit with the purpose and content of the site, and visitors should be a major consideration.

The target audience of a website is likely to have certain preferences when it comes to design style, and these should not be ignored. This is the main reason that so many websites in particular niches or industries share a similar style. While you don’t want your designs to look just like everything else, it’s a good idea to factor in the common user expectations and what they will want to see when they arrive at your site.

4. What works and what doesn’t work in the current design?

When looking at the current design and determining a direction for the re-design, it’s important to take a close look at what is working and what is not. Are there certain aspects of the website or the design that draw a lot of feedback, either positive or negative? Are there areas of the site where usability could be improved? Once you have a specific list of strengths and weaknesses you’ll have a much better idea of what direction to take with the re-design.

Site Structure

If the website has been continually growing with new content or pages being added, the structure of the site is an area that may need evaluation. Does the current structure allow for visitors to easily find what they’re looking for? Does it allow for the site to continue to grow without any problems? If these items need to be addressed it’s best to do so at the time of re-design so they can be adequately handled and fixed.

Traffic Sources

One area that is often overlooked during a re-design is traffic sources. It’s important to know how visitors are arriving on the site because it will help you to learn more about the visitors of the site. In addition, it’s helpful to know which pages are the most common entry points so that you can be certain to make these pages as useful as possible to new visitors.

Knowing the sources of traffic can help you to find ways to maximize those sources. For example, before I redesigned this blog theme about six months ago Design Float had consistently been one of the leading sources of traffic, and fortunately a targeted source as well. As part of the re-design of the theme a voting button for Design Float was added at the end of each post, and since that time the traffic from Design Float has become even more significant.

Layout

The layout of a website has even more significance in terms of content than it does in terms of design. While the layout is important for creating an attractive site, it also helps to determine how the content will be presented to visitors and what will be emphasized the most. Take the time to consider what is most important on the site, and remember the ultimate goals of the site and the re-design. Is there content that needs to get priority by being placed in prime areas of the layout?

SEO

Search engine visitors are important to just about every website. One of the potential areas for disaster in a re-design is damaged SEO that results in lower rankings and reduced search engine traffic. Obviously, only a portion of the significant SEO factors are influenced by on-page factors, and others are off-page.

For the on-page factors, if the site is currently doing well with search engines, pay close attention to how it is structured and coded in order to avoid damaging the rankings. If the site currently isn’t doing as well as it could, then changing things up and improving the on-page SEO is necessary.

Even off-page SEO needs to be considered to some extent. It’s preferable to keep the URL structure the same as it was before the re-design so search visitors are going to arrive at the right place and so that the exiting pages get the benefits of the existing rankings rather than starting over. If a lot of links are pointing at specific pages, make sure that those URLs are not changed, or if they must be, make sure to use SEO-friendly re-directs.

What Factors Do You Consider During a Re-Design?

Please take a moment to share your experience and opinion on the subject of re-designs.

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.

Regardless of what type of website you’re developing (a blog, a portfolio site, an e-commerce site, etc.), the success of the site will hinge on being able to communicate effectively with visitors and readers. On the subject of communication, there are a number of potential issues that need to be considered:

Purpose

New visitors should be able to quickly get an idea of a website’s purpose and its primary reasons for existence. If a site does not clearly communicate that purpose, visitors are not likely to stick around. If your purpose involves having visitors take a certain action (such as buying a product, filling out an information request, signing up to a newsletter), they should understand exactly what it is that you want from them.

Questions for evaluating your website’s communication of its purpose:

Can a visitor easily determine the purpose of the site upon first visit?
What elements in the design are competing with communication of purpose rather than helping?

Typography/Fonts

Typography can sometimes be a subtle detail in the design of a site, but it can also have a significant impact on the communication. The font chosen, size, color, weight, and case all impact how the message is being communicated. For more on typography, see 101 Typography Resources.

Questions for evaluating your website’s use of typography and fonts:

How does the typography complement the message of the site/company?
Are elements such as bold, italics, font colors and font sizes used effectively?

For excellent examples of typography, see Typesites.

Colors

Colors can have a subtle psychological effect, or they can have a more obvious effect. The same website with two different color schemes can have two drastically different appearances, and this may impact the communication with visitors.

For more on the psychology of colors, see Choosing Colors for Online Marketing and The Meaning of Colors. For a look at some of the most helpful resources for choosing colors, see Find the Perfect Colors for Your Website.

Questions for evaluating the impact of colors on your website’s communication:

• Are the primary colors of the company used effectively in the website to present a consistent image?
• How does the color scheme affect readability?

For a fun and informative project on the impact of color, see Cymbolism.

Busyness of the Page / Clutter

A busy page that’s full of clutter will have serious problems being able to communicate with visitors. Many large websites, especially news sites, face this issue. One of the reasons a minimal approach to design can be so effective is because it gives the designer more control over the message that visitors are sure to receive. With less going on, visitors will not be distracted by extra items and will have only the primary messages being presented to them. Of course, the minimal approach isn’t appropriate for all projects, but it’s a helpful illustration of how busyness and clutter can impact communication.

In the image below, Kyan’s portfolio site has very little to distract visitors from its message, “We are a creative web design & development agency with a passion for web standards.”

Questions for evaluating your website’s communication involving clutter:

• Is the most important information drowned out by excessive clutter?
• Is there a need to remove or re-organize content?

Images

The images and photographs used on websites will have a huge impact on communication, because they will typically be noticed by visitors before text will be read.

The primary message that 3000k wants to communicate to visitors is that they can help you to grow a stronger presence online. The image they’ve chosen is obviously intended to accompany the text in communicating that message.

Questions for evaluating your website’s communication using images:

• How do the images complement the text and the intended message?
• Are the images professional quality?

Icons

The primary purpose of icons is to tell visitors what they can do by clicking on the icon without the need to put everything in words. For example, the printer icon tells visitors that it will help them to print the page, the home icon indicates that they’ll be taken to the homepage if they click, etc. Icons are essentially of little value if they are not intuitive enough that visitors know right away what they will do.

Questions for evaluating your website’s communication using icons:

• Are the icons used in a way that can help make the site easier to navigate/use for visitors?
• Are the icons intuitive?

Navigation

The navigation used on a page will communicate to visitors which pages are most important, or at least what’s relevant to the page that they’re currently reading. Every website will have some pages or sections of the site that are more significant than others. This may be a page that is important to the site owner, such as a sales page, or it could be important to the visitor because it is related to the current page. Whatever the case may be, the navigation that is used will in some ways communicate what content is important to visitors.

Questions for evaluating your website’s communication through navigation:

• Is the navigation logical?
• Are links to the most important pages easy to find from everywhere on the site?

Eye Path

It’s a known fact that design decisions can impact how the visitors’ eyes will first explore the page, and the habits of our eyes can also impact what aspects of a page get the most attention, and what may be overlooked. For communicating an important message, you can use this to your advantage to make the message more effective.

For a look at the subject, see Designing a Guided Tour and What I Learned from Eye Tracking.

Questions for evaluating your website’s communication in terms of visitors’ eye paths:

• What part of the design will catch visitors’ eyes first?
• How can you direct attention to the sections of the page that are most important?

Language and Grammar

An obvious impact on the message is the language in which it’s being communicated. Knowing your target audience, you should be able to identify the language to be used, although some websites will offer multiple choices of languages for visitors. Also, the grammar and spelling will say a lot about the site and the company, good or bad. Professional websites should make every effort to portray professionalism with the language and the grammar being used.

Questions for evaluating your website’s language and grammar:

• Is the grammar professional and free of errors?
• How could messages possibly be misinterpreted?

Accessibility

The message of a site can’t be communicated of the visitor can’t access the page. In that case the message usually will become, “you’re not the type of visitor that’s important to us.” Simply making a page accessibly will not create positive and clear communication, but not being accessible will surely communicate and unintended message.

Questions for evaluating your website’s accessibility and its impact on communications:

• What potential barriers to accessibility exist? Are they acceptable?
• How does the site degrade?

Whitespace

The whitespace used around text and throughout the design will play a role in how easy or difficult it is for the reader to get the intended message. Earlier we looked at how minimal designs can promote clarity of message, and whitespace is often a big factor in this. Providing some whitespace around the important message will make it stand out more and will give it the appearance of importance.

Questions for evaluating your website’s communication through whitespace:

• Is it possible to improve the communication/message by using more or less whitespace?
• Does the whitespace have a purpose in the design?

For a nice example of whitespace that helps with communication, see Big S Design.

Copywriting

The words chosen will obviously have an impact on the communication. Many website owners and designers don’t give much consideration to the copy that is used, often to the detriment of the communication. This will often not fall into the responsibility of the designer, but if you’re evaluating a site’s level of communication, it cannot be ignored.

Questions for evaluating your website’s communication through its copy:

• Does the web copy clearly communicate the message to visitors?
• Is it convincing?

Headings

Headers and sub-headers are used for multiple purposes in web design. To start with, they quickly give the visitor an idea of what content will follow and they break up the text to make it more readable. Additionally, they are great for getting the attention of visitors and pulling them in to text that they might not read otherwise. Not to be forgotten, headers also have some value in SEO.

When designing a page, give careful consideration to the headers that are used. Make sure they are friendly to both human readers and to search engines.

Questions for evaluating your website’s communication through headings:

• Are headings used appropriately (i.e. do they accurately describe the page’s content)?
• Do they make the page easier to read/scan?

Taglines

Some websites use taglines to quickly convey a message to visitors. I can’t harp on taglines too much, because I don’t use one here, but if used effectively, taglines can be a great communication and branding tool. The tagline gives you the opportunity to tell visitors how you want to be remembered and can help to distinguish your site.

Questions for evaluating your website’s communication through its tagline:

• Does the tagline communicate an important message effectively in addition to just being clever or funny?
• Is it memorable?

Superawesome effectively uses a tagline to tell visitors what they’re all about.

Organization

The text and images on the page are doing the communicating, but the method in which they are organized can make the communication easier or more difficult. Good web design will present the content in a way that allows it to achieve maximum impact in terms of communication.

Questions for evaluating your website’s organization and its impact on communication:

• Is the content of the site logically organized to a new visitor?
• Could the message be improved through re-organization?

Formatting

Especially with articles and blog posts, formatting is essential. The same content formatted in two different ways can produce drastic results. When dealing with content on the web, it’s essential to break it up so it can easily be read on-screen. This means using short paragraphs, headers and sub-headers, adequate spacing between lines and paragraphs, lists, blog text, etc. For some excellent examples, see Designing and Formatting Blog Posts for Readability.

Questions for evaluating your website’s formatting of text:

• Is the text broker up to allow for scanning?
• Is it written specifically for being read on-screen?

Looking to Hire a Designer or Developer?

Post a free job listing to the DesignM.ag job board for freelance, part-time or full-time positions. Your listing will be seen by thousands of talented designers and developers. - Post a job for free.