Tag Archives: Web 2.0

Why Degrade Gracefully?

I got thinking today, as I near roll out of an internal helpdesk app heavily using jQuery, why we bother to degrade our scripts so they work without javascript. I get it: some people have javascript disabled in their browser… but my question is this: so what?

Javascript is a core part of web experience today.  In fact, I’d say that, on the desktop in the full browser front, if your browser doesn’t support at least HTML 4, javascript, and CSS 2, you’re not playing with the right tools.  After all, we expect that people can parse HTML, why not expect that javascript is a pre-requisite for web usage?

javascript

Some of us go to great pains to make sure our sites work should a user have javascript disabled.  But I’m actually considering the opposite: hiding certain critical elements if you don’t have javascript enabled to ensure that each visitor is on an even playing field.  Wrapping submit buttons in jQuery’s append() method, submitting data on click(), and plentifully exchanging JSON data via AJAX throughout ought to properly cripple participation of those who opt out of script execution on my site.

It all comes down to this: if you want your site to reach the widest audience possible, you need to anticipate that the client may not allow you scripting capability.  Conversely, on our intranet, and maybe one day on my websites, I’m doing the opposite: if you want to use the site, you’ve got to enable javascript: if you don’t, well… your loss.

Tagged , , , ,

Damn It, Twitter!

FAIL WHALE

All goddamned day I’ve been getting this goddamned whale on Twitter. I’ve also been trying to change the background of my stream, but although it always reports successful (when it doesn’t fail due to capacity problems), it never changes. It either replaces my background with nothing, or it uses the background I had three or four changes ago. God damn it, Twitter, get your goddamned act together!

Tagged , , , ,

IE8 STILL Doesn’t Support CSS border-radius

I find it absolutely amazing that IE8 doesn’t support border-radius. No wonder more & more people think IE sucks. It’s just ugly.

Tagged , ,

Facebook’s New Interface

Facebook loosed their new interface this week.  Thus far, there is nothing “live” about it.  This makes me very sad.

Honestly, if Facebook doesn’t introduce AJAX-y live update goodness to their homepage, I suspect I’ll use Facebook about 11% as much as I used to.

Tagged , , ,

How to Add Latest Tweet to WordPress (Without a Plugin)

I decided to add my latest “tweet” from Twitter to the sidebar of my WordPress blog. Rather than use yet another plugin that adds yet another hook – and there are many that do this with lots of code, I decided to use a homegrown solution, dependant only on PHP4+ and cURL  (most webhosts already have cURL compiled in, if not, you should request it).  Adding the following to any of the files in your WordPress theme will print out your current Twitter status and cache the results so you don’t hammer their system.

First, snag your Twitter user id.  Then, open up your theme file.  I put mine in sidebar.php found in /wp-content/themes/<THEMENAME>/.    Use the below code.  If you want the output wrapped in a list, you would need to put <ul> and <li> tags around this code.

Carefully set your variables.  The cache file should be writable.  Note that you can use a decimal value for $tw_BlankAfter and $tw_Minutes if necessary.   That’s it.

Due to what must be a bug in WordPress, please ignore the closing “</text></created_at>” at the end of this post.  It’s trying be smart and “fix” broken tags, but the code is right.

NOTE (2/20/09): I have updated the below code.  The new version can be found at “Posting Your Latest Tweet in WordPress“.

/* ~~~~ Custom Twitter Bit ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* ~~~~ Adam S, firsttube.com, twitter @sethadam1 ~~~~~~~~~~~~~~~~~~~~ */
 
$tw_File = '/path/to/a/static/writable/file/twitter.html';
$tw_Userid='XXXXXXX'; //set to your Twitter user id
$tw_BlankAfter = 30; //blank out status if it's older than this many days
$tw_Minutes = 10; //minutes between reloads
 
$tw_Offset = FALSE; //leave as is
// uncomment below time if you want to allow a manual reset via ?twitter-reset
// if($_SERVER['QUERY_STRING']=='twitter-reset') { $tw_Offset=0; } 
 
/* Do not edit below this line */
if(filemtime($tw_File)&gt;time()-floatval($tw_Offset)) {
	include $tw_File;
} else {
	if(is_writable($tw_File)) { $tw_iswritable=1; }
	$tw_time = (86400*floatval($tw_BlankAfter));
	if($tw_Offset) { $tw_time=$tw_Offset; }
	$tw_hyperlinks = true;
	$tw_c = curl_init();
	curl_setopt($tw_c, CURLOPT_URL,
		"http://twitter.com/statuses/user_timeline/"
		.intval($tw_Userid).".xml");
	curl_setopt($tw_c, CURLOPT_RETURNTRANSFER, 1);
	$tw_src = curl_exec($tw_c);
	curl_close($tw_c);
	preg_match('/(.*)&lt; \/created_at&gt;/', $tw_src, $tw_d);
	if(strtotime($tw_d[1]) &gt; time()-$tw_time) {
		preg_match('/(.*)&lt; \/text&gt;/', $tw_src, $tw_m);
		$tw_status = htmlentities(str_replace("&amp;","&amp;",$tw_m[1]));
		if( $tw_hyperlinks ) {
			$tw_status = ereg_replace(
			"[[:alpha:]]+://[^&lt;&gt;[:space:]]+[[:alnum:]/]",
			"<a href="\">\\0</a>",
			$tw_status);
		}
		$tw_output = $tw_status;
	} else {
		if($tw_iswritable==1) {file_put_contents($tw_File,''); }
	} 
 
	if($tw_iswritable==1) { file_put_contents($tw_File,$tw_output); }
	echo $tw_output;
}
/* ~~~ /Custom Twitter Bit ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

Please note that portions of this code come from the twtter_status() function that was not written by me, but is available from various sources online.

Update: Removed function and put code inline.

Tagged , , ,

Re-Twittering

I’ve decided to give Twitter a go again. It seems to move pretty quickly and satiate my ADD by filling in the gaps in my Facebook live feed.  If you and I know each other, give me a shout @sethadam1.

Tagged , ,

A Cleaner, Simpler firsttube.com

I’ve been pretty liberal in completely redesigning my website for some time now. I built this site sometime in August of 2000, using my own HTML. All dynamics were achieved… well… faked… via re-uploading static HTML files. Version 2.0, a major overhaul, arrived shortly thereafter, and version 3.0 completely migrated to PHP as the base. The site thrived as a Phish music archive and when I moved away from that, I retired what was then version 4.0, and several versions followed until this one, version 9. But alas, shortly, I will begin the design of firsttube.com version 10, and it will be a chore, as I intend to modify most of the tables in my underlying database. Many features I wish I had implemented long ago – such as subscribing to threads and letting users enter a website, thereby not exposing their email address – are long overdue and virtually omnipresent in other weblogs.

I’ve even tossed around using another blog engine and just migrating my data, but then, where would I play?

My primary goal, though, for firsttube.com 10, will be a radically simpler and more attractive interface. I like some Web 2.0 mainstays. Expect larger text, brighter colors, AJAX where appropriate, and simplicity. My new comments page, which I’ve been playing with, is already stripped down and already kind of overwhelming. So back to the drawing board, it appears. Stay tuned for more updates than necessary.

Tagged , ,

Facebook Redesign Launched

Facebook today launched their long in-the-works redesign. I’ve been following it for at least 4 months or so, and today it appeared live. After many iterations, this may actually be the one I like best.

But alas, I use Opera, and strangely, this version doesn’t play well. Many links flat out don’t work, there’s weird Flash that Flashblock blocks with every page load, and worst yet, the thing is actually parsing A LOT incorrectly. Check out the below screenshot, and be sure to click on it for the full size version.

Tagged , , ,

Slashdot: Slowing Rotting from the Inside Out

Sometime ago, say, 1999, Slashdot was the king of the online tech world. In fact, from a “hits” standpoint, they may still be, if not second to Digg. Slashdot has always been the first big blog-style tech site, long before the word “blog” meant anything to anyone, and somehow, Rob Malda and crew are still relevant in the scene.

Not too long ago, Slashdot started overhauling their incredibly horrendous HTML and rewriting in mostly compliant HTML. The goal of the rewrite, amongst many other things, such as incredible bandwidth savings, was to support stylesheets and graceful degrade. When all was ready, Slashdot held a contest to solicit new stylesheets and received tons of submissions, some really cool and others really ugly, and chose a very nice, very reserved, very modern-but-conservative one as their new default style.

Let’s back up a bit: Slashdot is written in Perl – ack! – and is built upon an open source system called, simply enough, “Slash.” Slash code is horrendously out-of-date and the last download is pathetically old. In fact, the only way to get Slash in any recent form is via CVS access. Slash requires mod_perl and tons of Apache and perl customization. Since Slash is tried-and-true, it’s not really “new” code. And it shows in many ways.

Not too long ago, the Slash folks started realizing that new technologies and new sites were introducing amazing interactive features. Perhaps they realized when a chunk of their userbase got fed up and left for sites like Digg, Techcrunch, Mixx, or some other aggregation type site. Nonetheless, the Slash team started hacking in features that emulated many of the Web 2.0 sites. First it was tagging. “Taggging” has been in beta for some time now. It allows users to arbitrarily tag a story with keywords. The FAQ says that once enough people use a tag, it shows up as a suggestion for others. But I always see weird tags suggested. Either way, it’s pointless, because I don’t know what good tagging does for me.

Then came the “firehose.” The Firehouse is essentially Slashdot’s answer to Digg. The diea is this: users submit stories, links, bookmarks, journal entries, etc, and other users vote on the stories. As the stories get “warmer,” or redder, the entries because available to the editors to convert into real news items. Neat, huh? The idea is cool, except the interface is nowhere near as dynamic or alive as Digg’s, and the content doesn’t rotate as fast. And the load time hurts. So I never use it.

In the last 6 months to a year, Slashdot began rolling out “D2,” their new dynamic discussion system. It is a replacement for the static comment system of days past. The problem is multi-fold, however. Firstly, the layout is a screaming nightmare. There is so much whitespace and what is there is totally overwhelming. Big garish buttons take the place of links or real buttons. Dynamically fetched text takes many seconds to load, even generic insertions like a comment form takes 5 seconds plus to appear. Slashdot has become flat out slow. And D2, which should have remedied a lot of that, has not lived up to its promise.

Slashdot

All the places where things got dynamic on the site feels like a new paradigm being smashed into old code. I wonder if Slashdot might be better off rewriting the entire engine as version 3.0. I know that sounds scary, but when OSNews was starting to feel the pain, we ditched the entire front end and rewrote it – every single line of PHP and HTML and CSS and JS. A combination of creative time-based caching, caching on request, and sleek, optimized queries resulted in a snappy and very responsive front end with smooth ajax integration, a super fast loading page (minus the ads, subscribe today!), and a zero lag experience. The differences between the v3 backend and v4? None. If you exclude new features we built in (news tags, extended user preferences, and conversations), the backend is exactly the same.

Slashdot’s database likely won’t have to be dumped or modified at all to rewrite all of their Perl and Javascript/Ajax. But it might result in a faster, smoother, nicer looking front end. It’s time to reel in the speed issues – the entire site takes forever to load (a 200K front page plus externals doesn’t help). It’s time to fix the ajaxian display weirdness. It’s time to get your JS working well in Opera. Fix those and then perhaps we can deal with the elitist userbase.

Tagged , , , ,

From Bloglines to Google, and Back

I ditched Bloglines the other day for Google Reader. I’m not a huge fan of Bloglines’ new beta interface, most because I find it clunkier than the current interface. Sure, the current one feels a little dated, but it works. Plus, the iPhone interface is nice.

Google has a lot going for it. For one, it seems everyone who uses it raves about it. Also, the iPhone interface is integrated with all the other Google services I use, Picasa Web, Gmail, etc.

This all came about because I wanted to use a desktop RSS reader at home and sync it with my web interface for work and iPhone, but that doesn’t exist unless I use Newsgator. Bloglines and Google both appear to have a sync API, but neither Vienna nor NetNewsWire (nor any other client I could find) actually syncs back to them.

But it appears Vienna is working on one for Google’s reader, and with the Bloglines beta looming, it seemed like a good enough time to make the jump. So I did.

Google’s Reader is awfully attractive, but it’s really keyboard driven. Not only that, but there’s no way to have it mark all items as read as you click a feed. You must begin the tedious task of scrolling through every single item, or hitting “j”, “j”, “j”. And YouTube embeds don’t go away – at least in Opera 9.22 – they just wait at the top of the reading pane, obstructing text, until I click a new feed.

Did I mention that Google Reader is slow slow slow? I can click a link and watch it “Loading…” for several seconds. Opera is a second class citizen in Google-land, which is why all new Gmail features don’t work (v2, label colors, AIM) and Picasa support is flaky, but I think Reader fits in that boat too. It’s painful.

So, after 4 full days, I bailed. I’m back to Bloglines classic. I’d love to tweak the stylesheet a little, but it works and it’s so much faster. I’m pretty pleased with Bloglines, especially now that I’ve had a chance to experience something else.

Tagged , , , , , ,