akd-io / akd-io-website

Personal website of Anders Damgaard
https://akd.io
1 stars 0 forks source link

Eliminate content jump because of unknown image size during page load #2

Closed akd-io closed 5 years ago

akd-io commented 5 years ago

Currently, if viewing the site on a slow network, the content on the page will jump when the page receives the size of the profile picture. This can be eliminated by giving the -tag a width and height. What is the best solution here, the image being responsive?

akd-io commented 5 years ago

This blog post on Medium's progressive image loading mentions how padding-bottom's percentage values are based on the width of the parent instead of the height, making that the easiest way to give a placeholder the same aspect-ratio as the image to replace it. This is also know as Intrinsic Placeholders.