Do You Speak HTML?

Ever since I have been living away from my home country of England, I have noticed myself picking up on what I would consider misuses of the English language. On the most part, they are Americanisms, for which I take great pleasure and amusement in refusing to understand, until the person uses the English pronunciation. However, I also seem to hear an awful lot of completely made-up words or incorrect grammar. One may argue that this does not matter, as long as you can communicate the message but I guess being from the country that shares it’s name with the language, I have a built-in pride for it’s correct usage.

In development, things are usually not so forgiving when it comes to language. If you don’t get the spelling or grammar correct, it just will not compile or operate as expected. That is, except for HTML. Browser rendering engines are not fussy at all when it comes to HTML and will render pages happily, even when the code is all over the place. There is historical reason for this but unfortunately it seems to have lead to complete complacency in developers.

HTML is not a difficult language, it is simple to understand, there are not that many grammar rules and the vocabulary is tiny. So why then is there such a massive quantity of web developers who are just not that fluent in the language? I am not talking about just being able to get a page to look like the design. I am talking about expressing the content of the page using correct elements and combinations there of. There is a reason behind every html element, they were created because of a need, and each should be used where it is appropriate to do so.

If you are from the school of thought that does not worry about this, as long as it renders as the designer imagined, then there are good reasons why you should be thinking otherwise. Every day, web bots will be viewing your pages and trying to understand them. Screen readers do the same thing and a badly constructed page can be totally confusing to a blind person. You could be losing out on valuable traffic because of this. You could also find yourself with more work down the line. A site like Css Zen Garden shows just how much can be done with design without touching the html. That is not so easy when you have to work with a badly created page.

So what if that is not a big enough reason for you? Well, look at it this way. People who can speak correctly and have an extensive grammar, find themselves in a much better position than those who don’t. It can give a great first impression. The same thing is true for development. You may consider yourself pretty good in your chosen programming language but if you are sloppy in such a simple language like html, it could be the deal clincher in a job interview. It would certainly change my impressions of a potential candidate if they don’t have a decent grip on something that they should be able to in their sleep.

So how is yours? Time to brush up perhaps? Are you really that fluent? Be honest with yourself. How well do you speak html?

Edit: To all those that have taken this opportunity to pick holes in my use of language in this article: I do not consider myself an expert in English, by any means. I make as many mistakes as the next person. I now live away from England and on a daily basis I hear non-English people use phrases and pronunciations I was taught are incorrect. I don’t try to preach the way I was taught or consider that way the only way it should be done. My point was that something like Html should not have such variance. There is a worldwide standard we are all supposed to adhere to and were it not such a forgiving markup language, things would be much better.

Creating PDF Documents in PHP Using Tcpdf

When developing websites, it is not going to be too long before you are required to generate a pdf for users to download. One usually searches for a suitable library for this and in php, there are a few options out there. My personal favourite, and one that is still receiving regular updates and improvements, is tcpdf.

There always seems to be a trade-off between flexibility and ease of use with these libraries and tcpdf seems to lean more towards the flexibility side of things. I prefer this, as there would be nothing worse that committing oneself to a particular library, only to find that it is not possible to generate a particulr report further down the track. On top of this, the library is available in PHP4 and PHP5 versions and is open source, should one need to tweak it any way.

Installation is pretty straight forward for and there are suitable instructions telling you how. In my case, however, I am using the CodeIgniter framework and needed to take some additional steps in order to use it. If anyone else is also using CodeIgniter, here is how I do it:

1. Unpack the tcpdf installation package into your  system/plugins folder. This will give you a tcpdf directory in the plugins directory.
2. Create a tcpdf_pi.php file inside the plugins directory. Place the following code in it:

1
2
3
4
5
6
7
8
9
10
11
12
13

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
require_once('tcpdf/config/lang/eng.php');
require_once('tcpdf/tcpdf.php');
 
// Extend the TCPDF class to create custom Header and Footer
class OnemoretakePDF extends TCPDF {
}
 
function tcpdf(){
    return new OnemoretakePDF (PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true);
}
 
?>

Here, we basically instantiate tcpdf and pass in a few of the default values. You may be wondering why I have extended the TCPDF class and have not just instantiated it directly. Well, I shall come to that later.

To use this in CodeIgniter, you load the plugin and then create an instance of  it as follows:

1
2

$this->load->plugin( 'tcpdf' );
$pdf = tcpdf();

The next step really, is to visit the documentation for tcpdf. It is not the easiest to follow set of documentation there is, as it has been generated directly from the code, although there are several examples that you can pull apart to learn more. The premise here is to create a new pdf page and plot what you want on that page. This can be done directly with commands like Text() and Line() which use coordinates directly or you can also use Cell() and MultiCell() which allow you to draw using a cell system like a table and utilise borders and alignment appropriately. For those who just cannot get their heads around plotting on a page, there are commands to plot HTML, although support for styles is limited, so don’t expect to recreate a fancy webpage layout by throwing the html at it. I found that with a little bit of lateral thinking, most jobs can be done without the HTML methods anyhow.

What took me a little time to get used to, is that the coordinate system is not in pixels but by default, in millimetres. This actually makes a lot of sense, as we are creating for print here, not screen. This makes it very awkward if you are working off a design done in photoshop or similar and want to get the dimensions just right. However, a trick I soon learned was to print that image directly to a pdf and then you can use the measurement tools in your pdf reader (Foxit reader has such a tool) to measure the correct distance in millimetres.

The API for tcpdf is extensive and with it, one can achieve most tasks. One thing to note, however is that to create a standard header and footer for your document, you need to override the default header and footer methods in the main tcpdf class. This is why, in the code above, I extended the tcpdf class. It will give us the opportunity to override these methods as follows:

1
2
3
4
5
6
7
8
9
10
11

class OnemoretakePDF extends TCPDF {
    //Page header
    public function Header() {
        //header plotting code here
    }
 
    // Page footer
    public function Footer() {
      //footer plotting code here
    }
}

My biggest gripe about this library is that the documentation does not give enough detail. Coupled with that, the forum is a SourceForge forum, which frankly I find very difficult to find anything in. It would be great if there was a way to get more detail, perhaps a wiki would benefit the project a great deal – I am sure there is a lot of detailed knowledge out there about the ins and outs of the library, its just that there is no way to tap into it.

You can’t complain too much however, this project provides a very powerful pdf creation library. I have had experience with Microsoft.Net libraries of a similar nature and you can end up paying quite a lot for them. Not to mention they tend be way more restricted as to what is possible.

The Technical Debt

I have spent the last few days at work doing some intense refactoring of a seemingly complex jQuery plug-in. I managed to cut it down by 140 lines and speed it up immensely. Whilst it would have saved time if I had written the plug-in myself in the first place, I cannot be expected to do everything and nobody else at work would improve their jQuery and javascript writing skills if I did so. I therefore label my time spent as paying of some of the technical debt that we create, in the process of releasing the software as quickly as we can. If you have not come across this metaphor before, here it is:

It really nails the reason that as developers, we try to refactor regularly. Unfortunately refactoring is not something that people outside of the development community tend to understand and it is considered a waste of time all too often. I think use of this metaphor may just help those people understand.

Is Atlas So New?

Slipping musically into my twitter stream earlier this morning came an excited remark by John Resig. He seemed all hyped about the new Atlas product from 280 North that they announced at Future of Web Apps, Miami.

Given John’s reputation in web development, I immediately followed the link and watched the introductory video on the site, expecting to be amazed. It looked all very pretty and the creation of an rss reader with just a few clicks of the mouse gave suitable wow-factor to the demonstration.

However, I could not help thinking that I had seen this idea somewhere before. I use it at work every day – Microsoft Visual Studio. The same concepts are there for web development – a drag-and-drop interface, with built-in controls that are supposed to take most of the grunt work away from you.

At first look, this idea is great – creating fully-fledged application in no time at all. However, in my experience with Visual Studio, this ends up being more of a hindrance than a help. I avoid the drag-drop functionality of VS like the plague, not because I am a glutton for punishment but because of the intrinsic limitation it places on you and because most of the time the same functionality can (and should) be achieved in a faster, more flexible and more maintainable way. The biggest gripe I have with web development in VS is the constant struggle to make it produce tidy html that is standards compliant.

Atlas might not be like that at all. I have only seen the video. However, I don’t think it is revolutionary as the buzz today would lead us into thinking and it may not be all that people hope it is. It could endup just being a Visual Studio type development environment based in a browser.