25 Secrets of the Browser Developer Tools

WEB 2012. 10. 9. 10:39
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

Development.

Over the last few years there has been one tool that has helped out every web developer more than any other – the browser developer tools. Working in harmony with the web browser, the developer tools allows us to manipulate DOM elements, CSS styles, JavaScript and other useful information from the same window often in real time.

Historically developers have used Firefox’s Firebug add-on to develop and debug their websites, but more recently each browser has developed its own set of tools and each comes with its own advantages and disadvantages. Nowadays it seems hard to imagine ever building a website without one of these handy tools, which are normally accessible by either pressing “F12″ in Windows or “Cmd” , “Option” and “I” on the Mac, or by right clicking on the page and selecting “Inspect Element”.

Browser

Development Toolset

Type

Documentation

Chrome

Developer Tools

Integrated

Documentation

Firefox

Firebug

Add-on

Documentation

Internet Explorer

Developer Toolbar

Integrated

Documentation

Opera

Dragonfly

Integrated

Documentation

Safari

Developer Tools

Integrated (Default off)

Overview


But are you using the developer tools to their full potential? The biggest positive about the developer tools is that they are incredibly easy to use, but as a result developers often miss out on a large proportion of the functionality provided. Inspired by
a video talk by Paul Irish and Pavel Feldman, Ive compiled a list of secrets of the developer console. Im not expecting every one of these to be unknown to you, but hopefully some of these will help you to become an even better web developer.

If you have any more secrets, feel free to leave a comment at the end of the article and I’ll update the post once I have verified them. I’d also love to know what developer console you use as your primary development tool, let me know below!

(more...)

발췌 : http://www.andismith.com/blog/2011/11/25-dev-tool-secrets/

posted by 어린왕자악꿍