February 16th, 2010
Social media often seems like a load of crap, so I’m releasing these Poopy Social Icons: 36 different icons in 3 crappy sizes: 48×48, 64×64, 128×128.
Feel free to use the Poopy Social Media Icons on any site personal or commercial. No attribution is necessary but please link back to this post or retweet it if you like using these. Thanks!
Download the Poopy Social Media Icons
The Poopy Social Icon set covers 34 different social media outlets with an extra icon option for both Twitter and Digg. If I missed any, please let me know.
Tags: design, freebies, icons, social media, traffic, web design
Posted in web design | 5 Comments
February 15th, 2010
Last week marked the release of Buzz, Google’s new competitor for Facebook and Twitter.
Initially Buzz inherited a lot of the privacy issues of G-Chat by automatically adding everyone in your Google contacts. The problem with Google contacts is that even people you email casually end up in this list. Fortunately, this privacy issue has been mostly addressed, and Buzz now makes you confirm anyone before adding them.
However another privacy issue remains, which is that Google Buzz profile URLs line up with Gmail addresses. So if a Google profile exists at the URL http://www.google.com/profiles/rickymartin, you can bet there is a corresponding email account rickymartin@gmail.com. (Sorry Ricky is still ‘living la vida loca’ and hasn’t set up his Buzz account yet)
And there are additional issues with linking Google profile URLs with Gmail addresses, as this Buzz post from Danny Sullivan explains.
Getting Around … Read more…
Tags: buzz, google, privacy, social media, workarounds
Posted in social media
February 10th, 2010
Nicholas Zakas is a Javascript guru and principle front-end engineer for the Yahoo! homepage. Zakas just announced his new book High Performance JavaScript, which you should order today.
Zakas is pretty much the man when it comes to Javascript performance, and in June he gave a Google Tech Talk entitled Speed Up Your Javascript.
While Javascript optimization is by no means black-and-white, here’s a list of 10 tips from Nicholas’ talk that will help you write Javascript that really flies.
1. Define local variables
When a variable is referenced, Javascript hunts it down by looping through the different members of the scope chain. This scope chain is the set of variables available within the current scope, and across all major browsers it has at least two items: a set of local variables and a set of global variables.
Simply put, the deeper the engine has to dig into this … Read more…
Tags: 10 tips, best practices, DOM, front-end, javascript, jQuery, loops, optimization, performance, scope, webdev
Posted in 10 Javascript Performance Tips, javascript | 21 Comments
February 4th, 2010
In the past two years, increased browser support has transformed CSS3 from a fringe activity for Safari geeks to a viable option for enterprise level websites.
While cross-browser support is often too weak for CSS3 to hold up a site’s main design, front-end developers commonly look to CSS3 solutions for progressive enhancement in their sites. For instance, a developer might add a drop-shadow in Firefox, Safari and Chrome using -moz-box-shadow and -webkit-box-shadow, and then be comfortable with this design enhancement falling off for IE users.
But wouldn’t it be great if IE users could see the better version of the page? Fortunately there are cross-browser hacks for the more common CSS3 attributes. These hacks not only allow CSS3 attributes to work in all browsers, but in turn allow designers and developers to use CSS3 in the central styling of their sites.
In this article we’ll walk through getting rounded … Read more…
Tags: cross-browser, CSS, CSS hacks, css3, IE, Opera, rounded corners, SVG, vector
Posted in CSS | 211 Comments
January 5th, 2010
Remember the code from Contra on original Nintendo? Up, up, down, down, left, right, left, right, B, A, start; it’s also known as the Konami Code and the 30 Lives Code.
This famous sequence of buttons from the 80’s isn’t going anywhere: in more recent times it’s been in a Moldy Peaches song, and used as an easter egg in Google Reader and Facebook, to name a few.
But I’m sure tons of great things can still be done with the code from Contra, so I built it into a simple jQuery plugin that can be easily used on any site.
The jQuery Contra Plugin allows you to call a function of your choice whenever a user enters the Konami Code (up, up, down, down, left, right, left, right, b, a, enter).
Download the Contra Plugin
Read the jQuery Contra docs
How to use … Read more…
Tags: code, downloads, easter egg, freebies, javascript, jQuery, Nintendo, plugins, pop culture, throwbacks, video games
Posted in front-end, jQuery Plugins | 5 Comments
December 22nd, 2009
In Javascript it often makes sense to attach a stylesheet rather than style a bunch of individual attributes. Appending a stylesheet to the DOM has a number of advantages:
-
Stylesheets can be easier to work with than Javascript—it’s just more natural to use CSS syntax for styling.
-
It’s nice to avoid the cross-browser headaches associated with Javascript styling. Compare CSS’s simple float: left to Javascript’s style.styleFloat = ‘left’ and style.cssFloat = ‘left’.
-
Appending a stylesheet is better for performance when styling 15 or more elements.
-
CSS allows you to leverage pseudo-classes and define styles with the simple a:hover selector instead of both onmouseover and onmouseout event listeners.
There are a couple ways to append a stylesheet. Although it’s usually best to attach an external stylesheet, there are times when you need to build a stylesheet on the fly with Javascript. Let’s walk through the code we’ll need to append … Read more…
Tags: append, best practices, cross-browser, CSS, DOM, front-end, javascript, on-the-fly, unobtrusive, web standards, webdev
Posted in front-end | 7 Comments
December 8th, 2009
TranslateThis is a new Javascript widget that provides 52 languages of translation by leveraging the Google Language API.
Installing TranslateThis couldn’t be easier—simply copy and paste the widget code anywhere on your website, you don’t have to upload any files or change any settings.
Besides being easy to use, TranslateThis also provides many attractive features for developers. First off, requests to the Language API run in Javascript, so the translation is pretty fast. Additionally, the script is lightweight, weighing in at just over 11kb with another 7kb of imagery. And since it doesn’t depend on any Javascript library, TranslateThis can be implemented on any website without additional overhead. Finally, TranslateThis has been tested in all modern browsers and its user interface is designed to be straightforward and seamless.
What can you customize in TranslateThis?
Tags: AJAX, analytics, cross-browser, customization, downloads, front-end, javascript, performance, plugins, translation, web design, webdev, widgets
Posted in front-end, webdev | 3 Comments
November 19th, 2009
There were a lot of good speakers at today’s jQuery Summit, but Paul Irish‘s talk on jQuery Anti-Patterns for Performance & Compression was my stand-out favorite. Covering a number of advanced jQuery performance optimization techniques, this speech put my knowledge of jQuery optimization to shame.
Before Paul’s talk my understanding of jQuery performance tuning was fairly simplistic:
- Optimize selectors to descend from an id if possible.
- Use tag names when selecting classes and don’t use an excessive number of selectors.
- Define variables instead of selecting the same object repeatedly.
- Optimize your code replacing repetition with object oriented functions.
But the information Paul presented blew all that out of the water. Here are 10 jQuery performance rules I gathered from his presentation:
1. Optimize selectors for Sizzle’s ‘right to left’ model
As of version 1.3, jQuery has been using the Sizzle Javascript Selector Library which works a bit differently from the … Read more…
Tags: front-end, javascript, jQuery, performance, selectors, webdev
Posted in webdev | 25 Comments
September 29th, 2009
Yet Another Featured Posts Plugin provides an easy-to-use interface for featuring specific posts in a WordPress blog. After installing the plugin, you can feature and unfeature posts by clicking on each post’s ‘featured star’ in the WordPress edit posts page.
Yet Another Featured Posts Plugin has a variety configuration options, allowing you to control a number of display options as well as which users can feature posts. For developers YAFPP allows several output options besides the default: it can return a data array, modify the next query for WordPress’ the_loop(), and or return formatted data (which can be easily formatted through the admin panel).
Download Yet Another Featured Posts Plugin (YAFPP)
YAFPP Screenshots
Read the documentation
How to use YAFPP
To start, download YAFPP and upload it to your site’s wp-content/plugins/ directory. Activate the plugin and go to the posts listing in your WordPress admin … Read more…
Tags: AJAX, blog, open source, PHP, plugins, wordpress, WP plugins
Posted in webdev | 90 Comments
September 14th, 2009
For the past couple years jQuery has been gaining in popularity, from a hot script with easy CSS selectors released by John Resig in 2006, all the way to jQuery 1.3.2, probably the most widely used Javascript library today. The jQuery core has been constantly expanding, offering new methods and performance tuning with every release, in addition to the wide variety of jQuery plugins that are released almost daily.
Known for publishing resources for the latest development trends, Packt Publishing has recently released an updated version their jQuery book: Learning jQuery 1.3, by Jonathan Chaffer and Karl Swedberg of Learning jQuery (the website). This new resource provides an excellent introduction to jQuery as well as going into detail on some of its finer topics. I’d highly recommend it for anyone who is fairly new to jQuery—it will give you a great head start in … Read more…
Tags: best practices, books, jQuery, resources, reviews
Posted in front-end | 1 Comment
