I’ve thought long and hard about this, and I still can’t decide whether or not I should consider myself a “gamer.” During my lifetime, I’ve owned an original Nintendo, Sega Genesis, Nintendo64 (best controller of any console ever), wii, and XBox 360. I used to have a horrible habit of downloading pirating games, but that’s long and over with. Anyways, the only game I’ve played consistently over the past three years is Call of Duty. Which one? Whichever the latest Call of Duty has been most recently released. I don’t even care to attempt the story mode; I simply want to log on and shoot each and every one of you I encounter.

My sharpshooter status aside, I’ve always been surprised upset that Microsoft has never provided an API for the vast amount of information about users, the games they play, and statistics within the games. Namely, I’d like to publicly shame every n00b I’ve baptized with my sniper rifle. I recently found a great gamer API effort by XBoxLeaders.com. While their API can’t tell me the titles and emblems I’ve earned in Modern Warfare 3, I can get some relevant information about my user, my status, and the games I’ve recently dominated.

The PHP

The API is incredibly simple to use: simply send the the gamertag and response type you desire:

// Settings
$gamertag = 'dwalsh83';
$profileUrl = 'http://www.xboxleaders.com/api/profile/'.$gamertag.'.json';

// Get information about me
$info = file_get_contents($profileUrl);

// To JSON
$json = json_decode($info);
$user = $json->user;

The response will look like this:

{
  "status": {
    "is_valid": "yes",
    "is_cheater": "no",
    "tier": "gold"
  },
  "profile": {
    "gamertag": "dwalsh83",
    "gamerscore": 300,
    "reputation": 20,
    "gender": "male",
    "motto": "Watch your head.",
    "name": "David Walsh",
    "location": "Madison, WI, US",
    "bio": "There is, and only can be, Call of Duty.",
    "url": "http:\/\/live.xbox.com\/en-US\/Profile?gamertag=dwalsh83",
    "avatar_tile": "http:\/\/image.xboxlive.com\/global\/t.fffe07d1\/tile\/0\/2000b",
    "avatar_small": "http:\/\/avatar.xboxlive.com\/avatar\/dwalsh83\/avatarpic-s.png",
    "avatar_large": "http:\/\/avatar.xboxlive.com\/avatar\/dwalsh83\/avatarpic-l.png",
    "avatar_body": "http:\/\/avatar.xboxlive.com\/avatar\/dwalsh83\/avatar-body.png",
    "launch_team_xbl": "no",
    "launch_team_nxe": "no",
    "launch_team_kin": "no"
  }
}

As you can see, you get basic account information (name, bio, etc) but also a bit of information about the games the user has been playing recently. You also get links to images for the user and said games. What you choose to do with this information is up to you; you could put together a really basic gamercard:

<style>
	
	.gamercard {
		border: 1px solid #bdbec1;
		padding: 10px;
		width: 600px;
		font-family: arial, sans-serif;
		font-size: 12px;
		color: #bdbec1;
		
		background-image: -webkit-linear-gradient(#ddd, #fff, #e9fdce);
		background-image: -moz-linear-gradient(top, #ddd, #fff, #e9fdce);
		background-image: -ms-linear-gradient(#ddd, #fff, #e9fdce);
		background-image: -o-linear-gradient(#ddd, #fff, #e9fdce);
		background-image: linear-gradient(#ddd, #fff, #e9fdce);
	}
	
	.gamercard img {
		display: block;
	}
	
	.gamercard .avatar {
		float: right;
		width: 150px;
		height: 300px;
		margin: -60px 0 0 50px;
	}
	
	.gamercard h1 {
		font-weight: normal;
	}
		
		.gamercard h1 img {
			display: inline-block; 
			padding-right: 10px;
			width: 24px; 
			height: 24px;
		}
		
		.gamercard h1 a {
			text-decoration: none;
		}
		
			.gamercard h1 a:hover {
				background: #bbe6a6;
				color: #333;
			}
			
	.gamercard h2 {
		color: #111;
		font-size: 16px;
		font-weight: normal;
		margin-top: 15px;
	}
	
	.gamercard ul {
		list-style-type: none;
	}
		.gamercard ul li {
			padding-top: 8px;
		}
			
			.gamercard ul li strong {
				color: #666;
			}
			
	.gamercard ul.games li {
		display: inline-block; 
		margin-right: 20px;
		text-align: center;
		font-weight: bold;
		width: 85px;
		vertical-align: top;
	}
		.gamercard ul.games li img {
			margin: 0 auto;
			width: 85px;
		}
	
	.gamercard a {
		color: #78bb58;
	}
	
	.gamercard .clear {
		clear: both;
	}
	
</style>

<!-- gamercard -->
<div class="gamercard">
	
	<!-- profile image -->
	<img src="<?php echo $profile->avatar_body; ?>" alt="<?php echo $profile->gamertag; ?>" class="avatar" />

	<!-- gamer name -->
	<h1><img src="<?php echo $profile->avatar_tile; ?>" alt="<?php echo $profile->gamertag; ?>" /><a href="<?php echo $profile->profile_link; ?>"><?php echo $profile->gamertag; ?></a></h1>

	<!-- personal info -->
	<h2>The Legend</h2>
	<ul>
		<li><strong>Name:</strong> <?php echo $profile->name; ?></li>
		<li><strong>Bio:</strong> <?php echo $profile->bio; ?></li>
		<li><strong>Location:</strong> <?php echo $profile->location; ?></li>
		<li><strong>Gender:</strong> <?php echo $profile->gender; ?></li>
		<li><strong>Motto:</strong> <?php echo $profile->motto; ?></li>
		<li><strong>Online:</strong> <?php echo $profile->online ? "Online" : "Offline"; ?></li>
		<li><strong>Status:</strong> <?php echo $profile->online ? $profile->online_status : "(none)"; ?></li>
	</ul>

	<?php if($profile->recent_games): ?>
	<!-- recent games -->
	<h2>Recent Games</h2>
	<ul class="games">
		<?php foreach($profile->recent_games as $game): ?>
			 <li><a href="<?php echo $game->marketplace_url; ?>"><img src="<?php echo $game->small_boxart; ?>" alt="<?php echo $game->title; ?>" /></a><br /><?php echo $game->title; ?></li> 
		<?php endforeach; ?>
	</ul>
	<?php endif; ?>
	
	<div class="clear"></div>
</div>

Don’t forget to cache the responses you get back from the API for faster performance!

In the end, I’m not sure how feasible it would be to create a true API for XBox and its games. I assume each game and online service stores its information on the game creator’s own servers, so the information you could get would be minimal and fragmented at best. It would be nice if the creators of Call of Duty could put something out there for assassins like me, but they’re probably all trying to find a way to improve the horrible spawn positioning logic. Awesome work by XBoxLeaders.com in this effort though — it’s given me a great start at a fun project.

XBox Live Gamer API is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

It’s no secret that Facebook has become a major traffic driver for all types of websites.  Nowadays even large corporations steer consumers toward their Facebook pages instead of the corporate websites directly.  And of course there are Facebook “Like” and “Recommend” widgets on every website.  One problem I’ve always found with sharing URLs on Facebook is that you often have no control over the image and description text that accompany the URL.  Had I known about Facebook Open Graph API, I would’ve known the solution to that problem.

Facebook’s Open Graph protocol allows for web developers to turn their websites into Facebook “graph” objects, allowing a certain level of customization over how information is carried over from a non-Facebook website to Facebook when a page is “recommended”, “liked”, or just generally shared.  The information is set via custom META tags on the source page.  Let’s take a look at the different META tags Facebook uses to allow you to customize how your website is shared.

All of Facebook’s Open Graph META tags are prefixed with og:, then continued with more specific the specific property to be set.  The data relative to the property set goes within the content attribute:

<meta property="og:{tagName}" content="{tagValue}"/> 

Using this simple META tag strategy, you can tell Facebook what images, text, and more to use when sharing your webpage.  Let’s review a few key META tags!

Facebook Open Graph Meta Tags

image

The image META tag directs Facebook to use the specified image when the page is shared:

<meta property="og:image" content="http://davidwalsh.name/wp-content/themes/klass/img/facebooklogo.png"/>

It’s best to use a square image, as Facebook displays them in that matter. That image should be at least 50×50 in any of the usually supported image forms (JPG, PNG, etc.)

title

The title to accompany the URL:

<meta property="og:title" content="Facebook Open Graph META Tags"/>

In most cases, this should be the article or page title.

url

The URL should be the canonical address for the given page:

<meta property="og:url" content="http://davidwalsh.name/facebook-meta-tags"/>

Familiarize yourself with the canonical LINK type if you aren’t aware of its purpose — it could help your SEO out greatly!

site_name

Provides Facebook the name that you would like your website to be recognized by:

<meta property="og:site_name" content="David Walsh Blog"/>

This is very useful as Facebook may have no way of knowing outside of this META tag.

type

Provides Facebook the type of website that you would like your website to be categorized by:

<meta property="og:type" content="blog"/>

Read the complete list of website types to best categorize your website.

More Facebook Open Graph META Tags

The META tags provided above are just a few of the special Open Graph META tags sniffed by Facebook.  Open Graph also specified META tags for:

• Facebook Application-specific settings, if your website also has a Facebook app
• Activities
• Businesses
• Groups
• Locations

Visit the Facebook Open Graph page to retrieve more details about each META tag and its intended information.  Facebook also provides a Lint tool to help you validate what you’re sending!

The Open Graph protocol is a great way to not only share a page’s information but to also control how your site’s information is shared.  Using these META tags could be the difference in attracting just a few visitors from Facebook or attracting loads of visitors because your shared links provide useful keywords and imagery!

Facebook Open Graph META Tags is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

The Imagery

Facebook uses a funky sprite for their modal box. Pretty cool though.

The CSS

/* from facebook */
.generic_dialog { height:0; left:0; overflow:visible; position:fixed; /*dw*/ top:0; width:100%; z-index:101; }
#generic_dialog_iframe { left:0; position:absolute; top:0; z-index:3; }
.generic_dialog .generic_dialog_popup { height:0; overflow:visible; position:relative; }
.generic_dialog div.dialog_loading 		{ background-color:#F2F2F2; border:1px solid #606060; font-size:24px; padding:10px; }
#generic_dialog_overlay { display:block; left:0; position:absolute; top:0; width:100%; z-index:100; }
.dialog_body .dialog_content_img { float:left; margin-right:15px; }
.dialog_body .dialog_content_txt { float:left; padding-bottom:5px; width:300px; }
.dialog_body .dialog_content_body { padding-bottom:13px; } 
.dialog_body .form_label { padding-right:5px; }
.dark_dialog_overlay { background-image:url(facebook-overlay.png); background-repeat:repeat; }
* html .dark_dialog_overlay { background-color:transparent; background-image:url(blank.gif); }
.full_bleed .pop_dialog_table td.pop_content .dialog_body { padding:0; } 
table.pop_dialog_table { border-collapse:collapse; direction:ltr; margin:auto; table-layout:fixed; width:465px; }
td.pop_topleft, td.pop_topright, td.pop_bottomleft, td.pop_bottomright { height:10px; overflow:hidden; padding:0 !important; width:10px !important; }
td.pop_topleft { background:transparent url(facebook-pop-dialog-sprite.png) no-repeat scroll 0 0; }
td.pop_topright { background:transparent url(facebook-pop-dialog-sprite.png) no-repeat scroll 0 -10px; }
td.pop_bottomleft { background:transparent url(facebook-pop-dialog-sprite.png) no-repeat scroll 0 -20px; }
td.pop_bottomright { background:transparent url(facebook-pop-dialog-sprite.png) no-repeat scroll 0 -30px; }
td.pop_top, td.pop_bottom { background:transparent url(facebook-pop-dialog-sprite.png) repeat-x scroll 0 -40px; }
td.pop_side { background:transparent url(facebook-pop-dialog-sprite.png) repeat-y scroll -10px 0; }
td.pop_content { background-color:white; direction:ltr; padding:0; }
.pop_dialog_rtl td.pop_content { direction:rtl; }
td.pop_content h2.dialog_title { background:#6D84B4 none repeat scroll 0 0; border:1px solid #3B5998; color:white; font-size:14px; font-weight:bold; margin:0; }
td.pop_content h2.dialog_loading { background:#6D84B4 url(facebook-indicator_white_small.gif) no-repeat scroll 400px 10px; padding-right:40px; }
td.pop_content h2 span { display:block; padding:4px 10px 5px; }
td.pop_content .dialog_content { background:#FFFFFF none repeat scroll 0 0; border-color:#555555; border-style:solid; border-width:0 1px 1px; }
td.pop_content .dialog_body { border-bottom:1px solid #CCCCCC; padding:10px; }
td.pop_content .dialog_summary { background:#F2F2F2 none repeat scroll 0 0; border-bottom:1px solid #CCCCCC; padding:8px 10px; }
td.pop_content .dialog_buttons { background:#F2F2F2 none repeat scroll 0 0; padding:8px; text-align:right; }
td.pop_content .dialog_buttons input { margin-left:5px; }
td.pop_content .dialog_buttons_msg { float:left; padding:5px 0 0; }
td.pop_content .dialog_footer { background:#F2F2F2 none repeat scroll 0 50%; }

/* david walsh custom */
#fb-modal	{ display:none; }
#fb-close	{ cursor:pointer; }
.info		{ width:280px; float:left; font-size:11px; color:#666; }
.info b	{ color:#000; }
.image	{ width:200px; float:left; margin-right:10px; }

Most of this CSS was copied straight from Facebook’s stylesheets. You’ll see a bit of custom CSS at the bottom but that’s just me customizing the content in the modal box.

The MooTools JavaScript

window.addEvent('domready',function() {
	/* hide using opacity on page load */
	$('fb-modal').setStyles({
		opacity:0,
		display:'block'
	});
	/* hiders */
	$('fb-close').addEvent('click',function(e) { $('fb-modal').fade('out'); });
	window.addEvent('keypress',function(e) { if(e.key == 'esc') { $('fb-modal').fade('out'); } });
	$(document.body).addEvent('click',function(e) { 
		if($('fb-modal').get('opacity') == 1 && !e.target.getParent('.generic_dialog')) { 
			$('fb-modal').fade('out'); 
		} 
	});
	/* click to show */
	$('fb-trigger').addEvent('click',function() {
		$('fb-modal').fade('in');
	});
});

Fade in. Fade out. Too easy with MooTools!

Just because Facebook has more resources than you doesn’t mean your site can’t look as good as Facebook!

Facebook-Style Modal Box Using MooTools is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

Digg recently came out with a sweet new feature that allows users to create Tiny Digg URLs which show a Digg banner at the top allowing easy access to vote for the article from the page. While I love visiting Digg every once in a while, I’d rather grab the URL remotely. Here’s how to do so using PHP.

The PHP

/* function that grabs the response from digg */
function get_digg_url($url,$app_key)
{
	$return_xml = file_get_contents('http://services.digg.com/url/short/create?type=xml&appkey='.urlencode($app_key).'&url='.urlencode($url));
	$digg_url = get_match('/short_url="(.*)"/isU',$return_xml);
	return $digg_url;
}

/* function that runs a regex to scrub for the url */
function get_match($regex,$content)
{
	preg_match($regex,$content,$matches);
	return $matches[1];
}

/* important! set a fake user agent */
ini_set('user_agent','Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6');

/* url i want the digg URL for, and my app key which is a URL */
$url = 'http://davidwalsh.name/penetrated-diggnation';
$app = 'http://davidwalsh.name';

/* get the digg URL! */
$digg_url = get_digg_url($url,$app);  //returns:  http://digg.com/u1DOk

Very quick and simple. You could also use PHP’s cURL library if you wanted.

The XML Response

<?xml version="1.0" encoding="UTF-8"?>
<shorturls count="1" offset="0" timestamp="1238884894" total="1">
	<shorturl link="http://davidwalsh.name/penetrated-diggnation" short_url="http://digg.com/u1DOk" view_count="0"/>
</shorturls>

XML is a beautiful thing, isn’t it? You may also request a JSON response.

Like this Digg article? I suppose you could Digg it! Or you can check out the time I was featured on DiggNation!

Create Digg URLs Using PHP is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

MooTools Devs & Contributors

• Official Twitter Account
• Jan Kassens
• Aaron Newton
• Thomas Aylott
• Christoph Pojer
• Harald Kirschner
• Tom Occhino
• Guillermo Rauch
• Nathan White

Automated Accounts

• Clientcide
• MooTools Core Updates (from Github)
• “MooTools” Twitter Search

Many of the accounts above are tweeted to often so if you follow MooTools you should follow the developers above.

Following MooTools on Twitter is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

Everyone loves Twitter. Everyone loves MooTools. That’s why everyone should love TwitterGitter, a MooTools plugin that retrieves a user’s recent tweets and allows the user to format them however the user would like. TwitterGitter allows the user to choose the number of tweets to retrieve and returns an object containing the data provided by Twitter.

Twitter’s Response Object

JsonP.requestors.request_0.handleResults(
	[
		{
			"created_at":"Mon Feb 09 23:38:33 +0000 2009",
			"user": {
				"description":"",
				"url":"http:\/\/davidwalsh.name",
				"name":"davidwalshblog",
				"protected":false,
				"followers_count":639,
				"profile_image_url":"http:\/\/s3.amazonaws.com\/twitter_production\/profile_images\/57860553\/footer-logo_normal.jpg",
				"location":"Madison, WI, US",
				"screen_name":"davidwalshblog",
				"id":15759583
			},
			"in_reply_to_user_id":null,
			"in_reply_to_status_id":null,
			"in_reply_to_screen_name":null,
			"truncated":false,
			"text":"Just got home from work.  Enjoying a Heineken.  Going to write some articles.",
			"id":1193654096,
			"favorited":false,
			"source":"<a href=\"http:\/\/www.netvibes.com\/subscribe.php?module=Twitter\">Netvibes<\/a>"
		},
		{
			"in_reply_to_screen_name":null,
			"user": {
				"description":"",
				"screen_name":"davidwalshblog",
				"followers_count":639,
				"url":"http:\/\/davidwalsh.name",
				"name":"davidwalshblog",
				"protected":false,
				"profile_image_url":"http:\/\/s3.amazonaws.com\/twitter_production\/profile_images\/57860553\/footer-logo_normal.jpg",
				"location":"Madison, WI, US",
				"id":15759583
			},
			"created_at":"Mon Feb 09 21:58:00 +0000 2009",
			"truncated":false,
			"favorited":false,
			"in_reply_to_user_id":null,
			"text":"Yep, it's decided...writing articles tonight.",
			"id":1193352388,
			"in_reply_to_status_id":null,
			"source":"web"
		},
		//....
	]
);

Above is a sample of what is returned by Twitter.

The MooTools Plugin

var TwitterGitter = new Class({
	
	//implements
	Implements: [Options,Events],

	//options
	options: {
		count: 2,
		sinceID: 1,
		link: true,
		onRequest: $empty,
		onComplete: $empty
	},
	
	//initialization
	initialize: function(username,options) {
		//set options
		this.setOptions(options);
		this.info = {};
		this.username = username;
	},
	
	//get it!
	retrieve: function() {
		new JsonP('http://twitter.com/statuses/user_timeline/' + this.username + '.json',{
			data: {
				count: this.options.count,
				since_id: this.options.sinceID
			},
			onRequest: this.fireEvent('request'),
			onComplete: function(data) {
				//linkify?
				if(this.options.link) {
					data.each(function(tweet) { tweet.text = this.linkify(tweet.text); },this);
				}
				//complete!
				this.fireEvent('complete',[data,data[0].user]);
			}.bind(this)
		}).request();
		return this;
	},
	
	//format
	linkify: function(text) {
		//courtesy of Jeremy Parrish (rrish.org)
		return text.replace(/(https?:\/\/\S+)/gi,'<a href="$1">$1</a>').replace(/(^|\s)@(\w+)/g,'$1<a href="http://twitter.com/$2">@$2</a>').replace(/(^|\s)#(\w+)/g,'$1#<a href="http://search.twitter.com/search?q=%23$2">$2</a>');
	}
});

Note: you will need to download Aaron Newton’s JSONP plugin here.

Parameters include:

• username: Your Twitter user handle.

Options of the TwitterGitter class include:

• count: (defaults to 2) The number of tweets you would like returned.
• sinceID: (defaults to 1) The baseline for the tweets to be returned.
• link:: (defaults to true) Want the class to linkify URLs, @ replies, and #topics?

Events include:

• onRequest: The function to execute when the TwitterGitter request is made.
• onComplete: The function to execute when the TwitterGitter request is complete. This is where you want to put your tweet formatting.

Sample Usage

window.addEvent('domready',function() {
	$('git').addEvent('click',function(e) {
		e.stop();
		$('tweets-here').set('html','');
		//get information
		var myTwitterGitter = new TwitterGitter($('username').value,{
			count: 5,
			onComplete: function(tweets,user) {
				tweets.each(function(tweet,i) {
					new Element('div',{
						html: '<img src="' + user.profile_image_url.replace("\\",'') + '" align="left" alt="' + user.name + '" /> <strong>' + user.name + '</strong><br />' + tweet.text + '<br /><span>' + tweet.created_at + ' via ' + tweet.source.replace("\\",'') + '</span>',
						'class': 'tweet clear'
					}).inject('tweets-here');
				});
			}
		}).retrieve();
	});
});

Make sure to check out the demo. If you happen to use this, be sure to post a link — I’d love to see what you’ve done. Happy tweeting!

MooTools TwitterGitter Plugin is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

Click here to read Chris Coyier’s article with regard to the site redesign.

The newest code snippet we’ve added to enhance your S&S experience is a submission favelet/bookmarklet. This new favelet allows you to quickly submit the article you’re reading, no matter what the source, to Script & Style. All you need to do is select/highlight the text you’d like to act as the article description and click the favelet. A new window will appear with the submission screen already filled out for you!

The Favelet Code

//favelet modified from:  http://cubicle17.com/post/32941821/bookmarklet-search-netflix
(function()%7Bvar%20d=document,w=window,ds=d.getSelection,ws=w.getSelection,ss=d.selection,e=encodeURIComponent;t=(ws)%3Fws():(ds)%3Fds():(ss)%3Fss.createRange().text:'';t=(t.toString().length)%3Ft:prompt('Please select article description text.','');if(t)%7Ba='http://www.scriptandstyle.com/submit%3Ftitle=' + e(document.title) + '%26url=' + e(window.location) + '%26content=';u=a+e(t);f=function()%7Bx=w.open(u,'nfx','scrollbars=1,toolbar=0,resizable=1,status=1,width=600,height=600');if(!x)w.location.href=u;%7D;if(/Firefox/.test(navigator.userAgent))setTimeout(f,0);else%20f();%7D%7D)();

Don’t worry about the mess of code. All you need to do is drag the link to your “favorites” toolbar and it will work on any site you visit!

Jump on over to Script & Style to check out the new look and be sure to grab the Script & Style favelet!

Script & Style Revamp with Submission Favelet is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

I’ve found the most useful bookmarking site to be de.licio.us. De.licio.us provides a very simple API which allows me access information about who has bookmarked my articles quickly. Here’s how to pull the bookmark count for a specified URL.

The JavaScript

<script type="text/javascript">
//the callback -- what do we do with the json response?
function get_delicious_count(info) { 
	//get the number of saves
	var num = info[0].total_posts
	//if none, do nothing
	if(!num) return;
	//if some, I add the number to the end of my link, like at the top of every one of my article posts.
	return $('delic').set({ 
		'text': $('delic').get('text') + ' (' + num + ')',
		'title': num + ' people found this post delicious!'
	});
}
</script>


<script src='http://badges.del.icio.us/feeds/json/url/data?url=http://davidwalsh.name/delicious-url-count-javascript&callback=get_delicious_count'></script>

You need to place your function code before the second JavaScript tag which goes to de.licio.us to get the statistic information. Note that you need to provide the URL to check and a callback function which will handle the data.

When you receive the data, you can do whatever you want to format it. On this site, I get the count and append it to the “de.licio.us” link at the top of the article. How would you use this data?

Get a URL’s de.licio.us Count Using JavaScript is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

I get more reader interaction

I recognize that many of the readers of this blog follow me on Twitter. I love when I get comments on my articles and that has spilled into my Twitter account. Every once in a while I solicit feedback and there’s never a shortage of responses. I value the time people give me when they respond so if any of you read this, thank you for responding to my quips.

I need a place I can vent to fellow web developers

When I see that a customer who required CMS capabilities has completely messed up their website by using 28 colors and sizes of text or another customer has a 12 year old managing their website, I simply MUST share this with fellow developers.

There’s no better place to throw a quick razz at web friends

While developers usually respect each others choices in tools (PHP vs. Rails, MooTools vs. jQuery), I couldn’t, however, live with myself if I didn’t take a quick, harmless shot at jQuery and Firefox team member @reybango. Of course, he never hesitates to throw a shot my way too! Just a little fun to help us get through the day.

Sometimes you just want to make a pithy comment

Whether we know it or not, we’re all smart asses. Really. And every once in a while we need to rail off a relatively meaningless, witty 140 character or less sentence. Twitter is the perfect place to do so.

It’s fun to hear what other programmers think about non-web topics (aka devs have personalities?)

Web is a huge and ever growing topic, but I don’t always want to hear other developers talk about it. What does @chriscoyier think about peanut butter vendors? @emwendelin spent a night with his uncle — how did it go? It’s good to get a taste of what other techies are really like away from the computer.

You get 140 characters or less

I don’t have time to write novels and I don’t want to read yours. The 140 character limit forces me (and you) to be brief and creative with your messages and that’s the best thing in the world when I’m busy but need a little intrigue.

Did I miss something? Share!

6 Reasons I’m Glad I Joined Twitter is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.

I made the Digg homepage for the first time! Sweet. Nothing like a front page promotion!

Subsequently, DZone’s server crashed quickly. Ooops!

Digg Homepage!! Woohooo!! is a post from: David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.