Showing posts with label web pages. Show all posts
Showing posts with label web pages. Show all posts

Wednesday, March 26, 2008

SEO Illustrations

After piecing together the post on Universal Search, I decided to take my own advice to see how others had illustrated the SEO/SEM process. It's harder than you think to illustrate a 3-dimensional, really 4-dimensional, process for those who are not at least somewhat familiar with how the dynamic mechanisms of the Web works. I hope these guys don't mind a little link love.
Here is the one that caught my eye first.

The illustration is from RedalKemi.com
That's really not a bad. You can take a look at it if you like. I'm just studying how the process is illustrated.
The diagram clearly illustrates the benchmarks. (Benchmarks is a project management term for issues that must be resolved before continuing with the project.) Time is implied from top to bottom.
There are a few unclear elements. CORE is a neologism from the marketing department. The initials LB and AS stand for Link Building and Automated Submissions, respectively. The website explains the terms and process in some depth, although for clarity the image could be made into a link map. There could be some confusion over whether AS stood for AdSense or Automated Submissions, for example.

This illustration is from the Center for Citizen Media blog.
Obviously, not everyone approves of SEO. I'm not sure which step the author disagrees with most: overaggressive marketers gaming the system or Google closing the loopholes and dinging the sites that break Google's rules.
It can be argued successfully (I can show a couple of examples offhand.) that marketers are creating better content and more timely content. The support for Google comes down almost to prejudice and politics. Will consumers revolt because content is more relevant (more informative and timely)? Is any of this destroying the Web? If you think of the Web as a young mind, then Google's Relevancy efforts are the way a child matures by learning and testing rules.
The philosophical and political arguments can go on and on.

As a marketing tool, this illustration from the Before Your Interview blog is great. Although it appears to be 2-dimensional, it's really linear; more correctly, circular.

It's intuitive and easy, and allows the presenter to discuss many issues in the process. It's attractive. The bright colored arrows catch the eye. The use of whitespace is good.
Despite the large numbered steps, it's a little unclear where to start. And where to finish. In a way, it deceives the intuition a little. There is less of an attempt to illustrate the details of the process than to allow the presenter and client to discuss the steps.

This illustration is from the Quality Nonsense blog.

Great stuff, huh?
Check out the blog, too. This is not True Confessions - more like a Letterman monologue.

You can quickly see the purpose of this illustration from PRomoting Webs site.

The colors are vibrant. The terms used are familiar. But for my purposes -to illustrate the SEO/SEM process, it's only marginally useful.
This could be an introduction of a Powerpoint presentation. Topics are essentially listed in a creative presentation of an outline.
There's no meaningful timeline. 'Strategy' is a slide title; not a step.

This illustration from Bristol Bath Exeter Plymouth Online web E-marketing gets into more depth. But it's so unclear about the presentation an arrow is required to indicate the flow of time.

That's too plain to really catch the eye. In fact, it's a little hard to follow for the uninitiated. There's no question the presenter means business though.

Now, this is a marketing plan! - from ProBlogger right here in Australia.
That's not an illustration. It's an ambitious plan that states goals. It doesn't say much about how those goals will be achieved. Nor does it illustrate recursive steps. This guy wants it all, and NOW!
Combined with a couple of the other illustrations, it could be very effective. To accomplish those goals though, this guy needs to assemble a team. Wonder if he needs an SEO Consultant?

In the light of the introduction of Universal Search, and presuming the quality of illustration will improve, - none of these illustrations is very impressive. In different circumstances -different clients, where the illustration appears, and style of presentation or presenter, all of them could be effective to explain the process.

This illustration from Inventa Technologies is a little too complicated.
'Development' is really a title. My first thought was to animate it like a roulette wheel. Those small arrows in the center are unnecessary. Some of them are even off-center, too. It's a good list of the initial steps for SEM. It's businesslike (which means the colors could be brighter), but where is the starting point?
The arrows between items seem to indicate each item is a benchmark. They're not. Keyword Selection doesn't have to be done before Site Architecture is done. The list is organized more for the developer than SEO.
I can't escape the feeling this illustration needs animation, and maybe some mouseover effects.

I'm going to finish this little exercise with an illustration I like from the Huntas search engine.
Vibrant earth colors dynamically arranged with energetic lettering, the illustration demands attention.
Overlaying circles suggests topics affects others; and a sequence. To emphasize the sequence, small arrows link around the circles. Although details are missing, the sequencing is accurate. You do have to Optimize a web site before you Submit web pages, for example.
It's a distinctive design, yet businesslike. A student of design will tell you those are Southwestern colors, which have become acceptable throughout the world for business. So the designer kept within the expectations of their audience.
The 2-dimensional design illustrates time effectively. The illustration is intuitively clear and could stand on its own. It requires no presenter or additional text to get its point across.

I hope you've enjoyed my review of some of the design efforts to illustrate the SEO/SEM process. Let me know what you think.

PS If representatives of any of the authors or sites wants their illustration removed, feel free to contact me. I'll remove it instantly along with my comments.

SEO/SEM in Australia is a special issue for so many reasons. Join me was we explore. It will be a fascinating and informative journey. Sphere: Related Content

Tuesday, March 25, 2008

The 5 Whys

Go to Ask (formerly Ask Jeeves) and type in "Why call a cable installer?"
The first thing you see is the sponsored links. The sponsored links give the following reasons:
  • Install Broadband: Same day or its free
  • Telephone systems installation and maintenance for all businesses
  • TV Installations (7 days): Plasma, LCD, Home theater installs; Flat rate Sydney (and a phone number)
Yet if you ask a cable installer why someone will call them, they'll tell you about their qualifications; the quality of their work; the quality of their tools and materials.
Why does someone call a cable installer?
  • Because they want their broadband working for more rooms of their house.
  • they want a new phone installed;
  • they want their present phones to work better;
  • they want a new television or home theater installed.
  • Or there is a service broker who wants you to put your job up for cable installers to bid.
They don't call a cable installer because he has great qualifications or uses good tools and materials. If you look down the page at the search results, you'll see a lot of DYI kits, places to buy cabling supplies, and cable installer horror stories.
Only one cable installer for every two pages or so. Other than the Sponsored Links, there isn't one cable installer on the first page of results.

It's a good thing Jeeves is retired. Ask doesn't seem to have the answer to "Why call a cable installer?" really. Or do they?

The 5 Why?'s
Ever had a little kid see you doing something and ask, "Whatcha doin'?"
You explain, trying to keep your mind on your work, and the kid says, "Why?"
You put aside something, and patiently explain why you're doing what you're doing; and the kid says, "Why?"
About here you're thinking, "I've got to explain this.", and set aside your work completely to give a long winded answer you hope (emphasis needed) will satisfy the kid's curiosity. - And the kid looks at you and says, "Why?"
This time, you're gonna have to reach. Your answer may take in social issues, politics, and maybe even religion. But those soft young eyes meet yours again with "Why?"
This has become a test of wills and character. Most people just tell the kid to go away. Some enlightened types might realize the kid just wants attention. A hug and a tickle satisfy the real reason for all the questions.


Like the kid, Customers don't want to hear all the answers to Why. They just want their needs fulfilled. Those Sponsored Links are speaking directly to those needs. In fact, they are saying what marketing research tells them is the most likely reason someone calls a cable installer.
  • One customer may want broadband installed, and today.
  • Another might want a telephone system installed.
  • Another wants their new plasma TV running, or a home media center connected.
The Sponsored Links are speaking directly to the Customers' needs. (Let the rest go find what they can in the search results.) Neither the business or the Customer has the time for 5 Why?'s.

Speak to the Why?'s
(All puns intended.)
The authors of these ads are speaking directly to why the Customers they want will call a cable installer.
But take a closer look at the wording, and consider the targeting.
The top and bottom ad are more likely targeted towards home owners or home business. The mention ADSL, same day service, and a list of home entertainment devices.
The one in the center is targeted for business. It says so clearly. And its terminology is more formal, "installation and maintenance." Home owners install; they don't get an installation. And very few home owners worry about maintenance (unless its their garden or divorce.)
Although there is no reason a business wouldn't want a plasma screen installed or same day service, that's usually not the first consideration. The Customer doesn't have to ask why. They see what they want, click on the ad, and it's instant gratification.

What has happened is the authors of the ad asked themselves Why? a few times. There is an old marketing homily that goes: Ask yourself Why 5 times (to understand your Customer)
The authors asked themselves Why? five times to understand the reasons their Customers wanted the service. If you look at the ads, it works pretty well. They don't talk about experience or qualifications. The text talks about the needs and wants of the Customer.

Web pages
More than likely, 1/2 of those ads are linked to a landing page. Google frowns on landing pages. The landing page speaks directly to the content of the ad. Landing pages are optimized to respond to the ad. The page probably has contact information and a form to book a cable installer. At most, contact information is one click away on another page.
There are small differences in a landing page though. A landing page is not permanent information. It's built just to absorb the production from the ad. One of the main reasons for this is to track the efficiency of the ad. Usually, landing page content is duplicated on the main site.
The landing page may be part of the market research. The company may want to know the effectiveness of different wording for the ad; or whether an image ad is more effective.

If one of the company's main services is cable installation however, there's no need for a landing page. The ad link takes them into the website where a page is optimized for the same Customer needs.
The difference is subtle, but important. If the company does cable installation, the page may not speak as clearly to the Customer's needs from the ad. There may be more information about other Customer needs and wants. Or the page may describe the company more than the need expressed in the ad.
This page will answer the question more fully "Why call a cable installer?", but may not be so clear about answering the Customer's needs. (Unfortunately, neither did whoever took over for Jeeves.)
A very valid question is: Why doesn't this page appear in the search results (SERPs)?
The answer to that is gonna have to be for another time, but try the same search "Why call a cable installer?" on Google or Answers.com. Hint: The reason has a lot to do with Relevancy and tagging.
At the end of the day, "Why call a cable installer?" depends on why you are asking, and who (or what search engine) you ask.

SEO/SEM in Australia is a special issue for so many reasons. Join me was we explore. It will be a fascinating and informative journey. Sphere: Related Content

Friday, March 21, 2008

Web Design 101 - Second Period

It didn't take long to get a response to this:
I am, by my own admission, a lousy web designer.
"Well, what kind of web designer are you then? The stuff in that article about Wired didn't sound very professional. It sounded like a bunch of techie BS to me."
-- Fair enough.

I'm a technical web designer. I pay attention to things like above the fold, easy navigation, hot spots, and how the visitor's eyes will move down the page to get information. Which, of course, means I often use templates - which I hate. I hate templates for the same reason I hate modern cars. They all look the same to me.

Above the Fold
The Above the Fold concept grew out of studies of visitor behavior. About 60% of visitors to a website never click down the page. They scan what appears in their browser window, if that's not what they want, they move on quickly.
Let me take a random example from the Web. This is the Oklahoma Bar Association website.

That's what appears in the browser. It's what is 'above the fold.' If the visitor clicks on the scrollbar on the right, they'll see:
Unless the person needs something specific from the Oklahoma Bar Association, and knows it should be there, less than 30% of visitors will ever see that second fold.
That means less than 15% of visitors to this site will ever what is on the two folds below, too.
Above the fold, you have to identify yourself, say or show something of interest, and offer visitors somewhere to go - or you've lost them.

Hot Spots
Take another look at the first page of this site. It's an attractive page: businesslike, and appealing. There is some energy to the presentation. That's important.

(Note: My apologies to regular readers. I'd intended to put this graphic in place initially, but had misplaced the software.-PD)

Where do your eyes go first? and then? And how does your attention move down the page?
If you're like me, they went momentarily to the logo in the upper left, then quickly to the colored navigation on the right. A quick scan of that list -maybe the first 3 or 4 items- then across to the navigation on the left. A slightly longer scan there, then a look at the article headlines. - And back to the colored navigation on the right!
The Hot Spot on that page is the flashy navigation on the right. It draws attention from everything else. The eyes keep going back there no matter what you're looking for.
If what the visitor is looking for isn't on the navigation, they might find the Quick Links drop down or the Search bar.
The movement of the eye is probably more easily seen in the reduced image.

Navigation
The Navigation is in the colored areas. The eyes are drawn to those colored areas, even though the site uses text links. And there's a little stickiness. See the last link on the right? Every other link is capitalized except 'my okbar'. Personalization.

That's actually the 'Tips' page. Take a look at the homepage for a second.
Where do your eyes go? Again, right to that navigation on the right. But they quickly shot over to the Mock Trials article, didn't they?
There is no second fold here. All you see if you scroll down is the footer with a the copyright and contact info. This page is designed completely above the fold. Did you notice there is a new link on the right to quickly look up a case? Probably not until I mentioned it. You'd have to be a member of the site to use it because it requires an ID and Pin number. Again, stickiness through personalization.
This whole page is navigation really. It moves you quickly to where (is assumed) you want to go.

All of these concepts are technical aspects of web design. This is hardly an award-winning creative site, but it is a very good design for useability.

Color
One key aspect that is often overlooked is color.
Imagine picking a color combination for a plumber. You might ask the customer what their favorite colors are; but will probably prove fruitless. Most people will say either blue or green, which doesn't tell you much.
You might try to consider the meanings of color. What can you say about the company using color? Or, more professionally: What does the visitor want to see?

One technical method is to turn a color wheel. Choosing appealing color combinations from a color wheel is easy. Just look for combinations at muliples of 30 degrees.
Adjacent colors harmonize. Colors separated by another color are contrasting colors. You may also see these referred to as complementary. Red and Green are contrasting colors. The more transitional colors separating two colors, the greater the contrast. Colors that are directly opposite from one another clash.
The there is the limitation of 216 web-safe colors.
In the end, the web designer usually has to prototype a few pages with different color schemes, although none of the examples will probably satisfy the eye of the discriminating plumber.

If a designer wants to be a little New Age about it, they might apply the principles of Feng Shui to the colors and patterns. (Maybe another time...)

What meaning do the colors on the Oklahoma Bar Association pages convey? There aren't many: grey, crimson, black and white.
This should have been an easy one for the designer. In this case, a combination of color confers the meaning. Grey and crimson are colors associated with learned academics, graduation, and scholarship around the world. These colors could even be taken from the traditional formal robes of the legal profession.
The swish of crimson on the right mimics the drape of crimson underrobes.
Keeping the text black on a white background maintains the business like appearance. Can you imagine the text in blue? It would be inappropriate, maybe even garish.
If a little more energy were needed, the colors of the text might be alternated between black and dark grey. But that sort of distinction is unnecessary here.

Individual colors convey meaning, too.
Grey is a neutral, balanced color. It is a conservative color. It is the color of formality, even mourning.
Red is power. Business people wear red ties. Celebrities and VIPs (very important people) walk the red carpet.
The combination confers a subtle message beyond the traditions.
And these colors are not overused. There is a lot of white space, indicating openness - something the legal profession always strives for, but fails because of the arcane nature of their training.

Gestalt
The Gestalt of the web pages indicated here is consistent. It is reinforced by the symbol of the legal profession: the scales of justice in the logo position. There are four Gestalt designs. Which of these applies to the web pages illustrated above?

These concepts:
  • Similarity
  • Proximity
  • Continuity
  • Closure
  • and All Together Now
..are psychologically hard wired into our brains. The interpretation of these patterns bridges cultures and racial divides. When the information on a web page (or any other document) doesn't respect these principles, it is seen as awkward or distasteful.
The same sort of gut level reaction is invoked when a website adheres too closely to one of the Gestalts. Consider the dark interfaces of many gaming sites. In an attempt to convey Continuity, the sites often evoke Closure and too much 'togetherness' (All Together Now). These interfaces seem to drain energy from the viewer. (For example, take the 'All Together Now' pattern and fill the remaining squares with black.)

Images
Images are a part of every website. The old saying about a picture being worth a thousand words is only true on the web for the visitor, not the search engine, -- but still holds true.

Logos just don't cut it. There are few really memorable logos anymore. Logos are often stylized to keep them simple because most people will remember vivid abstractions. Other than traditional icons though, most logos have lost their meaning.
Images of people in some sort of activity are best. Visitors identify with the people and the activity in an image far better than telling the story in text.
Animated images can be easily overdone. Unless the animation is necessary to illustrate steps in a process or provides interactivity, they're usually best to avoid. Animated images just to provide movement make the web page look like an intrusive ad. The animation can quickly draw attention from the important information.
As a trainer, I've trained people to make animations in Photoshop and Flash. I always caution everyone not to rely on them. For one thing, to date no search engine can read either format.
How do you place images on a page? - Refer to the Gestalt section above.

Expectations and Surprise
Websites, more than individual pages, have to conform to visitors expectations. A business site has to have a logo and a title bar - even if the title of the page isn't in the title bar. The logo should be a link back to the homepage. Navigation from every page should be clear from every page on the site.
That doesn't mean every page has to be the same. In fact for many reasons including SEO, every page shouldn't be too similar. But too many changes may make for unwelcome surprises that confuse visitors.
Small surprises are acceptable. Take another look at the illustrations of the Oklahoma Bar Association website. The homepage has the logo and title bar, with a quick login to reference material. The internal pages change slightly. These pages have additional navigation hints on the left and breadcrumbs at the top.
If there were a general rule for changing the look and feel of a website, it might be to limit such changes to navigation.
Changes in color -for text, title bar, or background- to distinguish different parts of a website have to be done with caution. Colors convey different meanings. And no one can predict how different browsers or monitors will display some colors.

You are what you publish
What kind of web designer am I? A technical web designer. One who applies these principles and ideas above somewhat resentfully to my work. I pay attention to the goals of SEO and SEM when I design a site.
I told an SEO client recently: "I can tell you the reason for every word on (your) website." I had to hold my tongue from saying it would bore him to death if I did.
There is a great deal more that can be done with web design.
Web design has only begun to explore the dimensions of Web 2.0, for example. It's exciting for me to contemplate producing websites that are more interactive; more like desktop applications or games. For now, we are stuck with the business letterhead model.
But the expectations of users and customers will have to grow and change. It's already happening in places like the US and UK. Australia may follow suit soon, as real broadband speeds become more commonplace.

SEO/SEM in Australia is a special issue for so many reasons. Join me was we explore. It will be a fascinating and informative journey. Sphere: Related Content

Wednesday, March 19, 2008

Hackers and the 30%

In the dim dark days long past, web design was not a profession.
In the beginning, before the advent of public search engines, the Web population was made up of the top 30% or so of the best educated and best paid in the US. People joined the 'Internet Revolution' to see what these future great minds were thinking and saying.
In those days, a hacker was more of a Robin Hood than a Darth Vader. 'Hacking' was a sport, sorta. It meant breaking into someplace just because you could. Hackers didn't take things. They usually left something to say they'd been there. A dark rose on a chemistry professor's desk, for example.
The Net was more humorous than commercial.
One of the most popular downloads was a tutorial on picking locks - not on a site called Burglary.com -but on the MIT site.

As books emerged predicting the introduction of HTML 3.2 (the current version is 4.x), Web Designer became a profession. A dot-com was just another domain. (Not for long though.)
The debate raged for years about whether the Web should allow business sites.
A lot of people didn't think it should. But the push into the new medium was inexorable. After all, the Web was populated with the most cashed up consumers in the country!

Web pages were often long. Hyperlinks moved the reader from one part to the other instantly. Philosophers rambled on for hours -in text- about how hyperlinks were creating a new mindset. A 3-dimensional concept of information: a Revolution in expression. Text and images aligned themselves analogically to the thinking processes of the human mind.
Some web designers became architects of the Revolution. They designed information to be understood in quick reference and depth.

The key to this Revolution was how to structure the information.
Page titles reflected the context. Headings set the information into outline form. Each heading was also an anchor that could be addressed via hyperlink, so the reader could move seamlessly through.
Keywords and meta data emerged. They presented the home grown search engines with quick references to the content. No one was willing to commit precious mass storage to comparing the whole content of web pages.
The nascient science of information retrieval traded amongst the gnomes and dwarves of the Net.

New Web Designers were trained to this structure to organize their pages. They have to be educated to it.

Twenty years or more later, new Web Designers have forgotten. Like the stories of ancient religions and societies, the lessons have to be learned again. The story could read like a fantasy novel written during a war. Dark forces sweeping across the World, changing, destroying, and building new places and things - until they burnt themselves out in their glory.
"Google has changed the way the Web does business" is the buzzing headline. It may be more like brushing off old shoes though. The structure is again relevant. In fact, it establishes Relevancy for a web page.
The Web has changed, but gone full circle. It's more egalitarian, and commercial. Instead of the top 30%; there are less than 25% who choose not to have Internet access.
New leaders earn their fortunes by digging up the treasures of the Past. SEO is really just applying the principles established in the beginning to a new Web.

SEO/SEM in Australia is a special issue for so many reasons. Join me was we explore. It will be a fascinating and informative journey. Sphere: Related Content

Sunday, March 16, 2008

Web Design 101 - First Period

I am, by my own admission, a lousy web designer.

Why? - Because I hate templates.

The first website I saw was made by Microsoft's FrontPage 97. All you had to do was tell it: Make me a corporate web! - and FrontPage would dutifully generate homepage, about us, products, and services, and contact pages. Poof! A small company was IBM.
The title of the page was in a box at the top, and all the structural tags - H1, H2, etc. - were colored, sized, and decorated for you. In most templates, it even gave you little graphics for unordered lists.
All you had to do was fill in the blanks, and you were a working company on the Web.
It was a raving bore in 94; and it's only more today. (Not a great poet, either, you'll notice.)

One of the first rules of web design is to make your pages look pretty much the same. The idea is that you won't confuse your visitors, and maybe even establish your corporate or personal style.
That was find in those days if your sense of style is either blue jeans or polyester slacks.
Problem was, that layout implied a company had to have Products and Services. Some companies didn't. That alone created a sense of insecurity or desperation.

Design the information to express

I've never been much of one to put things in little boxes. Design should express and enhance, not restrict.

I tend to want to design a website page by page to reflect the present attitude of the company. If it's a small company that just got a new logo done, then let's let it fill half of space above the fold. Why not? This is company just coming into its own.
They're proud of their new logo. It's all over their vans, new business cards and new company literature. Put it out there for the world to see!
They've only got a few services, but those services are needed in their area. Their customers like them. One of them said so right in the middle of the home page.
Just put a list on the side full of links to get more info.

A design like that gets poo-poo'd a lot. Even customers don't like it because they don't think it looks "business-like". (Not that anyone has ever defined "business-like" too well.) It becomes a matter of latent expectations, not perceiving.

Why does a web page have to follow the pattern of a business letter? Why not let it be a presentation right from the homepage? You got a new company, tell the world about it.
You can always add or adjust stuff later.
It has to look like a business letter because customers won't know what to do. Or, It has to look like a business letter because that's what this site looks like. (The one I'd like to be...)

Wired wonders
Wired proposed over a decade ago that we use the web space better. (I lost track of the article or I'd provide a link.)
Web pages only had to show a window into the content. It's what they do anyway. There could be content spread wide and far across thousands of pixels of space. One click, and the viewport shifted to another part of the grandscape.
They were far ahead of their time.

Web pages in those days were constrained by download speeds on 33k and 56k modems. If a webpage had more than 30K of content - images, programming, and HTML - visitors just went somewhere else.
The download time has changed a little with the spread of broadband, but the size limitation for templates still holds them below 60K. And all of it has to fit on a business letter, within two clicks down the sidebar.

The article proposed broad, bold colors. Wide colored channels guided the visitor across the webscape to explore information or make a purchase. The user actually interacted with the page instead of just clicking away.
Changing colors in the viewscape indicated where the visitor was in the process. All the information was contained on the page, so there was no need for flickering screens. The body tag encompassed many pages, really viewports, of the viewscape. If the visitor wanted, they could ramble around without following the colored guide lanes - and take the path less followed.
Using a mouse or the arrow keys, they could go anywhere just like exploring a landscape on Google Earth. Zoom in or out to get their bearings, then off to explore again.
I don't imagine such a site would have a problem with stickiness...

Where does all of this fit into SEO and SEM? That's going to be a topic or two for another time.

The plan in those days long ago was to use Javascript and Java to implement responsiveness and new content on demand. That can still be done, of course, but there are much more exciting options now. (continued later)

SEO/SEM in Australia is a special issue for so many reasons. Join me was we explore. It will be a fascinating and informative journey. Sphere: Related Content