Debugging pages in the browser developer tools.
8 notes tagged
Twenty five questions on the parts of front end work that touch the business directly, and where a markup answer is expected rather than a marketing o...
Twenty five questions where you predict what the browser produces, or find what is wrong. The format that exposes what you actually understand.
A symptom to cause lookup for the problems that come up repeatedly, and the two minute checks that resolve most of them.
The validator catches nesting errors, duplicate ids and missing attributes in seconds. A page that renders is not the same as a page that is correct.
The Console reports what went wrong. The Network panel shows what was requested, in what order, and how big it was. Between them they explain most pag...
The Elements panel shows the live DOM, not your file. That difference is why it is the first place to look when markup behaves in a way the source doe...
Automated tools find about a third of problems. Here is what they catch, what they miss, and a manual routine that takes fifteen minutes.
Parsing, the DOM, style matching, layout and paint. Knowing this pipeline explains why script placement matters, why images need dimensions, and why b...