IconShock, a well-known icon design company, is sharing an impressive and complete social bookmarking/networking icon set.
The set has ~150 unique items in 9 different pixel-perfect sizes and they are all available in .PNG, .PSD, .AI and .ICO formats.
Also, for mobile applications, there is a “mono version” included as well.
That’s not all. Every icon has 3 color states: enabled, disabled and normal. Simply, a must bookmark.
Orbit is a lightweight (2.8kb compressed) jQuery plugin for displaying multiple images in a limited space.
The HTML markup is pretty clean, just an element that wraps multiple images where the captions are generated from the title tags of these images.
Images can be browsed using the prev-next buttons which appear on hover and there is an optional timer letting the user know when the next image will be displayed.
This easy-to-use plugin has several options like the animation type, animation speed, enable/disable previous-next buttons, captions, timer and more.
Requirements: jQuery
Compatibility: All Major Browsers
Website: http://www.zurb.com/playground/jquery_image_slider_p…
Data URIs, which is a way of using data in-line in web pages, is a great method for minimizing HTTP requests and speeding up websites.
The common usage is simply encoding data (mostly background-images) in Base 64 and including it to the stylesheets.
Spritebaker is a free web application which automates this process for you.
Just mention the URL of the CSS file, it will search for the background-images + fonts (non-local ones) and create a new stylesheet with these stuff converted to Data URIs.
However, don’t forget that Data URIs usage isn’t perfect yet like the CSS file will grow (you must turn on gzip-compression) or <IE8 browsers will be incompatible. It’ll be a good idea to check the suggestions by Spritebaker.
carouFredSel is a jQuery plugin that converts any kind of HTML element into an infinite and circular carousel.
It can scroll one or more items at the same time both horizontally or vertically.
Every item can be displayed automatically and/or by user interaction (pressing buttons or keys on the keyboard).
The plugin works with items in different width-heights and it is compatible with most of the jQuery lightbox plugins.
It is possible to add/remove items from the carousel dynamically, play, pause or control the prev-next items using custom events and manage it at every level with the callbacks provided.
Requirements: jQuery
Compatibility: All Major Browsers
Website: http://caroufredsel.frebsite.nl/
Personally, I’m a Firefox user as the web developer toolbar and Firebug is a must-have for a web designer/developer and, also, appreciate what Mozilla does for web.
Right, these tools or similar ones also exist on other browsers like Chrome (which can be my next browser with the performance offered).
There are also other great ones like Opera or Safari and it is very normal not to consider IE at all as every version used to come with its own issues.
Maybe, this can be changing as Internet Explorer 9 Beta is out with serious improvements like:
It is not hard to guess that IE9 is still not a strong option for web designers/developers with the lack of dev-tools and reputation it has.
However, it is a big step forward and hopefully a good-enough product to motivate IE fans to upgrade and end up increasing the “modern browser usage ratio”.
Also, considering the activity on the “web-dev products side of Microsoft”, seeing new IE-compatible designer/developer tools in the near future won’t be a surprise.
P.S. Internet Explorer 9 Beta only works with Windows Vista and Windows 7.
Website: http://www.beautyoftheweb.com/
Diaspora is an open source social networking application that is considered to be a Facebook alternative by many sources.
It includes most of the features to be expected like friendships, status messages, photos, etc.
The application’s most original part is the way the user-data and so the privacy is handled: all personal data is stored wherever you want like on an hosting account or on your personal computer.
And, considering it is open source, users will be able to attach their profiles (including all personal data) to a network built with the system.
Diaspora is built with Ruby and still in the early development phase. However, seems like we’ll be hearing more about it in the near future.
Requirements: Ruby, RubyGems, Bundler, MongoDB, OpenSSL, ImageMagick, Git
Website: http://www.joindiaspora.com/
Download: http://github.com/diaspora/diaspora
If you’re using Twitter frequently, it is possible that you may have found yourself several times on searching for an older tweet.
However, Twitter usually doesn’t archive tweets older than 2 weeks and the info shared/conversations become unreachable.
Tweet Nest is an open source PHP application that automatically archives your tweets and offers you an easy-to-use interface for browsing through them.
It can display the new-style retweets, geographic places and links to original tweets + includes thumbnails of media like photos hosted on common providers like TwitPic.
Tweets are categorized in months and a good looking yet simple bar chartshows the amount of tweets, retweets and replies you’ve sent every day.
Requirements: PHP 5.2+ (with PECL JSON), MySQL 4.1+
Website: http://pongsocket.com/tweetnest/
Demo: http://pongsocket.com/tweets/
It will take an awful lot of effort on Google’s part to tear most web developers away from their beloved Firefox, but with the number of web-developer-friendly extensions for Chrome on the rise, developers in increasing numbers are giving Chrome a try and some of them are not looking back.
Chrome’s faster than Firefox, uses less CPU and comes with built-in Developer Tools (accessible by pressing Ctrl+Shift+I). Even if you’re not ready to abandon Firefox yet, make sure you give Chrome a chance with the outstanding extensions below. Chrome’s improving rapidly and early adopters will benefit most.
Totally straightforward, MeasureIt! lets you draw a ruler so that you can measure the pixel width and height of any element online.
Pendule provides a veritable smorgasbord of valuable developer tools to help with style sheets, JavaScript, forms, images, accessibility and much more.
BuiltWith profiles the webpage you’re looking at, exposing all the technologies used therein.
With Flashblock, Flash elements on a website are replaced by placeholders, which can be clicked on individually to load the Flash content.
Use this extension to randomly generate lorem ipsum text. It’s as simple as that.
As a web developer, you’ll end up repeating the same actions over and over again. Record these actions as iMacros to save yourself valuable time. Great for filling out web forms.
Xmarks is the best tool at your disposal for backing up and syncing bookmarks. Use it to sync across computers and different browsers. 163,569 users can’t be wrong.
Google URL Shortener takes long URLs and makes them smaller for easier tweeting and emailing. Use this extension to incorporate the Shortener into your browser.
Take a screenshot of a webpage and perform basic editing (crop, resize, rotate) in your browser with Aviary.
While Aviary is the best at capturing entire webpages, Snippy is ideal for grabbing snippets from sites of interest for research.
Some people prefer Snippy; others prefer Ibrii, which is another excellent extension for capturing snippets of pictures, text and videos. Try both and see which one’s right for you.
PlainClothes “unstyles” the websites you visit, colour coding specific elements for accessibility and educational purposes.
An absolute must have extension for web developers. Use it to inspect HTML elements and live edit CSS properties.
Use IE Tab to view websites in Internet Explorer while using Chrome.
Pick any colour from any webpage using this terrific tool.
Having too many tabs open at once can cause serious confusion and major errors. Clean up your online working environment with TooManyTabs, which makes it possible to clearly see all the tabs you’re using.
Session Manager saves your internet session, including all open tabs and windows, for you to come back to. It’s another good one for developers who are a little too “tab-happy”.
The aptly named Chrome Sniffer enables users to inspect the CMS and JavaScript library running on a page. Over 50 different kinds are detectable.
You get a whole new toolbar full of web developer goodies when you install this extension.
The first step on the path to recovery from “shareaholism” is admitting you’ve got a problem. The next step is installing Shareaholic for Chrome which makes sharing webpages via Facebook, Twitter and email etc really, really easy.
With over 10 million users, chances are you’ve heard of FastestFox, which speeds up your Firefox browsing experience. FastestChrome is essentially the same thing, but (you guessed it!) for Chrome.
Once installed, you can click on the Validity icon in the address bar to validate your HTML documents without even leaving the page.
This one’s great for everyone, not just web developers – you can use LastPass to securely store and manage all of the passwords that you use online.
Essentially a to-do list built into your browser, Google Tasks is another extension which is useful for everyone.
Chrome SEO provides Chrome users with a suite of handy SEO tools. It’s the most popular SEO extension available.
Change the size of your browser to see how websites fare at different resolutions.
Using Speed Tracer, you can pinpoint and solve speed-related issues with you web apps.
Picnik is one of the best free online image editors out there and now it’s available as a Chrome extension.
Chrome Flags tells you the physical location of the website you’re viewing by displaying the appropriate national flag.
WebEdit’s a superb extension for killing time while experimenting with your developer skills. Use it to edit (non-permanently, of course) any webpage you like.
Checking the availability of domains online is pretty easy, but if you do it regularly you can really benefit from this extension, which runs the necessary checks in secs.
SEOQuake Lite displays the PageRank and Alexa rank of the website you’re viewing in the bottom right of your Chrome browser window.
Click on the Site Geo icon and the IP address of the current website you’re viewing is revealed. This can then be located on a proper map.
Not only can you use Google Mail Checker to see what’s inside your Gmail inbox without navigating away from your current webpage, you can preview messages: deleting, marking as spam or reading as appropriate.
SEO Analysis Tool picks apart the SEO characteristics of any webpage, providing you with detailed information about meta tag listings, keywords found in anchor tags and URLs found in the page, amongst other things.
