Grand Rapids Website Design Blog » Website Design

Minify/Compress CSS using PHP

Casey Henry — Mon, 14 Dec 2009 19:05:08 +0000

Google recently announced that site speed may be the next ranking factor. With this in mind I am going to explain how to minify/compress your CSS files using PHP. Many site use a few different CSS files to format their website, each one of these files requires a HTTP requests which an slow things down.

First you will need to create a new php file that will act as a CSS files when it is called.

// Sets the document type to be a CSS files.
header('Content-type: text/css');
// Since the documents is Static I set a future date to expire.
header("Expires: Thu, 15 Apr 2012 20:00:00 GMT");

Now that you have your PHP document setup you need to create a function that will minify your current CSS files. Minifying your CSS basically means to remove all unnecessary whitespace and symbols. The function below will do that nicely.

Now that you have your function to minify your CSS you must call your CSS files and have them minified. The code below will get the contents of the CSS file, minify it, and display it to the browser.

//Replace text.css with your file

$file = 'text.css';
$content = @file_get_contents( $file );
echo minify( $content );

//Repeat those three lines of code for each CSS file

Minifying your CSS file is complete. Now to compress the file using GZip.

A the beginning of your same PHP file, you need to add this line of code.

if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) ob_start("ob_gzhandler"); else ob_start();

At the end of your PHP file you need to add this line of code and you are complete.

ob_end_flush();

Now in your main HTML file you need to reference the new PHP file we just created.

<link href="/FILENAME.PHP" rel="stylesheet" type="text/css" media="all" />

It may seem weird to link to a PHP files and say it’s a CSS file but in the first bit of code we wrote, we told the browser that it is a CSS file regardless of the extension.

Using this method on my website I was able to reduce my load time from 2.6 second to 1.46 second, an increase of 46%! Think about what it can do to your website!

Feel free to ask questions in the comments below.

Time Spent On A Website

Casey Henry — Fri, 19 Dec 2008 18:26:20 +0000

How long do you spend looking at a page on a website. For the average user, they will spend less than 40 seconds looking at content on a page. What lesson can you learn from this? Simple, try not to jam your pages with too much text. Pages that have charts, graphs, or images along with some text will be more appealing to your website users. The next time you are at a website, think about the time you spend on each page and relate that to your website.

GR Web Designs can help track the amount of time spent clients spend on your website. Feel free to contact us for a quote on a new website design or a redesign of your current website.

Three Design Priorities

Casey Henry — Mon, 08 Dec 2008 22:41:12 +0000

For everyone who has created a website in the last 15 years, three things are always the same. If these three priorities are not followed it could destroy any business website. Follow these simply design priorities and you will be set:

Communicating clearly. Users will make a decision about your website within 30 seconds of visiting your first page.

Provide information users want. Don’t fill your website with pages and pages of information that no one will read or use.

Offer simple, consistent, and clear navigation and page design. Put things where users expect to find them and don’t veer to far from the website norm.

Keeping with those three design priorities will help your site flourish in the web world!

Increase Your Businesses Local Sales

Casey Henry — Mon, 06 Oct 2008 11:31:56 +0000

A simple way to increase the local sales on your business website is to include your business in the major search engine’s local listings.

For example someone from Hudsonville, Michigan is searching for website design and they go to Google and type in “Hudsonville Website Design” they will get the listing in the image below. These local business results appear before the regular search engine results and could result in more visits to your website.

Google Local

Below are a few links to the major local listings you should submit your business to.

Google Local

Yahoo Local

Live Local

Basic Website Information

Casey Henry — Mon, 29 Sep 2008 21:08:07 +0000

Obtaining a website can be a confusing process. This blog will help you understand what you need to get and keep your website up and running. Every website has three major components, the web page themselves, a hosting package, and a domain name.

The website consists of all the pages and code that create what you see on your computer. Each page is different and can be from very simple to quite complex. Websites can vary in price from very inexpensive to quite costly depending on who creates your site. Please contact us regarding any quotes you have received from other companies for a comparison price.

The hosting package is where your web pages are stored on the internet. Just like when you save your resume to a folder on your computer, your web pages need to be stored somewhere so the public can access them. There are many companies that will host your website for you at a variety of prices. Make sure you do your research and get what you need. If you need assistance with your hosting package please feel free to contact us.

A domain name is a unique address that tells your customer where your website is located on the internet. A domain name is typed into your customers address bar to get to your website such as gr-webdesigns.com. A domain name is registered with a registrar that tells the customer where your website is stored. You must renew your registration yearly or you can by them for a longer period such as 5 years. If you need help registering your domain or have questions please feel free to contact us.