Programming the Web

I do a lot of web programming at work, with a combination of PHP, HTML, CSS and Javascript. Once you've understood how each language works, using them together is no problem. The thing is, is that really all these components of web programming were designed separately from each other and bolted together. This makes for ineligant code, to both program and read.

There are several things that spring to mind when coding web pages: the need for escaping, the differing syntaxes, the similarity of Javascript and PHP. Wouldn't life be simpler if these components were unified?

The answer is to employ the block notation of C like languages (such as PHP and Javascript). This could be used to immediately simplify HTML and make it less verbose. For example an ordered list might look like:

ol {
li{First item}
li{Second item}
}

Given good identation, this is already more readable. Also this ties in a lot better with the other three components and their syntax. How are HTML attributes to be done? Again the answer is to pinch the notation for functions in PHP and Javascript:

table (width: '25%'; border:'2px') {...}

So the semantics here are that parameters are in round brackets whereas code or children are in braces. The parameter syntax is very similar to that of the existing CSS syntax, so this can also be brought into the fold:

#div (
text-align: 'left';
position: 'absolute';
)


Note the round brackets. This scheme allows us to get rid of the escaping nonsense and to remove the sense of these disparate components being bolted together. How so? Well luckily most HTML tags are different from PHP and Javascript keywords. For example you could do the following:

html {
body {
for ($index = 1; $index<=10; $index++) {
echo 'This is body line '.$index;
}
}
}

This example shows how you can freely mix HTML markup and PHP code together, without having to escape from one to the other. This makes for clarity in reading and reduces the semantic baggage when trying to decipher code. Here's an example which would mix all the components together:

html {
head {
script{
function sayHi() {
alert('Hi there!');
}
}
style {
.box (
background-color:#009966;
)
}
}
body (bgcolor: 'red'; text: 'blue') {
div (onClick: sayHi(); class: 'box') {
'Click me';
}
}
}

The only exceptional thing here is how to handle blocks of text in HTML. These would need to be escaped in some fashion, so as not to be confused with PHP code. I'm not 100% sure how this should be done. A simple way, as shown in the preceding example, would just be to enclose the text in quotes. Another way would be to have an explicit 'text' tag, but then you may as well use the 'echo' statement in PHP.

How would such a file be used in practice? The ideal of course would be for a web server like Apache to read the file and execute it straight off, emitting the result as conventional HTML/CSS/Javascript. A second easier solution, is to write a compiler which would convert the new format syntax into the conventional style. The converted pages would then be used as normal.

Lastly, is the issue of Javascript/PHP. It would be wonderful, if there wasn't a need to learn two separate languages with very similar syntax. Why not go the whole hog and produce a hybrid of the two? Maybe easier said than done.