Swimburger

Implementing Responsive Images in Umbraco

Niels Swimberghe

Niels Swimberghe - - Umbraco

Follow me on Twitter, buy me a coffee

Phone/Tablet/Laptop displaying Umbraco logo

For many years, the web platform had responsive image capabilities such as the srcset-attribute, sizes-attribute, and the picture-element. Major browsers also have supported these capabilities for some time now. (Caniuse: srcset & sizes, picture)
Unfortunately, these capabilities are often not used because they seem daunting at first and become a lot of work to maintain. In this blog post we’ll learn the basics of these responsive image capabilities and how to make them available and maintainable to Umbraco content editors.

I wrote this post for 24days.in 2019, head over to 24days.in for the full article.

 

Read article on 24days.in

 

Related Posts

See All Posts
See All Posts

Related Posts

Robot with Umbraco logo

Crawling through Umbraco with Robots

- Umbraco
The robots.txt file’s main purpose is to tell robots (Google Bot, Bing Bot, etc.) what to index for their search engine, and also what not to. Usually you want most of your website crawled by Google, such as blog posts, product pages, etc., but most websites will have some pages/sections that shouldn’t be indexed or listed in search engines.
Azure Application Insights logo + Umbraco logo

Ignoring Umbraco ping.aspx from Azure Application Insights

- Umbraco
Application Performance Monitors provide you with a lot of data, but some of that data may not be relevant. Specifically, in Umbraco there is a page at \umbraco\ping.aspx that is being called frequently to keep the site alive. This is very useful to prevent the site from "dying" (?), but the data for this request isn't that relevant and could skew your statistics. Using Azure Application Insights ITelemetryProcessor, we can prevent ping request from being sent to Azure Application Insights.
Spider Web with Umbraco logo

Crawling through Umbraco with Sitemaps

- Umbraco
Websites come in all shapes and sizes. Some are fast, some are beautiful, and some are a complete mess. Whether it's a high-quality site is irrelevant if people can’t find it, but search engines are here to help. Though the competition to get on first page is tough, this series will dive into some common practices to make your website crawlable.