With the vast amount of text being posted online and via social media these days I thought it would be beneficial to share this very brief tutorial for how (and how not) to style all that great stuff you’re sharing online. These tips apply anywhere you might post text—whether it be in one of our content management systems, WordPress, Facebook, Blogger or even old fashioned MS Word, these simple design principles will help insure your message gets the credibility that it deserves.

1. Learn to use <shift><enter> (Windows) or <shift><return> (Mac) to insert line breaks with no vertical spacing. This practice helps insure you maintain close proximity of related content and greatly aides in readability.
   People often just hit <enter> between lines of text which adds awkward and undesirable vertical space.

   Example using <shift><enter>	Example using <enter> only
   My mailing address: RisingLine 111 S. Broadway St STE 101 Boise, ID 83702	My mailing address: RisingLine 111 S. Broadway St STE 101 Boise, ID 83702

2. Don’t change typefaces (fonts). In fact you cannot change fonts/typefaces in our CMS text editor but many other text editors allow you to do so. The typefaces for your Website are specified in a single Style Sheet that was developed specifically for your site and insures consistency across all pages of your Website. Consistency in the presentation of your content is a cornerstone of good design.
3. Don’t change typeface colors. For a professional consistent presentation of your content the colors are controlled through the Style Sheet. Emphasis colors (such as the color of your hyperlinks) have been selected by your professional designer specifically to harmonize with the color palette of your Website.
4. Use the "font size" selector very very sparingly. Avoid at all costs using the "font size" selector to increase text size. This practice will invariably create inconsistent and amateur rendering of your content which cannot be controlled from the central style sheet. The only reason we retain the font size selector is for those rare occasions where a line of text needs to be reduced in size.
5. Avoid using "U" Underline to emphasize inline text. People will think the underlined text is a hyperlink. Rather use the "B" (Bold) or "I" (Italic) icons to emphasize a word or sentence.
   

   For professional and consistent presentation of your content…
   Do	Do Not
   News and Announcements We are extremely pleased to announce the opening of our second storefront in the beautiful city of San Jose, California. Please join us for our grand opening on April 3rd.	News and Announcements We are extremely pleased to announce the opening of our second storefront in the beautiful city of San Jose, California. Please join us for our grand opening on April 3rd.

6. Use the "Format" selector to change heading text size and create a logical hierarchy of content. Using this method allows consistent presentation for your site which is controlled by the Style Sheet.

.Com instead of .Net

This first guideline is the most absolute of them all—never use a .net domain as your primary business domain. The reason a company considers a .net domain is almost always because someone else already is using the .com version of the domain. Usability studies have proven that when someone hears or reads a domain name, by the time they type it in their Web browser they’re most likely going to type .com anyway. If you do choose to go with a .net, be aware that a huge percentage of the branding expense and effort you do for your Website will benefit the .com version, not yours.

Sometimes people see that their .com is not currently developed and assume that since there is no site on the .com the .net is a viable option. In these cases it’s even more important not to choose the .net. A domain squatter dreams about a company investing a ton of money into developing and marketing a Website on a .net for which the squatter owns the .com. It raises the value of the .com significantly and it’s very easy to squeeze the .net domain holder into paying an exorbitant price for the .com when the squatter puts up a porn site.

This means that even though there is the perfect domain name available (such as mycompanyname.net or myexactkeywords.net) you’ll be far better off to select a .com even if it’s not as desirable of phrase. Our upcoming posts will shed some light on how to do that.

While there are many important factors (both on the client and developer side) there are two all-powerful prime lynchpins that will make or break even the most qualified participants: Perspective and expectations. Some time ago I made a blog post on perspective, in this second of two posts I’ll discuss expectations.

Expectations

Success in almost any transaction or relationship is determined by establishing and meeting a set of shared expectations between parties. A $3 meal at a McDonalds can be just as successful as a $200 meal at a Smith & Wollensky Steakhouse. The same degree of success can be realized at both regardless of the vast difference between a dedicated waiter serving dry-aged prime beef and a mass produced sandwich handed to us in a crumpled paper bag. It’s all about us getting what we expect.

When a client and developer view a project from a shared perspective, setting expectations is the natural progress of collaboration. Without the collaborative systematic development of a set of shared exceptions we risk orchestrating an iPod dance party. Both parties may participate but they’ll each be in their own world and when the music stops they will have completely different perspectives from which to determine success.

Developing a shared perspective is the responsibility of the developer and starts with listening, interrogating really (in a nice way, without the light), to the client and extracting the core business goals of a project, the details of the client’s unique value proposition, the needs and profile of their customers and other such vital information.

Provocative and challenging questions should be presented to the client in this stage to help them gain an outside perspective and the developer needs to be willing to adjust their biases so that in the end there is an unambiguous meeting of the minds about the project goals. In addition to the primary goals, there are many technical parameters that need to be discussed and agreed upon including development environments, creative parameters, branding continuity, etc.

After goals and requirements have been collaboratively determined, the developer is responsible for drafting a formal systematic development process that articulates the specific developer tasks that will be provided to meet those goals, and establishes a work-flow time frame for project completion.

All of this is not that profound or new. It’s really just common sense. But from my observation, the temptation is often great to gloss over a formal development of a shared perspective and expectations. It’s usually in the context where the client and developer develop good initial rapport and feel confident that they’re “on the same page.” Feelings are great but Web development projects are too complex and expensive to rely on luck for success.

If your visitors become confused about what your site is about or how it applies to them, they are likely to just leave and look elsewhere. The goal of your front page is to allow visitors to qualify themselves as prospects for your business or organization and to proceed through the sales process by accepting a call to action that you offer.
Actions can include purchasing online, contacting you for an appointment, subscribing to your newsletter/blog or whatever the specific next step is in your sales process.

The Essential Questions Visitors to Your Site Will Need Answered:

• What do you do? One of the most common mistakes that sites make is not being clear on exactly what they are providing. The more complex of solution you offer the more important it is to provide this answer in easy-to-understand language. The essence of what you do should be the basis of your organization’s mission statement, but answering the “What you do” question will also include the specific products or services  you’re offering.
• Why you do it? This is related to an organization’s vision statement but needs to be expressed in concise language free from industry jargon. Telling visitors “why you do it” is a means of establishing credibility and positioning yourself as an expert adviser for recommending a solution to their needs.
• Why are you the best choice? This question is the most vital for new prospects and should be answered by your unique value proposition. Your unique value proposition is simply a concise statement of how you
  meet their need better than anyone else.  In addition to stating your unique value, you need to back it up with real-life examples. The most effective support will be testimonials, portfolio’s of your past work, and third party reviews or endorsements if available.
• What can I do? This is the question you want most asked because it means your visitor is satisfied (or at least intrigued) with the answers to their first three questions. They are asking how to proceed through your sales process. This doesn’t mean they’re necessarily ready to buy, but they’re willing to take a step closer. Your site needs to present unambiguous action items for your customers to answer their question of “What can I do?” by providing conspicuous “call to action” links in the body of your front page and the navigation menu.

How To Provide the Answers

Here are a few key principles for answering your visitors’ questions :

1. Be concise. Paragraphs of text on your front page will bury the answers to your visitors’ questions and result in a high abandon rate. Your front page, and navigation bar, should be thought of as a map that clearly directs people to more detailed information on the destination of their choice, without them having to think twice about their choices. While, supporting pages will provide more detailed answers the still must avoid verbosity to be effective.
2. Communicate in layman’s terms and avoid your industry’s jargon. Realize that much of the internal language your organization uses may have no relevance for your visitors.
3. Provide clear call-to-action choices for all types of visitors. The fundamental questions presented above provide answers for newly aware prospects through “trial” or first-time buyers. If you anticipate clients, customers with an ongoing relationship with your organization, to be frequent visitors you need to accommodate the needs of these visitors. Other visitor types can include press, investors or employers. The answers to each type of visitor questions need to be presented in proportion to the importance they have towards achieving the overall goals of your site.

So, with that preamble, here are a couple easy ways to reduce your Web development, technical service and graphic design costs:

Maximize the value of each change request

Like almost all Web development and design firms, we have a minimum 1/2 hour charge for any job. This is due to the fact that to switch to a new client’s project, for even a small amount of work, compromises the efficiency of our day’s work flow and imposes an opportunity cost. We have to transition from another project, “retool”, login to appropriate accounts, backup data before changes, post changes, often test the changes (for example in different browsers) then communicate back to the client regarding the work.

The key for clients to realize is that once we have initiated a change request, the incremental cost is much lower for us doing other small changes while we’re already working within a client’s account. For example take a client who sends over three Website content change requests during a week. Each change may take 10 minutes of actual coding, but if they send those requests at three different times they would get billed 1.5 hours. If they save those requests and send them all at once they would only get billed for 1/2 hour or 66% less.

This strategy of course has the most dramatic effect for small changes that are not extremely urgent, and can most commonly be applied for changes for Website content. So if you find yourself with numerous small changes throughout the month, simply try holding them in an Outlook folder or whatever and sending them in groups.

Save 15% by prepaying

We now offer prepaid hours with a 15% discount off our standard rates. There is no minimum quantity, you can use them immediately, they never expire and unused hours are 100% refundable. You can also track your prepaid balance real-time through our online client portal.

Save up to 40% through our flat-rate retainer plans

For any client who regularly gets at least two hours of service from us a month you will save a significant amount of money through our flat-rate retainer.

Skeptical?  Download our Retainer Savings Calculator and run your own comparison scenarios. (If you need help running scenarios just let us know).

Not only do you receive a substantial discount on the number of hours in your plan, you are also entitled to a discount on additional hours each month if you should need them. Flat-rate retainers are paid in advance of each month. Additional hours are billed at a discounted rate of your hourly retainer rate + 20% and payable net 15. Unused hours in flat rate plans are not refundable nor carried over to the next month. Retainers automatically renew but can be canceled at any time.

If you have any questions or would like us to personally review your ongoing service needs and provide recommendations please feel free to contact Doug Case by phone at 208.475.3192 or through our online contact form.

Unlike print publishing, soft-copy (digital based) publishing relies on the recipient of a document to have the same font installed on their system as the designer. If the recipient’s system does not, a substitute font will be used that will cause the document to appear quite different from what the designer intended.

You likely have received a PowerPoint or Word document which when opened had strange spaces, line breaks and page breaks. More than likely, this document looked much better when put together, but the author failed to embed the fonts before sending off the document to your system.

Embedding a font means including the font files within the Word document (or whatever) thus allowing the recipient’s to view your publication with its intended fonts, even if they don’t happen to have those fonts installed on their system.

No embedded fonts for webpages

While embedding fonts is a great solution for insuring design integrity when emailing Word, PowerPoint and Adobe Acrobat documents, it’s unfortunately not an option for HTML coded Webpages. This means that while there are estimated to be up to 100,000 digital fonts (see: http://www.microsoft.com/typography/links/ ) there are only a handful of fonts suitable for body text; fonts that are common to 90%+ of all PC’s and Mac’s in the world. My short list of those typefaces is below:

Windows font name / Mac font name

• Arial / Helvetica
• Trebuchet MS / Helvetica
• Verdana / Verdana
• Georgia / Georgia

The good news is that deciding which font to use for your Website body text is going to be easier than you thought.

The case for Helvetica (or Arial for Windows)

The Arial / Helvetica combo of typefaces is the de facto standard for professional Web presentation. Helvetica is an icon of contemporary design that is synonymous with professionalism. It’s an undisputed fact that a majority of professional copy is presented in Helvetica typeface (or a close variation). Look at any major magazine, sign, or advertisement; the publications of design leaders like Apple and the New York Design Center; the productions of polished professional brands like Crate and Barrel, Target, Macy’s, or Nike . . . Helvetica is used in their marketing material a majority of the the time. Helvetica is so prevelenat within marketing, it recently became the subject of it’s own full length film.

Helvetica is a great typeface because it so efficiently achieves the goal of graphic design. It provides an unpretentious backdrop of credibility to your unique value message without drawing attention to itself (and thus drawing attention away from your message). Helvetica provides a great “off white” canvas on which your message can be communicated professionally and concisely.

Selectively using other typefaces as graphic elements within your Webpage

While there are only a few font choices for body text, we can selectively create text using other fonts by converting that text to a graphic and then embedding that text as a graphic in a Webpage. With a neutral body font like Helvetica, the “feel” of the featured graphic font is conveyed quite well. For example we can set the font face of headers, menu-items, front page “ads” or call-out text sections in a different typeface.

I hesitate to say that “any” font can be included with this method into a Webpage. One of the tell-tale signs of amateur design is the inclusion of too many fonts of differing styles. This is fine for personal home pages, Facebook or cottage industry newsletters but if our goal is producing professional grade best-practice publications the rule of thumb is to use as few typefaces as possible and then use those variations sparingly.

Only choose to use an alternate typeface set as graphics if you can articulate the reason this addition would add value to your design and increase the clarity of your value proposition. Graphic rendered typfaces have some downsides, namely they add to the load time of your page and the text within the graphics is not indexed by search engines.

In conclusion

Be aware that unlike other types of publishing, you really don’t have much a of font choice when it comes to the body text of your Website. Unless there is a compelling reason, Helvetica / Arial should be your default choice. The other options listed earlier (Trebuchet, Verdana and Georgia) are also viable options.

Any typeface can be converted to a graphic and included within your Webpage, however this method should be used with caution and in consultation with a professional designer.  If you have questions or comments on this article, please don’t hesitate to share them.

While there are many important factors (both on the client and developer side) there are two all-powerful prime lynchpins that will make or break even the most qualified participants: Perspective and expectations. In this first of two posts I’ll touch on perspective.

Perspective

Unfortunately many Web development request for proposals I see are in reality an afterthought or addendum to an already established business model. A common misconception is that a Website or application is some sort of magic accessory that will improve the effectiveness of any business to which it is applied. Revenues down?  Slap up a new ecommerce storefront and watch the numbers climb. New customers declining?  Have your existing Website optimized for search engines and all will change. We refer to this as the Field of Dreams syndrome or the “If you build it, they will come” mentality and it is probably the number one cause of failure and lost effectiveness for Web development projects.

The most essential key to a successful Web development project is not about the Web at all. It’s about defining a competent strategic perspective and then determining the optimal role a Web asset should play within a business’s overall strategic business plan.

A Website, even when built with cutting-edge technology and top-tier design, can at best only reflect the real value that your business offers. Conversely, a high value solution, even when wrapped in subpar quality design and development, can be wildly successful. There’s no better example of this than plentyoffish.com which serves up an antiquated template design, a blurry logo with a tagline too small to read, and a site full of distorted images — all while earning over $10 million of year with only a staff of a few people. Plentyoffish.com focused on the essentials of business and has proved its truly unique value proposition to its market space.  (see And the Money Comes Rolling in, Inc Magazine)

Don’t get the impression that quality graphic design and Web development aren’t important . . . they’re critically important. They just have to be backed up by legitimate value. Very few sites, even those offering stellar value, can get away with sub-par design and features; sites like plentyoffish.com and craigslist.org might but they are definitely an exception. In fact Stanford University reports almost 1/2 of the new visitors to your Website will make an immediate judgment call about the credibility based on your Website’s presentation alone. So, the optimal approach is to first develop a business plan that delivers unambiguously unique value and, second, deliver that value proposition professionally including quality design and Web applications.

So for a client and developer to position a project for success, they need to both commit to intense reality therapy so they can view the project from the same, or very similar, high-level and objective perspective. This can be tough for a number of reasons. On the client side it’s often more than they bargained for and they’re not prepared to invest the time and effort into delving so deep into the soul of their business just for a Web development requirement. They may agree intellectually that it requires a thoughtful strategic approach, but succumb to the “just get it done and off my plate” urgency while fooling themselves into thinking they’ll come back and fix it later.

On the developer side of the coin, it requires a commitment to a deeper type of relationship than that of just a self-interested transactional service provider. The developer needs to define themselves first as a business advisor and secondly a service provider and then only for those services in which the developer can represent themselves as an established expert. It’s only if the developer can truly be objective, and not threatened about recommending 3rd party involvement, that a genuine shared strategic perspective with the client can be reached.

To be continued . . .

No, it’s not RisingLine.com (although I have to admit I think quite highly of that design), and before I continue I should disclose that I have absolutely no ulterior motive in praising the site I’m about to mention . . . no referral fees, or kickbacks of any kind.

So enough with the rambling, MediaTemple.net is the site to which I am directing my compliments. The first thing a visitor to their site will notice is that graphic design is extremely powerful but not overpowering. . . minimalist, detail oriented, clean, modern, just plain classy. It does what a graphic design is supposed to—provide a professional backdrop to the content of the site which beams credibility without distracting from the message.

I have to assume by the continued proliferation of shabbily designed sites on the Web that many don’t realize just how important design is. As we like mention, over and over, research has shown that a shockingly high percentage of people make a judgment call about the credibility of a company within seconds of visiting a Website based primarily on the graphic design (see the Stanford Web Credibility Research site for more insight on this topic). While my high school history teacher did not find it amusing when I offered to turn in a picture instead of the assigned 1,000 word essay, it really is true that a picture (or for our purposes a design) is worth a 1,000 words of credibility, and all that communicated in the blink of an eye.

A very common misconception is that an effective design is one that has a lot of swirls, colors, moving things and flashy graphics. While those types of sites might be appropriate in some instances (although I can’t think of any of the top of my head) professional Websites have a demanding purpose to concisely communicate value propositions and persuade their prospects to buy. Much Web design we see out there does more to distract from those goals than reach them. Media Temple offers us a great example of a well refined goal-oriented design that delivers their message with just a touch of panache.

Even the best graphic design is of no real use without concise messaging, clear communication flow and easy to understand navigation. These disciplines are collectively known as usability and are achieved exceptionally well by Media Temple. What’s even more impressive in this accomplishment is that the unique value of Media Temple’s hosting solutions are considerably more challenging to communicate than their competitors because they really are unique. Media Temple provides virtualized hosting accounts that are spread across a grid of resources as compared to the typical shared hosting company that sticks customers on a server in their farm to fight with the other squatters for finite resources. Based on my experience using their product, Media Temple’s solutions live up to the grand impression they make on their Website.

While I’m not going to get into the details, the usability of their client-side administration panel and knowledge base impresses me even more than their front end. I recently spent some time in Media Temple’s Grid-Service environment testing the CMS platform we develop on (coincidentally their hosting platform provided the most consistent high performance of any of the many shared hosting environments we’ve tested in) and I had a hard time tearing myself away from their administration panel when our project was complete.

Hats off to Media Temple for their great achievement and many kudos for providing us all a great example of what the Web should look like.

Without design being part of a holistic strategic approach to communication, it becomes impotent. A site with no design will trump the most artistically original site if the former has quality content and offers intuitive and easy to use solutions to its target visitors needs. The classic example is the most visited and arguably most successful Web site in the world: Google.

Web sites are a lot like people, their success is ultimately based on the value they contain, not their outward appearance. This is vital to understand so that design is put into its proper place. Web design is still important, it just has to be the dressing for content of real value.

Google is like one of those geniuses who are so recognizable and brilliant that they can get away with wearing an old t-shirt and jeans to deliver a key-note speech. It’s fair to say the brilliance of most of us is not as common knowledge.

Web design is the same, once the foundation of quality content is present, professional and usable design is an excellent catalyst to facilitate communicating the value of your site. In my next post I’ll get into some specifics about our philosophy and methods for designing Web sites that are modern, appealing and clearly communicate the values of your organization.

As ridiculous as this example sounds, it’s exactly what happens many times on websites. We find a site in a Google search that looks like it might be what we’re after, but on its front page were confronted by too many snippets of ambiguous information and distractions and no clear statements of what this site is about.

One of the most ludicrous distracting features that I’ve seen recently is “SitePal.” A zombie-like animated talking head that speaks in slow broken computer generated speech…”Welcome (octave lower) to our Website (two octaves higher) Please mouse over my (pause) face to make me talk. What’s even creepier is that on some versions the characters head slightly bobbles and it’s eyes cross as it attempts to follow your mouse movements.

Having some sort of animated or technical feature on a site can be tempting for its novelty factor. But just because something can be done does not mean that it should be done. Research has consistently shown that superfluous elements are often detrimental to the overall communication and persuasion goals of web sites. For
access to solid research on the topic visit the  Stanford Web Credibility Research site or, in keeping with the theme of efficient communication, check out the all-time classic, Don’t Make Me Think, by Steve Krug.