Gadgetopia

SEO FAQ : An entertaining rant against SEO companies.  I’m not a fan of the SEO industry – for every one credible firm, there are 100 that are completely full of crap.

If you’re a company that’s about to pay some SEO expert, please, I beg you, take that money and hand it to a talented writer or competent web developer instead. It’ll be much better spent.

And here’s why he’s pissed:

I publish a magazine and I know a lot of magazine publishers. And they are forking over embarrassing sums of money to charlatans who say they can raise their search engine rankings. These magazines can barely pay their writers.

A lot of SEO firms prey on ignorance and false hope.  I will grant some exceptions, but it’s largely a disgusting, bottom-feeding industry.

tldr - Interfaces for Large-Scale Online Discussion Spaces : I’m very impressed with this.  I assumed there was really no new ground to break in the area of discussion forums, but this guy has really put something interesting together, which helps users navigate large-scale, branching discussions.

tldr is an application for navigating through large-scale online discussions. The application visualizes structures and patterns within ongoing conversations to let the user browse to content of most interest. In addition to visual overviews, it also incorporates features such as thread summarization, non-linear navigation, multi-dimensional filtering, and various other features that improve the experience of participating in large-discussions.

He’s apparently going to release it to Reddit soon.  Really good stuff.

I don’t know how someone at Reddit stumbled onto this, but take a look at the image above.  At Esquire magazine, if you highlight any text on the site, an Ajax call sends information about it to some company that tracks this stuff:

Tracer tracks when users copy content from your web site and automatically adds a link back to the original page when your content is pasted.

Original Content: http://tracer.tynt.com/features-and-benefits-of-tracer#ixzz0NbHLVUTY
Under Creative Commons License: Attribution No Derivatives

And, yes, the company added that link and attribution text to my clipboard.  The first paragraph was all I copied.

I suspect this is another step down the road of publishers wanted to get paid for what is probably considered fair use.  They figure that, to blog it, you’ll probably need to highlight it first.

This, however, is utterly doomed to fail.  I promise you that once the actual purpose behind this comes to light, there will be an avalanche of Firefox extensions and HOSTS file entries to prevent it. (Someone in the Reddit comments has already added it to an AdBlock blacklist, apparently.)

Just to see if anyone contacts me about it, I hereby post the text I highlighted.

Cats purr for the same reason that Mrs. Fella sighs: because they are cats. And just like Mrs. Fella’s sighs, a cat’s purring changes and can signify a vast range of emotions.

Interesting discussion over at Reddit (link above), including this pretty good idea:

Nice east way to send them a message…

1) highlight text, right click, “inspect element” 2) Click in to the DOM view of firebug, and enter the phrase ” STOP F**KING SPYING ON ME YOU C**TS” 3) Go back to browser window and select you recently added text 4) You end up with the following in the firebug net tab…

trace[content]
STOP F**KING SPYING ON ME YOU C**TS

Enjoy!

In the end, the Net will self-regulate this.  If it gets to be something too annoying, these guys are a continuous DDOS attack away from oblivion.  I could see a Firefox extension that kept a list of sites using the service and continually, automatically highlighted text whenever you were on those sites, rendering their monitoring useless, since you’d be sending all the text of every page to them.

StackExchange™—The Stack Overflow Knowledge Exchange Platform: Spolsky and Atwood have productized the Stack Overflow platform, so you can buy it as a service and customize it as a knowledge sharing site for anything.

The idea of a knowledge exchange, running the same software as Stack Overflow, can be applied to just about any subject matter. With StackExchange™, you can run a site with all the same features that made Stack Overflow successful.

Prices start at $129 a month.

Joshua Davis (web designer): I kinda like this – it’s a Wikipedia page on a Web designer, essentially.

Joshua Davis (born June 13, 1971) is an American web designer, author and artist in new media. He was an early pioneer in the use of Macromedia Flash.

Of course, not just any designer.  Joshua Davis was with Kioken, one of the most awesome firms back in the late 1990s.  I wrote about them here, and Davis even came along and commented some time later.

It’s interesting to read about how things worked at the higher levels back in the day.

A proficient illustrator and painter with a passion for technology, Davis’ work brought an entirely new dimension to art. Utilizing randomization in controlled environments, or Chaos Theory, Davis established a new and unique perspective on visual communication and creative expression, pioneering an area previously unexplored in graphic design.

In January 2001, as part of issue #100 of K10k.net, Davis posted an autobiography — a revealing look at his personal life in the New York City art/club scene in the early 1990s, his drug addiction, and his ability to overcome it to pursue his goal of being a full-time artist.

Perhaps some day there will be a Wikipedia page about me. “Content management visionary” has a nice ring to it…

3x3: I love this.

3x3 is a typeface based on a 3x3 bitmap matrix.

3x3 is claimed to be the smallest readable bitmap font, with the major exception of ‘2’ being indistinguishable from ‘z’, ‘9’ from ‘q’, and ‘5’ from ‘s’.

I think Blend has a new corporate identity font…

What exactly is the point of "scribd.com"? What problem does it solve that existing technologies do not? Why do I need JavaScript and Flash to read a document?: Interesting debate over at Reddit about the point behind scribd.com. This is the site that wants to be the “YouTube of documents.”

I thought they were going to savage it, but there were a surprising number of Scribd defenders.

My site’s audiences are alternately middle America and members of Congress. Not exactly the savviest of audiences. And for me, Scribd means the days of tediously providing instructions on downloading OpenThis and FreeThat are over.

[…] I love the site’s viewer - it’s far less likely to horribly lock your browser loading the plugin than Adobe’s hulking mass of a viewer, and the interface is fine.

[…] It makes sharing documents easier. Have you ever seen Flickr? It’s Flickr for documents. Hey, Flickr uses JavaScript and Flash too. Why should I need JavaScript and Flash to look at pictures? I could just get everybody to send me a tar of their photos.

The conversation turns into an entertaining discussion about vendor lock-in and the mechanics of publishing documents to the Web. It’s worth a read.

Readability - An Arc90 Lab Experiment: This is kind of a cool little bookmarklet.

Readability is a simple tool that makes reading on the Web more enjoyable by removing the clutter around what you’re reading.

Now, what’s remarkable is that it works on almost any site. CNN, the New York Times, USA Today, your blog, etc. — click the bookmark and everything is stripped away, leaving the clean, uncluttered text of the main content. But how does it figure out what the main content is?

I dug into the code a bit. The bookmarklet just loads a script file from their site. I went through that, and it appears that it finds the DIV with the most P tags (it replaces BRs with Ps to normalize everything). It saves that and tosses the rest.

Ingenious.

I had a really great time this morning doing some actual work with Balsamiq Mockups (if you followed me on Twitter, you would know about this by now…).

This is an Adobe Air app for making quick screen mockups. It’s a blast to work with.

It’s rock simple, and therein lies its strength. There are pallets of common interface elements, for Web sites, client apps, and even iPhones. You drag stuff onto the canvas, then double-click it to edit. Drag them around, group them, resize them, etc.

I read no instructions. I just opened the app and it was kind of obvious how it worked. There are hardly any menus, no wizards, no…cruft.

When I was done with my mockup (I spent about five minutes on it), I clicked “Mockup…Export to PNG.” And here’s something else I liked: it didn’t ask me where I wanted to save it. It just saved it as “mockup.png” on the Desktop. I assume you can configure this somewhere, but it’s a good assumption for the software to make, because most people don’t care — so long as they can find the image, they don’t much care where it is or what it’s named.

Here is my mockup I made in five minutes. I gave this to Josh to show him how I wanted this screen to look. This probably saved me 20 minutes of explaining and fixed when it didn’t come out quite like it looked in my head. Josh looked at the picture for 10 seconds and understood exactly what I wanted.

This is in addition to the core benefit of doing mockups at all: in actually drawing the screen, I was forced to make some decisions. I would stop for a second, think in my head, “That won’t work…” then backup and re-do it. This benefit is well-known, but it often gets ignored in the face of actually doing the mockup, which, for a programmer, is sometimes complicated (e.g. — I am forbidden by law to even open Photoshop, much less Illustrator).

The only drawback of Balsamiq Mockups is that you run the risk of getting a little cutesy. Everything in it is of this “sketch” style, which might get old after a while. I don’t know what capacity the software has for importing other elements.

It’s only $79. It’s worth a couple times that amount.

Disclaimer: Balsamiq provided me a free license key to use the software to write this review. Trust me, however, when I say that if it sucked, I’d have told you just the same.

I’m sorry but Dreamweaver is dying: An interesting thought I’ve never really acknowledged — the era of the client-side WYSIWYG editor is really coming to an end. We’re getting to a point where developers work in a text editor, and content editors work in a CMS, and that’s about it.

The bottom line is that the old model of the central webmaster hand-spinning every page of every website and, worse, manually adding the navigation necessary to help users find it, just isn’t scalable or viable.

[…] In the relatively near future every website will be a dynamically-generated web application and all of today’s sites built on multiple static pages will be ripped out and replaced.

Coding Horror: HTML Validation: Does It Matter?: Interesting comments from Jeff Atwood about HTML validation and whether or not it matters.

The whole HTML validation exercise is questionable, but validating as XHTML is flat-out masochism. Only recommended for those that enjoy pain. Or programmers. I can’t always tell the difference.

Anyway, we validated as the much saner HTML 4.01 strict, and even then I’m not sure it was worth the time we spent. So many of these validation rules feel arbitrary and meaningless. And, what’s worse, some of them are actively harmful.

I’ve never been a huge fan of validation. We’ve talked about this at least twice before.

The case against Flex-based application UIs: Love this post from Tony Byrne. I agree with every word of it.

To me, turning to Flex for a content management interface is a cop-out. It creates nice demoware for the vendor, but long-term problems for you. I can see why Flex is alluring for vendors: maintaining consistent, cross-browser compatibility (especially with AJAX) is hard and expensive. But why does that mean that you the customer must give up the simplicity and supportability of a native browser-based interface?

JQuery Corner Demo: A gallery of effects you can get using a jQuery extension for rounded corners. Some pretty amazing sutff.

Pretty Loaded - a preloader museum curated by Big Spaceship: A big museum of Flash pre-loaders. Fascinating. You can just sit back and watch — as one is done, it loads the next.

Here’s a page that shows what’s wrong with news on the Internet. This story is from an NBC affiliate in Nashville. I clicked through to this story, and….

I couldn’t find the story. I was assaulted by this page. I had search before I could visually frame where the main content of the page began and ended.

I did a little math on it:

• Total screen area: 805,409 pixels
• Total area devoted to the main content: 79,146 pixels
• Percentage of space on the page devoted to the main content of the page: just 10%

Just to make sure I wasn’t throwing stones a glass house, I did some math on an average Gadgetopia story. And I set up a couple rules (and re-did the one above based on these rules):

1. I screencapped the initial screen my browser captured. Whatever was above the fold.

2. I resized the browser to eliminate gutters on the outside of the site design. I basically reduced the screen width until I got a horizontal scroll.

3. I drew a box around the main content. I didn’t discount internal whitespace inside the main content, although I did remove elements that had nothing to do with the main content (still, it’s grossly unscientific, because what you do you about, say, headlines separated from the story by lots of whitespace or other design elements — see the CNN story below).

Anyway, here’s a post from Gadgetopia:

• Total screen area: 721,984 pixels
• Total area devoted to the main content: 278,848 pixels
• Percentage of space on the page devoted to the main content of the page: 37%

Here are some other sites (reduced to just the percentage):

• CNN’s story about Jett Travolta: 29% (it’s 40% if you include all the whitespace under the headline)
• NY Times story about hotel lobbies: 33%
• USAToday story about the action in Gaza: 39%

What seemed like a great idea for analysis in the beginning runs into problems because you have questions about what is related to the story and what isn’t. But, in general, the numbers hold true from an eyeball perspective as well as a mathematics perspective.

Jakob Nielsen has always been a proponet of doing screen area measurements. He divides the screen up into three areas:

• Content
• Navigation
• Advertising

He has recommended percentages for each, through I can’t remember what they are.

Look back over the screencap that caused me frustration in the first place, I learned an important design principle. Nothing should compete with the headline.

The fact that I couldn’t find where the story started certainly was affected by the small space the story occupied on the screen, but it was also affected by the fact that so many other things on the page competed with the headline. The ads to the top and right of the headline make it tough to pick it out amidst all the clutter. If that was easier, the lack of space devoted to the main content wouldn’t have been as much of a factor — I would have at least known where to start.