Usability, Web Sites and SEO in Kansas City

Changes to search engine result pages mean big wins for SEO

Domain stacking, went live about two weeks ago, allows the same domain to appear in top 3 results. For this to happen Google must consider your site a brand. It’s a great way to filter out competition.

SEO for images, with recent changes to Google Images user interface, there is much less focus on the first two or three results. Positions in search are variable because of fluid page layout. Individual image SEO value is reduced, because of overlay method, but you can write a few lines of JavaScript to overcome this.

Additional metadata, you can now embed ratings for your content, number of reviews, price range. When a page is about a person, you can also embed companies, titles. The big one is thumbnail images. Having a thumbnail has a big impact on the number of click-throughs.

Winning Rankings in Local Search and Maps

This is one area where Google isn’t the dominant player, as they are on the rest of the web. The importance of local search is more important than ever before, especially if you’re targeting a specific region. Google is already doing some geo-location based on your IP address and returning local results, when available. Local does have the potential to push organic listings down.

One of the best research tools is Google Insights, which allows you to narrow down by location. The algorithm for local is vastly different. In tests, restaurants with Flash web sites are ranking in local results. Local Search Ranking Factors is a report which is updated yearly.

Claim your place: It’s very important to claim your places, to ensure the search engines and local directory services know they have the correct info for your business. There’s so much bad data in local data, verifying data goes a long way for ranking. Only 2 or 20 million have claimed their Google places page. The other 18-million were fed from Acxiom, InfoUSA and Universal Business Listing.

Use the name of the business in the title, along with one-two descriptive keywords.

Example: name of business, North 45; provide a keyword or two, such as North 45 Pub, but don’t overdo it, such as North 45 Pub – Drink beer, meet local area singles.

Fill out as much information in your listing as possible. Include links to your site, photos of your business, special incentives, etc. If you have multiple locations, fill out and verify each location individually. It’s also a good idea to add your business address and geo-coordinates to your Wikipedia page, if one exists.

Tracking successes: You can set up Google Analytics to track traffic from local results in SERP’s.

Tool for local research and citations -
http://www.whitespark.ca/tools/local-citation-finder/

The Science of Twitter Success

…

…

Site Architecture + Technical Best Practices for Big Site SEO

…

Constructing Effective SEO Audits

…

Scaling Organic Search – The Business of SEO

…

More to come in the following week

I decided to go through my notes, pull out important points, then update this blog post, instead of doing a live-blog for the event, as I’ve done for past web conferences.

I’m registered and ready to attend SEOmoz PRO Training Seminar, August 30 – September 1, 2010 in Seattle, WA. The conference provides an arsenal of Tips, Tricks & Tactics to elevate SEO skills.

Lets Meet in Seattle

If you’re in Seattle, lets meet up! SEOmoz PRO Training Seminar is Aug 30 – Sep, but I’m arriving in Seattle, Aug 27th. Follow @garrettn on Twitter.

SEOmoz PRO Training Seminar in Seattle

• Follow SEOmoz Pro Training Seminar (Seattle) attendees on Twitter.
• SEOmoz PRO Training Seminar Agenda (1-pg PDF)
• RSVP to the SEOmoz Pro Training Seminar on Facebook and/or LinkedIn.

Parameters & Google Search Appliance

Search Protocol Reference for Google Search Appliance is a good place to start to see all available parameters and what they include.

Additional fields can be added to search forms to retrieve content based on meta-data, collections, date ranges, page titles, sites, and more.

URLParams plug-in for Firefox as an easy way to view and modify parameters after submitting a search.

Use getfields = * to return all meta-data for pages. If you’re going to use meta-data in your search  results you must get meta-data using this parameter.

Boolean logic can be used with any parameter or collection. AND (.), OR (|), NOT (-), use parenthesis to direct to evaluate Boolean first.

Interface can be built in GSA using XSLT or can be created in the language of your choice and passing XML results back and forth to GSA. JavaScript and jQuery can also be used in HTML form if you don’t want to use server-side technology.

Enhanced Simple Search

Using operators, but operators may be difficult for users to remember. These can be submitted in the URL string using form fields in search.

Use a simple HTML form to submit data strings on search.

Google Admin Interface

Set where to get dates from your pages using Document Dates (under Crawl and Index).

Collections Versus Meta-data

Collections are vertical. Examples, all PDF’s, all Word files, sub-section(s) of your site, or multiple web sites.

Meta-data is horizontal, across all collections.

Advanced Search

Start out using the advanced search out of the box. By looking at the source of the page, you can see the page is generated using an HTML form.

Google Search Appliance Form Generator was built to help people understand how to put together advanced search interfaces. It generates a form which can be used as a start for your search interface. It also gives you hints for various search parameters.

More info

• Web sites using Google Search Appliance
• Google Search Appliance links from Fig Leaf Software
• Advanced search report decipher’er
• Display multiple collections in multiple iframes
• http://www.learngsa.com

Site Search Analytics – what users want from your site, in their own words.

A little goes a long way. The Zipf distribution, shows that investment in results for most frequent search terms can go a long way. Focus on small number of most popular search terms, work on those, then pick another small chunk.

Users stop (and maybe search) when they lose the scent of information.

Search Terms or Queries

Interesting parallel between meta data and what people search for on your site. Meta data distills content found on a page, and search queries distill what user is looking for on the page.

Cluster your queries and determine which terms seem to mean the same thing? This will enable you to learn more about users’ language and tone. This also gives you a sense what might go into taxonomies, meta data and page content. Can give insight on what types of what facets you might consider for your search.

Determine content type

What kind of content is a user searching for when they use various search terms. Applications, news, reference content, contact info, instructions. This allows you to create a ranked list by content type which allows you to better understand contextual navigation. Content type can also be use to improve search performance, using content type as a search facet. Understand seasonality to determine editorial schedules.

What is unique about your queries? Product codes, course codes, proper nouns. If you see product names or unique queries you can identify, try to give search results more context, make your query string suggest sorting. When queries begin to spike, compare to current content and determine if there might be a need for more content on this topic.

You might use cookies for audience segmentation, so you can break down search and needs by different audiences. Are queries for content that doesn’t exist on your site? Try to determine what’s commonly important to all audiences.

Use numbers for proof you need to de-jargonify

Are people searching for jargon, where do search terms cross your company jargon? Focus on naming content what it is.

Key is to constantly tune your site’s performance. If you’re always looking at what users want from you, you have more of a chance of satisfying them than you do spending x number of dollars on a redesign every x number of years.

Goal-Driven Analysis

Remember to analyze failed search terms. Look at successes and failures in processes.

What are top pages where user searches from? What are the search terms for each page? Is page titled in an unclear or ambiguous way? Are you missing content from the page?

Test performance of most frequent queries. Measure using original two sets of metrics.

• Relevance (or queries with the best result).
• Precision (assess each result on a scale or relevant, near, misplaced, or irrelevant).

“Relevance will only work if you have an idea of the best results”

Getting Started with Site Search Analytics

If you use Google Analytics, you must enable search query collection in the settings.

Check out:

• Lee Romero’s blog
• Jeannine Bartlett’s SIX Metrics Framework

D2W Sessions

• Prototyping: A Component for Successful Projects with Chris Griffith
• The Perfect Prototype with John Farrar
• Developers are from Mars, Designers are from Venus with Chad Udell
• Adobe Flash Catalyst and Flex for Designers with Rob Huddleston
• Turn WordPress into a Professional-Grade Editorial Workflow Publication with Pariah Burke
• Javascript Libraries for Designers with Ryan Jeffords and Doug Boude

D2W Keynote with Doug Winnie

Flash Platform, From Start to Finish – Book

“Workflow is about building a relationship.”

Building a relationship with those on your team, project stakeholders, and the project itself.

Design and development embody many different disciplines.

Design Disciplines

• Visual Design
• Layout Design
• Interaction Design
• Motion and Audio

Developer Disciplines

• Architecture
• Scripting and Coding
• Data
• Content and Structure

Each person offers a unique combination of these disciplines at varying levels. Design and  development must respect each other. Each of us have our own experience in both areas.

Adobe Creative Suite 5

Adobe CS Review allows stakeholder comments and feedback throughout the design process.

Adobe Flash Catalyst

Adobe Flash Catalyst has really nice features for building interactive prototypes and allows export to browser-based or Adobe AIR application. Click asset in Flash Catalyst and file opens in appropriate application. After edited and saved, content is updated in Flash Catalyst.

Adobe Flash Professional

Now can create mobile applications for mobile, including Android and other platforms.

Workflow Lab – Beta 2

Not a project management tool. Doesn’t have aspect of duration. Has ability to show time, but is a visual reference only. Create project workflows and define how team will work together. Link to web sites, local files or can export assets into a single folder and archive assets and workflow and how they came together. Once the project has started you can categorize different items within the project.

Dreamweaver

New features in Dreamweaver 5. HTML5, Media Queries, CSS Inspector, Improved Live View with Navigation and CMS Integration.

What is the first impression of a customer who visits your web site? Today, I visited the Prudential home page where I was greeted with the content and imagery below.

First impressions of Prudential

• This guy has a lot of money.
• He probably doesn’t understand day-to-day life of an average American.
• Does it really take this much space to say that Prudential is stable?
• How does a picture of the CEO help to back up this idea?
• Why is so little of the home page devoted to the activities one might come to the site to complete?

What are your first impressions of Prudential?

Next, I visited the Principal Financial Group home page. While some would argue the Principal home page isn’t as visually appealing, just look at the number of things you can do from the home page.

First impressions of Principal Financial Group

• I can do a lot of things from the home page.
• The site is very information-rich.
• There are multiple links to primary activities a user might come to the site to complete.
• A few photos on the site, but I can figure out where to learn more about rolling over funds from an existing 401k plan.

What are your first impressions of Principal Financial Group?

Results from the CSS3 Selectors Test at CSS3.info

Safari 5 (5533.16)

From the 43 selectors, 41 have passed, 0 are buggy and 2 are unsupported.

Chrome 5.0.375.55:

From the 43 selectors 43 have passed, 0 are buggy and 0 are unsupported.

Firefox 3.6.3

From the 43 selectors 43 have passed, 0 are buggy and 0 are unsupported.

CSS3 Selectors Not Supported in Safari 5

CSS3 selectors not supported in Safari 5 are, :link and :visited. Why didn’t Apple get to these two CSS3 selectors prior to Safari 5 release.

CNN proclaims, Internet Explorer 6 finally nearing extinction

Except, not really. See below for latest browser statistics from our consumer/physician clinical information web site, which gets about 2 million visits or 5 million page-views per month.

Internet Explorer 6 – 12.2%, in August 2010, down from 17.8% in January 2010.

Note: Graph last updated September 3, 2010.

If you’re trying to use CSS3 now, you might run into frustration when trying to figure out the vendor prefixes and subtleties that go along with it. Here are CSS3 generators and tools, I’ve found helpful along the way.

CSS3 Generators

• CSS3 Generator
• CSS3, Please
• CSS3 Sandbox
• border-image generator
• font-face generator
• border-radius generator
• gradient & gradient button generator

CSS3 Tools

• CSS3 Selectors Test
• CSS3 Cheat Sheet (5-pg PDF)

Affordance

Something should look like what it does. If you over design you can break usability.

Rules

Fitts’s Law – Bigger buttons are faster.

It’s about balance and proportion.

Create patterns for margin and padding. Removes arbitrary decisions and ensures consistency.

Margin, padding and font-size are related to create a feeling of balance.

Patterns make it harder to make a mistake. Arbitrary decisions cause imbalance.

Are elements aligned along the left side, elsewhere?

Hierarchy communicates importance. Size explains hierarchy, larger elements are more important.

Color is more subjective, it’s more difficult to apply rules. Design solves problem, color tells a story.

Use photography to create color palette. Adobe Kuler allows this by uploading a photo.

Content

Design is about what best supports the content.

Most sites are based around text, unless you’re designing a photo gallery.

Relative text sizes create balance.

Leading = line-height in CSS

Range kerning = tracking or letter-spacing in CSS. Sometimes negative, has the most impact on larger type.

We read based on letter and word shapes.

Widows, fix using non breaking space between last two words in a paragraph. WIDON’T is JavaScript automatically does this.

Common mistakes

Line-height, there should be just enough space to differentiate one line from the next.

Improper treatment of emphasis. It shouldn’t distract the reader.

Hanging punctuation, use text-indent: on element

Primes versus quotes. “”  vs “  ”

Start without color to remain distraction free. Use as few visual elements as possible.

Grids

Another simple pattern to contain and organize content which allow design without guessing.

Nice, but only guides. Design doesn’t always have to align.

Simplify

Simple is often an improvement, often the best thing you can do is remove things.

Simplify the color scheme, typography and layout. Give typography structure, using relative type sizes.

Critiques

Critiques are good to help realize the easy things to fix.

Communicate your thoughts. Conduct with your team, and ask questions. Ask to see the goodness. Focus your efforts on what’s right, this will expose to you what’s not right and also what you need to protect in the design.

A good design critique.