spacer GIF is a small, transparent GIF image that is used in web design and HTML coding. They were used to view the layout of HTML elements on a web page, at a time when the standard HTML did not allow this. They became mostly obsolete after the adoption of Cascading Style Sheets .

History

David Siegel’s 1996 book Creating Killer Web Sites [1] was known to publish the Spacer GIF technique. According to Siegel, he invented the trick in his living room. [1] [2]

The Cascading Style Sheets (CSS) standard decreases the use of spacer GIFs for laying out web pages. CSS can achieve the same effects in a number of ways, such as by changing the margin or a relative position.

Usage

It was recognizable early on that the size of the table could not be set directly, each cell could contain an image through an <IMG>tag. The size of image tags Could be set indépendamment, With Their WIDTHand HEIGHTattributes. The table cell would then resize itself to just contain this image, thus resizing itself. It was also realized that the size of the image was controlled entirely by the image of the image ( note 1)was still needed). Accordingly, the same image file could be used for all the images. The only requirement was that this image was invisible, or by being transparent.

Spacer GIFs themselves were small transparent image files. GIF files used Were As It Was That was common formats supported transparency , Unlike JPEG . These files were commonly named spacer.giftransparent.gifor 1x1.gif. Prior to the Widespread Adoption of Cascading Style Sheets (CSS), the spacer GIF s Were used to control blank space Within a webpage , That can be resized selon the HTML attributes it is Given. The reason a spacer GIF is invisible is so that an HTMLdeveloper can create a picture with a specific color spacer GIF. For instance, a developer looking for a 500-square- pixel box 500 pixels on a side of a separate blue 500 × 500 graphic at the expense of additional bandwidth. Instead, the developer can specify the size of a pre-existing transparent spacer GIF.

The technique was used around the same time as table-based layout . The web page was considered as a grid-based layout and it was desired to set the size of each grid section independently, as pixel-based sizes. The grid could be coded simply by using the <TABLE>tag, but this was not allowed.

Drawbacks

Designs produced by the designer, but could look completely different on the reader’s display. Different screen resolution, browser rendering engines, as well as user preferences, could change the layout of the design considerably. Many designs became simply unreadable, especially as small-screen and mobile devices became popular.

GIFs could be extremely tedious – especially when making small changes to an existing design.

Obsolescence

The technical Was obsolete for designing web pages by around 2005. Implementation of CSS allowed sizes of HTML objects to be set directly. Although CSS has been adopted, it has been adopted by the GIFs was usable by about 1997.

In addition, table-and-grid-based layouts have been prepared by the reader in an attempt to respond to the growing use of mobile devices to access web content . These design methodologies are the result of two-dimensional layout between elements. Instead of the elements would be offered to the reader’s browser and the browser would place them as best it could, according to the size of the reader’s browsing window. Fluid design layouts made of the setting of page element sizes on the user’s browser less important. This was particularly obvious where pixels are removed. As the web designer had never been able to check the size of the reader’s screen

References

  1. Jump up^ sic– Actually an imagepaper– a file Was not needed, purpose Was invariably used.
  1. Jump up^ Rønn-Jensen, Jesper (2006-03-03). “Justaddwater: Who invented the Spacer GIF” . Justaddwater . Retrieved 2006-11-26 .
  2. Jump up^ Siegel, David (1997-10-02). “The Web is ruined and i ruined it” . XML.com . O’Reilly Media . Retrieved 2015-07-08 .