Plan a Great Client Login System

Tweet

Freelance Website designers, small Web design businesses, and large development enterprises should consider using a client login page for their customers.

A client login lets your clients access all their available features in one handy place, with the minimum fuss for the client and yourself. It allows you to keep confidential information confidential, while permitting collaboration between your business and the client online. It can substantially increase your credibility in the client’s eyes, as well as reducing the chance for mis-communication, making the client management process occur more smoothly.

Let’s look at the features you should consider for inclusion in your client login system. We’ll also address some of the key problems you may encounter, and explore how you can overcome them.

Before you Start

Your client login page doesn’t always need to be a complicated system, however there are some factors that need to be carefully thought out before you start. Attention to these details now can save you a lot of time in the long run.

Storage

You need to store certain client information in order to access it — so the user can change settings easily, and not have to enter their name or email address each time they want to do something on the site. Before you begin development, pick the storage method of your choice, and stick to it! Don’t store half the information in MySQL, and use flat text files for the rest. Choose one, and use one. Here are some ideas for storage methods:

  • MySQL
  • Microsoft Access
  • Flat Text files

MySQL is excellent in that it’s secure and can be easily accessed. It is also the PHP programmer’s method of choice. Microsoft Access works extremely well with ASP, and is brilliant for more organised storage. Flat text files are in no way secure, and not a good idea for information you don’t want hackers to be able to see.

The method you select from the suggestions above is an easy decision — all you need to do is choose the option that your server best supports. However, you must be careful in deciding what to store. You may wish to store all the details you have of your clients, but if a hacker gets in, they will have access to some potentially sensitive and confidential information. For this reason, limit the amount of information you store to a bare minimum, for example:

  • Customer’s site name — the full name of their Website
  • Customer’s site address — the URL to their Website
  • Customer’s full name — so you can greet them personally on each page
  • Customer ID Number (if applicable) — for support requests and correspondence
  • All services the customer has bought — and which ones they have paid for

Never store plain text passwords anywhere on your Web space, database, or wherever else a potential hacker could find them. If you have to store them, encrypt them. Take a look at the MySQL password function, and the PHP functions MD5 and crypt for help with protecting passwords.

Security

Making your client information pages secure is an important part to remember. Not only does it protect hackers, it lets the page know who’s using the page. As I said before, you can give a personal touch to each page the user visits (e.g. "Welcome, Mr. Mickiewicz"), and when a user wants to change their settings or information, they can do so without having to enter their username and password each time.

There are many ways to authenticate your users — I won’t go into much detail, but here are a couple of suggestions:

  • .htaccess
    You know those login boxes that pop up in your browser sometimes? This can be done with minimal fuss using .htaccess authentication. For more information on this, see Kevin Yank’s Apache HTTP Authentication in PHP.

    However, there are certain security risks involved — usernames and passwords are both sent to the server in plain text and it is easy to "hijack" along the way.

  • PHP/MySQL Authentication
    This is the method I recommend you use for your client login page. It is extremely flexible and customisable, unlike those ugly .htaccess popup boxes. See Kevin Yank’ s article, Managing Users with PHP Sessions and MySQL for more details on this.

Get to the Drawing Board!

Now, draw out a plan on paper. Outline the links, colours, and text you want, to help when it comes to programming your pages. Your plans don’t need to be concise — you don’t need to write out the full text you’re going to include, and sketch each image out in general terms; just an overview of what will be in each place is fine.

The last step before you start is to decide upon the features you’ll include in your client login page. I’ve put together a few suggestions here for you to chew the end of your pen over.

Website Control Panel Access

If you offer Website hosting with your design services, you should provide a link for users to log in to their site’s online control panel, where they can set up and manage accounts, email addresses, etc.

Update Profile

You can provide a form through which users can update their customer profile if they change an address or phone number, for example. If you’ve decided not to store the client’s full information in your database, then you could set up a form-mailer to email the form contents to you for a manual update.

Work in Progress Page

Let your customers see how far you’ve got with their project. This could consist of a diary-style script where you can post major parts of the site that have been completed. A link to the site as it stands can also be included, along with a schedule, so they know when the site is due to be finished.

Support Area

This section might include details on how the client can contact you if they have a question or problem relating to their site. A simple mail form can be included to allow them to send you an email without leaving the page — they don’t even need a mail client such as Outlook or Eudora! You may also have support forums for clients — if this is the case, link to them from here.

Content Management

If you’ve supplied your user with a content management system it could be handy to include a link directly to the administration panel so they can add new content at the touch of a button.

Webmail Access

You can install a simple Webmail system so your customers can check their email over the Web. Hotscripts has a good list of free and licensed scripts.

Domain Expiry and Billing Data

Let your clients see when their next payment is due, or when they need to renew their hosting account.

Server Status Page

If you offer your own hosting to clients, you could include a server status page, where users can view and report downtime.

Logout Link

It sounds obvious, but you can’t afford to forget this, especially if the user is on a shared computer. Also worth considering is a "change password" page.

Of course, there are loads of other possibilities that you can include in your client login system. Remember that as most Website design companies’ services differ as their clients’ needs vary, it may be difficult to provide links to certain areas. For example, there is no point linking to a hosting control panel if all you’ve done is designed a logo for the client: a control panel won’t exist for them, and they’ll get a 404 error.

One way around this is to set up a separate database table or page with "Yes/No questions". For example, the field names could include "has_hosting", "has_domain", "has_cms" and the values for each user can differ depending on what they actually do have. Then you only need to display the links that are relevant to that specific user on your pages.

Get Programming!

Enough talk, you haven’t even started to make your client login page yet! After taking all the features we’ve discussed into account, you can get started on your programming, designing, and whatever else you need to do. However, there are some things you still need to remember — I know, there’s too much, but you want to make it look nice and professional, and work properly, don’t you?

It’s OK to Patronise

It’s OK to patronise your clients. Most people that hire a professional to make their site, do so because they don’t know how. Therefore they are highly unlikely to be Web professionals. You may need to spoon-feed your clients with "layman’s terms" and basic information, so they understand exactly what you mean.

Example: Instead of "Click here to enter your MySQL driven Web-based PHP content management system admin panel", consider "Click here to enter your Website’s content management control panel".

Consistency is Key

All your pages need to have the same layout, colours, fonts etc. to minimise user confusion. A lot of hosting control panels use frames, as this ensures a consistent layout, so you might consider it, too.

The fact that only a handful of users are going to be able to see your login system is no excuse to make it look boring and rushed. Put effort into your design to make it attractive and usable, and you’ll find your clients will want to come back.

The factors I have discussed in this article should give you an idea of the sort of features you should consider when making a client login page. Of course, as all Website design companies are different in almost every respect, there will certainly be other factors that you’ll want to build into the type of basic system we’ve discussed here. I hope this has inspired you to create your new client login page. Good luck!

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • http://www.gatim.nl Vertaalbureau

    Great article and great insights, thank you. Client login systems/extra-net are the easiest most efficient customer-retention tools!