• Posts
  • RSS
  • ◂◂RSS
  • Contact

  • Picture Infrastructure

    January 15th, 2015
    pictures, blog, tech  [html]
    Every year I go back over the pictures I have and put up a selection of them under jefftk.com/pictures. For the first eight years or so this was just a simple list of thumbnails linking to larger versions of the images:
      <a href="family_dinner.jpg">
        <img src="family_dinner-tn.jpg"></a>
      <a href="alex_jeff_alice_rick_music.jpg">
        <img src="alex_jeff_alice_rick_music-tn.jpg"></a>
      <a href="davy_alex.jpg">
        <img src="davy_alex-tn.jpg"></a>
    
    Clicking on a picture, viewing it, and clicking back is kind of annoying, so I added a lightbox view last year. This year I wanted a better experience on my phone, so I rewrote the lightbox code to handle phones. [1]

    Over time the thumbnails got bigger and bigger as ideas about acceptable bandwidth have changed:

    year height
    2005 96px
    2006 96px
    2007 96px
    2008 96px
    2009 96px
    2010 128px
    2011 200px
    2012 300px
    2013 300px
    2014 400px
    At this point the 96px thumbnails are awkwardly small, so I've now gone back over all the years to bring thumbnails up to size and add the mobile-suporting changes I had made for 2014. I've also added srcset support for 2x displays:

       sed 's~img src="\([^"]*\)-tn.jpg"~
              img src="\1-tn.jpg"
                  srcset="\1-tn.jpg 1x, \1-2x.jpg 2x"~'
    

    (Historical consistency was very helpful here.)


    [1] Code is on github.

    Recent posts on blogs I like:

    Learning Worst Industry Practices

    If I have a bad idea and you have a bad idea and we exchange them, we now have two bad ideas. But more than that. If I have a bad idea and you have a good idea and we exchange them, we should both land on your good idea – but that requires both […]

    via Pedestrian Observations September 20, 2020

    Collections: Iron, How Did They Make It? Part I, Mining

    This week we are starting a four-part look at pre-modern iron and steel production. As with our series on farming, we are going to follow the train of iron production from the mine to a finished object, be that a tool, a piece of armor, a simple nail, a w…

    via A Collection of Unmitigated Pedantry September 18, 2020

    Learning Game

    I came up with this game. In the game one person thinks of something and then gives the other person a clue. And the other person writes a guess down on a blackboard or a piece of paper. Or really anything you have that's laying around that's av…

    via Lily Wise's Blog Posts September 17, 2020

    more     (via openring)


  • Posts
  • RSS
  • ◂◂RSS
  • Contact