Archives for February 2010

February 26, 2010

CSS Font Order

When designing web pages, using the appropriate font for your design does wonder to the overall look, feel and layout of your page. Unfortunately, web designers are quite limited to the fonts they can use. Most web designers stick to the tried and true “web safe” fonts.

If you take all considerations including operating systems: Windows, Mac OS X, Linux, Unix, and browsers: IE, Firefox, Safari, Opera, etc, then you are really stuck with just 3 of the safest fonts on the web. They are: Arial/Helvetica, Times New Roman/Times, and Courier New/Courier.

Other fonts that work across platforms are: Palatino, Garamond, Bookman, and Avant Garde.

Fonts that work in Windows and Mac OS, but not in Unix+X are: Verdana, Georgia, Comic Sans MS, Trebuchet MS, Arial Black, and Impact.

If you like to consider all OS platforms in your design, then the order of your fonts in CSS is important. I recommend this sequence.

Establish a Baseline

At the very least, you need to establish your baseline font. Choose whether you want “Serif or Sans-Serif” font. The CSS would look something similar to this:

html { font-family: Serif}
html { font-family: Sans-Serif }

Choose a Web Safe Font

Next, choose a “web safe” font. Your choice comes down to either taking Arial/Helvetica, Times New Roman/Times, and Courier New/Courier. Most people don’t use the monotype Courier font except when displaying code. So, you are essentially down to four fonts, Arial/Helvetica or Times New Roman/Times. Helvetica is very popular. Arial is not far behind. New Times Roman is better than Times. In our example, will now look like this:

html { font-family: Times New Roman, Serif }
html { font-family: Arial, Sans-Serif }

Choose a Cross-Platform Font

If you must, you can choose a “cross platform font.” Again, our choices are: Palatino Linotype, Garamond, Bookman, and Avant Garde. The first 3 are Serif fonts. Avant Garde is the only Sans-Serif font.

html { font-family: Palatino Linotype, Times New Roman, Serif }
html { font-family: Avant Garde, Arial, Sans-Serif }

Add Other Fonts

If you must, you can choose other fonts, although they do not work in Unix+ systems. They are: Verdana, Georgia, Comic Sans MS, Trebuchet MS, Arial Black and Impact.

html { font-family: Georgia, Palatino, Times New Roman, Serif }
html { font-family: Verdana, Avant Garde, Arial, Sans-Serif }

There you have it. A safe way to implement CSS Fonts across all OS platforms.

February 26, 2010

Ubuntu Going from Brown to Gray

There are rumors and rumblings that Ubuntu might be going from brown to gray. I certainly would welcome the change. I think, you can only be brown for so long. I think it’s time for Ubuntu to get a face lift, a much needed one. Maybe some Botox shots.

What could be better for the most popular Linux distro in the world to get a new color scheme. Gray is a good start. To tell you the truth, I wasn’t so very keen on the brown color to begin with. After years of color deprivation, I finally switched to a non-earthy color, like green.

Currently, I’m using Linux Mint, a derivative of Ubuntu. If Ubuntu switches to gray, I think it will attract more people to use Ubuntu. By the way, my theme just went from black/white/red to black/white/gray scheme. I’m ahead of the curve. Just pure coincidence.

If the rumor were true, I can’t wait to see this new color scheme.

February 25, 2010

Run Multiple Applications in CodeIgniter

You’ve installed CodeIgniter and you’ve written a couple of applications. Now, you want to run two of your applications under one install of CodeIgniter. The following article discusses how to run several applications within a single install of CodeIgniter. The approach is accomplished using Apache’s Virtual Host.

Install Apache Virtual Host

1. To add a virtual host, edit /etc/apache2/sites-available/default. We will use “vhostname” as the virtual hostname in this example. Edit the default file and add the following:

<Virtualhost *:80>
ServerName vhostname
DocumentRoot /var/www2
</VirtualHost>

2. Run the a2ensite script which enables your virtualhost within the apache2 configuration. It creates symlinks within /etc/apache2/sites-enabled.

# sudo a2ensite vhostname

3. Restart Apache

# sudo /etc/init.d/apache2 restart

4. Check your virtualhost if it’s working by pointing your browser to http://vhostname.

CodeIgniter Setup

One way of setting up CodeIgniter to support multiple applications, is to have separate folders for each application. You can set up your CodeIgniter directories like the following:

system/
 application/
  app1/
   config/
  app2/
   config/

1. Under the “app1/config” directory, edit the config.php file. Point your application to be hosted at vhostname by changing the following line:

$config['base_url'] = "http://vhostname/";

2. Copy the “index.php” file under the main CodeIgniter directory to the http://vhostname web root directory.

3. The “.htaccess” file recommended by CodeIgniter also needs to placed to the web root of http://vhostname.

4. Open your browser and check if your application is working by placing http://vhostname in the address bar of the browser.

5. Repeat steps 1-4 to add additional virtual hosts. That’s it.

If you have questions or suggestions, please leave a comment.