# Is there a reason for images loading from the top?

**URL:** <https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252>\
**Category:** Factual Questions\
**Created:** [July 16, 2014, 6:20am UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252 "2014-07-16T06:20:40Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![Artemis\_Tardis](https://avatars.discourse-cdn.com/v4/letter/a/4bbf92/32.png) [@Artemis\_Tardis](https://boards.straightdope.com/u/Artemis_Tardis)\
**Post date:** [July 16, 2014, 6:20am UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/1 "2014-07-16T06:20:40Z")

</div>

It was quite visible on Dial-Up ages: Images would load painfully slow… from the top to the bottom. I can only imagine the frustration of a Teenage boy “studying”, only to find out that the image was cropped. Is there a reason for that? I mean, the image would load just fine if it loaded from left to right or whatever. Is is just the sequence of data that is written the same way as words? Or is there technical / logical reason for that?

---

<div class="post-metadata">

**Author:** ![kk\_fusion](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/kk_fusion/32/15276_2.png) [@kk\_fusion](https://boards.straightdope.com/u/kk_fusion)\
**Post date:** [July 16, 2014, 6:41am UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/2 "2014-07-16T06:41:01Z")

</div>

A digital image on your screen is always a rectangular array of pixels, which can, for technical matters, be processed in any geometrical manner. So any reason why your download shows up line-by-line from the top will eventually boil down to “that’s the way we read a printed page”.

---

<div class="post-metadata">

**Author:** ![Isilder](https://avatars.discourse-cdn.com/v4/letter/i/cc9497/32.png) [@Isilder](https://boards.straightdope.com/u/Isilder)\
**Post date:** [July 16, 2014, 6:46am UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/3 "2014-07-16T06:46:49Z")

</div>

There were interlaced GIF’s which would draw lines at various places down the page early on , and then fill then in. Like top, middle, bottom, top ,middle, bottom…  
Well as it turns out, few people bother to set that on, or to add it into their sofware,  
so mostly the jpegs are linear not interlaced.

See [Interlacing (bitmaps) - Wikipedia](http://en.wikipedia.org/wiki/Interlacing_%28bitmaps%29)

---

<div class="post-metadata">

**Author:** ![Francis\_Vaughan](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/francis_vaughan/32/3093_2.png) [@Francis\_Vaughan](https://boards.straightdope.com/u/Francis_Vaughan)\
**Post date:** [July 16, 2014, 7:19am UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/4 "2014-07-16T07:19:25Z")

</div>

Historically, CRT screens scanned from top left. So when a graphics buffer was designed, it would usually address the on screen pixels in the lower quarter plane coordinate space. From there it is a short step to defining the screen coordinates this way, and thence to populating image files in the same manner.

As noted, it is possible to create compression formats that fill the image differently. Especially loading a coarse resolution version, and incrementally improving the resolution in stages. Jpeg supports this in the progressive format. Creating images in this manner had more popularity in the early days of the Internet, for much the reason the OP suggests. They are still supported, but the advent of higher bandwidths seems to have left most people unaware of the option to create them. Which is a pity.

---

<div class="post-metadata">

**Author:** ![njtt](https://avatars.discourse-cdn.com/v4/letter/n/ecd19e/32.png) [@njtt](https://boards.straightdope.com/u/njtt)\
**Post date:** [July 16, 2014, 7:43am UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/5 "2014-07-16T07:43:46Z")

</div>

> [@Francis\_Vaughan](#):
>
> Historically, CRT screens scanned from top left. So when a graphics buffer was designed, it would usually address the on screen pixels in the lower quarter plane coordinate space. From there it is a short step to defining the screen coordinates this way, and thence to populating image files in the same manner.
> 
> As noted, it is possible to create compression formats that fill the image differently. Especially loading a coarse resolution version, and incrementally improving the resolution in stages. Jpeg supports this in the progressive format. Creating images in this manner had more popularity in the early days of the Internet, for much the reason the OP suggests. They are still supported, but the advent of higher bandwidths seems to have left most people unaware of the option to create them. Which is a pity.

I don’t think it is a pity at all! In fact some sites do still do this - the image first appears entire but blurry, and gradually get sharper! I hate it! It hurts my eyes as they involuntarily try to focus the blurry image. I have to look away or shut my eyes until it has loaded properly. There is no such problem with images that load from the top. (I have a 30Mbps connection, but some sites still take a few seconds to load their images.)

---

<div class="post-metadata">

**Author:** ![Heracles](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/heracles/32/487_2.png) [@Heracles](https://boards.straightdope.com/u/Heracles)\
**Post date:** [July 16, 2014, 10:19am UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/6 "2014-07-16T10:19:47Z")

</div>

For those willing to forego compression, the Windows BMP format can, and often does, store pixels bottom-to-top. Apparently this reflects [the in-memory layout](http://msdn.microsoft.com/en-us/library/windows/desktop/dd407212%28v=vs.85%29.aspx).

---

<div class="post-metadata">

**Author:** ![ftg](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/ftg/32/2801_2.png) [@ftg](https://boards.straightdope.com/u/ftg)\
**Post date:** [July 17, 2014, 6:48pm UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/7 "2014-07-17T18:48:22Z")

</div>

In the GIF89a [standard](http://www.w3.org/Graphics/GIF/spec-gif89a.txt), there are fields for Image Left Position and Image Top Position to specify relative orientation of the image wrt the screen orientation. So one can encode an image upside-down or right-left or both.

Sometimes one came across such an alternately encoded image. Some decoders would be thrown off and display the image upside-down.

I believe similar fields exist for jpeg and tiff images. It’s custom, not a requirement.

---

<div class="post-metadata">

**Author:** ![eschereal](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/eschereal/32/18939_2.png) [@eschereal](https://boards.straightdope.com/u/eschereal)\
**Post date:** [July 17, 2014, 6:58pm UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/8 "2014-07-17T18:58:54Z")

</div>

Curiously, for a given compression ratio (image quality), I was finding that selecting “progressive” for jpegs tended to create slightly smaller file sizes. If server space is tight, one might do whatever they can to make best use of it (gotta upload all three thousand of those 20MP wedding pictures).

---

<div class="post-metadata">

**Author:** ![Blaster\_Master](https://avatars.discourse-cdn.com/v4/letter/b/cab0a1/32.png) [@Blaster\_Master](https://boards.straightdope.com/u/Blaster_Master)\
**Post date:** [July 17, 2014, 8:16pm UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/9 "2014-07-17T20:16:24Z")

</div>

There’s a few different things at work here, most of which have been touched on. First, very few images you’ll see online are just bitmaps, what you’re likely to see on a given webpage are jpg or gif. It’s been a while since I was working with jpg compression, but the general idea is that it takes groups of pixels (IIRC 8x8 blocks), performs various steps to cut out unimportant information (FFT frequency filtering, quanitzation, etc) and then compresses what’s left. This can be exploited to have the data load in a few different methods, whether it is each block or line one at a time, from low-resolution to high resolution, or perhaps some other method. Regardless, it has to store the data somehow, and with imagines, generally the (0,0) point is the top left.

That all said, I think websites will have a tendency to encode in that way so that particularly low bandwidth visitors can start to see some information right away and have a visual indicator of how far along. Why not show some of the data in real time as you can? And if so, whether it loads top to bottom, bottom to top, or left to right is arbitrary, so basically, why not just start from the beginning to the end? As someone mentioned, you can change that, but that might cause issues, plus it would mean putting in the extra effort of figuring out for each image what the “ideal” load direction would be, so I imagine that they just would leave it alone.

---

<div class="post-metadata">

**Author:** ![ftg](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/ftg/32/2801_2.png) [@ftg](https://boards.straightdope.com/u/ftg)\
**Post date:** [July 18, 2014, 4:45pm UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/10 "2014-07-18T16:45:09Z")

</div>

I just did some checking about jpeg formats. The older standard encoding: JFIF, doesn’t seem to have an orientation flag. But the newer one: EXIF used by cameras in particular, [does](http://en.wikipedia.org/wiki/Exif#Example).

That’s a good idea: the camera might be rotated relative to the object and it helps if the proper “right side up” can be embedded.

So if someone took a picture using a digital camera that has an orientation sensor (like many smart phones), then the bottom might be seen to load first on a slow loading web page.

---

<div class="post-metadata">

**Author:** ![Claverhouse](https://avatars.discourse-cdn.com/v4/letter/c/13edae/32.png) [@Claverhouse](https://boards.straightdope.com/u/Claverhouse)\
**Post date:** [July 18, 2014, 5:51pm UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/11 "2014-07-18T17:51:11Z")

</div>

> [@njtt](#):
>
> I don’t think it is a pity at all! In fact some sites do still do this - the image first appears entire but blurry, and gradually get sharper! I hate it! It hurts my eyes as they involuntarily try to focus the blurry image. I have to look away or shut my eyes until it has loaded properly. There is no such problem with images that load from the top. (I have a 30Mbps connection, but some sites still take a few seconds to load their images.)

Don’t get me started on ‘_Lazy Load_’ websites, or the equally foul ‘_Infinite Scroll_’ whereby a page goes on forever like a dusty road.

> [@Heracles](#):
>
> For those willing to forego compression, the Windows BMP format can, and often does, store pixels bottom-to-top. Apparently this reflects [the in-memory layout](http://msdn.microsoft.com/en-us/library/windows/desktop/dd407212%28v=vs.85%29.aspx).

BMP ! There’s a word that takes one back, used to be part of the Web, like blinking marquees and hit counters.

---

<div class="post-metadata">

**Author:** ![dstarfire](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/dstarfire/32/5762_2.png) [@dstarfire](https://boards.straightdope.com/u/dstarfire)\
**Post date:** [July 18, 2014, 6:18pm UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/12 "2014-07-18T18:18:37Z")

</div>

In many programming languages, coordinate 0,0 refers to the top left corner. So, most data handling routines (including image transfer and compression) will try to provide data for that coordinate first.

---

<div class="post-metadata">

**Author:** ![eschereal](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/eschereal/32/18939_2.png) [@eschereal](https://boards.straightdope.com/u/eschereal)\
**Post date:** [July 19, 2014, 12:06am UTC](https://boards.straightdope.com/t/is-there-a-reason-for-images-loading-from-the-top/693252/13 "2014-07-19T00:06:04Z")

</div>

Coördinate system orientation is not really part of a language, rather it is part of the OS. QuickDraw, the original Macintosh graphic engine, was that way, but for some reason in NeXT/OS X, they switched the origin to the bottom left, like a traditional Cartesian graph. Luckily, the programmer is provided an option to reverse the Y ascent, making scroll views much easier to deal with.
