T&S Web Design

There is a way to get elements in IE6 to have a min-height and a min-width. However, both require hacks that isolate IE6 from other browsers. We’ll start with the easy one.

Min-height can be achieved in IE6 by using a conditional HTML comment and the height CSS property. It turns out that Microsoft decided that the height CSS property in IE6 and below should actually be the minimum height. We can put this inside a style tag in the HTML comment after the initial CSS. This way all other browsers will not see the CSS.

<style type="text/css">
  .minheightclass { min-height: 100px; }
</style>
<!--[if lte IE 6]>
<style type="text/css">
  .minheightclass { height: 100px; }
</style>
<![endif]-->

Make sure that the element with the min-height does not have overflow: auto. It will not work in that case. You will need to override the overflow in the IE6 conditional comment in order for it to work.

Min-width in IE6 is a little bit trickier and it requires javascript to be enabled. We will still use the conditional HTML comment, but we will have to add a Microsoft proprietary CSS expression. A CSS expression allows some javascript code to dynamically determine the value of a CSS property. We will apply the expression to the width property.

<style type="text/css">
  .minwidthclass { min-width: 350px; }
</style>
<!--[if lte IE 6]>
<style type="text/css">
  .minwidthclass { width: expression(this.clientWidth > 350 ? "100%" : "350px"); }
</style>
<![endif]-->

Be careful when using this hack as it can cause the browser to lock up if you get the values wrong.

One of the most difficult and annoying things to set up in a small business is email. There are so many different options that it can be frustrating to even attempt to configure email. What’s the difference between IMAP and POP3 anyways? I’ve seen people just type in their email address and it works. Why doesn’t mine work like that? I will attempt to answer some of those questions in this post.

There are three main email retrieval protocols in use:

• Exchange - This is a proprietary mail protocol used by Microsoft to receive email from an Exchange Server. Support for this protocol is heavily integrated into Outlook. It is the easiest to set up. Simply enter your email address and password and Outlook takes care of almost everything else for you. In addition to easy set up, the Exchange protocol allows an Outlook client to be connected constantly to the Exchange Server, so any email received by the server when almost instantly be sent to the user. This means that you will know you have an email the instant it has been received.
• IMAP - IMAP stands for “Internet Message Access Protocol.” It is very similar to the Exchange protocol, with the exception of the set up. It, like the Exchange protocol, allows messages to be retrieved the instant they are received, but it is harder to set up. In addition to email and password, you will need to know the mail server, your username to connect to the server, and whether or not the server uses SSL.
• POP3 - POP3 stands for “Post Office Protocol version 3.” It is very different from the other two. It requires just as much information to set up as IMAP, but it does not maintain an active connection to the server. Meaning that it only checks every few minutes to see if any new mail has been received. Another limitation of POP3 is that it doesn’t allow messages to be marked as read on the server. Meaning that if you check your email with an email client on one computer, read, and delete some email messages and then you check it using a different computer, you will have to go through the same messages you went through before. This is extremely annoying, even more so the more computers you check the email with. The one advantage to this is that every computer will always have every email you received.

The one problem with IMAP is that it every email that you delete is deleted from the server. Most people want to have one copy of every email they have received for reference. The problem is that many mailboxes limit the size of the mailbox so that once it is full they can no longer receive new messages (POP3 doesn’t have to worry about this, since most email clients are set to remove the message from the server after a few days). To get around this we need to have a way to move old email off the server and into a different folder. This can be done in almost every email client using offline folders. I will show you how to do it in Apple Mail.

The first thing you will need to do is create a folder to store the old messages. Click Mailbox -> New Mailbox… and add the mailbox to On My Mac. Once the mailbox has been added, create a rule (Preferences -> Rules -> Add Rule) that will move old mail into it when it was received or sent a certain number of days ago. Under “Perform the following actions” select that you want to move the message to your new folder.

This archiving method allows you to get all the advantages that come with IMAP (not having to delete every junk email from your work computer, home computer, and iPhone, individually) along with the advantages of POP3 (being able to keep all your email messages in case you need to reference them later). It also keeps the number of emails in your inbox way down, depending on how many days you choose to wait before archiving your messages.

I frequently get asked questions about domain names by small business owners. Here are some of those questions, along with the simple versions of the answers.

Q: How do I pick my domain name?

A: The easiest thing to do is find a short version of your business name. So if your business name is, for example, Texas Concrete, you might see if the following is available:

• texasconcrete.com
• txconcrete.com

Q: What if the domain name I want is already taken?

A: Maybe you’ve settled on the perfect domain name, but it’s already taken. The good news is, the domain may be for sale. If you go to the site and there’s an offer to sell the domain name, you just have to be willing to either pay what they’re asking, or to bargain with them.

On the other hand, someone may actually be using the website. In that case, it can’t hurt to ask them if they’re interested in selling it. But if they aren’t, you’ll need to pick another domain name.

Websites like GoDaddy.com that sell domain names will often suggest other domain names if the one you want is taken. However, there’s other sites like Domainsbot.com that are a bit more flexible and dynamic in their suggestions. That’s the tool I generally recommend to clients.

Alternatively, you can just do something like appending your city or state to your domain name, or just pick something associated with your industry. You might use your product instead.

Let’s look at an example. We’ll talk about a hypothetical company, J.R. Technologies, that primarily sells and repairs laptops, and is located in California. Well, jrtechnologies.com is already taken, but the owner really wants a .com. Some other options might include:

• JRLaptops.com
• CALaptops.com
• LaptopsInCA.com

Hopefully you get the idea.

Q: How much does a domain name cost?

It varies. Currently the most expensive is .tv, which tends to run around $35. Another, .me, is $20. The more common ones, like .com, .net, .org and so on tend to run under $10.

Q: Is it better to get the .com?

Good question. The .com, .org, etc. (called top-level domains or TLDs) actually all have meanings. For example, .com is short for commercial, and is typically used by for-profit businesses. On the other hand, .org is for organizations, and is typically used by non-profit organizations.

There are also many TLDs created for specific countries, including .us for United States, .uk for United Kingdom, and so on. Some countries have TLDs that have a more common meaning that they’ve chosen to capitalize on. The country of Tuvalu’s number one export is their TLD, .tv. Montenegro made their domain, .me, available after just over a year of being an independent country.

So if you are a for-profit business, it’s customary to get the .com. If you are a non-profit organization, it’s customary to get the .org. If you run a television station or program, the .tv TLD is appropriate.

Q: If I get the .com, should I get any others as well? And will that make it more expensive?

The more you get, the more expensive it will be. However, gone are the days (back in the 90’s) when domain names were $70+ per year. So it’s pretty affordable to purchase domain names just to make sure others don’t get them first. Even if you purchase the .org as a commercial business, this will keep your competitors from buying that domain name and redirecting it to their own site. It will also keep a “domain squatter” from purchasing it with the express purpose of selling it back to you for profit.

Hopefully that answered some of your questions about domain names as well.

There are many times in a programmer’s career when regular expressions are extremely useful. Sadly, many programmers do not know regular expressions well enough to use them when the situation requires it. This post shows how easy it is to replace the contents of querystring variables in a URL using regular expressions.

function replaceQueryString($url, $key, $value = NULL)
{
  $url = ereg_replace('[\?&]'.$key.'=[^&#]*(#?)', '\\1', ereg_replace('([\?&])'.$key.'=[^&#]*&', '\\1', $url));

  if ($value === NULL)
    return $url;
  else if (($pound = strpos($url, '#')) === false)
    return $url.(strpos($url, '?') === false ? '?' : '&').$key.'='.urlencode($value);
  else
    return substr($url, 0, $pound).(($question = strpos($url, '?')) === false || $question > $pound ? '?' : '&').$key.'='.urlencode($value).substr($url, $pound);
}

The first line of the function uses regular expressions to remove the existing query string value from the url. Next, the correct point of entry is found for the new value to be inserted. Finally, the new value is inserted into the url. All that in under ten lines of code.

Occasionally when working with database relationships one will come across an instance of a many-to-many relationship. This type of relationship can occur, for example, when multiple users can be assigned to multiple tasks with users being assigned multiple times. This type of relationship should be implemented as three separate tables as shown below.

Users

Tasks

Taskassignments

Now, it is possible to join these tables in a single SQL statement. However, the resulting set would most likely contain many duplicate entries. There is a way in mysql to get the entries in two SQL statements without duplicating even a single entry. This is done using mysql’s GROUP_CONCAT function. This function is used to return many entries that relate to one entry on a single row. For example:

SELECT userid, GROUP_CONCAT(taskid) tasks FROM Taskassignments GROUP BY userid

would return

The next step from here would be to change the SQL statement so that it joins with the “Users” table.

SELECT userinfo.userid, tasks, username FROM Users userinfo INNER JOIN (SELECT userid, GROUP_CONCAT(taskid) tasks FROM Taskassignments GROUP BY userid) tasksassigned ON userinfo.userid = tasksassigned.userid

This retrieves the username instead of just the userid. (Now the user can be referred to as “Bob” rather than “User 12″.)

Now that the users have been retrieved from the database, all the associated tasks must be retrieved without duplicating entries. How can this be achieved? All the task ids must be parsed and stored so they can be retrieved from the database. In php this is simply a few lines of code:

$ids = array();
while ($row = mysql_fetch_assoc($result1)) {
  foreach (explode(',', $row['tasks']) as $id) {
    if (!in_array($id, $ids))
      $ids[] = $id;
  }
}

Lastly, all the tasks are retrieved from the “Tasks” table.

if (count($ids) > 0)
  $result2 = mysql_query('SELECT * FROM Tasks WHERE taskid = '.implode(' OR taskid = ', $ids);

And the tasks are correlated to the proper users, so the results can be displayed.

$tasks = array();
if (isset($result2))
  while ($row = mysql_fetch_assoc($result2))
    $tasks[$row['taskid']] = $row['name'];

mysql_data_seek($result1, 0);
while ($row = mysql_fetch_assoc($result1)) {
  echo htmlspecialchars($row['username']).' has the following tasks:
<ul>';
  foreach (explode(',', $row['tasks']) as $taskid)
    echo '<li>'.htmlspecialchars($tasks[$taskid]).'</li>';
  echo '</ul>';
}

If you’re only checking your website in the web browser you use, others may not be seeing the site how you intend them to. After all, chances are pretty low that everyone looking at your site is using the same browser you are.

Here at T&S Web Design, we test on several browsers on Macs and several on Windows. Here’s the breakdown, along with the percentage of usage from w3schools.com, taken June 2008. Obviously the percentages will not be exactly the same on your site, but they shouldn’t be too far off. (Note that Firefox, Safari and Opera have the same percentage on both Mac and Windows, because w3schools.com does not differentiate between operating systems)

• Firefox - Win & Mac - 41.0%
• Internet Explorer 7 - Win - 27.0%
• Internet Explorer 6 - Win - 26.5%
• Safari - Win & Mac - 2.6%
• Opera - Win & Mac - 1.7%

Of course, the best way to check in both Windows and Mac’s OSX is to have a Mac and a Windows computer. Barring that, another viable solution is Browsershots.org. There are tons of browsers available across four different operating systems. Note that they have Opera on Windows, not Mac, but it shouldn’t make a difference.

Ten years ago, the web was a very different place. All sorts of tricks were being used to control the experience a visitor to a website had. You might be forced to watch a Flash introduction. You could have been blocked from saving individual pictures from the site. And when you finally got frustrated and left the site, it might just give you a final pop-up ad to try to get you back.

Today’s web is, rightfully so, a much different environment. Users have taken back control. Common web browsers like Internet Explorer and Firefox let visitors to your website bypass all the tricks you could have used in the past. The browser gives the user control over their web experience once again.

Good websites have been giving the visitor the control the entire time. Your website should do the same thing. Because without control, the visitor won’t be on your site for long.

Want a Flash intro? Great, put a skip button that they can click immediately, before the intro even loads.

Worried about people stealing your pictures? Simply put a watermark on them.

Don’t want people to leave your site? Then have fantastic content. Create a blog, a gallery, whatever it takes to engage your website visitors.

Today I needed to use a bit of javascript to modify the contents of a web page. However, the section of the page I was changing was being updated with user entered content. I wanted the content on the page to show exactly what the user typed, meaning that I had to make sure that if the user entered any valid xhtml code it was encoded correctly. I searched around on google and found next to nothing on the topic, so I decided to create my own.

I used the php function “htmlspecialchars” as the basis for my function. I looked up the replacements that this functions uses. It turns out that only four characters need to be replaced to properly encode the contents: &, <, >, and “. Here is the function:

function htmlEncode(str) {
  return str.replace(/&/g, '&amp;').replace(/"/g, '&qout;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
}

The only thing I had to watch was that the ampersand character was encoded before the others, since it is used for encoding the others.