Not Just Pretty | Building An Effective Small Business Brand

My 20-minute Website Redesign

I just redesigned my website in 20 minutes. It's not a full redesign, but through swapping out a few key components and making a couple of graphical revisions, the site looks refreshed.

I wanted the site to look bolder and authoritative.

Before:

After:

  

Designing Forms on Your Website

Brand design can extend into all realms of a business's designs - even into the design of feedback or subscription forms on your website. Here's an example of how you can customize a form to match your brand design.

This is the original output of a form-creation program:

It's decent, certainly - but we can do better.

When you're designing your form, keep your brand's color palette, font style and other brand standards in mind. Here's a designed version of the same form, followed by a discussion of the changes that were made.

1. Adding a headline can help to make the purpose of your form clear. Headlines also make the form design more eye-catching. Design the headline to match either the other headlines or sub-heads on your page, in terms of font face, alignment, color choice and size.

2. Include instructions on how to use the form, and set expectations about what will happen once the form is filled out. This helps to visually anchor the form and to also make the person filling it out feel more comfortable about doing so. Again, the font face, alignment, color choice and size of these instructions should be matched to your other materials - in this case, your body copy.

3. Style the form field labels. Change the font face, size and color palette on the form field labels (Name, Email, Company, etc.) to match your body copy.

4. Align the form field labels (usually left, unless your brand guidelines specify another choice). You may be able to do this by just styling the text, but you may have to change the table styling if your form was delivered in an HTML table.

5. Design or style the "Submit" button. Your choices here include:

1. Keeping the default style (shown here)
2. Changing the text that appears on the button. This can be done in the HTML code by changing the 'value="Submit"' text to read 'value="Your Text Here"'.
3. Swapping out the default button style for a graphical button. The code for this is: <inputype="image" src="images/submit.jpg" value="Submit" alt="Submit"> where 'submit.jpg' is your image file. If you choose this route, design the button to match your color palette and brand, but make sure that it is still easily identifiable as a submit button. You may do this through the words on the button, or by using an arrow graphic if space is limited.

6. Consider placing a border around your form. This can help to distinguish it from other elements on the page, and help it stand out from the rest of your content. Your border can be solid, dashed or dotted. Choose the option that aligns with your brand.

7. Add a background color. This is another way that you can make your form stand out and call attention to itself. Choose a background color that your headline and body copy colors contrast with, to ensure that they will be legible. And, make sure the background color coordinates with and compliments the rest of your brand. You may also choose to place a subtle pattern in the background if your brand calls for that.

Collecting Customer Testimonials

QUESTION:

I want to compile some testimonials from my clients so I can eventually put some on the website.  Do you have any advice or resource/article about the process of collecting testimonials from clients.  I assume you should guide them a bit to elicit the best well thought out, well written responses.  

ANSWER:

I've just asked people to give me testimonials - I don't offer a lot of guidance, unless we've done several projects together and one went particularly well.

Usually I ask right at the end of a project, though I have gone back in the archives and asked older clients for testimonials. 

Lately, I've been asking through LinkedIn and then posting those to my website as well. That way, the testimonial is recorded in both places.

I also keep an eye on client emails for interesting comments, and sometimes ask to use those outright, and other times ask them to create a more in-depth testimonial based on their comment. 

Otherwise, I prefer not to guide my clients much - I think the testimonials sound more natural that way. There are others who offer a lot of guidance, such as a questionnaire or template response that people can then modify. I've heard of people getting testimonials by conducting phone interviews. I've even seen people who write out the testimonial for the clients' approval, but that seems a bit contrived to me.

CAN-SPAM Act Also Applies To Small Businesses

With this talk of subscriptions, I just wanted to make a note that the CAN-SPAM Act affects small businesses. Really, it applies to anyone who sends out "bulk" emails, even if the recipients of those emails have requested to be on your list (and, you do only send your emails to people who have requested to be on your list, right?)

CAN-Spam laws have been revisited, debated and revised a couple of times in the past couple of years. Here's the current rules from this law:

(From Wikipedia: http://en.wikipedia.org/wiki/CAN-SPAM_Act_of_2003)

Applicability
CAN-SPAM defines a "commercial electronic mail message" as "any electronic mail message the primary purpose of which is the commercial advertisement or promotion of a commercial product or service (including content on an Internet website operated for a commercial purpose)." It exempts "transactional or relationship messages." The FTC issued final rules (16 C.F.R. 316) clarifying the phrase "primary purpose" on December 16, 2004. Previous state laws had used bulk (a number threshold), content (commercial), or unsolicited to define spam.
"Commercial", by many industry standards, is defined by a combination of the content in the subject line and "above the fold content" in the body of the message. If this content contains a solicitation and it can be determined that the majority of the content is selling something- it is a commercial offer.
If the subject line and body content are majority invoicing information, a sales receipt, account information, etc. the offer is considered transactional. Note that an offer or advertisement can be placed in a transactional message so long as it is placed in a non-prominent position. Many in the email marketing industry utilize the 80/20 rule to define commercial vs. transactional email in order to be clearly in either category.
The bill permits e-mail marketers to send unsolicited commercial e-mail as long as it adheres to 3 basic types of compliance defined in the CAN-SPAM Act: unsubscribe, content and sending behavior compliance:
Unsubscribe compliance

• A visible and operable unsubscribe mechanism is present in all emails.

• Consumer opt-out requests are honored within 10 days.
• Opt-out lists also known as suppression lists are only used for compliance purposes.

Content compliance

• Accurate from lines (including "friendly froms")
• Relevant subject lines (relative to offer in body content and not deceptive)
• A legitimate physical address of the publisher and/or advertiser is present (this can be a post office box or private mailbox)
• A label is present if the content is adult.

Sending behavior compliance
A message cannot be sent through an open relay

• A message cannot be sent to a harvested email address
• A message cannot contain a false header (the email details about where it's from must be accurate)

Note that falsifying header information is a serious violation of the CAN-SPAM Act and generally is an indicator of criminal or malicious intent which can bring the attention of other law enforcement agencies besides the FTC, including but not limited to the FBI, DOJ and US Postal Inspectors.
The content is exempt if it consists of:

• religious messages;
• political messages;
• content that broadly complies with the marketing mechanisms specified in the law; or
• national security messages.

There are no restrictions against a company emailing its existing customers or anyone who has inquired about its products or services, regardless of whether or not these individuals have given permission, as these messages are classified as "relationship" messages under CAN-SPAM.

More details about CAN-Spam are available here:

Wikipedia: http://en.wikipedia.org/wiki/CAN-SPAM_Act_of_2003

Merchant Account Services

If you're setting up a shopping cart for your website, you'll need merchant services to be able to process your own credit card payments. 

I recently met Jeff Marcous of Dharma Merchant Services, and his company provides socially responsible merchant services - allowing you to support causes and to work with a green company. And, he's very personable and friendly, and wants to help small businesses.

His website is: http://www.dharmamerchantservices.com/

Branding Your Video Background

To extend your brand into you video's background, consider creating a brand background poster. To do this:

1. Measure your background: Set up your camera for a test video. Also set up a background with some objects in it - hang a poster on the wall, stick a yard stick right behind your head, or otherwise mark out your background. Record yourself for a bit, and then view the video. Use the marks in the background to determine how large of a background image you need to cover with your poster.

2. Make your graphics: Take a simple visual motif from your brand's visual vocabulary and enlarge it to poster size. Adobe Illustrator is a good program to use to create this file, and it creates files that are often accepted by banner printers.

3. Recommended poster size: Try to make your poster no more than 36" in one dimension (the maximum size of many banner printers) and then as long as you need in the other direction. This will save you the cost of printing two lengths of poster, or mounting them on oversize foam core boards. 

Do check first with your poster/banner printer before committing to your final size, though, and make sure that their equipment can handle the size you plan to print.

4. Consider how you'll hang it:  You'll either need to hang the poster on a wall behind you, or use an easel to prop up the poster as you record your video. 

Here are the details on how to do either approach:

1. The non-wall-mounted option: Get your background image printed on paper, mount it to foam board (the banner printer will do this for you), and then get a floor easel from Staples. You can adjust the floor easel to the right height and prop the foam-core-mounted image on it, and position it in your background to record. 

This approach would take a bit of adjustment each time to get the image framed right because you'll have 3 moving parts: height of the easel, distance of easel from you, and distance of camera from you. You'll want to take the time to adjust it each time in order to maximize the visual consistency of your videos - the background should appear similarly positioned in each of your videos.

2. The wall option: Get your image printed on vinyl, and install 2 hooks or pins on your wall at the proper height. Have your printer install grommets in the upper corners of your poster (and possibly the lower ones as well: depending on the weight of the vinyl material and the printer's recommendation, you may need to install lower hooks or pins as well).

You'll have a better chance at creating a consistent frame in all of your videos because you'll only have 1 variable: distance of camera from you.

5. Print out the graphics for use. Look for a large-format printer, or a vinyl banner specialist. Consider getting a UV coating on the banner or poster to make sure the color saturation lasts.

6. Store your graphics carefully. Both the foam-core-mounted posters and vinyl banners are somewhat fragile - you don't want to dent or mar them. Imperfections could be visible in your videos (especially if you're filming in HD).

• A portfolio case to store paper posters, like this one: http://www.dickblick.com/products/prat-start-1-portfolio/   
• A cardboard mailing tube or plastic storage tube (like http://www.dickblick.com/products/alvin-telescoping-storage-tube/) for vinyl banners.

Linking Your Video To Your Website Or Blog

Once your video has been uploaded to YouTube, linking it to your video or blog is quite easy:

1. Log In: To your YouTube account.

2. Click On "My Videos" in the pull down link under your user name.

3. Choose Your Video: Click on the title of the video that you would like to display on your website or blog.

4. Get the Link: On the right side of the screen, there are two options for getting links to your video - the first is a link to watch it on the YouTube page, and the second is the code to embed the video player on your site. Since it's often better to keep visitors on your site than referring them to other sites and losing their attention (especially if you're referring them to a site as distracting as YouTube), you will probably want to embed your code in your page.

5. Copy and Paste: this link into your blog or website

• Blog: If your blog software has an HTML window, it will be easiest to open this window and paste the embed link into the code. If not, look in your help files to see how you can insert HTML code into a blog post.
• Website: If you have access to your own site, through editing software (like Dreamweaver, Contribute or even FrontPage), an online editor (like Adobe InContext Editing or Microsoft Office Live), or other means, then just copy and paste the link into the site. If you have a designer who maintains your site for you, then send them the link (or your YouTube account login info if you're going to have many videos for them to post over time), and have them embed the code - it shouldn't take more than a few minutes.

6. Upload and Test: Upload your edited website files and test to make sure it worked.

YouTube makes it very easy to embed your videos in your website.

How To Upload A Video To YouTube

Once you've created a video, the next step is to upload that video to YouTube for web publication. Here are the steps to do that:

1. Download the video from your camera to your computer - consult your instruction manual on how to do this (and, if you've lost your instruction manual, Google your brand of camera for directions). 
2. Make any edits to your video. For example, you may need to cut off "dead air" at the beginning or end of the video. Or, if you need to cut out a piece of your presentation, you can fade the video out and back in again to avoid a sudden cut in the content. You can also add a logo at the beginning of the video, add credits at the end if needed, or add your website's URL to the bottom corner to extend your branding. Good tools for this include: Apple's iMovie or Windows MovieMaker.   
3. Convert the video to a format YouTube accepts. YouTube recommends "QuickTime .MOV, Windows .AVI, or .MPG files." They specifically recommend "the MPEG4 (Divx, Xvid) format at 640x480 resolution with MP3 audio." Your videos can be up to 2 GB in size, and up to 10 minutes in length.
   
4. Log in to YouTube. Or, create a YouTube account if you don't have one yet. 
5. Click on Upload. In the upper-right corner, there is a blue link that says "Upload". Click on this. 
6. Select the (edited) video from your hard drive and hit "Upload Video". 
7. Title and Tag. On the next screen, you enter the title of the video (this displays on the video before it is played), a description, any tags (keywords on the video's content), specify the category and the language. You can also select the Privacy level of your video - for a promotional video, you should select "Share Your Video With The World".  You can edit any of the tags or options later in the "My Videos" menu - which is in a pull-down menu box under your user name.    
8. Hit "Upload Video" to upload the video. This may take a few minutes for slow internet connections or large videos. 

And, that's all it takes to upload your video to YouTube. This may sound like a lot of steps - but I have tried to be pretty detailed about the process. The process tends to go pretty quickly once you're through steps 1 and 2.

Updated Website Design Portfolio

I had a chance over the last couple of weeks to update my website design portfolio with some of my latest work:

http://www.elf-design.com/portfolio-Web-Design.html

And, I have updated my blog design portfolio as well:

http://www.elf-design.com/portfolio-Blog.html

Website Form Generator

You can increase the interactivity of your website with an email form. An email form can help your customers have a conversation with you, and can help you suggest or control the topics of conversation. You can:

• Collect visitors' email addresses for an opt-in newsletter
• Have prospects contact you for more information
• Have clients send in their project-start-up information (like an intake questionnaire)
• Have interested visitors ask you a question or suggest article topics 

Creating a form that emails you its' content can help with all of these tasks and more. But, how do you code the form?

I just found a free online tool that works really well for this purpose: 

http://www.emailmeform.com/?page=fwstep

You sign up for an account, and then it walks you through the process of creating an email form. Then, it generates a simple link that you can paste into your website code, email to your designer, or place on a blog post.

The added bonus to these forms is that they come with CAPTCHA images - those combinations of letters that some forms make you type in. These help control spam submissions.

Try it out if you need to make your website a bit more interactive.