DiggBar Confirmed Evil, How to Fix?

Apr 13 2009
Posted by Mark
in Discussion

It seems that the argument regarding the controversial DiggBar has been settled—it is, in fact, pure, unadulterated evil. The conversation surrounding it has not died, however. It has shifted to how to fix it. Kevin Rose is reportedly meeting with Matt Cutts on that very subject.

I’m sure to many content providers, the answer to that question involves a shallow grave about 47 pixels deep. But Eric Meyer asked on Twitter earlier (and subsequently regretted) if there was a way to compromise so that Digg users could have the bar but the URLs weren’t hijacked by Digg for the rest of us (including search engines). While it doesn’t solve all the problems created by the DiggBar, there is a trivially simple technical solution to handle this compromise.

As there are two distinct components to the problem—links from Digg’s site and Digg’s new short URL service—there are two components to the solution:

First, links from Digg’s site should point at the actual content, absent the DiggBar. When users are logged in, and if they prefer to see the bar, Digg can rewrite the links to point at DiggBar’s short URL version. Google never sees a hijacked URL from Digg’s site.

Second, Digg’s short URL service can check for the presence of a user session and DiggBar preference before deciding whether to show the bar or simply use the standard 301 redirect like most short URL services. Simple.

If Digg was truly interested in totally satisfying content providers, in addition to these measures, they could have an opt-out list for content providers that never wanted their content rendered under the DiggBar. Again, not perfect but it would go a long way to appease the community.

Will Digg take any of these measures? Only time will tell.

Update: 04/20/2009

Time has told—Digg will fix the DiggBar. According to a posting on Search Engine Land, The DiggBar Compromise: Show Framebar Only To Logged In Digg Users, the DiggBar will not be seen by anyone other than currently logged in Digg users. From the article,

…if you click on a DiggBar URL from Twitter, you won’t see the DiggBar unless you’ve already been to Digg and have a logged in status. Just having a Digg cookie won’t be enough, Digg cofounder Kevin Rose told me when we talked about the new implementation yesterday. A Digg user must be logged in for a DiggBar to show. Logged in users can also opt-out of seeing the DiggBar.

Those who are NOT logged in will simply be redirected to the destination page, via a 301 permanent redirect. This will include search engines that follow those links.

There you have it—compromise. But will this deter other framing services or empower them?

CommentsNo Comments » Tags, , ,

DiggBar Controversy, But What About Facebook?

Apr 10 2009
Posted by Mark
in Discussion

There has been some outrage about Digg’s new DiggBar. The argument goes, that is is wrong to disguise the URL of the page you are reading because the URL is an important indicator in web culture (for a number of reasons). And the DiggBar essentially hijacks bookmarks. In addition, there are some misgivings about the idea of Digg branding content to look like it is from Digg.

People are using a number of tricks to thwart this new service including specifically detecting the bar and disabling frames altogether. Some argue if it is worth it to block the bar while Reddit users are having a field day tearing Digg down over it and offering the latest hack.

They are right—the DiggBar is evil. My point, however, is that Facebook has been doing this for a while and I have not seen the same reaction from the community. Did the outrage over it slip by me? Or did Facebook’s referral bar just slip under the radar despite their 200 million users? Is it because they have not offered it as a short URL service? Is it because they are currently not selling ads on it?

…what gives?

Facebook referral bar in action.

Facebook referral bar in action.

Update on Frame-Busting

I can’t stop reading about this topic. New posts are showing up everywhere. And a common misconception keeps popping up–that the only way to selectively detect the DiggBar (or any frame-jacker) is to do it server side. The consensus seems to be that in Javascript, all out frame-busting is your only option. Of course, it’s not. Javascript has a prefectly good regex engine.

The following Javascript snippet combines John Gruber’s infamous tactic with the frame busting method.


<script type='text/javascript'>
if ( top.location.href.match(/http:\/\/digg.com\/\w{1,8}\/*(\?.*)?$/ )) {
alert( "DiggBar is evil!" );
top.location.href=self.location.href;
}
</script>

Certainly, this technique suffers from all of the limitations of the Javascript frame-busting technique. But it is an option many seem to be overlooking.

Comments1 Comment » Tags, , , ,

CSS Frameworks Comparison Chart

Mar 23 2009
Posted by Mark
in Develop

Lately, I have been taking a second look at using CSS frameworks. I’m a firm believer in the concept of choosing the right tool for the job based on the project constraints. And what better way to quickly evaluate a set of tools than a comparison chart!

As of this writing, there are exactly eight gajillion CSS frameworks available on the internet. Today, we are comparing the top three—all of which are built on the same basic foundation of features: reset, grids and basic typography.

CSS Framework Comparison Chart
YUI CSS Blue Print 960.gs
Fixed Page Width (in pixels) 750, 950, 974 950 960
Fluid Layout (width=100%) yes w/plugin w/plugin
Prebaked Layouts yes no no
Columns fractional microformat 24 12 or 16
Design Templates no no Printable PDF, Fireworks, Illustrator, OmniGraffle, Photoshop & Visio
File Size (minified) 1.5K ~14K 3.5K
Hosted Minified Version yes no no
License BSD Modified MIT Dual GPL/MIT
Vertical Rhythm Styles no yes w/plugin
Print Styles no yes no
Source Order Independence yes no no
IE compatibility v6+ v6+ (typography issues noted) v6+ (HR spacing issue noted)
IE conditional style sheet yes no no
Maintains Separation of Data and Presentation Layers sort of no no

Impressions

YUI CSS

Heavily scientific. Yahoo engineers have created a system that is based on a layout microformat which has its roots in Yahoo’s own landscape of sites. As a result, you have baked in support for standard ad widths and the evolved maturity that comes from the extensive user experience testing Yahoo has performed. Be prepared to print out some reference sheets, however. The drawback of this system is that it requires you to learn the microformat and the idiosyncrasies that come with it.

Blue Print

Typographically sound. Blue Print has a strong focus on type. So much so, that the author once publicly mused about releasing a lite version of Blue Print that removed the grid, allowing it to be used in conjunction with 960 GS. While both Yahoo and 960 GS both seem to take the same philosophy on type styles—offering it for rapid prototyping reasons but recommending against production use. Blue Print goes the opposite direction which to my mind makes it more of a prototyping tool than one for production use. It is also heavier than the others but you shouldn’t need a chart to navigate it.

960 GS

Easy going and friendly. 960 GS was created for one reason—the grid system. As a result, it is small and tight and incredibly easy to use. Perhaps its most brilliant feature is not even part of the framework itself—design templates! The trick to using a grid system is getting the designer to conform to it. 960 GS offers design templates for a wide range of software and even printable sheets making it easy for designers to adhere to the system. Brilliant.

Conclusion

At this point, I would probably say that 960 GS is suitable for most projects. If I had a project that called for flexible page widths, ad support, or was performance critical, I would lean on Yahoo. If I needed stronger type support, I would look in Blue Print’s direction.

Comments3 Comments » Tags, , , ,

Launch!

Mar 13 2009
Posted by Mark
in News

Today we have launched our company blog, Synapse. We’re getting on the board with just a few quick tips from life here at Neural9. They may be a bit obvious. They may not. But, we hope to have some interesting discussion coming up soon. So, check back regularly.

CommentsNo Comments »

Mac Tip: Using Spaces with Multiple Monitors

Mar 13 2009
Posted by Mark
in Tips

Coming from a *NIX background, I was quite enamored with Mac OS X 10.5’s new Spaces feature. I used the default 2×2 setup which made a nice grid when you reveal them all. Very managable. Recently however, I added a second monitor and threw everything off. I no longer had 2×2 but effectively a 4×2. This made the reveal unusable.

Spaces reveal with 2 monitors and a 2x2 grid. So hard to see your app windows.

Spaces reveal with 2 monitors and a 2x2 grid. So hard to see your app windows!

Luckily, Apple, despite their penchant for limiting user configuration options, added the ability to reduce the number of columns via the Spaces settings panel. After reducing it to one column, I had my 2×2 grid back. Yay!

Spaces reveal with 2 monitors and just 1 column. Much better!

Spaces reveal with 2 monitors and just 1 column. Much better!

CommentsNo Comments » Tags, , ,

CSS Tip: Using Multiple Classes

Mar 13 2009
Posted by Mark
in Develop, Tips

You probably already know that you can add multiple classes to elements in HTML.

Example:


<div class="Post First">...

But, did you know that you can string them together in your CSS selectors?

Example:


div.Post.First{ color: red }

You can also use this trick to combine classes and IDs.

Example:


<div id="First" class="Large">...

And the CSS selector,


div#First.Large{ font-size: 150% }

A word of caution, this trick does not work in IE6. But then, if we limited ourselves to what worked in IE6, we’d never get anywhere.

Hope you find this to be useful.

CommentsNo Comments » Tags,

Eclipse Tip: Best Keyboard Shortcut Ever

Mar 13 2009
Posted by Mark
in Develop, Tips

In any Eclipse text editor (which includes all of Aptana’s as well), you can swap 2 lines of code (the current line and either the one above or below it).  This trick accomplishes the same goal as highlighting and cutting and pasting, or highlighting and code dragging. But line swap is much quicker than either.

On Linux and Windows, it’s ALT+Up or Down Arrow. On Mac, it’s OPT+Up or Down Arrow.

code-tip-line-swap

The official names in the Preferences section (Preferences->General->Keys) of either Aptana or Eclipse are “Move Lines Up” and  “Move Lines Down”. And as the names imply, the trick works with multiple selected lines, or blocks, of code.

CommentsNo Comments » Tags, , , , ,