Archive for the ‘html’ Category

Pingerator

Sunday, October 1st, 2006

Some of you might know that I’m a fan of microformats. I’ve had a few lectures here in Slovenia in our local multimedia center, I’ve done some persuading and some watching from a distance. I’ve been on the uf-discuss mailing list for some time now and on Saturday I read about this problem Andy Mabbett had with the Pingerati ping service for microformated pages – it only takes one URL per ping. This makes for a very painful resubmitting process.

Well since I was just back from a short vacation I decided to stretch my fingers and write up a small page that allows users to add multiple URLs that will get submitted to the Pingerati service one by one. It didn’t really take me much time – about an hour – and it was done. I present you the pingerator.

It’s an easy to use one page app. All you do is enter the URLs, one per line as the instruction says, and click ping! If you want to resubmit the URLs in the form you can click save and the URLs will be stored in a cookie. You can easily restore the URLs by clicking restore! The pinging is done via an iframe and you can even see the pingerati response if you toggle the visibility of the window.

I haven’t really had time to test it though so any bug reports are welcome. The application will probably be under some refurbishing in the next few days but that should not break the saved URLs or the ease of use it sports today.

Long time no see – unknown IE bug

Saturday, September 9th, 2006

It’s really been quite a long time since I discovered a bug in IE’s CSS parsing that I didn’t know. I’m not saying that I don’t encounter bugs on a daily basis, but I know what they are and I avoid them accordingly as per Andy’s 4th3rd law of bug hunting. As I didn’t know it existed I didn’t know if they corrected the problem in IE7 but it seems they have – it’d be nice if someone checked the case and report it.

The bug is in parsing CSS files with #id.class formed selectors. It seems that when you have only one in the CSS file it works ok. You can see this in the before section of the case. After you add an additional #id.class rule before it the second one fails.

It’s pretty annoying since I had an element with an id that was one of the rare color coded elements on a site. When I wanted to change the colors with #element.color it didn’t work in IE (yes, I know that .color might not the best idea but believe me, in this case it is). When I wanted to change this to .element.color I found out that this is also broken so under pressure of time I solved it with YAWE (Yet Another Wrapper Element). It works but is a bit uglier.

In about 4 years time I won’t need to think about this anymore…

This page contains both secure and nonsecure items

Friday, June 9th, 2006

Sometimes creating a secure page is easy – you just change the http to https and you’re done. On other times you open the page in Internet Explorer and it starts complaining about unsecure items on the page. It’s annoying because many users get scared away thinking something wrong is going on. Or it’s just annoying since you don’t want to click ok every time you load a page.

To remove this alert follow these simple rules. After you do something reload. If there’s no more alerts you succeeded. Otherwise go on. If you get in a jam leave a comment and I’ll try to find one and add a rule.

  1. Change all http:// resource links to https://. The doctype is not a problem. All others (images, css, javascripts, iframe pages) should be https://.
  2. Change all about:blank links (yep, these are unsecure) to a blank file that exists and is a https:// link.
  3. Install Fiddler and check if there are any hidden requests to http:// (it won’t show https:// requests with the default setting). Change them to https://
  4. Check if any iframes have # for src or the src is left blank. Change them to something that is a https:// link and exists. Looks like # is actually an alias to about:blank.
  5. Find any resources that return an error (404, 500). This one is tricky since it’s not really easy to set up an SSL proxy. Try checking the server’s access logs.

The trick behind these is that any data that comes from an unsecure source triggers the alert. Unsecure data might come from a http:// link OR a built in page. Built in pages are for example about:blank. BUT what you wouldn’t expect is that also Explorer’s built in error pages are unsecure. So if you get a 500 or 404 error and Explorer decides to display its internal error message you will get an alert.

This might not be all but I think it should be enough.

Changing the way we change websites…

Friday, May 5th, 2006

A while ago Marko wrote about reusability of css based designs. I didn’t agree with him fully but had no idea how to explain/prove it.

In the times of table layouts the process od redesigning a site was actually (at least) three things. First the content was restructured and some of it written again (the sitemap). Then the layout was changed to reflect the new structure and to better fit the content (the wireframes). At the end a façade was made for reflecting the latest trends in ‘webdesign’ (the design – or is there a better word for it?). Even if it was a three way process it was rarely done by three different people – ‘webdesigners’ did almost everything themselves. Since this was quite a lengthy process it was also expensive and some corporate websites changed once every three (or more) years.

Now it seems things are changing for the better. With a DIV layout, CSS based designs and a strict separation of layout and content we can actually split these three into separate stages. The strict division of these stages gives us the posibility to focus our work on what it really has to achieve. It’s true that you cannot use the whole 100% of the other parts but being able to keep 80% is good enough.

About a week ago I found out about two ‘design’ contents and the one Slashdot is holding was interesting because it was about proving a point – you can change the façade without changing the layout or the content. I did the whole thing without changing a bit of HTML (with a bit ugly CSS, would be nicer if a few lines of the code were changed).

I think this way of thinking will settle in and more and more changes will include only one of the three stages. Hopefully they will be based on user testing and/or usage data…

Reinventing the contact…

Monday, April 17th, 2006

I read that ICANN is in the final stages of creating another top-level domain called .tel. The arguments behind it are that currently there is no way to get the latest contact information so companies and individuals will buy .tel domains to provide it.

Their argumentation can be summed up in these three points. Firstly not everybody has a website with a friendly and memorable URL that can be used as source of data. Secondly people cannot be identified by phone numbers because they change. People are identified by names hence their solution is perfect.

It doesn’t take a genious to see the arguments they make are very weak. If users don’t have a website now, why would they have it after the .tel domain is available? Yes, phone numbers change, domain names change, people move, companies die. URLs are hard to remember, so are emails and phone numbers. Names and faces are hard to remember. To make things worse there are people with same names, similar URLs, phone numbers and even faces. And there can only be one identified by a unique .tel domain. How does this lessen the confusion?

The thing that made me write this is the ignorance of the development of the web. Nowadays almost every communication device is also a web browser. Web pages use HTML as the foundation and HTML has an element called ADDRESS. This is what the specification says about the element:

The ADDRESS element may be used by authors to supply contact information for a document or a major part of a document such as a form. This element often appears at the beginning or end of a document.

This means that you can already do what they want to achieve by the .tel domain by using the ADDRESS element on your web page. If you want to make the contact information even more computer readable and be able to add other information you could just use hCard microformat. It’s based on a standard contact format and can be easily imported into all recent contact management software.

Since not many people use the ‘new’ TLDs are there any reasons to have .tel?