Web development tools

Web development tools (often called devtools or inspect element) allow web developers to test and debug their source code. They are different from website builders and integrated development environments (IDEs) in that they do not assist in the direct creation of a webpage, rather they are tools used for testing the user interface of a website or web application. Web development tools come as browser add-ons or built-in features in modern web browsers. Browsers such as Google Chrome, Firefox, Internet Explorer, Safari, Microsoft Edge and Opera, have built-in tools to help web developers, and many additional add-ons can be found in their respective plugin download centers. Web development tools allow developers to work with a variety of web technologies, including HTML, CSS, the DOM, JavaScript, and other components that are handled by the web browser. Due to increasing demand from web browsers to do more, popular web browsers have included more features geared for developers. Several notable web browsers have support for web developer tools that allow web designers and developers to look at the make-up of their pages. These are all tools that are built into the browser and do not require additional modules or configuration. Firefox – opens the Web Console / Browser Console (since Firefox 4). The Web Console applies to a single content tab; the Browser Console applies to the whole browser. Many add-ons also exist, including Firebug. Google Chrome – Chrome Developer Tools (DevTools) Internet Explorer and Microsoft Edge – opens Web Developer Tools (as of version 8) Opera – Opera Dragonfly Safari – Safari Web Development Tools (as of version 3) The built-in web developer tools in the browser are commonly accessed by hovering over an item on a webpage and selecting the "Inspect Element" or similar option from the context menu. Alternatively the key tends to be another common shortcut. HTML and DOM viewer and editor is commonly included in the built-in web development tools.