Not given this issue much thought yet but I wonder whether having admin control panels are neccessary, certainly in their current form. When creating a blog post or forum post, there’s no more logical place to do it than on the blog or the forum itself. Why does a totally separate interface exist for creating forums or creating categories? If you want to edit a forum topic, you can do it right there. But if you want to edit a forum, you need to log in somewhere else and do it in an interface which is totally different.

I presume the main reason is for security – if you left your computer logged on your website, someone could do limited damage before logging in again. A separate interface may not be the only solution. The software can be designed in such a way when a user would do an action which makes large changes it prompts the user to re-enter their password.

Putting content and user control back into the main interface may give a better workflow. Of course there’s going to be general settings such as board name, e-mail configuration, etc. These could exist as part of the main script as an additional page; it doesn’t need to necessarily be a totally separate script.

Currently I use RSS 1.0 with the content stored in a content:encoded property of each item. The full content of blog entries is in the RSS entries. Of course, in XML documents everything must be nested properly, ampersands need to be encoded, etc. People find all kind of strange ways of getting around this requirement and allowing tag soup to be placed in RSS documents. The content:encoded property kind of allows that – if there is a mismatched tag the RSS file will still work.

However, the requirement for properly encoded characters remains. TinyMCE to the rescue! By default, TinyMCE will ensure that anything that needs to be an entity is an entity. If you type £, it generates £ If you type &, it generates &. For some reason, XML doesn’t support all the entities that HTML does – £ is an invalid XML entity. However, the numeric version of the entity, £ works and is valid.

To ensure valid RSS, I tried to set the "entityencoding" : "numeric" property on TinyMCE. It kind of worked – it produced valid numeric entities instead of named entities. This option seems to have a serious bug however; when you try to use an angle bracket it doesn’t encode it. The "hack" which solved it was to use named entity encoding but to configure the names to produce numeric entities.

entities :
"160,nbsp,38,amp,34,quot,60,lt,62,gt,162,#162,8364,#8364,163,#163,165,#165,169,#
169,174,#174,8482,#8482,8240,#8240,181,#181,183,#183,8226,#8226,8230,#8230,8242,
#8242,8243,#8243,167,#167,182,#182,223,#223,8249,#8249,8250,#8250,171,#171,187,#
187,8216,#8216,8217,#8217,8220,#8220,8221,#8221,8218,#8218,8222,#8222,8804,#8804
,8805,#8805,8211,#8211,8212,#8212,175,#175,8254,#8254,164,#164,166,#166,168,#168
,161,#161,191,#191,710,#710,732,#732,176,#176,8722,#8722,177,#177,247,#247,8260,
#8260,215,#215,185,#185,178,#178,179,#179,188,#188,189,#189,190,#190,402,#402,87
47,#8747,8721,#8721,8734,#8734,8730,#8730,8764,#8764,8773,#8773,8776,#8776,8800,
#8800,8801,#8801,8712,#8712,8713,#8713,8715,#8715,8719,#8719,8743,#8743,8744,#87
44,172,#172,8745,#8745,8746,#8746,8706,#8706,8704,#8704,8707,#8707,8709,#8709,87
11,#8711,8727,#8727,8733,#8733,8736,#8736,180,#180,184,#184,170,#170,186,#186,82
24,#8224,8225,#8225,192,#192,194,#194,195,#195,196,#196,197,#197,198,#198,199,#1
99,200,#200,202,#202,203,#203,204,#204,206,#206,207,#207,208,#208,209,#209,210,#
210,212,#212,213,#213,214,#214,216,#216,338,#338,217,#217,219,#219,220,#220,376,
#376,222,#222,224,#224,226,#226,227,#227,228,#228,229,#229,230,#230,231,#231,232
,#232,234,#234,235,#235,236,#236,238,#238,239,#239,240,#240,241,#241,242,#242,24
4,#244,245,#245,246,#246,248,#248,339,#339,249,#249,251,#251,252,#252,254,#254,2
55,#255,914,#914,915,#915,916,#916,917,#917,918,#918,919,#919,920,#920,921,#921,
922,#922,923,#923,924,#924,925,#925,926,#926,927,#927,928,#928,929,#929,931,#931
,932,#932,933,#933,934,#934,935,#935,936,#936,937,#937,945,#945,946,#946,947,#94
7,948,#948,949,#949,950,#950,951,#951,952,#952,953,#953,954,#954,955,#955,956,#9
56,957,#957,958,#958,959,#959,960,#960,961,#961,962,#962,963,#963,964,#964,965,#
965,966,#966,967,#967,968,#968,969,#969,8501,#8501,982,#982,8476,#8476,977,#977,
978,#978,8472,#8472,8465,#8465,8592,#8592,8593,#8593,8594,#8594,8595,#8595,8596,
#8596,8629,#8629,8656,#8656,8657,#8657,8658,#8658,8659,#8659,8660,#8660,8756,#87
56,8834,#8834,8835,#8835,8836,#8836,8838,#8838,8839,#8839,8853,#8853,8855,#8855,
8869,#8869,8901,#8901,8968,#8968,8969,#8969,8970,#8970,8971,#8971,9001,#9001,900
2,#9002,9674,#9674,9824,#9824,9827,#9827,9829,#9829,9830,#9830,8194,#8194,8195,#
8195,8201,#8201,8204,#8204,8205,#8205,8206,#8206,8207,#8207,173,#173,233,#233,",
entityencoding : "named",

Just yesterday me, neonDragon and a few others were having a chat about XHTML and HTML in irc.neondragon.net #evolution about whether we should use XHTML 1.0 or HTML 4.01.

I caught the XHTML bug around 2 years ago so I actually haven’t written a line of HTML for about that long. I’m using XHTML 1.0 Transitional almost exclusively across all of my sites, sometimes XHTML 1.0 Strict. I’m quite happy with XHTML but it’s true that there haven’t been many benefits.

If you visited this website several weeks ago, you probably wouldn’t have noticed it was sent to you using the application/xhtml+xml mime type providing your browser supported it. For Internet Explorer users, you got the text/html MIME type. This worked fine but sometimes problems could be caused by an non-encoded ampersand or something. Before I added the WYSIWYG editor, I removed the application/xhtml+xml MIME Type because I couldn’t guarantee bulletproof XHTML.

The big problem is this: I can’t guarantee the user submits valid XHTML. Markdown did a pretty good of generating XHTML but it wasn’t perfect. With the application/xhtml+xml MIME type, all it takes for a user to break a web page is to submit content with an unencoded ampersand. If you want to be so dramatic, call it a "denial of service".

I do wonder whether XML_HTMLSax could ensure bulletproof XHTML but I’ve never really tried it. The SafeHTML library I use actually converts ensures tags are closed and stuff as an side-effect but it misses things such as unencoded ampersands.

In the last year or so, HTML 4 has become more popular again. Hixie’s complaints about MIME types (Sending XHTML as text/html considered harmful) is probably one of the most frequently quoted articles on the HTML VS. XHTML debate. Anne van Kesteren writes today on the Rise of HTML:

I guess people have noticed that XHTML 1 is not forwards compatible. At least not with XHTML 2 which is not backwards compatible. HTML 5 on the other hand has a clear migration path. Or perhaps it is none of that bullshit and it came out quite clearly that there where zero benefits. 

One of the reasons I’m seriously thinking about going back to HTML 4 is because HTML 5 is really exciting and it seems like it’ll be out and be supported by browsers way before XHTML 2 is. (Whether IE will support it is a different matter; to be honest I wouldn’t be surprised if it decided to support XHTML 2 at the same time as Web Forms 2) but at least HTML 5 is more backwards-compatible than XHTML 2 is.

What’s the real difference between valid XHTML and good HTML anyway? A few /> to close tags and making sure entities is encoded correctly?

For the moment I think I’ll keep using XHTML. TinyMCE produces XHTML. The XHTML might not always be perfect but it’s XHTML, not HTML. To return to HTML would mean modifying TinyMCE to produce valid HTML – without the self closing tags for example. The same thing applies to other scripts I use such as SafeHTML and PHP itself. A PHP error message is technically invalid HTML as it has a self-closing br tag. 

Hopefully switching to XHTML 1.0 Strict with application/xhtml+xml will become more practical soon. And whats to stop someone from implementing HTML 5 in an XML format? XHTML 1.2 perhaps? 

I just discovered that you can style the user’s text selection using CSS 3. At the moment it only works in Gecko and Safari – Safari supports it through the official ::selection whilst Mozilla supports it through the proprietary ::-moz-selection rule. I used the following two rules to change the selection colours:

::-moz-selection { color: black; background: #A0B7CC; }
::selection { color: black; background: #A0B7CC; }

There was no real good reason for doing it apart from that it looks hip. Accidently discovered at moo.fx, more info at Quirks Mode.

Well, I’ve finally been able to make available a technology preview release of Geneone – the software which powers this blog. This includes many of the features I’ve talked about over the last months including WYSIWYG Editing, Similar Entries and IntelliAnswer. This release also contains the object system which I use. This release is buggy and unfinished. There are bits of code which cleaning up, bits of code which are redundant, and things which need to be shuffled around.

Get it here 

You should only download and install this release if you are comfortable with PHP. Please read the Readme.txt file first; the install.txt file contains some basic instructions on how to set up Geneone. If you are getting a HTTP error 500, try renaming the .htaccess file to something else. If the index.php file is blank, check out rdf.php and see if it presents any errors.

The genescripts/ folder has 3 examples of scripts which integrate with Geneone. Integration with other scripts and being able to write useful scripts utilizing Geneone’s API should become a major selling point in the future.

Feedback, comments and bugs are welcome.

A while ago it was rumoured that Google and Sun were building a web-based office suite. The rumours turned out to be false (so far at least) but it now seems Microsoft is rumoured to be building a web-based Office suite.

According to ZDNet, a Microsoft insider said said "Everything. Hosted Office. Everything hosted" when asked what applications Microsoft plans to offer hosted as services.

If this is true, Office 12 may be the last desktop office suite from Microsoft. Perhaps "Office 13" will take advantage of some new functionality in Vista such as XAML and would allow some basic things to be done offline but files, tools such as spelling, etc. to be done online. The disadvantage of hosted web applications is that if your connection breaks or something, you can’t carry on with your work and you may lose data and time. 

I do wonder how practical it would be to create a fully 100% online office suite.

Came across this wonderful website today. It contains images of liquid in shapes created by dropping or splashing water. The photographs are taken at high speeds with flash to "capture the moment". There are pictures of liquid sculpture created from water, food colouring, milk and oil.

It’s well worth taking a look through the gallery – there are some really nice images. The free fall gallery and squirts gallery contains some of my favourite snaps.

I can’t imagine the amount of work it would have taken to create these images; there’s the artistic elements, photography and the science behind surface tension and viscosities.

Many of you have worked out or discovered the solution for the HTML mystery I posed 1 week ago. To recap, it’s a 0 byte HTML page (excluding comments) with images, text and rollover effects. It was quite interesting to see what people wrote on forums, blogs and comments.

Some of the incorrect answers… 

XUL/Standards
Some people suggested that I was using a proprietary technology which only worked in Mozilla such as XBL or XUL. Wrong. The mystery page follows standards – the HTTP header used is defined in RFC [some random meaningless number]. The stylesheet used should be valid CSS 2.1. Obviously the page itself wasn’t valid as it didn’t contain any content. The demo page also works in Opera 9.

JavaScript
There was a suggestion I was getting Javascript to create the page and then using Javascript to somehow disable or modify the “View Source” functionality of the browser. Interesting ideas; I’m not sure if this is possible but you need one Javascript tag and you can create a DOM and a fully functioning web page. Whether you could then disguise the fact your including Javascript is another matter.

PHP Magic
There was also some suggestion I was doing some magic with PHP. PHP is a server side language which generates HTML and can’t cause something like no source code. Well, it kinda can…

The reason I used PHP was because I needed to send a special HTTP Header:

Link: <nocode.css>; REL=”stylesheet”; MEDIA=”screen”

This HTTP Header is the equivalent of sending a link tag in the head section of the HTML page. The second trick in using CSS was that not many people knew what CSS could do – rollovers, inserting content, images. The following CSS file was used:

body { background: #9EAEB3 url(grad.jpg) repeat-x top; font-size: 20px; text-decoration: blink; font-weight: bold; }
body:after { content: “This page contains 0 bytes of HTML (excluding comments). View the source code, no CSS! Move your mouse here…” }
body:hover { text-decoration: none; color: green; }
body:hover:after { content: “Look, no Javascript, ma! View source… ” url(http://khlo.co.uk/ui/cow/images/comments.gif) ” cow.neondragon.net”; color: white; background-color: blue; font-size: 24px; line-height: 36px; }

The content attribute allows you to add generated content into a webpage. In practice, this is sometimes used in the printer stylesheet to display URLs linked. For example, a:after { content: “(” attr(href) “)”; } will display the URL of the target page of each hyperlink in the page. The :after and :before pseudo-classes allow content to be added before or after the element.

:hover is also a cool pseudo-class but most people will probably have used these now on their hyperlinks. Back in the day, many people used Javascript for text and image rollovers. 

I do think including stylesheets using HTTP headers is quite a neat trick – perhaps this could be a new method of sending stylesheets only to Gecko and Opera 9+. A “hack” if you like. 

Congrats if you got it! 

moo.fx is a small, light weight JavaScript effects library. It weighs in at 3KB but you’ll also need prototype.js; a light version of prototype included in the download weighs in at another 3KB. Check out the test page to see some of the effects it can do.

At the moment, I’m using the Rico library for effects; I don’t use “AJAX”, Drag and Drop, LiveGrid, etc. On Evolution we use the Rico library with the extra features we don’t use removed. The resulting library is 38KB plus an extra 29KB for Prototype. It seems like moo.fx can do quite a lot of what Rico can do and there is an Accordion-like effect demonstrated on the moo.fx homepage.

moo.fx also claims better Opera and Safari support which is also a bonus. I’m not sure whether I have the energy to migrate Evolution to use moo.fx but it’s certainly a library I’d look at for further use in any similar projects. It’s also open source and released under the MIT license :) 

I just added a ‘Similar Entries’ section to each blog post. This is highly experimental. It finds 5 blog posts which are similar or relevant to the current blog post. It does this by automatically finding key terms in the blog post using Yahoo!’s Web Services. These are then stored as “tags” or taxonomies in the database. The blog then finds other blog posts with the same keywords and orders them by relevancy.

As it’s experimental, I’ve left quite a lot of debug/test information in – the keywords generated and the “score” of relevant entries. It’s working quite well in some cases; for example on the blog post “Opera to become free?“, it links to a later post when Opera does become free, Opera 8.0 upgrading and some web statistics. Some of the keywords which Yahoo! returns don’t make much sense – on the “Opera to become free?” article it gives key terms such as tries and competes. The automatic key term extraction implementation probably needs some work – perhaps I need to make it only select the most important 5 or so terms to store as labels/tags for that object.

The key terms are generated when the blog post is created. For the older blog posts, I wrote a PHP script to generate them.

/* Load configuration file */
require (“path-to-config-file.php”);

/* Load required core libraries */
define (“IN_GENE”, TRUE);
require (“loader.php”);

$blog = Gene::getObject(1);
$childs = $blog->getChilds();

foreach ($childs as $i) {
    $object = Gene::getObject($i[‘object_id’]);
    $taxonomy =& $object->getTaxonomy(1);
    $taxonomy->add($taxonomy->findTerms());
    echo ‘Done ‘.$i[‘object_id’].’\n’;
}

It’s quite a nice script at 18 lines and shows how easy it is to integrate your scripts with Geneone.

It’d be interesting to see how scripts such as vBulletin find similar topics. If anyone has any knowledge, please share it! Greatfully appreciated!