-<h4>Finished the <code>HEAD</code>? Continue with the <code>BODY</code>!</h4>
-<p>
-Once the <code>HEAD</code> element has been reduced, you need to start reducing
-the number of required elements in the <code>BODY</code>. This will tend to be the
-most time consuming since hundreds (thousands) of elements will be
-present. The general practice is start removing elements by both their
-<code><start></code> and <code></end></code> elements. This is especially true for
-tables, which are frequently nested. You can speed up this process by
-selecting groups of elements and removing them but ideally you need to
-save and reload the test case each time to verify the problem is
-happening.
-</p>
-<p>
-Another way to help you identify unnecessary elements is to temporary
-uncheck 'Enable Javascript' in the Preferences. If you turn this option
-off and loading your test case still reproduces the problem, then any
-script elements that are present can be removed since they are not a
-factor in this issue. Let's say that you have reduced the page down to
-a nested table with an ordered list with an <code><link></code> element that need
-to be present. It's good practice to identify that CSS rule that is
-being in the external file and add it directly to the test case. Create
-a <code><style></code> <code></style></code> in the head and copy/paste the contents
-of the .css file into this style element. Remove the <code><link></code> and
-save the changes. Load the test case and verify the problem is still
-occurring. Now manually delete or comment out each CSS rule until you
-have just the required set of rules to reproduce.
-</p>
-</div>
-</body>
-</html>
+ <h4>The first steps</h4>
+ <p>
+ Really the first step in reducing a page is to identify that main
+ problem of the page. For example:
+ <ul>
+ <li>Does the page have text overlapping an image? </li>
+ <li>Is there a form button that fails to work?</li>
+ <li>Is there a portion of the page missing or misaligned?</li>
+ </ul>
+ </p>
+ <p>
+ After you have made this determination, you need to create a local copy
+ of the page created from the page source window. After saving this
+ source, it's a good idea to put a <code><BASE></code> element in the
+ <code>HEAD</code> so that any images/external style sheet or scripts that use a
+ relative path will get loaded. After the <code>BASE</code> element has been added,
+ load the local copy into the browser and verify that problem is still
+ occurring. In this case, let's assume the problem is still present.
+ </p>
+
+ <h4>Work from top to bottom</h4>
+ <p>
+ In general, it's best to start from the top of the <code><DOCTYPE></code> and
+ work down through the <code>HEAD</code> to the <code>BODY</code> element. Take a look at the HTML
+ file in a text editor and view what types of elements are present in the
+ <code><head></code>. Typically, the <code>HEAD</code> will include the <code><title></code>
+ element, which is required, and elements such as <code><link></code>,
+ <code><style></code> and <code><script></code>.
+ </p>
+ <p>
+ The reduction process is to remove one element at a time, save, and reload the
+ test case. If you have removed the element and the page is still
+ displaying the problem, continue with the next element. If removing an
+ element in the <code>HEAD</code> causes the problem to not occur, you may have found
+ one piece in of the problem. Re-add this element back into the <code>HEAD</code>,
+ reload the page and confirm the problem is still occurring and move
+ on to the next element in the <code>HEAD</code>.
+ </p>
+
+ <h4>Finished the <code>HEAD</code>? Continue with the <code>BODY</code>!</h4>
+ <p>
+ Once the <code>HEAD</code> element has been reduced, you need to start reducing
+ the number of required elements in the <code>BODY</code>. This will tend to be the
+ most time consuming since hundreds (thousands) of elements will be
+ present. The general practice is start removing elements by both their
+ <code><start></code> and <code></end></code> elements. This is especially true for
+ tables, which are frequently nested. You can speed up this process by
+ selecting groups of elements and removing them but ideally you need to
+ save and reload the test case each time to verify the problem is
+ happening.
+ </p>
+
+ <h4>Another method</h4>
+ <p>
+ Another way to help you identify unnecessary elements is to temporary
+ uncheck 'Enable Javascript' in the Preferences. If you turn this option
+ off and loading your test case still reproduces the problem, then any
+ script elements that are present can be removed since they are not a
+ factor in this issue. Let's say that you have reduced the page down to
+ a nested table with an ordered list with an <code><link></code> element that need
+ to be present. It's good practice to identify that CSS rule that is
+ being in the external file and add it directly to the test case. Create
+ a <code><style></code> <code></style></code> in the head and copy/paste the contents
+ of the .css file into this style element. Remove the <code><link></code> and
+ save the changes. Load the test case and verify the problem is still
+ occurring. Now manually delete or comment out each CSS rule until you
+ have just the required set of rules to reproduce.
+ </p>
+
+ <h4>Adding to the bug</h4>
+ <p>
+ When you've finished your reduction, you should add it to the bug. It's quite likely
+ that in the process of reducing, you have found the root cause of the problem, so
+ you are able to set the right component. If you do not have the rights to change
+ the component, read about how to get them in this <a href="bugzilla.html">document
+ about Bugzilla</a>.
+ </p>
+<?php
+ include("../footer.inc");
+?>
\ No newline at end of file
git://git.webkit.org / WebKit-https.git / blobdiff