Oct 2014 24

Easily determine the font and font properties of text on a web page with the What Font? Chrome browser extension. Much faster and easier than looking for the font in an inspector.

Download on the Chrome Web Store

whatfont

Share
Oct 2014 21

Recently I wanted to take a picture of one of my bathrooms. Unfortunately, the half bathroom is a bit small and my phone’s camera couldn’t take a shot that could show most of the bathroom. Even though my phone, a Samsung Galaxy Note 3, has a pretty impressive panoramic picture feature, it only creates horizontal panoramas. Fortunately, though, there is a free program called Panorama Plus which can take a series of photos and stitch them all together. Below are the individual pictures I took of the bathroom from different angles and below them is the panorama of all of those pictures stitched together. Not bad!

individual-pics [..]

Share
Oct 2014 21

Google Chrome Inspector’s Network tab allows you to see HTTP requests and responses when a page is loaded. However, by default, if you click on a link and go to another page, the network log is cleared and HTTP requests and responses for the new page is shown. If you’d like to preserver the network log across multiple pages / page loads, click the Preserve Log checkbox. This is especially handy if you are filling out a form which posts to a page that causes a page reload and you want to see the request form data sent.

preserve-log

Share
Oct 2014 17

To see the diff of a file between two non-sequential revisions, open the log for a file and select the two revisions and then click the Change button as shown in the screenshot below.

diff

Share
Oct 2014 15

We all know that images are the heaviest assets of websites by file size and should be optimized first more than anything else. Pretty much everyone uses Photoshop’s Save-for-Web to optimize images for web use. But, it’s possible to easily get even smaller file sizes without any noticeable different in image quality. I recently tested a service called Kraken (https://kraken.io/) and it reduced a banner background image by 44% (126 KB).

Without Kraken: 282KB
With Kraken:     157KB

The two images are below. Can you tell any difference between the two? Click on the image to see a larger version.

code-background3-compare

 

Update: Actually, Compressor (https://compressor.io/compress) was able to compress the image by even more (70%)!

Some other image optimization sites are:

  • https://tinypng.com/
  • http://pnggauntlet.com/
  • http://optimizilla.com/
Share
Page 1 of 7112345102030...Last »