Standards matter. Before standards, every browser had its own play book. With standards, every browser’s on the same page. Great for developers, standards let them create sites that work on all browsers out of the box. Great for the browsing public, they ensure that you enjoy a great experience on every site you visit. And these technologies are free for anyone to use.

I am currently spending some time checking out HTML5 and CSS3. And from what I can see the browser world is now just as unsynchronized as it was in the first browser war.
My inspiration for checking the new features in HTML5 and CSS3 is the fact that so many people are saying that with HTML5 (and CSS3) Flash is dead.

Well.

The good thing about Flash is that it runs on all platforms, though really slow on iPads and iPhones – but that’s another issue. It is browser independent, which makes it look the same in all browsers. That’s what makes Flash a graphic designers choice instead of HTML5/CSS3.
An example I can use is this:
Let’s say there is a website wanting to show information about the players on the teams playing in the World Cup in South Africa (in 2010). The designer want some animation like flipping cards, sliding in/sliding out and so on. Let’s say the company creating this application wants to use HTML5. Well, he can’t:

1. Internet Explorer (from 6 up to current build of IE) does not understand all the 3d-stuff in CSS3
2. Firefox 3.6 (and most likely 3.7) does not understand all the 3d-stuff in CSS3
3. Opera 10.5 (and most likely 10.6) does not understand all the 3d-stuff in CSS3
4. Chrome 5 does not understand all the 3d-stuff in CSS3

So there is only Safari (with about 5% of the market) that understands the 3d-stuff in CSS3. Which is not so weird. Apple was one of the promoters of 3D-transformations in CSS.
Also: In Flash there is only one build. There are no specific style sheet for IE(6-X), Firefox, Webkit/Chrome/Safari or Opera. There are no need for [IF IE] in the HTML/CSS-code.

I do hope that the developers and the designers who works with CSS3 and HTML5 at Apple will become advocates of standards and that they will fight for this in their forums. I experienced the lasts browser war (which Microsoft claims it won… you don’t win wars, ok! and… look where it left us: With IE6 still being widely used in 2010!!!). I don’t want another one in 2010.

And I think there is only one way we can achieve a compliant standard that all browse vendors will follow: Start thinking of your users and the web developers. Stop creating HTML/CSS rendering engines. Standardize on one or two (Webkit and Mozilla, with the latter also being the one to disappear).
Sorry Microsoft. When you are nine years behind… although you did invent the XMLhttpRequest, most important part of AJAX, why not start contributing to an open source project instead?
And sorry Opera. Your market share is way to small, and I think you are better off using one of the other engines and start contributing to those instead. And: Three is one to many (or three is a crowd as the saying goes).

So what shall the vendors do when they cannot focus on their own engine?

• Contribute to the two standard engines (webkit/mozilla)
• Focus on making the best looking, fastest or functional browser out there.

Usage: If you want to create a modal form/window, a “popup” or a lightbox you have to use Javascript. I am suggesting this tag to remove the javascript need to create such a standard feature on the web. This technique uses iframe and css to create the look.

Implementation: I am suggesting that can use most of the same attributes as iframe/frame.
Adding the following attributes:

• modal
  boolean, if the window shall be modal or not
• movable
  boolean, true if the window shall be moveable, false if not
• fade-background-color
  Color, set the background color being used when window opens. Default is dark gray…
• background-opacity
  integer, set the transparency for the background

I am not part of the W3 HTML 5 working group and I have not posted this suggestion to this group. I am just suggesting it here as something I wish to see in HTML 5.

Coming from the Windows side of things and being used to Visual Basic (I probably have the 1.0 floppy somewhere if I start looking!!!), Delphi and now lately Visual Studio (It might seem weird that I’ve just recently been introduced to VS, but I have mostly coded in PHP and classic ASP for the last 8-10 years, and then you sort of don’t need VS), I have been accustomed to drag’n drop + double click to add code to the application. I have yet to write an application for Linux, but I have made a few attempts. My first attempt included being introduced to the Glade application which is/was used to create the layout of the application – aka GUI. Then you write the code in another IDE.

This was (hm) a while back – not writing year here, but I can write years if you like…

The Good

With the introduction of MonoDevelop, Real Basic and QT we don’t have to open one application to create the GUI and a second one to attach code. It is all being done (and taken care of) in one development tool. This is, and I’d like to emphasize on this, the best way to write applications (my humble opinion – hey my blog!). The tool and GUI-designer is implemented and things can and should work smoothly. Also: You don’t have to learn two applications and probably also two “languages” – although I am all for having knowledge in as many programming languages as you can. I can now code in C#, VB.Net, Delphi/Pascal (although somewhat very rusty), Perl (briefly, by no means an expert and more or less a novice  and PHP (if that is considered a programming language).

I have tested QT, MonoDevelop and Real Basic. As I am no C++ developer (but I wish I was!), QT would be my choice of  development tool to use when learning that language. Real Basic has only been tested a few times after listening to Bryan Lunduke (Linux Action Show / Computer Action Show) speaking highly of it. MonoDevelop is as of now the tool I use when I’m now doing some C# stuff on Linux and trying to get the grips of  GTK-development.

I do want to check out Python as a programming language as I have heard so much positive things regarding the language. But writing an application where you use Glade + editor of choice is not something I want to do. Not in 2009/2010. I think I’ve read somewhere that it can be possible to write applications in Python using QT, but I haven’t spent to much time getting this to work – as I don’t know that much Python – yet…

One thing though: By using Glade and similar applications you separate logic with presentation which can/is a good thing. But there are also drawbacks to this way of designing and developing applications. More below.

The “Bad”

I have also tried Android development in Eclipse, and it seems promising. But again: If the only way to create a GUI is to write XML-code, then no thanks. To the developers of development tools out there: Look at the calendar. It is – as of writing – saying December 19 in 2009, start creating drag’n drop applications.

This also goes for creating Web applications (as this is the new term for web pages). DreamWeaver alternatives for Linux? Not even close. Visual Studio + PHP under Linux. Nope.

Two years ago I attended a class to get a jumpstart on C#-development. And I was shown how to create a zebra-striped/styled datalist in VS. The teacher showed me how to do this in three ways: the first one without using any code, the second way with some code and placing the “plugin” and the last way by creating the object and so on.

So let’s say you have never programmed anything in your entire life. Which one would you start using to get going and to be inspired to code more? First one, most likely – until you understand that it gives you some restrictions and/or problems down the line. But at least you get inspired. You get the application out there to impress friends/boss/yourself quickly.

There are of course drawbacks to this type of applications. No one can argue that DW and such applications creates optimized code. And I am my self a user of Notepad-like applications to generate PHP-code – that is – I have moved from Bluefish to Aptana/Eclipse. Sometimes I do wish it was a faster way to create forms than the way I do it now – even though it doesn’t take that much time.

I have checked out Zend Studio – which is now an Eclipse plugin, and I was hoping that ZS would be the way to do the same thing for PHP under Linux/Windows. Nope – not as I have found out – yet. It saddens me. Especially because they market this as “Zend Studio 7.1 is the next generation of our professional-grade PHP application development environment. It has been designed to maximize developer productivity by enabling you to develop and maintain code faster, solve application problems quickly and improve team collaboration.”

I don’t think they are close to be a next generation professional-grade PHP application development environment. This is 2009 (soon 2010) and 7.1 should’ve had drag’n drop datalists, form creation in place. I hope, how ever, that ZS will in the end turn out to become a drag’n drop Rapid Web Application development (RWAD – Coined by Trond Husø on December 19, 2009!!!) tool for PHP.

My Dream!
Maybe, in 2010(not likely) we could have a universal Rapid Application Development tool to be used to develop Linux applications that supports Python, Java, Perl, C, C++, PHP (if you want to!), C# and any other programming languages you can think of. And most importantly: The RAD tool should work out of the box. No spending much time on plugins and so on.

Some links:
There are some RAD applications out there and here are some links:
Python
Dabo

Visual Basic

Gambas

MonoDevelop

Pascal

Lazarus

(more links to come – obviously… – please do suggest some!)

Another discussion regarding development under Linux:

Putting the Squeeze on Python Application Development

(more links to come)

It is interesting to follow the discussion on the ieblog which is oh-so-long. Which is not so weird. IE is of great concern for web developers. We have to code for it so that the website looks correct even in IE6 – which really is making us go mad. Many times I have spent hours and hours to make the website work in IE6 – both HTML, CSS and Javascript wize.
It is more than annoying to say the least.

One suggestion that comes up in the comments is for Microsoft to move Trident out of IE and in stead start using Webkit. We all know that’s not going to happen. And there are a few reasons for this:

1. Trident is Microsofts own rendering engine and is used not only in Internet Explorer, but also in other applications – not only from MS. Since we also know that IE is tightly connected to the OS, Trident is most likely used in other applications – like for instance Explorer.
2. Because the IE is so tightly connected to the Operating System they can’t change the rendering engine. It will take up a lot of resources, time and effort to make changes in the OS and then in a lot of MS applications that it won’t make sense.
3. MS don’t really want to follow web standards. They will invent in order to fix problems at hand in the Operating System which isn’t really Web related.
4. MS has spent much time and effort on the rendering engine. And since they want to say that they have won the Internet (according to Steve Ballmer, source not found (yet)), they don’t want to give in.

I really wish that IE could be decoupled with the OS. It would mean that I – as a Linux user – could download and install IE-X on my Linux Laptop to test out the site on the crippled browser. Now I have to run Windows in a Virtual Machine just to make sure that it works properly. And not only do I have to have a VM. I also need to have multiple versions of Internet Explorer running on the installation as well. This so that I can be sure that it works “perfectly” on IE6, IE7 and IE8 (and soon IE9).
I am not sure I want to go down that route.

One thing I am sure of is that I am not supporting IE6. That browser is as old as the dark ages, and less people are using it. As more and more people are moving to Vista and Win7 IE6 will fade and hopefully it will be gone.

And hopefully in 2010 we will have a MS-browser that supports CSS3, CSS2.1 and HTML4 and HTML 5.

I do hope that MS keeps on being innovative. But I hope they do this participating with the Web development community and not against them.

I am not religious regarding using or not using the table-tag to render the page, but some are out there, and so it is nice to know how to use css to create a table.

Below is the code that I used to get some data. What it does it looping the “root” of my personal development apache server. Then by using the div-tag and css a table is created.

This is the index.php file

<?php
# index.php

/*
* This file shall have a little menu in it. It shall also list up the folders we have
* in the root directory
*/
echo ‘<html>
<head>
<title>Localhost</title>
<link rel=”stylesheet” href=”style/localhost.css” type=”text/css” />

</head>

<body>’;

if ($handle = opendir(‘.’)) {
echo $_SERVER['SERVER_NAME'].” running on: “;
echo $_SERVER['SERVER_SOFTWARE'].”<br>”;
# echo “Directory handle: $handle\n”;
echo “<b>Files:</b>\n<br>”;

# This will be a test for css and tables
echo “<div class = \”table\”>\n”;
$rows = 1;
$cols = 0;
$files = 0;
/* This is the correct way to loop over the directory. */
while (false !== ($file = readdir($handle))) {
if (strlen($file) > 2) {
# we shall change rows when we have created three columns
$cols++;

if ($cols == 5) {
echo “</div>\n”;
$cols = 1;
}

if ($cols == 1) {
echo “<div class = \”tr”.$rows.”\”>”;
$rows++;

if ($rows == 3) {
$rows = 1;
}
}

echo “<div class = \”td\”>”.$file.”</div>”;

}
}

closedir($handle);
echo “</div>”;
}

?>

And this is the CSS-file


/*
This style is used to check how to create tables in css
*/

div.table {
display: table;
table-layout: fixed;
background-color: rgb(120, 20, 90);
width:100%;

}

div.tr1 {
display: table-row-group;
background-color: #e5e5e5;
}

div.tr2 {
display: table-row-group;
background-color: #bfbfbf;
}
div.td {
display: table-cell;
vertical-align: top;
padding: 2px 0px 3px 0px;
border-bottom: 1px solid #d3d1d1;
width: 20px;
}