2.5 Compressing Images and Videos¶
During Week 1, I struggled greatly with using the best format for my images. There were times that my storage was over 200MB, and I was very stressed about this. I knew that I could take my images and shrink them to under 300 x 300 pixels. (In the Photos App on my PC, I was able to change the width and height of the photo [See Screenshot below]).
However, when I shrank the images to this size, many of them were too blurry to read. I decided I would try placing four images on one page in Microsoft Word and take a screemshot of the four images together, and I labeled each image with a letter (or comnination of letter)– made by a text box also in Microsoft Word. I had over 48 images at that time, and it took about three hours to format them this way. The overall file size was dropped quite a bit, but it was still very high.
I decided to start loading the newly-created screenshots of four images per page. I was waiting to commit and push the changes until I had everything on the page. When I went to commit and push the changes, I got the “broken pipe” error, and nothing was going onto the website. I spent nearly 7 hours trying to figure out how to fix the error. After about five hours, I spoke to my daughter (a computer science major), and she suggested that I do an Internet search using the error message I was getting. I read several articles and chats about how to fix it. When I went to try them, nothing seemed to work.
I reached out to my adult classmates in Fab Academy, and Nidhie Dhiman suggested that I create a new SSH key and clone the repository again. I took her advice and created the new SSH key (this time, I was much faster at it!). Generating a new SSH key did not help my problem. So I read the message that I was getting just before the error message; I copied that part and did an Internet search with it. I learned that I could reset the page entirely. So I copied abd pasted all of the work on my pages into a Microsoft Word document as a backup. doing the hard “Reset” fixed the issue, but many of my four-image screenshots were gone.
I went back to formatting them the same way as before. This time, I gave each screenshot a number; this was very time-consuming. I was able to get the number of screenshots reduced by 75%. I did another Internet search about ways to reduce image size. After sifting through a lot of information, I came across Tiny png. I tested out my four-image screenshots, and the file sizes were significantyly reduced. I was able to get the total storage down to ~52MB. Resizing images to below 300 pixels in the Photos App on my computer is utilized by the same screenshot as above.
In speaking with Dr. David Taylor about my images, he suggested that (because the writing on my shrunken images were barely readable) tha I use a table and reference numbers in the screenshot. This wound up being a great idea, and I looked up (on the Internet) how to created a table in markdown language. On Tuesday (Feb 1), I met with Dr. Fagan to review my first week’s worth of work. We discussed all of my issues with the images, and we tested out another method for reducing the file sizes. The method that worked the best was to resize the largest dimension to 300 pixels and reduce the the image qquality to about 30%. However, when I went to use this “Workflow” at home, I was not getting the option in the Photos App to change the image quality.
This week, I tested even more methods for reducing my file sizes, and I think I have found the best workflow. I remembered Dr. Gershenfeld saying that jpg’s were the best file. All of my files were png’s, I took the prebious week’s worth of images and used Tiny png to reduce them. Then, I opened them in the Photos App on my computer and saved them as jpg’s. When prompted if I wanted to replace the image, I chose “yes”.
This week, as I was adding more photos to my assignment, I started off by taking my images into Microsoft Word and taking a screenshot of multiple images together on one page. I then ran the screenshots through Tiny png, and the file sizes were reduced by over 50%. As I did this, it dawned on me that the website is called Tinypng. I was doing this workflow in the wrong order. I saved the screenshots first as a png in the Photos App. Then, I rant the .png’s through the Tiny png website. Once the file sizes were reduced, I then downloaded the new files onto my computer. I opened each file in the Photos App and saved the images as a .jpg. Adding .png’s to Tiny png was more effective than running .jpg’s through Tiny png. The screenshot below shows my comparisons.
