1. Web Development Tools By: Bhavsar Deep K. 7th sem Msc (CA & IT)
3. What provide tools ?? Error checking tools ◦ CSS Validator ◦ HTML Validator ◦ Link Checker ◦ Debug ◦ Edit
5. Chrome Developer Tools.. Bundled and available in Chrome In September 2008, Google released a large portion of Chromes source code as an open source project called Chromium Allows web developers and programmers deep access into the internals of the browser and their web application The Developer Tools are heavily based on the WebKit Web Inspector, a part of the open source WebKit
6. How to use…??? Select the Wrench menu top-right of browser window Select Tool Select Developer tools Press Shortcut key: Control - Shift - I keys to open Developer Tools Control - Shift - J to open Developer Tools and bring focus to the Console. Control - Shift - C to toggle Inspect Element mode.
7. Firebug... Bundled and available or we can install in Mozilla Firefox Firebug is free and open source, it is licensed under the BSD license Firebug was initially written in January 2006 by Joe Hewitt, one of the original Firefox creators.
9. Firephp... FirePHP enables you to log to your Firebug Console using a simple PHP method call. FirePHP is ideally suited for AJAX development where clean JSON and XML responses are required. All data is sent via response headers and will not interfere with the content on your page.
10. Firequery... Firebug extension for jQuery development. jQuery expressions are intelligently presented in Firebug Console and DOM inspector. elements in jQuery collections are highlighted on hover. jQuerify: enables you to inject jQuery into any web page. jQuery Lint: enables you to automatically inject jQuery Lint into the page as it is loaded.
11. Flashbug.. Flashbug is a firebug extension for Flash in Firefox. It provides extensive Flash debugging add-ons .
13. Microsoft Script Debugger.. It is one kind of debugger that is provide by Microsoft ActiveX® Scripting host application. For example, Microsoft Internet Explorer (IE) or Microsoft Internet Information Server (IIS). It is control the pace of script execution with break points and stepping. View and control script flow with the Call Stack Window. It is support in Windows 2000, Windows NT, Windows Server 2003, Windows XP.
14. Omeasure.. A simple measuring tool for web designers and developers using Opera. It lets you draw a ruler across any webpage to check the width, height or alignment of page elements in pixels. Download from Opera add-ons. Note: After install omeasure extension in opera after we have to reload page.
15. Safari Developer Tools It is provide in safari web browser. it easy to modify, debug, and optimize a website for peak performance and compatibility. It is provide three powerful things ◦ Web Inspector ◦ Snippet Editor ◦ Extension Builder