Essential Google Chrome Extensions for Web Developers

Google Chrome is rapidly gaining market share. This article attempts to highlight 30 popular Chrome extensions for Web Developers. Some of these have been available in Firefox for several years already.

Extensions can be enabled or disabled on the fly in Google Chrome without the need of restarting the browser (which is the case for Firefox). This makes it very easy for you to give the following extensions a try. If you are not already using these plugins, go ahead and give them a try. You might find some of them useful for your needs.

1. Measure It!

Measure It enables you to draw out a ruler that will help you get the pixel width and height of any elements on a webpage.

2. IE Tab

Yes! There is an extension to use Internet Explorer within Chrome. This is a Windows-only extension and you can use it to render those web sites which work only when using IE. It can double up as a great extension to test the behaviour of your website when using IE.

3. Firebug Lite

Firebug Lite is not a substitute for Firebug, or Chrome Developer Tools. It is a tool to be used in conjunction with these tools. Firebug Lite provides the rich visual representation we are used to see in Firebug when it comes to HTML elements, DOM elements, and Box Model shading. It provides also some cool features like inspecting HTML elemements with your mouse, and live editing CSS properties.

4. Speed Tracer

Speed Tracer is a tool to help you identify and fix performance problems in your web applications. It visualizes metrics that are taken from low level instrumentation points inside of the browser and analyzes them as your application runs. Using Speed Tracer you are able to get a better picture of where time is being spent in your application.

5. Eye Dropper

Eye Dropper is extension for Google Chrome and Chromium. It allows you to pick color from any webpage or from advanced color picker. It is great tool for web developers.

6. Lorem Ipsum Generator

Chrome Extension that generates random “Lorem Ipsum” text. It uses a minimalist and well looking design.

7. Resolution Test

An extension for developers to test web pages in different screen resolutions, with an option to define your own resolutions.

8. Pendule

Pendule provides extended web developer tools for Chrome.

9. Aviary Screen Capture

This quick screen capture extension is a must-have for bloggers and designers alike! It will perform a screen capture of the visible portion of any webpage and then open the capture instantly in a basic image editor where you can do markup (draw arrows and rectangles), edit (crop, rotate and resize) and get the exact pixel colors of the image. A perfect companion tool for designers and bloggers!

10. Chrome Sniffer

This extension will help web developer to inspect web framework / CMS and javascript library running on current browsing website. An icon will appear on address bar indicates the detected framework.

11. Chrome SEO

The Google Chrome SEO Extension provides easy access to Search Engine Optimization Tools that can help you with Competitive Analysis, Keyword Research, Backlink Checks, PageRank Checks and other daily SEO tasks.

12. Validity

Validity can be used to quickly validate your HTML documents from the address bar. Just click the icon in the address bar to validate the current document without leaving the page. The number of validation errors can be seen in the tool tip and the detail can be seen in the JavaScript console.

13. Meta SEO Inspector

Meta data is not just the usual HTML meta tags, but the XFN tags, various microformats, the recently introduced canonical attribute, the no-follow links and so on.

This extension is mainly aimed at web developers that need to verify the description tag of their site to follow the Webmasters’ Google Guidelines, SEO, or even to who is curious about page contents that are usually not visible, but can reveal interesting site properties.

14. Web Developer

Adds a toolbar button with various web developer tools. The official port of the Web Developer extension for Firefox.

15. Chrome Web Developer Tools

Chrome Web Developer Tools aims to replicate the features available in the popular Firefox add-on called Web Developer.

16. Color Picker

Quickly get the Hex and RGB values of any color! Also adjust Hue, Saturation, and Balance.

17. Image Cropper

This extension help you to crop any images on the fly. It’s especially useful when you need to crop your online album photo for IM thumbnail.

18. Picnik for Chrome

The Picnik Extension for Chrome lets you easily edit the images you come across while browsing the web. With a click you can create a snapshot of your current web page and open it in Picnik for easy editing, annotation and sharing. Do the same for all the image on the current page — just pick the image from the dynamic hot list and then edit, annotate and share with Picnik.

19. BuiltWith

BuiltWith is a web site profiler tool. Upon looking up a page, BuiltWith returns all the technologies it can find on the page. BuiltWith’s goal is to help developers, researchers and designers find out what technologies pages are using which may help them to decide what technologies to implement themselves.

20. iMacros

iMacros was designed to automate the most repetitious tasks on the web. If there’s an activity you have to do repeatedly, just record it in iMacros. The next time you need to do it, the entire macro will run at the click of a button! With iMacros, you can quickly and easily fill out web forms, remember passwords, create a webmail notifier, and more. You can keep the macros on your computer for your own use, use them within bookmark sync / Xmarks or share them with others by embedding them on your homepage, blog, company Intranet or any social bookmarking service as bookmarklet. The uses are limited only by your imagination!

21. Snippy

Snippy allows you to grab snippets of web pages, save them for future use and upload them to Google Docs. Snippy capture rich contents and preserves formatting, so you can capture paragraphs, images, links and more.

22. JavaScript Tester

This extension adds a small & useful shortcut to your browser “Alt+J”. To run and test performance of JavaScript code.

23. csscan

Inspired by the Firefox Extension CSSViewer, this Chrome extension allows you to easily scan an element’s basic CSS properties without having to delve into the inspector window.

24. MultiSwitch

Switch between development, test and productive application.

25. Regular Expression Checker

This extension is a simple regular expression testing tool for Chrome.

26. jsshell

jsshell is a small command window placed at the bottom of your Chrome browser that lets you run jQuery and jLinq commands no matter what page you’re on!

27. JSONView for Chrome

JSONView for chrome is an extension that helps you to parse and view JSON documents.

28. PHP Documentation

Makes it simpler to search the PHP reference manuals by providing an icon in the toolbar.

29. XML Tree

Displays XML data in a user friendly way.

30. View Selection Source

View selection source in resizable popup. Drag the bottom right corner to resize. Simple, but very useful for web developers.

http://www.stumbleupon.com/su/2auNr8/totalbakwas.com/2010/tech/essential-google-chrome-extensions-for-web-developers

Facebook Updates You Should Know About

Many people have already posted about the recent Facebook updates and shared it with their friends, but I know there are still many out there who aren’t aware of these changes. That’s why I decided to blog about it and share it here so that more users will know about these important updates and be able to properly configure their Facebook account settings.

News Feed Settings

If you’ve recently logged in to your Facebook account and noticed that you’re missing new updates from some of your friends, then you need to check your News Feed Settings. A recent Facebook update has enabled an option by default to only show posts from “friends and pages that you interact the most“. Meaning, if you haven’t interacted with a certain friend (message, chat, comment, tag, etc.), then you won’t see/receive any updates from that friend on your News Feed.

There are two ways to configure your News Feed Settings:

Via the Most Recent link on the top part of the News Feed

1. Login to your Facebook account.
2. Click on “Most Recent > Edit Options“.



3. On “Edit Your News Feed Settings > Show posts from” option, make sure that “All of your friends and pages” is checked.



4. Click on “Save“.

Via the Edit Options link at the bottom of the News Feed

1. Login to your Facebook account.
2. Scroll down to the bottom of the page.
3. Click on “Edit Options“



4. On “Edit Your News Feed Settings > Show posts from” option, make sure that “All of your friends and pages” is checked.



5. Click on “Save“.

Now you won’t miss updates from any of your friends or pages. If you noticed, below the “Show posts from” section is the “Hide posts from” option. Aside from the two filter options, this allows you to further customize your News Feed settings and block updates from specific friends or pages. To learn more about how to control your News Feed settings, refer to this post.

The option to show updates only from friends and pages you interact the most can be useful for some users as it displays less updates and only new updates from friends and pages that interest them the most. However, Facebook shouldn’t use it as the default setting especially if they don’t notify users about it. The default setting should be “All of your friends and pages” and then let the user decide whether they want it that way or not.

Secure Browsing

The other update has something to do with security and was created to address the vulnerability caused by unsecured web browsing. A certain Firefox extension called Firesheep allowed malicious users to browse the activity of other Facebook users on the same WiFi network (airport, public library, school, coffee shop, etc.) and even read or write on their accounts when logged on to Facebook via an unsecured connection (HTTP).

To address this issue, Facebook has added the option to login using HTTPS which is encrypted and secure. Here’s how to enable or setup secure browsing via HTTPS on your Facebook account.

1. Login to your Facebook account.
2. Click on Account > Account Settings.
3. Under “Settings“, click on “Account Security“.
4. Make sure “Secure Browsing (https)” is checked.



5. Click on “Save“.

It is recommended that you enable this feature especially if you login to your Facebook account on public WiFi networks. It will keep your account and private information safe from prying eyes.

IMPORTANT: If you already enabled HTTPS and would want to access a Facebook application (e.g. games), Facebook will show a message asking whether you want to switch to a regular connection (HTTP) instead of a secured connection (HTTPS).

If you click on “Continue” and use the regular connection, HTTPS will no longer be enabled the next time you login. You’ll have to enable it again if you want to use it again for secure browsing.

Hope that this simple tutorial has helped you to properly configure your Facebook account settings not only for your News Feed but also to keep your account secure. If you found this post useful, I’m sure your family and friends who are on Facebook will do too, so feel free to share it with them. You can share this post via the bookmarking buttons below or via the toolbar.

http://www.stumbleupon.com/su/23okdw/jaypeeonline.net/tips-tricks/howto-bypass-megavideo-time-limit/

3 Basic Ways To Secure Your WiFi Router

The first thing you should do when you purchase and install a wireless router in your home is to secure it. Most people neglect to do so because they are either too lazy and they think that sharing their Internet connection is a noble thing or they are technically challenged and do not know what to do.

Why is it so important and why do you need to keep your router or WiFi connection secure? An open/unsecure wireless router or connection means that anyone can share your Internet connection and use it to browse raunchy, racist or other offensive websites using your IP address. Aside from that, it can also slow down the performance of your Internet connection.

Having an open/unsecured wireless connection will also leave you exposed to other serious threats which could lead to serious problems like online fraud and identity theft which are very common these days.

Here are 3 basic ways to keep your WiFi router or connection secure:

1. Change the router’s Default Username and Password.

Choose an uncommon username, something only you can know. Then choose a strong password – keep it at least 8 characters long, using a combination of letters, numbers and characters. Keep it secure and don’t share it with others.

2. Turn on Encryption.

Right now, the best encryption technology is WPA2. Select that one if your router supports it. If you’re still in the process of purchasing one, avoid routers that only support WPA (Wi-Fi Protected Access) and WEP (Wired Equivalency Privacy) and purchase one that supports WPA2. There are available tools on the Internet that can easily crack WPA and WEP encryption.

3. Change the Default SSID and Disable Broadcasting.

The SSID is your network name. By default, routers use a generic manufacturer SSID like “netgear”, “linksys” or “default”. Change it to something else, something uncommon. You can use the same principle as choosing/creating a strong password. A network using a default SSID can be perceived by the attacker as a weak and poorly configured network and will most likely attack it first. Another thing you can do with your SSID is to shut off or disable broadcasting. Keeping it “out of sight” will lessen the chances of it being attacked. Don’t worry about shutting this feature off because you can still connect to it manually.

I hope that this short tutorial on 3 ways to secure your WiFi router will help you keep your wireless router/connection safe. This is just a basic tutorial and I plan of coming up with a more detailed tutorial that includes more ways (some advanced ways) to keep your wireless connection/router secure so stay tuned for that. You can subscribe to receive FREE updates via email so you’ll be sure you won’t miss it.

Have you or someone you know had issues with online fraud, identity theft and other problems because of an open or unsecured wireless Internet connection? What measures are you taking to keep your WiFi connection safe and secure? Remember, its better to be safe than sorry.