When designing user interfaces, preferably you have access to or at least considered the actual content, before deciding on the structure and layout - thus letting the message dictate the form.
However, in many circumstances you don't have the final content, in particular when working on wireframe level. Thus you might need placeholders to indicate what pieces of content goes where on a web page or app.
For text content it is quite straight-forward. For visual content, such as images and videos, it's a bit more tricky.
For this purpose I have created a responsive image placeholder for HTML/CSS wireframes - presented on Codepen.