Image Placeholders – Save Time Creating Sample Images

I recently stumbled across a great resource relating to images. We've all been in the situation where we need to mock up a page quickly. To make the page appear more realistic, it really should have some neatly aligned and floated images or different shapes and sizes. Until now, I would jump into Paint.Net and mock up some images of the required sizes, save them, import them into the project and reference them in the code. http://placehold.it will change all that.

This site provides four-sized images of any size or colour. You can apply textual content that should overlay the image. You can even specify the file type that is rendered in your page.

The service is driven by URL. You just call the specially formatted URL and the desired image is served up for you. For example, the following code will render a rectangular image or dimensions 350px x 150px. You can click here to see the actual rendered image.

http://placehold.it/350x150

This code will render an image of dimensions 800px x 600px and will overlay the text "This is awesome" on it.

<img decoding="async" alt="" src="http://placehold.it/800x600/&amp;text=This%20is%20awesome" />

So, you can see there are some great possibilities for this service. Go over to http://placehold.it and check out more details.

Til next time ...