Help:Whitespace
Whitespace is blank space that appears on the published version of a Wikipedia page in any namespace. It is not occupied by any characters, templates, multimedia, or anything else. In other words, it appears white.
Whitespace is not always desirable. It can give the page an untidy appearance and make the article look incomplete. But it cannot always be avoided, and there are times when it may actually come in handy when added in small amounts.
Causes of whitespace
[edit]Table of contents
[edit]On pages with multiple headings, a table of contents listing the headings is automatically generated. When this occurs, the table of contents box will appear on the left side of the page between the lead section and the first heading. There will be no text to the right of the table of contents, though an image or a vertical template, such as an infobox, will appear in the space to the right if formatting causes it to require that space. Still, no text will appear in the space in between; it'll be white (as you notice, there is some white space between the TOC box and the image above).
There are various ways to modify the appearing of the table of contents. Entering the templates {{TOC left}} or {{TOC right}} at the top of the page will produce a table of contents to the left or right that does share its lines with some text. The magic word __NOTOC__ will cause the table of contents to be altogether absent, which for some pages may be necessary.
It is also possible to produce your own table of contents as follows:
{| id="toc" class="toc" summary="Contents"
! {{MediaWiki:Toc}}
|-
|[[#Heading 1|Heading 1]] {{·}} [[#Heading 2|Heading 2]] {{·}} [[#Heading 3|Heading 3]]
[[#Heading 4|Heading 4]] {{·}} [[#Heading 5|Heading 5]] {{·}} [[#Heading 6|Heading 6]]
__NOTOC__
|}
In an automatically generated table of contents, there will be one listing per line. But in a self-produced table of contents, multiple listings can be condensed into one line, as much as space allows, using the line break (<br />) text to mark the end of a line. The drawback to this is that you will have to manually add, remove, or modify headings as they are edited on the page. Still, it'll reduce the amount of whitespace on the page.
Templates
[edit]Whitespace cannot easily be avoided when a page with little text, often a stub, contains an infobox or similar vertical template that is quite tall along with a navbox or similar horizontal template at the bottom, and the amount of text on the page takes up far less space than the template to the left. Even without a horizontal template, there may still be a lot of whitespace to the left of the template between the final line of text and the category box at the bottom.
Images
[edit]Sometimes, images can contribute to whitespace. But the size of images can be controlled, so if an image is causing there to be a lot of whitespace, it may be worth reducing the size of the image, even just a little, in order to fill more of that space with text (depending on display width). Beware, though, of making one image significantly narrower than all others.
On a short page, a single image may be to blame for whitespace. If the height of the image is greater than that of the text, there will be some whitespace at the bottom.
On a longer page divided by multiple headings, it may be desirable to provide a small amount of whitespace by using the {{Clear}} family of templates so the image does not protrude into the next paragraph or section. Using several blank lines, <br /> tags or {{Break}} will not work correctly for all display widths, and surplus blank lines are removed by a number of processes.
Many infoboxes take an image, so if an image is placed there, it'll add more height that may benefit from balancing with text and other left-justified content.
Invisible comments
[edit]Comments in the wikicode added by <!-- Comment --> can contribute to whitespace. Format the comment to avoid this, by ensuring either that the initial < touches the text immediately beforehand, or that the final > touches the text immediately afterwards:
... the end of a paragraph. <!-- Don't use hidden comments in this manner --> The beginning of a paragraph ... ... the end of a paragraph. <!-- but doing it this way is fine -->The beginning of a paragraph ... ... the end of a paragraph.<!-- and so is doing it like this --> The beginning of a paragraph ...
Addressing the whitespace issue
[edit]Sometimes, when you have undesirable whitespace, the best way to solve the problem is to expand the article (with suitable content).
Sometimes, a minor fix will help eliminate or reduce whitespace. This may involve adding or removing one blank line from some part of the page, re-ordering templates, or the use of a gallery for multiple images. If an embedded list creates white space, using two or more columns may solve the problem.
Caveats
[edit]Avoid "fixing" white space issues which are peculiar to your combination of screen, window, and font sizes, your choice of browser, your image settings, and so on. Check with other settings or systems, or ask other editors to check them for you.
Avoid "fixes" which break the appearance of the page on mobile devices. Again, if you do not have a suitable device on which to check, other editors can advise you.