Kraken.io: Reduce Image File Size More Than Photoshop Save-for-Web

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/

The Different Types of Dashes

Hyphen
You know how to type a hyphen and that’s exactly why you use it so often in all the wrong places. The hyphen is used to break single words into parts (like when lines of type break within a word) or to combine separate words into one single words.
I’m hungry in a get-in-my-belly kind of way.

En dash
The en dash is used in dates to replace “to” or “and”. It can also be used to indicate the relationship between two different words. In German it is also used for a break of thought, with a space before and after the en dash.
I lived in the United States from 1976–1978.
I have a love–hate relationship with San Francisco.

Em dash
The em dash is used for a break of thought that is stronger than a thought within parentheses. It is a break in the sentence in order to create attention or stress a thought. The em dash is uncommon in the German language and most common in American type setting.
I once had to replace 1,000 hyphens in a single document—exhausting.

For more related information, visit http://www.typogui.de/

Simple PHP MVC Framework

When building a website with PHP, there are many frameworks you can choose from. However, they usually are very advanced with tons of features and sometimes a steep learning curve. If your needs are simple but you’d still like to build you site in a modular MVC-based fashion, PHP-MVC is a nice, light-weight alternative. You can learn more about it at https://github.com/panique/php-mvc.

Below is a screenshot showing you how simple the file structure is.

php-mvs

 

Update: another nice and simple PHP MVC framework is Simple MVC Framework.

simplemvcframework

which include some key plugins / extensions like PDO for safe, database-agnostic SQL and GUMP for form input validation.

Windows: Move All Nested Files in Subfolders into Current or Parent Folder

Last night I came across a situation where I had 447 folders each containing many subfolders and with only one file in the last subfolder. I needed a way to move all of these nested files into one parent folder. Luckily, there’s a small free program called Suction that can do this very easily. A screenshot is below. It worked perfectly and quickly.

suction

How to Set Up a Domain Name

STEP 1: Purchase Domain at Domain Registrar

e.g. abdullahyahya.com is registered at godaddy

  • GoDaddy
  • Hover
  • Gandi
  • etc

 

How to find where a domain is registered?
Do a whois lookup, e.g. http://www.whois.com/whois/abdullahyahya.com

 

STEP 2: Set Domain Name’s Name Servers at Domain Registrar’s Control Panel

e.g. below is the control panel to set the name servers for abdullahyahya.com

nameservers Continue reading How to Set Up a Domain Name

Boilerplate Configs for Various Web Servers

When setting up a web server, if it’s one of the following

  • Apache
  • Google App Engine (GAE)
  • Internet Information Services (IIS)
  • lighttpd
  • Nginx
  • Node.js

you may want to start or compare  your config with some boilerplate configs you can find at

https://github.com/h5bp/server-configs

Many best practices and optimization are included in them which can save you a lot of time.