{"id":440,"date":"2017-10-22T04:26:18","date_gmt":"2017-10-22T04:26:18","guid":{"rendered":"http:\/\/hardy-lavoie.com\/?p=440"},"modified":"2018-11-11T04:27:53","modified_gmt":"2018-11-11T04:27:53","slug":"module-4-image-optimization%e2%80%8b","status":"publish","type":"post","link":"https:\/\/hardy-lavoie.com\/?p=440","title":{"rendered":"MODULE 4: IMAGE OPTIMIZATION\u200b"},"content":{"rendered":"

Optimized Image:<\/p>\n

\"PetronasOptomized\"<\/p>\n

Original Image:<\/p>\n

\"petronas(1)\"<\/p>\n

This was an interesting exercise because I\u2019ve never spent much time thinking about load time when it comes to exporting web graphics. Basically, I\u2019d just \u2018save as\u2019 a JPEG set to \u201chigh\u201d and go with whatever the outcome of it was. Here, I found that achieving\u00a0a decent file size to load time ratio was much more of a finely-tuned process, and not necessarily as easy as it seemed.<\/p>\n

The original image was a whopping 3.09M\u2026not exactly an optimal size for a web page. I used Photoshop (Export -> Save for Web) to lay out four options of varying quality in order to compare the difference between the size and load times of each optimized image. Because this image wasn\u2019t employing a wide range of colors, I decided to save it as a JPEG rather than a PNG. Also, because of the limited color palette, I felt as if I would be able to air on the side of a lower quality optimization without suffering any major visual loss.<\/p>\n

The only discernable\u00a0quality loss is in the lower right-hand corner, around the bright orange-hued light. The edges of the light don\u2019t appear to be as crisp as in the original. However, if the original was not present to compare the optimization against, I feel the viewer may not be quick to judge this imperfection.<\/p>\n

The chosen optimization clocked in at 172.9k and 32 seconds at 56.6kbps. When I loaded both the original and the\u00a0exported version to this blog, I didn\u2019t see a huge difference in load time. This may just be due to the internet speed in the area I am, but I\u2019d\u00a0be interested in hearing if anyone else notices a difference. I\u2019m pleased with the result, but I attribute much of that to the image itself, as it was already quite crisp. I imagine that this exercise\u00a0on an image with a softer focus would be much more difficult to complete.<\/p>\n

<\/div>\n
\n
<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Optimized Image: Original Image: This was an interesting exercise because I\u2019ve never spent much time thinking about load time when it comes to exporting web graphics. Basically, I\u2019d just \u2018save as\u2019 a JPEG set to \u201chigh\u201d and go with whatever the outcome of it was. Here, I found that achieving\u00a0a decent file size to load […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[83],"yoast_head":"\nMODULE 4: IMAGE OPTIMIZATION\u200b -<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/hardy-lavoie.com\/?p=440\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"MODULE 4: IMAGE OPTIMIZATION\u200b -\" \/>\n<meta property=\"og:description\" content=\"Optimized Image: Original Image: This was an interesting exercise because I\u2019ve never spent much time thinking about load time when it comes to exporting web graphics. Basically, I\u2019d just \u2018save as\u2019 a JPEG set to \u201chigh\u201d and go with whatever the outcome of it was. Here, I found that achieving\u00a0a decent file size to load […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/hardy-lavoie.com\/?p=440\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/meaghanhardylavoie\" \/>\n<meta property=\"article:published_time\" content=\"2017-10-22T04:26:18+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-11-11T04:27:53+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mlhlblog.files.wordpress.com\/2017\/10\/petronasoptomized.jpg?w=700\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@MLHL84\" \/>\n<meta name=\"twitter:site\" content=\"@MLHL84\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/hardy-lavoie.com\/#website\",\"url\":\"https:\/\/hardy-lavoie.com\/\",\"name\":\"Meaghan Hardy-Lavoie\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/hardy-lavoie.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/hardy-lavoie.com\/?p=440#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/mlhlblog.files.wordpress.com\/2017\/10\/petronasoptomized.jpg?w=700\",\"contentUrl\":\"https:\/\/mlhlblog.files.wordpress.com\/2017\/10\/petronasoptomized.jpg?w=700\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/hardy-lavoie.com\/?p=440#webpage\",\"url\":\"https:\/\/hardy-lavoie.com\/?p=440\",\"name\":\"MODULE 4: IMAGE OPTIMIZATION\\u200b -\",\"isPartOf\":{\"@id\":\"https:\/\/hardy-lavoie.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/hardy-lavoie.com\/?p=440#primaryimage\"},\"datePublished\":\"2017-10-22T04:26:18+00:00\",\"dateModified\":\"2018-11-11T04:27:53+00:00\",\"author\":{\"@id\":\"https:\/\/hardy-lavoie.com\/#\/schema\/person\/b3d0c0908df37b760d35ed163fd98021\"},\"breadcrumb\":{\"@id\":\"https:\/\/hardy-lavoie.com\/?p=440#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/hardy-lavoie.com\/?p=440\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/hardy-lavoie.com\/?p=440#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/hardy-lavoie.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"MODULE 4: IMAGE OPTIMIZATION\\u200b\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/hardy-lavoie.com\/#\/schema\/person\/b3d0c0908df37b760d35ed163fd98021\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/hardy-lavoie.com\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/8a1327cdafc0f7010f87aa1864663969?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/8a1327cdafc0f7010f87aa1864663969?s=96&d=mm&r=g\",\"caption\":\"admin\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"MODULE 4: IMAGE OPTIMIZATION\u200b -","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/hardy-lavoie.com\/?p=440","og_locale":"en_US","og_type":"article","og_title":"MODULE 4: IMAGE OPTIMIZATION\u200b -","og_description":"Optimized Image: Original Image: This was an interesting exercise because I\u2019ve never spent much time thinking about load time when it comes to exporting web graphics. Basically, I\u2019d just \u2018save as\u2019 a JPEG set to \u201chigh\u201d and go with whatever the outcome of it was. Here, I found that achieving\u00a0a decent file size to load […]","og_url":"https:\/\/hardy-lavoie.com\/?p=440","article_publisher":"https:\/\/www.facebook.com\/meaghanhardylavoie","article_published_time":"2017-10-22T04:26:18+00:00","article_modified_time":"2018-11-11T04:27:53+00:00","og_image":[{"url":"https:\/\/mlhlblog.files.wordpress.com\/2017\/10\/petronasoptomized.jpg?w=700"}],"twitter_card":"summary_large_image","twitter_creator":"@MLHL84","twitter_site":"@MLHL84","twitter_misc":{"Written by":"admin","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/hardy-lavoie.com\/#website","url":"https:\/\/hardy-lavoie.com\/","name":"Meaghan Hardy-Lavoie","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/hardy-lavoie.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/hardy-lavoie.com\/?p=440#primaryimage","inLanguage":"en-US","url":"https:\/\/mlhlblog.files.wordpress.com\/2017\/10\/petronasoptomized.jpg?w=700","contentUrl":"https:\/\/mlhlblog.files.wordpress.com\/2017\/10\/petronasoptomized.jpg?w=700"},{"@type":"WebPage","@id":"https:\/\/hardy-lavoie.com\/?p=440#webpage","url":"https:\/\/hardy-lavoie.com\/?p=440","name":"MODULE 4: IMAGE OPTIMIZATION\u200b -","isPartOf":{"@id":"https:\/\/hardy-lavoie.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/hardy-lavoie.com\/?p=440#primaryimage"},"datePublished":"2017-10-22T04:26:18+00:00","dateModified":"2018-11-11T04:27:53+00:00","author":{"@id":"https:\/\/hardy-lavoie.com\/#\/schema\/person\/b3d0c0908df37b760d35ed163fd98021"},"breadcrumb":{"@id":"https:\/\/hardy-lavoie.com\/?p=440#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/hardy-lavoie.com\/?p=440"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/hardy-lavoie.com\/?p=440#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/hardy-lavoie.com\/"},{"@type":"ListItem","position":2,"name":"MODULE 4: IMAGE OPTIMIZATION\u200b"}]},{"@type":"Person","@id":"https:\/\/hardy-lavoie.com\/#\/schema\/person\/b3d0c0908df37b760d35ed163fd98021","name":"admin","image":{"@type":"ImageObject","@id":"https:\/\/hardy-lavoie.com\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/8a1327cdafc0f7010f87aa1864663969?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/8a1327cdafc0f7010f87aa1864663969?s=96&d=mm&r=g","caption":"admin"}}]}},"_links":{"self":[{"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=\/wp\/v2\/posts\/440"}],"collection":[{"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=440"}],"version-history":[{"count":1,"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=\/wp\/v2\/posts\/440\/revisions"}],"predecessor-version":[{"id":441,"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=\/wp\/v2\/posts\/440\/revisions\/441"}],"wp:attachment":[{"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=440"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=440"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hardy-lavoie.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=440"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}