Link tags: picture

160

sparkline

Responsive Images the Simple Way - Cloud Four

A nice succint explanation of using the srcset and sizes attributes on the img element—remember, you probably don’t need picture and source elements if your use case is swapping out different sized versions of the same image.

One caveat thought: you do need to know the dimensions of the images. If you’re dealing with unknown or user-generated photos, that can be an issue.

Pure CSS Landscape - An Evening in Southwold

This is not an image format. This is made of empty elements styled with CSS. (See for yourself by changing the colour value of the sun.)

2019-11-17 – florian.photo

These are great photos of the speakers at Beyond Tellerrand—great captures of Sharon, Cassie, and Charlotte.

The Department of Useless Images - Gerry McGovern

The Web is smothering in useless images. These clichéd, stock images communicate absolutely nothing of value, interest or use. They are one of the worst forms of digital pollution because they take up space on the page, forcing more useful content out of sight. They also slow down the site’s ability to download quickly.

Queen Mary 2 | Flickr

Jessica’s photos from our transatlantic crossing. Swanky!

Sunset from the Commodore Club

Reducing motion with the picture element

Here’s a clever tiny lesson from Dave and Brad: you can use prefers-reduced-motion in the media attribute of the source element inside picture.

IndieWebCamp Düsseldorf 2019 | 2 | Flickr

Today was a good day …and here are the very good photos.

IMG_2295

Science and Tech Ads on Flickr

Stylish! Retro! Sciency!

Martin ad

I commissioned an oil painting of Barbra Streisand’s cloned dogs

There’s something deliciously appropriate about using a painting cloning service to clone a photograph of some cloned dogs.

“Did you just order an oil painting of Barbra Streisand’s dogs?” is the most Simon and Natalie thing ever.

Although this comes close:

I took it to the framing store and asked if they could do something with “an air of existential dread”… and they nailed it too!

1969 & 70 - Bell Labs

PIctures of computers (of the human and machine varieties).

Control Panel

Analogue switches, dials, and buttons, buttons, buttons (just like that Flickr group I linked to).

Using SVG as placeholders — More Image Loading Techniques - JMPerez Blog

Here’s a clever to technique to improve the perceived performance of image loading with a polygonal SVG placeholder.

Now and Then Cobh

Time-shifted photographs of my hometown in Ireland.

Patterns Day 2017 | Flickr

Marc took some great pictures at Patterns Day.

In the break

Control Panel | Flickr

Photos of analogue interfaces: switches, knobs, levers, dials, buttons, so many buttons.

NASA – Past and Present Dreams of the Future | Benedict Redgrove

A selection from an ongoing photography project—seven years and counting—leading up to the launch of the Orion project.

70s Sci-Fi Art

Sci-fi book covers and posters from the 1970s.

IndieWebCamp Brighton 2016 | Flickr

Lovely, lovely photos from this weekend’s Indie Web Camp.

IndieWebCamp Brighton 2016

IndieWebCamp Nuremberg on Flickr

Great photos from a great gathering.

IndieWebCamp Nuremberg in motion