I’m pretty demanding when it comes to the creative look and feel of our website designs, so we only hire the best and the brightest. Still, sometimes that creativity has to be harnessed.

The last thing I want to do is stifle the creative juices of my design staff, but at the end of the day we’re not filming an episode of “designers gone wild”, we aren’t designing websites for ourselves. Believe it or not, we aren’t even designing them for our clients. We’re designing websites for our clients’ clients.

Whenever we bring in a new designer to the team, I usually like to have a “philosophical orientation” to create the expectation of quality design standards. These are typically interactive sessions, but I thought you might like to see my outline:

Website Design 101

I generally start with a list of attributes that I look for when evaluating my designer’s work:

1. Restrained use of soft shadows in the right place
2. Image Interaction
3. Color and shape balance
4. General composition
5. Appropriate design for the industry and the target market
6. Appropriate image selection (meaningful images with the right colors)
7. User friendly (and interesting) navigation
8. Easy to read text (appropriate font, size and spacing)

One surefire way to get the point across is to show actual examples as we explore the finer points of web design. The website we developed for CalPac online charter schools in California is a good example because my designer Adrian did a phenomenal job of tying in all the elements of good design into a package that showcases this online charter school while telling the compelling story to the students and parents of students.

Let’s take a closer look at some of the more subtle elements of design:

Soft Shadows: notice how the slight shadows around some of the basic shapes give them a 3-D feel as they seem to pull away for the page. The use of shadows is very common in web design, but I applaud Adrian’s restraint to not over use them…and in keeping the “spread” minimal so that there is just a subliminal hint of shadow instead of overstated “in your face” wide shadows. The watch-word here is “restraint”.

Image Wrapping: Actually the images don’t technically wrap around each other, but by placing one image on top of the other and allowing it to extend past the edge, it gives the appearance of wrapping behind the base image and enhancing that 3-D effect. Notice on the CalPac site how the navigation on the upper left, and the decorative ribbon on the lower right appear to wrap around the back. Clever and restrained use of image and shadow.

Color & Shape Balance: This is a little harder to explain. It’s also something that is difficult to teach.  It’s more something you have to feel… or sense. Everything on a page has what I call “visual weight”. Colors and shapes can draw your attention…not necessarily by themselves, but in conjunction with each other.

It is typically a good idea to stick with a primary pallet of colors and a secondary highlight color. In this case it’s various shades of blue and green while the photo selection brings in a variety of complimentary colors.  How colors and shapes interact? That’s the part you need to have a gut feeling for.

The other elements in my list are somewhat self explanatory, however there is one more bit of subtlety that I want to draw your attention to. That is the way Adrian treated the navigation. Hold your mouse over the navigation buttons on the Home page and any of the “Enroll Now” buttons. Notice how the colors gently reverse out, signifying that is the button you are interacting with at the moment. Did I mention small eloquent touches?

By the way, here is another article I wrote on my personal blog featuring Six Website Page Layout Tips you Absolutely need to Consider! That article focuses more on the layout aspect of a web page rather than the graphic design elements.

Kreative Webworks, Inc. is a professional digital marketing firm in Orange County California since 1999.  Our website designers are always on top of their game, and throughout the year I will be showcasing and critiquing their work from our website portfolio. Even if you don’t have the patience for my comments, you’ll probably enjoy our website designs.

Unfortunately not all Digital Marketers have your best interest in mind. They typically come in several flavors: Those with current knowledge, those with outdated knowledge, and those who abuse their knowledge. I can’t tell you how many clients came to us perplexed as to why their reports looked so good, yet their phone wasn’t ringing.

Case in point is an article I recently wrote: “Don’t let the “S” in SEO stand for Sucker” detailing an actual client that was intentionally misled by a classic “bait-and-switch” with his keywords. The company in question served themselves a “softball” simply by making long tail keyword phrases even longer in his monthly reports so they can meet their guarantee.

Legitimate Digital Marketing Experts will educate you as to what their strategy is, and not pull any punches as to what you can and can’t reasonably expect. Naturally you should expect a keyword placement report on a regular basis, but understand that is only part of the equation. It shows progress that the SEO Company should be using for themselves to show trends and progress, not absolutes. More to the point would be the actual analytics reports showing actual traffic and what keywords drove the traffic.

Keyword selection should address 4 components:

1. Relevance: Are the phrases that are targeted actually relevant to your business…or just easy to obtain?
2. Popularity: Are the keyword phrases that are being targeted actually searched on in sufficient volume to drive sales.
3. Acceptable levels of competition: Is there a reasonable expectation that first page rankings are obtainable? This is where a legitimate “long tail keyword” strategy comes into play.
4. Monetization: Can you actually make money and grow your business by driving consumers to your website by targeting those phrases?

Do yourself a favor and read Kimberly’s article. And as she says at the end of that article: “If it looks too good to be true…”

QR Codes (abbreviation for “Quick Response” Code) is a digital image that virtually anyone with a Smartphone can instantly scan and immediately go to a webpage, download specific information, add you to their contact list…or go to almost any digital destination. It’s kind of a barcode scanner for everyone.

There have got to be hundreds of different applications for QR Codes. Some are obvious, and some are just functional. You don’t have to be clever…but where is the fun in that? Here are 7 ideas literally off the top of my head:

1: Your Website: This is a bit obvious, so think it through… If your prospect is already on your site, you could give them access to a special mobile enabled special offer page that can only be accessed with their phone. Or you could just set it so they could conveniently download your contact information.

2: Business Cards & Flyers: Sure, this is one of the more obvious places to take advantage of the technology, but there are so many ways you can leverage it. You could link it to the home page of your website, or better yet a “Special Offer” page that can only be accessed through the QR Code. Just make sure it is a mobile enabled page because the only way it will be viewed is on the miniature screen of a smart phone. You could simply set it up to download your contact info into your prospects Smartphone (where it belongs in the first place).

3: Social Media Badges: Why not use it as a profile image on your Facebook business page, or as your Skype image, or as a secondary logo on your LinkedIn profile?

4: Tee-Shirts: OK, now we’re getting clever. Think about your entire staff buzzing around your tradeshow booth with oversized QR codes emblazoned across the front of their shirts. That by itself would be an attention getter… but the sight of other event goers continuously pointing their phones in your direction might garner some attention as well. Linking the QR code to an “event only” special would be the perfect payoff.

5: Menus: A restaurant could simply post the QR code outside the entrance so a patron could just scan and go and check what’s on the menu at their convenience. If the menu is on a mobile enabled webpage it could constantly be updated so the next time the patron checks in, the menu is up to date with the latest dishes and prices. To encourage people to check the mobile menu more often, the restaurateur could post mobile only specials and coupons that can only be accessed through the mobile version.

6: Urban Art: OK, graffiti… Could you really resist scanning some hi-tech tagging on the side of a wall or on the door of your office, shop or store?

Tattoos & Tombstones: Admittedly this takes a bit of commitment. Why not tattoo one on your body? Nothing embodies permanent proof of temporary insanity like a tattoo. Speaking of “permanent”, nothing says forever like chiseling your final epitaph on your eternal resting spot. Now that’s commitment!

Here is a little step-by-step guide on setting up a QR Code. Of course in many cases you might need help in setting up a mobile enabled website or specific mobile web page. Your Kreative Webworks team can help you with that.

Currently about 1 in every 7 searches on the Internet are from a mobile device such as a Smartphone or iPad. By 2013 there will be more searches from mobile devices than from desktop devices. In fact 25% of Internet users around the world are “mobile only” right now, yet few websites are mobile enabled.

This is temporarily a huge advantage for mobile savvy businesses.

It’s temporary because over the next couple of years all serious businesses will be mobile enabled. What is now an advantage will become mandatory. So for now, why is there an advantage?

Search engines try to give the best user experience to their customers. Their customers are people like you and me who are searching for, well…whatever we are searching for. Search engines can detect the specific device the search is being conducted from, and are giving preference to mobile enabled websites over their non-mobile counterparts in the search results when searched from a mobile device.

The consumer of course is not going to dedicate much time to viewing miniature versions of full websites. They have no patience to make the text bigger and move it around the screen so they can read everything. They are not going to spend much time squinting at little buttons that are smaller than their fingertips as they try to zero in on them to navigate to the next page of tiny text and miniature graphics.

Mobile consumers are looking for different information and a different experience than their desktop counterparts.

Just when you thought you got this website conversion thing just right, technology makes another adjustment to human behavior. Traditionally you want to lead your visitors down a “path” or a “sales funnel”. You want to control their experience, but make sure that any information that they may possible want is available on the site. This is true for mobile visitors as well, the difference is the information mobile searchers want is typically a lot less, and very specific.

Understand the mobile user may be on-the-go looking for directions, or knee deep in water looking for a plumber. Understand your customer, and give them EXACTLY what they are looking for… no more…no less.

The most sought after information mobile users look for? Company information, Destination information and Social Media.

OK, now that you understand why mobile website development is so important, and what consumers are looking for, you might want to look into creating a mobile friendly version of your company website. Depending on the complexity of the design and how basic the functions are (and they should be basic) you can generally have a custom mobile site retrofitted to your existing site for $500-$1000.

A few weeks ago I conducted a special “Insiders Guide to Leveraging your Online Reputation” workshop for U.S. and European audiences.

What’s that all about? Well the fact is that people may be saying nasty things about you without you… whether they are true or not. You can’t stop it, but you can manage it.

This is actually more than a lecture; it’s an actual workshop, complete with the same techniques and actual forms that we use to track our client’s online reputation.

The actual workshop is available at: http://wsiinstitute.com/media/ec/cb/Insiders_Guide_to_Leveraging_your_Online_Reputation_-_Flash_(Large)_-_20110812_04.40.24PM.html

I’ve also put together a special edition kit that includes all the forms that we actually use for our clients along with examples of how they should look when completed. If you think they would be useful, just contact us: http://www.kreativewebworks.com/contact.html

People are talking about you without you!

Before the Internet, businesses controlled their public image and message through television, Yellow Pages, radio and print advertisements. But now people are openly discussing your business image, products and services on social networks, review sites, online directories and blogs. Not only that, what they say impacts the buying decisions of your potential customers. During this workshop webinar, you will be presented with a step-by-step systematic approach to evaluating, improving and managing your online reputation. Make no mistake, it DOES MATTER. You can’t stop it, but you can manage it! Not only will you learn how to manage your online brand or personal reputation, but we will provide you with the actual worksheets that we use with our own clients.

There are two sessions to choose from:

Register: Wed, Aug 3, 2011, 8:00am PST *

Register: Wed, Aug 3, 2011, 11:00am PST

*The 8:00am PST session is to accommodate our European audience, so don’t let the 4:00 PM – 5:00 PM BST time on the registration form fool you… both of these sessions are open to everyone.

Note: You will need to use my name, Chuck Bankoff, to complete the registration.

Both of these sessions are free and include our Special Edition Resources Kit which is comprised of the same tools that we use for our own clients.

Chuck Bankoff is Director of Web Services for WSIeWorks, a full service Digital marketing firm in Orange County California.

Here is where I would normally turn the conversation towards content. However there is something even more fundamental I want to address; Usability and Visual Appeal…

Your top banner and navigation layout are major considerations because they will generally be used consistently throughout the site. However the individual page layouts (what is unique on each page) is what adds personality to the site.

• Think magazine…not flyer: Actually think somewhere in between. Print layout is not the same as web layout, but the basic rules of design apply. Flyers typically feature oversized fonts centered down the middle of the page. Magazines are typically more “artsy”. An effective layout combines the simplicity and directness of a flyer with the flair and interest of a magazine. Professional touches might include wrap-around text, multiple columns and strategic (but limited) attention getting devices. Add flair to your layout…not distractions.
• Spacing considerations: Unless you are publishing a term paper online you will probably not want to indent each paragraph. Instead you might consider separating each paragraph with a double space. This technique is cleaner, easier to read, separates individual points into manageable blocks and is certainly more contemporary. Here is an example of a Huntington Beach Personal Injury Lawyers site where we spaced each paragraph in blocks, and actually have each line at about 1.5 spaces for easer reading.
• Text wrapping: Wrapping text around images can have a very professional “magazine-like” effect on your page layout. A common mistake is allowing the text to butt directly against an image, creating an unintentionally crowded feel. Make sure that you use “cell padding” or another technique to create a small buffer around your images so that the text does not physically touch the images.
• Scrolling v. White Space: Decide what is more important, an uncluttered design, or letting the visitor see everything without scrolling. Minimal scrolling is acceptable and preferable to jamming all your content into the top portion of your page. An even better solution is to aggressively edit your content. Visitors inherently breeze through websites with an unprecedented level of impatience. On the web…less is more. Here is an example of site we designed with minimal scrolling. Note there really isn’t a lot of text on this popular healthy lifestyle Edamame website. We allowed the graphics to do the talking.
• Background images and textures: Unless you have an absolute compelling reason to do so, it is best not to use any sort of image background or textures behind the body text. This has a tendency to appear gimmicky and it obscures the readability of your text. It might also compromise the load time (the amount of time it takes for your web page to materialize).
• Appropriate use of Flash: Animation has several advantages, but it also has a tendency to be over used. A little animation can go a long way towards distinguishing your brand or demonstrating a technique. However it can also be a distraction to your real message and cause unnecessary load time.

Try to avoid testing the patience of your visitors with gratuitous eye candy. Moderately animated logos and slogans in the banner of your Home page (or landing page) are great for branding, but once someone has seen it and has decided to venture deeper into your site, there is no point in repeating it endlessly. The repetitive movement would be akin to someone walking back and forth in front of you while you are trying to read. Here is an example of a glass and mirror company in Dallas where we rotated the flash through once, and let it settle on the frame with the written message. It doesn’t rotate any longer and never animates on internal pages.

An example where flash serves a purpose above and beyond branding might be a website that promotes women’s lipstick products where a flash sequence demonstrates the proper technique for applying the product. As a general rule, anything that says “Skip Intro” or “Enter Site” should probably not be there to begin with.

We can influence the search engines and make our cases through Social Media channels, but at the end of the day your own website is one of the few things that you actually have total control over…

Chuck Bankoff is Director of Web Services for WSIeWorks, a full service Digital marketing firm in Orange County California.

The modern interpretation of that is the prospect who took the time to seek you out and go to your website or blog or any number of other web properties. They didn’t get there by accident. They either searched for you, or clicked on an email, or interacted through some social medium. In any case it was most likely through an effort that cost you money or time.

So let’s go on the premise that they were interested enough to check you out, but like the vast majority of initial web interactions, they weren’t ready to take any action. The reality is that they will probably check out your competitors…and do nothing with them either. At least initially…

Thus the reemergence of a technology called “Remarketing”, or the process of marketing specifically to people who have recently shown interest in what you offer.

Here’s how it works:

When a consumer visits your website via a search engine result, pay-per-click add, email link, or even an off-line advertisement, all of which you undoubtedly paid for in one fashion or another, we “tag” them. As they go about their business across the Internet over the next hours, days, weeks or months, we show them your custom banner ad. Your brand literally follows your best prospects around in the places they surf for mere cents per impression (literally a fraction of a penny).

Call us for a demonstration and an analysis to see if this technology can make even better use of your advertising dollars: (949) 481-0728

The cardinal rule of effective web design is to design for your target audience…not yourself. There are of course industry best practices…tempered with common sense.

Websites that are able to stand the test of time have three things in common:

• Appropriate theme for the target market
• Uncluttered design
• Unambiguous navigation

Not necessarily rocket science, however these elements take a bit of upfront planning, and should not be trivialized. Good website design by its very nature is subjective, but bad design is just…well bad. Here is my checklist of what NOT to do:

• Too much Flash: Improper use of flash is gratuitous and may detract from the purpose of the website. Make sure that flash is used judiciously and not just as “eye candy”.
• Pages that are too long: Long pages are subconsciously interpreted as too much work to read. It is much better to break content into multiple, well organized pages.
• Pages that are too cramped: Not everything has to be seen all at once to be appreciated. Too much collocated information is in itself a distraction.
• Unnecessary repetition: Give your visitor a little credit. Convenient navigation is one thing, but force-feeding it to your visitors is something else.
• Too many attention getting devises: If everything is highlighted, then nothing stands out.
• www.WebsitesThatSuck.com: (just in case you need additional clarification).

Contact us directly and we will evaluate how a mobile optimized website might apply to your business.