Low cost templates instead of costly custom graphic design

Recently, a customer asked me how much it would cost him to get a new design for his site. There was a time when I would have told him that it would probably cost him at least $1,500 to get a decent design from a reputable Web or graphic design company. But now things are much different, and there are many cheaper options out there.

When I first decided that I wanted to go with the new company/website name, Site Fixers, one of the first things I thought about was how I could get a pretty decent looking website up there that would give the appearance of quality without the high cost that usually goes with it. Then I remembered seeing banners in the midst of my Internet searches that were advertising cheap templates, so I decided to look into it some more. Read More…

Getting the .ca domain name you want, and TBR unfairness

So you finally thought of the perfect domain name for your business or personal website, but when you go to register it, it’s already taken. Sound familiar? Well, you might think it’s time to go back to the brainstorming session, but it might be best to check out a few things first.

One thing you should try, at first, is to type the domain name into your Web browser, and see if there is actually a website there already. If it looks like there is a real website there, you’re probably out of luck. If it seems like it’s not really being used, and you see something like an under construction, page not found, or a parked page with just a bunch of ads, then try doing a WHOIS search on the domain name to find out some information. Read More…

Converting a static website to a CMS site – part 1

Yet another website upgrade that is becoming more and more popular these days is giving someone the ability to edit their own content themselves. This kind of site is usually made up of: (a) an administration section for making changes to page content; (b) a database for storing the content; and (c) the live pages that the public sees after the content is grabbed from the database. It’s called a CMS, which is an acronym for Content Management System.

It’s easily understandable why someone would want to have their site changed, or even produced from the beginning, to be self-editable. For one thing, it eliminates the need of having to go to a website programmer whenever even the smallest changes need to be made. It can also give a website owner a feeling of control over his site, since he is now able to edit his own content, and add his own pages.

Giving the administrator the ability to edit the content of her own site does not come without its problems, however. If the administrator is able to make her own changes to her site, and given too much power over what can go into the content area, it can adversely affect the look and feel of the site. So, usually, we will have to impose limits on what the administrator can do, by removing buttons and functions from the WYSIWYG (what you see is what you get) editor that is typically used for writing and editing content for the pages.

Now, to get started in converting a static website to a CMS site, it’s usually a good idea to fix up the code first. There are actually some really messy, careless coders out there, so the code might be a nightmare for you to work with if you don’t fix it up first. Some things to look for:

  • Code that is not indented properly. Many programmers care a lot more about how much money they can make than about how clean their code is. You’ll often have to start from the beginning of the document, and indent everything properly, so you get a good look at the structure of the site, and make sure all the tags are opened and closed properly.
  • Attributes that are not in quotes.
  • More code is used than is necessary. Some programmers like to nest multiple tables inside each other to do something that often requires no table at all. You shouldn’t have a problem with using tables when they are needed, but often they are over-used.

It’s not necessary that you fix another programmer’s code before converting it to work with a CMS, but it will sure make things easier for you, and you’ll also end up with a cleaner looking site.

Now, you should have a nicely indented, clean looking HTML page for you to start adding your PHP code to in order to get it communicating with your CMS. But which CMS should you use? Now that is a good question. There are so many good ones out there now, it’s not an easy task to pick one out. A lot of people have their favorite one. Some of the more popular ones out there now are Drupal, Joomla, and CMS Made Simple. I recommend doing your own research, though, to find out what people are saying about them. A good site to go to for your research is Open Source CMS. At last count, they had 114 open source CMS applications listed and rated on their site.

Website BakerPersonally, my favorite CMS to use is one that is not nearly as popular as Drupal or Joomla. It’s called Website Baker. I like it, mainly, because of it’s simplicity. Compared to Drupal and Joomla, its code is much lighter, containing less bells and whistles, but still has everything that is needed for a solid CMS. My customers are also able to learn their way around the administration area of Website Baker really fast, which is quite a different experience compared to the other big CMS applications.

In part 2 of Converting a static website to a CMS site, I’ll show you how you can use Website Baker to convert your HTML page into a powerful CMS site that you and/or your customers will be happy with.

Adding Live Chat to your site

Working as a Website Programmer for almost 10 years now, I have learned not to get too comfortable with what I am doing for customers now, and to always make sure I keep up to date with new trends in Web Development.

For me, the first time I really noticed the need to remain current was when programming trends turned toward using stricter XHTML standards in place of the older ways of doing HTML with unclosed tags, unquoted attributes, and other sorts of messy styles, and when CMS sites and Blogs (a type of CMS) started to become more available and mainstream. Another big change was the rise of the use of PHP and MySQL in place of ASP and MS SQL.

Today, I have my own small Website Update company, and my main services are in the development of XHTML templates, updating and upgrading websites, developing custom PHP/MySQL applications, and converting sites to CMS sites, among other things. These are currently the services that customers seem to be in need of the most these days. However, in the last year or two, I have noticed a new trend that seems to be catching on faster these days. It is the appearance of a Live Chat button on all kinds of websites, and it is becoming more common.

I can understand why we are seeing these buttons more and more. It is yet another way of allowing a customer to communicate with a company to get the help they need, and usually, the connection time is really fast. I have used these Live Chat buttons on many sites myself, already, and I have found them to be even better than calling, and, of course, a lot faster than email.

After doing a lot of research into the Live Chat button phenomenon, I have managed to find one that is really good, and the best thing of all is it is open source (free to download and use). It is called Mibew Messenger.

Mibew Messenger

The list of features is quite generous and includes the following:

Main features

  • Unlimited operators, chats, and users
  • Priority queue of visitors
  • Differing buttons on same website
  • Reconnect automatically if the internet connection goes down
  • Agent and visitor “Typing Indicator”
  • Agent photo
  • Chat transcript emails
  • Sound and Visual alerts
  • “Leave a message” when you are away
  • Unicode support for multiple languages
  • Quickly convert text to hyperlinks in chat
  • Not blocked by pop-up blockers

Operator abilites

  • Web-based Operator Console
  • Canned messages for speed and consistency
  • Track where your visitors clicked from to get to your website (refer URL)
  • Chat conversation history with search
  • Linking to previous visits, instant access to previous chats
  • Reassign/Transfer chat ownership
  • Mark/Highlight nuisance visitors
  • Administrator can view active chats
  • Information about visitor: first message, address, browser
  • Administrator can take over the chat
  • Customize chat with your Logo, Name etc.

In order to add this to your own website, first, you will have to make sure that the server where your website is hosted meets the minimum requirements: PHP 5 or higher and MySQL 5 or higher installed. You will also need to have an extra database available, and have your database server, name, username, and password handy for installing the application on your site.

After you know that the application can run on your server, it is time to go to the Mibew Messenger website to download the latest version. You will need to download that, unpack it, and then upload the files to the Web server on which your website resides. You should create a separate folder for holding this application, and upload all the files to there. Installing it is then a simple matter of navigating to your website and typing in the exact path to your Mibew Messenger installation directory. You will then be able to install the application by adding in your database information and then installing everything at the click of a button.

Of course, the application is not much use if you don’t place the Live Chat button somewhere on your site. There is a special code you can get once you log in to your Mibew Messenger installation that you can copy and paste anywhere on your site where you want the Live Chat button to appear.

Now, it is time to allow the application to start working its magic. All you need to do is log in to the application backend by navigating to your folder and then wait. If you are logged in, your Live Chat button on your site will change from OFFLINE to ONLINE, and if someone clicks on the button, you will get a sound and visual alert, and will see a new person in your chat queue. The best way to test it out is to try it on two different computers. Load up your website at the page that has your chat button in one browser, and log into your chat application in the other one. Then click on the chat button in the first one, and see what happens.

You can find more instructions about the use of the application at the Mibew Messenger website, but the best way to learn how to use it is to try out all the features yourself. I’m sure you’ll love it, and that it will be a great addition and benefit to your website and business.

If your current Web server does not meet the minimum requirements for installing Mibew Messenger, there are many great, reliable, cheap hosting companies available for you to choose from. On my own website, I always have a few hosting companies that I like to recommend to everyone. Just go to my site and read the summaries I have for them, and see if one of them might be a good choice for you. You can even use coupon or promotional codes that I have listed there for an even bigger discount. Also, if you are having trouble installing Mibew Messenger yourself, I would be glad to do it for you. Just check out my rates and services at my website, which is sitefixers.ca.

Getting started with XHTML programming

This short guide is mainly for those who are interested in getting into XHTML programming, and/or improving the style in which it’s done from the beginning. That means that, at a minimum, you have to be able to edit your own HTML pages without having to use a visual object editor such as Design Mode in Dreamweaver. You have to know how to write some code, and understand how to edit and modify the source code of your document directly. Personally, I like using Dreamweaver in Code Mode, but there are many other good text editors out there.

For those who are already familiar with HTML, you might already know that XHTML is pretty well identical, except with a few extra rules that you need to follow, and a few extra lines added in.

Here is an example of a complete XHTML page that has all the necessary components in place for passing the XHTML validity test. It can be used for any site as a starting point, so it might be helpful to you to bookmark this page so you can come back and copy it whenever you need it. The code:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

      <html xmlns="http://www.w3.org/1999/xhtml"
      xml:lang="en" lang="en">

            <head>

            <title>Website title - the most important item for SEO</title>

            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <meta name="description" content="Description is still important to some
            search engines, and   should be different on every page, even if only
            slightly." />
            <meta name="keywords" content="enter, your, page, keywords, like, this" />

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

      </head>

      <body>

            <div id="centered-block">

                  <div id="header">
                        <img src="images/logo.gif" width="225" height="46"
                        alt="Your logo" />
                  </div>

                  <div id="content">
                        <h1>Your site content</h1>
                        <p>This is where you can place your content. Normally, you
                        will want to create your navigation above this section, or
                        have it in a left or right column here.</p>
                        <ul>
                              <li>This is an unordered bullet list</li>
                              <li>You can modify the bullet by editing the
                              bullet-01.gif image</li>
                        </ul>
                        <p>Good luck with building the rest of your site!</p>
                  </div>

                  <div id="footer">
                        Copyright &copy; 2009
                  </div>

            </div> <!-- centered-block div ends -->

      </body>

</html>

 

There it is! That’s all you need to get started. Just remember to include all the above code, and you’re all set to begin your next great XHTML site. Actually, everything that was added between the <body> tags is not necessary, but it can really help get you started, especially if you are developing a typical centered site.

You can view the above code in your browser by clicking here. If you want to test it out to make sure it is a valid XHTML document, you can use the W3C Validation Service. Just copy and paste the complete URL from the above site, or from a site of your own, and click the Check button at the W3C site.

Also, remember that for an XHTML document, you must always use quotes around your tag attributes (actually, you should have always been doing this no matter what!), close all tags, and include alt text for every image. Another good practice is to use comments after some of your DIV tags, so you can keep track of where you are, like I did for the centered-block div. Once your code starts to get really long, you’ll sure be glad you did that.

If you don’t have your own basic XHTML and style files for when you want to begin a new project, I recommend using the code above. You will also need a CSS file for styling the above code to make it look the way you want it to look. To make things even easier for you, however, I have created your basic index.html, style.css, set up an images folder, and packaged it all up in a zip file for you. Just download it from here:

  • XHTML starter site (just unzip this and use it whenever you want to start an new XHTML site)

I recommend using the W3C validator periodically, as you are developing your site, to make sure it still passes as a valid XHTML document. It’s pretty easy to forget about closing a tag or breaking another rule that will cause your document to fail the test. Thankfully, the validator does a pretty good job of showing you where your problems are, and why you are getting errors. Good luck with developing your XHTML site!