Posts Tagged ‘webmastering’

Customize the feed icon in Fireworks

Sunday, February 4th, 2007

Fireworks users don’t need to feel left out. Or at least when it comes to the feed icon.

Previously only available for the Big Snobbish Graphic Editors (Illustrator, Photoshop, etc.), the color of your feed icon can now be customized using Macromedia Fireworks. You can download the file here: feed-icon-chette

In case you didn’t know …

A feed icon is placed on websites (or content items) to indicate that the content is also available via web syndication (“feeds”). It was originally created for Mozilla Firefox’s Live Bookmarks, but has been proposed to be used universally for feeds. Take note that it is meant to be used for open formats (e.g., RSS 1.0, RSS 2.0, Atom, etc.)

Although the feed icon is not restricted to one standard color, it is still highly encouraged that you use its canonical color: orange. Color is a visual cue, and aids in the usability of websites.

Shying away from the SEO brouhaha

Tuesday, January 23rd, 2007

Yes, I do get your emails — questions about Search Engine Optimization (SEO), asking for advice, tips, etc. Some have heard of the work I did, while some simply analyzed my rankings in Google.

However, because of the sudden brouhaha on SEO, I’m a little uncomfortable talking about it in detail. “SEO Consultants” have sprouted out of nowhere, giving two-hour talks on things they learned from books & other SEO online references, have optimized less than 5 websites, & charging my clients an arm & a leg for their “expertise.”

They talk about key phrases as if it should be the sole content of your website. I have met 3 consultants who even lectured me about the importance of, egad, meta tags & doorways.

Yes. My hesitance is due to my fear that jumping in the SEO hubbub might even further overshadow the value of content.

Content is king.” These are the words I have been hearing since 1997 when I put up my first website. I scoffed at it & simply regarded it as just another buzzword. It took me quite a few years to take these words to heart.

As the years went by, I got more & more involved with websites — hundreds of them — either as a developer, a Project Manager, a writer, a consultant, a designer, or an owner. I started to see how content have magically gave these websites the rankings & the visitors. Heck, a lot of our website even got the top rank in Google without consciously applying a single SEO technique.

Try it: For the time being, forget about your technorati tags, blog pings, invisible key phrases, doorways, Google bombs, & submitting to link directories. And yes, even forget about your search engine friendly URLs. For a couple of months, just concentrate on giving the best quality content for your target market.

Notice how your key phrases’ position & density come out naturally. Notice how this, even more than hundreds of tips combined, can give you that rank that you have never even dreamed of grabbing.

I’m not saying that optimization doesn’t help, because it does. But how do you expect to put in the finishings in a house without the structure? You need to go back to the basics & build the foundation of your website. Only then could you discover what optimization your site really needs. And only then could you realize the true potential of your page rank.

Content is king. After all, even the most poorly written buzzwords can carry a lot of sense.

Search Engine Friendly Redirection

Saturday, January 6th, 2007

Website redirection” means that when a user goes to one of your web pages, you automatically lead him to another site (or page). This is particularly useful if you have changed your domain name or site structure.

In chette.com, you would notice that I use this. If you go to the URL www.chette.com, you are actually redirected to www.chette.com/main. Main is a folder in my public html. I put my content files in subfolders in order to keep my public_html directory neat, and to enable me to test an upgraded CMS before making it accessible to the public.

The old-school way of redirection was thru the infamous meta refresh tag. However, websites which contain this tag are already being tagged as spam by search engines.

A better alternative is to use a 301 or 302 redirect. These are called response codes. A more technical definition is available, but in a nutshell, if you use a 301 or a 302 redirect, you are just automatically directing your visitors to your new URL.

301 returns a user-agent response that your website has moved permanently to a new location. A 302, on the other hand, returns that your website has only moved temporarily.

What to use

There are a lot of arguments on 301 vs. 302. Some would favor one over the other, claiming that 302 should be strictly used for temporary locations, that 301 is preferred by search engines, etc. etc. However, from my own experience, it is most effective to use both.

Let’s say you have gotten a new domain name or URL.

First, submit this to Google’s index, but make sure that you retain your old domain (or URL) for the time being.

Then, put a 302 on your old domain name. That way, your old domain name and its rankings in Google are retained. Additionally, whenever someone clicks on a link which still has your old domain, because your server has a 302, it will automatically redirect them to your new domain name.

Wait a few months for your new domain name to “age” in Google. Aging is very important, and it usually takes 2 to 6 months, at the very least.

When your new site has aged satisfactorily, change your 302 redirects to a 301. This will transfer the page ranking of your old site to your new one in Google.

How to make the redirection

The most robust way of doing the redirection is thru .htaccess.

  1. Create a text file called .htaccess in your local PC.
  2. Put the following in this text file:


    Redirect 302 / http://www.newdomain.com/

    Replace www.newdomain.com with your new domain name.

  3. Save your text file.
  4. Upload this file in your old domain name’s public_html.

If you only want to redirect users to another directory, try this more convenient method thru PHP:

  1. Create a file with the same filename as your old web page file (index.php, default.php, etc.)
  2. Enter the following lines:


    <?

    header("Status: 301 Found");
    header("Location: main");
    ?>

  3. Upload this file in your directory.

Backing up your website using bash

Monday, May 15th, 2006

Note: Thank you to Bombim Cadiz, Linux guru extraordinaire, who could always explain in a few words what pages and pages of websites could not.

If you do frequent backups of your website, especially a Linux-based one at that, I’m sure you also have your share of:

  • Typing the same tar and mysql commands over and over again,
  • Opening all your config files to look for your database usernames and passwords, and
  • Basically going crazy over the numerous command switches & options.

When doing repetitive tasks such as backups, it makes more sense to use something called bash.

Bash stands for Bourne-again shell. It is very much like DOS’s batch file — it allows you to save a set of commands in a single file. This means that in you only need to run this one file, and all the commands you placed there will be executed.

A basic backup bash

1. Create the bash file in your favorite text editor.

Here is a simple bash file:


#!/bin/bash
echo "Let's back up your public_html directory!"
tar -cvzf backup.tar.gz public_html/*
echo "Your directory has been backed up. You may now download the file backup.tar.gz."

2. Save the text file. The filename that we are going to use is "backup." I removed the file extension .txt in order to make it easier to run the bash file.

3. Upload the file to your server, preferably in a directory that cannot be accessed by the public.

4. Make the file executable. You can do this via FTP by right clicking on the file, then changing the file attributes to 755.

Or if you’re logged in to your shell via SSH, just enter the following commands:

chmod +x file.sh

5. Whenever you need to backup your site, all you have to do is login to your shell, and run the bash file, like so:

./backup

Spicing it up

Here’s a modified backup bash for the adventurous in you:

#!/bin/bash
# Change the variables below, depending on your project.
projectname=MYPROJECT # Name of project
dbuser=myname # Database username
dbpass=mypassword # Database password
dbname=mydatabase # Database name
htmdir=public_html # Where your HTM files are located
backupdir=public_html/backups # Where you save your backup files
# Pause function
Pause()
{
echo
echo -n "Press ENTER to continue."
read
echo
}
# Welcome message
echo "Hi! This will backup the HTM and DB of this website. Simply follow the instructions."
Pause
# Ask for suffix of filename
echo "A suffix is appended to the filenames of the backup files."
echo "This is usually in the form of YYYY-MM-DD-TTTT (TTTT is the 24-hour format time)."
echo "For example: 2006-01-01-1200"
echo
echo "Enter your desired suffix now: "
read suffix
Pause
# Delete backup files
echo "Deleting existing backup files"
rm $backupdir/*
echo
echo "Backup files deleted."
Pause
# Tar HTM and DB
echo "Backing up HTM & DB files"
tar -cvzf $projectname-HTM-$suffix.tar.gz $htmdir/*
mysqldump --opt -Q -u $dbuser -p$dbpass $dbname > dump.sql
tar -cvzf $projectname-DB-$suffix.tar.gz dump.sql
rm dump.sql
echo
echo "All HTM and DB files tarred and gzipped."
Pause
# Move files to backup directory
echo "Moving files to backup directory."
mv $projectname-HTM-$suffix.tar.gz $backupdir
mv $projectname-DB-$suffix.tar.gz $backupdir
echo
echo "Files moved to the backup directory."
echo
echo "Thank you."
echo "You can now download your files from the backup directory."
echo

Creating a favicon using Adobe Photoshop

Tuesday, September 13th, 2005

A favicon, shortcut for Favorites Icon, adds a subtle touch of individuality to a website. It is a graphic which is typically displayed next to the website’s name in a browser’s bookmarks or address bar.

Most favicons have a dimension of 16 x 16 pixels, and use the .ico file format. Some newer browsers, however, already support .gif and .png.

  1. Download the ICO plugin for Adobe Photoshop at the Telegraphics website. To install, extract the file to your Photoshop’s file format folder. This is typically located at C:\Program Files\Adobe\Adobe Photoshop CS2\Plug-Ins\File Formats

    Take note that you can use other tools to create favicons. I also use Microangelo and IrfanView. I have a personal preference in the Photoshop-plugin technique because of its flexibility.

  2. Using your favorite graphics program (such as Adobe Photoshop or Macromedia Fireworks), create a new canvas. It is recommended that you use a canvas size with a multiple of 16, such as 64 x 64 pixels.
  3. Create your graphic. Keep it simple, and don’t apply too much anti-aliasing.
  4. (Continued)

  5. Resize your graphic to 16 x 16 pixels. If you are using Adobe Photoshop, navigate to Image > Image Size, and enter 16 pixels in Width and Height. Next, to minimize blurring, select Bicubic Sharper from the drop down. Click OK.

    If the graphic looks blurry, experiment with the aliasing and the sharpening filters.

  6. It’s now time to convert your image to the .ico format. If you created your file in another graphics program, load it now in Photoshop. From the menu, go to File > Save As. The Save As dialog box will appear. Under Format, select ICO (Windows Icon) from the dropdown. In File name, enter favicon. Click Save.

  7. Upload the favicon.ico file in your web directory.
  8. In the web pages that you want your favicon to appear, include the following code between the <head> tags:
    <link rel="shortcut icon" href="/main/images/favicon.ico" />

    Make sure that you enter the correct path to your favicon in the code. For example, for this website, the following code was used:

    <link rel="shortcut icon" href="/main/images/favicon.ico" />

Backing up your website

Saturday, September 3rd, 2005

Not long ago, I interviewed approximately twenty website administrators who were in charge of the management and administration of at least two websites. One of the questions I raised was how often they backup their website.

The results:

  • Daily — 1
  • Weekly — 3
  • When I am reminded to do so — 10
  • Never — 6

Hopefully, the results are not representative of the web development community because, oh boy, are we gonna be in trouble :)

Why backup

Backup is something we website administrators take for granted — maybe because we are blessed with reliable web hosting companies, or maybe because the content is not updated regularly that it seems like a waste of time.

But there are reasons why you should keep your own separate backup:

  • A lot of webhosting companies do not restore backups for free. One of my web hosting accounts actually charged $25 when we requested a backup restoration.
  • Mistakes and accidents happen. Even if your web hosting company perform daily backups, there is still a possibility that they won’t back it up at least once. And, depending on your luck, it may happen at the same time that you accidentally delete a file.
  • One word: Hacking. You are particularly susceptible if you are using very popular open-source scripts, particularly bulletin board systems.
  • If your site has a forum or has a lot of user-submitted content, your website data actually becomes more crucial. Not only because your website has a greater amount of content, it also has a greater amount of server load.
  • If you have a full backup of the site in handy, it is very convenient to give a copy to your client when they need it.
  • Some hosting companies, despite their claims, actually do not have a regular backup system in place.
  • Web hosting companies do close down. And when they do, so do any other means of getting in touch with them.

When to backup

How often you should perform a backup will depend on a number of factors:

  • Availability of the resources you need in order to perform the backup operation;
  • Frequency of content updates in your website;
  • Amount of updates; and
  • Importance of the website to the organization.

What to backup up

For most cases, there are two things that need to be backed up:

  1. Database. If you are using one of the popular open source content management systems (CMS) to maintain your website, there is a great possibility that your content is saved on a database.
  2. Web files. These are the files accessed by your users (PHP, HTM, images, etc.), and are usually saved in a directory called public_html or www. Note: If your website writes or reads files in another directory, whether remote or above the public_html directory, then these should be backed up too.

Backing it up

In a nutshell: The easiest way to backup your site is by compressing all your HTML/PHP/etc. files, and then downloading the compressed files. Here’s how to do it:

Step 1: Get shell access to your account. If you don’t have one, ask your web hosting provider nicely :) For security reasons, this is usually disabled by default.

A shell allows you to access your server thru a command-line interface (think DOS). With shell access, you can FTP, debug CGI scripts, set permissions, and even read your email.

If your web hosting provider refuses to grant you an SSH/Telnet access, you have no choice but to download each of your file via FTP, which is a time-consuming process.

Step 2: Get a Telnet/SSH client. I personally use PuTTY, a free telnet/SSH client.

Step 3: Login to your account. Open PuTTY (or your favorite SSH/Telnet client). Under Host Name, enter your domain name or IP address. Under Protocol, it is highly recommended that you select SSH instead of Telnet. Click the Open button at the bottom of the window to connect to your server.

You will be asked to enter your account’s username and password. If your login is successful, you will be taken to the prompt, which is typically represented by a dollar sign ($)

Step 4: Backup your database. Enter the following commands:


mysqldump --opt -Q -u USERNAME -pPASSWORD DATABASENAME > BACKUPNAME.sql

Replace USERNAME with the username of your database, replace PASSWORD with the password of your database, replace DATABASENAME with the name of your database, and replace BACKUPNAME with the desired filename of your backup.

When completed, you will be taken back to the prompt. Verify that the BACKUPNAME.sql is in the path you specified. You can compress this file by following similar commands at the next step.

Step 5: Backup your web files.

Go to the directory that you want to backup.

To view the contents of a directoty, enter the following commands:

ls

To change directories, just enter the following:

cd DIRECTORYNAME

Replace DIRECTORYNAME with the desired directory name, For example:

cd public_html

And finally, to compress/archive all the files and subdirectories in that directory, enter the following commands:

tar -cvzf FILENAME.tar.gz *

Replace FILENAME with the desired filename of your backup. Verify that the backup was successfully created. You can do an ls, or view your directory using your FTP client.

Step 5: Download the backup files. Use your favorite download manager. I personally use ReGet and GetRight.

Pretty nifty, huh? Hope this helps.

What web hosting company would you recommend?

Saturday, August 7th, 2004

The safe answer is always: "It depends on your needs."

It’s a tricky business recommending a web host, and I’m unfortunate enough to be asked that question frequently. I even have a ready script in hand, presenting 3 to 5 options to a client depending on their requirements, complete with a comparison chart, and a table of pros and cons.

There are instances when giving a hosting recommendation is not as risky, and in these instances, I won’t hesitate to mention the sites which come to mind everytime the subject of hosting comes up: I would personally recommend Site5 for Linux, and maybe Intermedia for Windows (not Linux). I know a lot of WiseWomen who swear by Pair. My brother is currently hosted on a Philippine-based webhosting company called Site.com.ph Digital Interactive, and is very happy with it.

I admit we host a lot of commercial websites in Intermedia. Some of our clients prefer LiveStats for viewing their website’s statistics, and their sleek DeskPilot for checking their emails from the web.

However, with big hosting companies, the impersonal attitude of the support personnel can be very off-putting, sometimes bordering on rudeness. For instance, I remember requesting SSH access for one of our accounts hosted in Intermedia. After filling in a request and providing them with the required information, the support personnel curtly replied that he cannot grant us SSH access on the reasons we provided. Period. (Ironically, they have previously granted us SSH access on our other accounts. Their client base must be so big as to bypass that information.)

Also, I’ve learned to be wary of hidden costs — in restoring from a previous backup, fixing a corrupted table in your database, DNS configurations, in upgrading/downgrading hosting plans, etc.

Thank goodness for hosting companies such as Site5. My feelings toward Site5 are very strong, and a bit personal. Back in 1999, when I was probably The Ultimate Newbie in their entire customer base, people like Matt and Todd were already there, patiently answering my questions — from Perl paths, to tips on backing up my database and DNS configurations.

I wasn’t actually the easiest (or smartest) customer in the world, but I have yet to encounter an email where they would refuse to give me any support because it was "beyond their scope of responsibility." In the rare case that I did ask a far-fetched question, they have always pointed me to the right direction, and even went as far as give URLs and tips on how to do things efficiently.

Fast forward to 2004, where thankfully, I don’t bug them as often:

  • I have finally gone past that newbie stage (even if, at times, I still feel like one)
  • Their NetAdmin leaves little room for questions
  • They practically have all the features I need. Do a comparison with other virtual hosting companies to see what I mean.
  • Most of all, they don’t forget their old customers. Did they implement a new pricing scheme that is better than what I originally got? No problem, here’s an additional 750MB space. I’m a little tight on cash this month, can I downgrade my plan first? No problem, consider it done.

Their slogan claims that they’re the most trusted name in hosting, and in my book, there is no doubt.

Check out their website at www.site5.com.