AdBlock

Firefox users should recognize this popular extension. This one’s an offshoot of AdBlock for Chrome, which itself is an offshoot of AdBlock Plus, the original Firefox extension. AdBlock does what its name implies: block ads. I installed it just to block that obnoxiously huge banner ad on YouTube’s homepage. If you’re not the type to ever click on ads anyway, then why not cut down on the visual (and sometimes audible) clutter?

Type-To-Navigate

[inline-ad align="right"]Type-To-Navigate is a mouse-hater’s dream. It lets you navigate links by simply typing the name of the link. So say I wanted to view the About page of a blog, I’d just type “about” and Type-To-Navigate will highlight the link and display an attractive popup of what I’d written (“about”). The only places where this extension doesn’t work are in text fields and when the link is attached to an image. However, it should find any text link with no problems. Another neat thing you can do with it is to press certain shortcuts while the link you’re searching for is highlighted. You can type ⌘G to find next, ⌘C to copy the URL, and ⌘I to send it to Instapaper.

Invisible Status Bar

Another neat extension from the developer of Type-To-Navigate, Invisible Status Bar gives you a Google Chrome-like status bar that pops up when hovering over links, and even tells you how big a file is when you’re hovering over a download link.

MouseGestures

This feature was originally pioneered by Opera back in 2001, and it’s kind of amazing that it’s taken this long to get it into Safari (at least officially). If you’re unaware, mouse gestures are where you hold down a button on the mouse (normally the right or middle button) and move the mouse to perform a gesture. Gestures can do things like go back a page, or reload. MouseGestures only offers four gestures right now: up, down, left, and right. Assignable actions run the gamut from going back a page to closing the active tab. Unfortunately, there are no customizable gestures like in Opera yet.

WOT (Web Of Trust)

Another popular Firefox extension, WOT offers better security when searching the web by ranking pages based on their content, with other WOT users providing the rankings. The green WOT symbol means the site is safe, and the red means it’s unsafe, with several degrees of safety in between. The only annoying thing about it is that it pops up a little indicator in the top left of the window whenever you visit a new site, but fortunately, it doesn’t popup when you visit a site you’ve already visited.

Gmail Counter

For those who don’t use anything other than Gmail’s web-based interface, this extension is rather useful. It adds a new toolbar icon that shows how many unread messages are in your inbox. Clicking on the icon also takes you to your inbox, so you can get rid of your Gmail bookmark, if you have one.

Reload Button

This one was made by the venerable, and über-critical, John Siracusa, to address his annoyance with the location of Safari’s reload button since version 4. It adds a reload button to the toolbar that’s freely movable, unlike the default reload button. There isn’t much else to say about it, unless you like Safari’s default reload button, in which case, what’s wrong with you?

You could install most of these from the Extensions Gallery, but I’ve elected to link directly to the developers websites, as Apple doesn’t have individual pages for extensions yet.

Have you been playing around with Safari extensions? What are your favorites so far?

Related GigaOM Pro Research (subscription required): What Does the Future Hold For Browsers?

To learn more about using Safari, check out our Safari 101 screencast on TechUniversity (subscription required).

Get Registered

Safari Extensions need to be signed to be installed, so before writing any code, head over to the Safari Developer Center to register as a Safari Developer. It’s free to join, and binds to your Apple ID from your MobileMe or iTunes account. You will have to follow the steps in the online wizard to create your own signed certificate, which you’ll use to create your extension. Once the certificate is created, just double-click to install it. Safari will automatically use this certificate when building your extensions.

Enable the Develop Menu & Extensions

Building Safari Extensions starts inside of Safari, but to get there you have to enable the Develop menu. To do so, go to Safari Preferences, select the “Advanced” tab on the end, then check the last option on the page, labeled “Show Develop menu in menu bar.”

You’ll see the new menu appear, click on it, check “Enable Extensions,” and select “Show Extension Builder.”

Create a New Extension

In the Extension Builder, click on the plus sign in the bottom left hand corner, then select “New Extension.” Choose a place to put the source code for your extension; I always put my code in a “Code” folder under my home directory. Give it a meaningful name, like “Hello World.” In the new form, fill out the “Extension Info” section, and change the Bundle Identifier under “Extension Details” to com.theappleblog.helloworld. Under “Extension Website Access” set “Access Level” to All, and check “Include Secure Pages.”

Open the Project Folder

This is where it gets a little confusing. It seems like Apple would like you to be able to build the entire extension in Safari, but they only give you half the tools to do it. The next option on the list is “Extension Global Page,” in a drop down menu, but there is no option to create one. Once the extension project folder is created (it’ll be in that folder you selected when you created your new extension), you need to open it up and add a couple of files to it. Since we are building a toolbar extension, you will need two files: an image in PNG format, and an HTML file which will hold our JavaScript. You can download both the HTML and the PNG file to use here. Add those two files to the project folder, and switch back to the Extension Builder. Now, when you click on the drop down menu under Extension Global Page, you should see the option for “global.html”, go ahead and select that.

Next, in the “Extension Chrome” section, click the “New Toolbar Item” button. That should drop down a new form with seven options. Fill out the form like this example:

Write Some Code

Open the global.html file in your favorite text editor. In this file is all of the logic for the extension. When our icon on the Safari toolbar is pressed, it will send an event named “sayHello”. Safari will parse our global.html file and see if that event is defined. Since we are checking for that event with the line if (event.command === “sayHello”), our JavaScript will trigger whenever that button is pressed. It’s important that the command defined in the Extension Builder matches the event.command we are looking for in global.html. When the event is matched, Safari will run any JavaScript inside the if statement which, in our case, is a simple alert box.

If you are familiar with JavaScript, you’ll be able to tell right away what you can do here. If not, just know that you can replace the line alert(“Hello World”); with whatever valid JavaScript you’d like.

With the Toolbar Items menu is filled out, you should be ready to build the extension. Click on the “Build Package” button in the top right corner of the Extension Builder. Save the extension to your desktop, then double-click on it to install it in Safari. You should notice a new button on the toolbar sporting the nifty TAB logo. Click on it, and you should see an alert window pop up saying hello.

Debug Workflow

If you don’t already have the global.html file open, go ahead and open it in your favorite text editor again. Change the text of the alert to say “Hello Jon,” or whatever you would like. Save the file without closing the text editor, then switch back to the Extension Builder and click “Reload.” Now switch to Safari and hit your button again, it should now display the new text in the alert window.

Build Something Awesome

This article has barely scratched the surface of what Safari Extensions can do. For more in-depth information, read through the Developers Guide on the Apple web site. I can’t wait to see what awesome extensions creative developers come up with.

To learn more about using Safari, check out our Safari 101 screencast on TechUniversity (subscription required).

Web & Utilities

AdBlock

The AdBlock extension is a great way to remove unwanted content from your browsing experience. Download the extension and load your web pages without as many intrusive ads. There’s even beta options to remove Google ads and YouTube ads.

BuiltWith Analysis

The BuiltWith Analysis extension provides an insider look into a website with one click. You can see what JavaScript libraries a site uses, who provides analytics as well as other nitty-gritty details that are totally public, but often obscured in tons of HTML source code.

Invisible Status Bar

Google’s Chrome browser does away with the status bar at the bottom of your window and only shows it when you hover over a link. The Invisible Status Bar extension does the same thing for Safari!

Live CSS Editing

The Live CSS Editing extension provides a quick way to load up a page and test modifications to the CSS in real time.

Bit.ly Shortener

The Safari Bit.ly Shortener extension makes it easy to shorten a URL with Bit.ly. Simply load the URL in your browser and then click the button!

PageSaver

The Svay.com PageSaver extension will, in one click, save the visible portion of a web page as an image and automatically download it into your Downloads folder.

ScribeFire

ScribeFire is an extension for using a centralized place for posting to all of your blogs, supporting a variety of typical blog features including formatting, categories and tags. ScribeFire’s Safari Extension brings support for this right into Safari.

Snapper

Similar to PageSaver, Snapper also saves the currently viewable portion of a website as a PNG and automatically downloads it for you.

Type to Navigate

The Type to Navigate extension is pretty darn cool. If you’re browsing a page and there’s a link you want to follow, just start typing any word that’s contained within it. It’ll highlight the link and then you just press Return to load it. If it’s not the right link, press Command + G to move to the next one.

E-Commerce

Amazon.com Search Bar

If you frequent Amazon.com, you’ll want the Amazon.com Search Bar extension. It’ll add a new Amazon.com bar to Safari giving you one-click access to your shopping cart, wish list, the latest deals and a quick way to search Amazon.com.

InvisibleHand

The InvisibleHand extension will subtly let you know when it finds a cheaper price to a product elsewhere on the Internet. The list of supported retailers is fairly decent for the U.S., UK and Germany, but more are being added frequently.

Social

FaceBlock

The FaceBlock extension blocks all of the annoying ads on Facebook. I always feel a little sadness for the advertisers that are paying for impressions that I never have to see. Oh well.

safari140

This gem of an extension allows you to post directly to Twitter from within Safari. Links are automatically shortened by is.gd.

Share with Facebook

The Share with Facebook extension gives you one-click access to share your current URL with your Facebook account.

Webbla

If you use Webbla for managing your bookmarks, take a look at the Webbla browser extension, which allows you to quickly add or modify them.

YouTube Full Screen

This extension is a great way to enable full-screen support of YouTube videos if you’re using YouTube’s HTML5 player instead of its Flash player.

Productivity

Background Tabs

The Background Tabs extension will allow you to open a new tab in the background by simply pressing the V key.

Gmail Checker

The Gmail Checker extension will give you an icon and badge in your Safari toolbar to show unread messages on your Gmail account. Keep an eye on their website for updates because the next version will support Google Apps users.

GoMBoX

The GoMBoX extension transforms your Google Images experience by showcasing results in a Lightbox overlay, allowing you to see larger versions without having to leave your search results page.

Instapaper

If you love Instapaper, check out Instafari, a simple one-click way to save an article to your Instapaper account.

InstaPaper Greystyled and Article Tools

The Greystyled and Article Tools extensions provide you with a cleaner style for your Instapaper.com account. Once the extension is installed, just visit instapaper.com to see the changes.

Google Reader – Simplified

If you’re a fan of Google Reader and the GreaseMonkey scripts that give it a simplified look, check out Lucidica, an extension that’s based off Helvetireader.

Safari Reload Button

If you’ve ever wanted to move the reload button for Safari out of the URL window and into its own button, the Safari Reload Button extension does just that.

Search Preview

With the Search Preview extension, you can preview the web pages that show up in your search results. This extension works with Google, Bing and Yahoo.

Toodlethings

If you use Toodledo for your task management, the Toodlethings extension re-styles the web interface with clean buttons and easier to read fonts.

For more great extensions, check out the Safari Extensions blog and keep an eye on Apple.com for its showcase that’s scheduled to premiere later this summer.

Have you written your own extension or found others? Share them in the comments below!

Now there’s a solution for the Mac: Rapportive. It takes over the advertisements area in Gmail, and provides basic information about your email correspondents: occupation, Twitter/Flickr/LinkedIn links, age, location and custom notes. Yes, it supports Google Apps accounts, and the preview version of Mailplane now has an option to view Rapportive data. The experience definitely feels like a beta, with occasional inaccurate or missing information, but it’s great having so much additional context inside my email.

The problem? Rapportive so far only works in Google Chrome and Firefox as an extension. Safari is missing out since it doesn’t support simple extension development. Now that Chrome has overtaken Safari in market share, Apple needs to step up its game in terms of features. Both Safari and Mail.app need extension support to integrate all of these new social products. I am aware that some important extensions like Evernote and 1Password exist for Safari, but there is no official Apple documentation or support on how to build extensions. This needs to change. Unfortunately for Apple, Google and Mozilla already have thousands of extensions available.

There are ways to get around the lack of extensive add-on support in Safari, and one is Input Managers. A new one designed for those who like to tweet is making the rounds, and as long as you’re more into the saying than the listening side of Twitter, it could suit your needs. Personally, it’s exactly the sort of thing I need, since it removes the distraction of the tweet stream while still allowing me to post links of interest or comments while working.

The extension, called Safari140, features automatic URL shortening support and character limiting, to make sure you stay under the Twitter limit (hence the “140″ in the name). While browsing, you can access Safari140′s post window at any time either by going to File > Post to Twitter (which is added when you install the extension) or by pressing “Ctrl+T”. The post dialog box will immediately appear, with the web address of the site you’re currently browsing already entered in the text box by default.

Safari140 works with both Safari 3 and Safari 4 Beta, and it’s a free download. Some people are apparently skittish when it comes to Input Managers, but I’m loving the beta, and I just want a way to tweet, so it works for me.

Related research and analysis from GigaOM Pro:
Subscriber content. Sign up for a free trial.

• The Near-Term Evolution of Social Commerce
• A 2011 Connected Consumer Forecast
• A 2011 NewNet Forecast

Today, Mozilla has released Fashion Your Firefox, a new Web application that enables Firefox users to customize their browser based on their interests and online activities. It provides a simple way to find appropriate add-ons that fit your lifestyles, showcasing them in a simple and easy-to-install way.

“One of the best parts about Firefox is the amazing richness of our 5,000-plus free add-ons,” said Mike Shaver, vice president of engineering at Mozilla. This new venture aims to personalize the browsing experience, allowing you to select a category of web user you feel you fit into. The categories you might fall into with Fashion Your Firefox are:

• Shutterbug: View and share pictures and videos online
• Rock Star: Listen to music while surfing, working, emailing or researching online
• News Junkie: Get the most up-to-date news and weather
• Shopaholic: Shop and take advantage of online deals
• Digital Pack Rat: Keep track of favorite sites, bookmarks and blogs
• Social Butterfly: Share, bookmark, and e-mail web pages via an array of social networking & bookmarking sites
• Finder and Seeker: Find and make information on the Web more relevant
• Decorator: Apply browser themes
• Executive Assistant: Organize online activities

Mozilla has also announced that, to date, there have been over 1 billion downloads of Firefox add-ons. That’s an awfully large number of downloads, and undoubtedly shows that any new way to organize popular and relevant add ons will be welcome by users. Fashion Your Firefox seems set to be a great way of ensuring that Firefox users aren’t overwhelmed by the sheer number of add-ons available.

Developers are also excited at the potential of reaching a wider target audience. Garrett Camp, co-founder and chief architect at StumbleUpon, stated:

StumbleUpon helps millions of users discover new Web content based on their interests. With Fashion Your Firefox, we look forward to introducing personalized Web discovery to a much larger audience.

It’s great news for developers who are fortunate enough to have their application featured in the list, but not so great for those left out. It will be interesting to see how often Mozilla updates this catalog of add-ons to reflect changes in demand and popularity, along with giving exposure to a wider range of developers.

It once again raises the question of whether Apple will choose to introduced some type of add-on system to Safari in future years. One billion downloads of Firefox extensions would certainly suggest that the demand would be there.

Take a look at the site and see what you feel you’d benefit from. You might just find a tool that improves your browsing experience dramatically.

Related research and analysis from GigaOM Pro:
Subscriber content. Sign up for a free trial.

• What Does the Future Hold For Browsers?
• Virtual Worlds: Trends and Opportunities
• Why iPad 2 Will Lead Consumers Into the Post-PC Era