Empty Image Source

An empty image source may look like a very basic problem that can be removed or replaced with an appropriate source. Although there is a disparity on how they are coded in HTML and JavaScript, they perform the same action which is to access the server or the source of image. It can be presumed that the browser will do anything if there are no source in the image command. Unfortunately, some of the browsers have a specific reaction to this command and can have horrible consequences in the website.

Where did the Empty Image Source Came From?

You might be wondering how can an image source be added by developer and leave it blank. Because of the demand of rapid output of websites, many developers are using templates in creating an online application.

JavaScript and Ajax based online applications are not exempted in this form of templating. When the developer uses a template there are instances that an image is not required or needed in the application. Unfortunately, some developers leave the code as it is. It's an innocent mistake but, as already indicated, this small mistake can have dire consequences in the application.

Two Possible Consequences

Increased traffic on the image - when there's an empty image source, there is a possibility the traffic will increase without actual visitors. Because there is no specific source of image, the function will try to get grab the image from the homepage or / of the server. Since there is no corresponding filename, the server will return without any data. Your user will unknowingly increase your traffic because the homepage and image source will access the same source.

This might not be a big concern for online applications and websites with few visitors (5 to 10 visitors in an instant is no big deal). But when you're expecting 100,000 hits a day, your server and bandwidth can easily go down.

Corruption of data - this problem can easily happen because the actual data is a lot different from what the tracker specifies.

This is where we take a look on how browsers react to a blank image source (in HTML and JavaScript)

• IE - Requests to the same directory of the webpage
• Chrome and Safari - requests the same webpage
• Opera - doesn't do anything (hence no problem)
• Firefox - requests the same webpage (like Chrome) on version 3.0 but was fixed on version 3.5.

Dealing with the Problem

The easiest solution to this problem is to eliminate the code. Since it doesn't have any function in the application, it's just proper that it should be removed immediately. On the other hand, the HTML 5 is coming out with specific solution to this problem. The browser will be instructed that it should not make any actions if it doesn't see any specified image source.

Double check your codes if you have used templates in creating Ajax or JavaScript based application. It's a source of potential problem that can be easily dealt with by HTML 5 or by completely removing the code.