How To Draw The Attention Of The Audience

22 May 2010

One of the best places I've ever seen to learn advanced JavaScript is on ejohn.org. There are several reasons for it, but what I want to mention here is the first slide (after the summary). Our goal! Determining a goal for your audience is the best way to draw attention to the end of any presentation. In this case the effect is even bigger because the audience will have found out till the end of the introduction whether the information is relevant to them, thus whether they are interested to listen / read.

I am amazed how many lecturers failed to do that simple trick and therefore lose connection with the audience.

Progressive Enhancement Cannot Be Applied To html5 Layouts

20 April 2010

Let me first make this clear: each time you fix something for a certain browser, you are not applying progressive enhancement. Progressive enhancement is all about building for the less capable first and enhance the experience for those using the latest modern browsers. So, any type of fixes are useless. If you use fixes, you might be applying graceful degradation or, more likely, you may just be hacking around in order to workaround the differences across the browsers and to make everything look and feel the same.

One of the great features of html5 is the new semantic tags. Like section, article, aside, footer, etc. Let's see how we can build a new layout using them. First of all, we have to make them block-level elements with css since they will behave as inline in each browser that do not understand them. So we fix the fact that these browsers do not support html5 semantic tags. Oops, I used the word fix, that's an indication we're not applying progressive enhancement. Ok, that's a tiny little fix so we can ignore it. Now, another obstacle is that Internet Explorer cannot apply a style to elements it doesn't know. So we're using the html5 shiv to create the elements in the DOM Tree and to fix this bug in IE. Oops, another fix. I'm not going to continue, I believe you get my point.

Ok, but what about the degradation of our future highly semantic markup? When you apply these fixes, another issue to worry about is what happens on browsers that do not support css. All these block-level elements becomes inline and the page looks messy (remember the idea of the CSS Naked Day?) The same way as if you use only spans to build the layout. Or what happens to IE with JavaScript turned off. It still cannot see the styles related to the new elements. So, our degradation is obviously not graceful, it is, to be honest, painful to watch.

The fact is, html, no matter which version, is not related to the user experience in any way on a given web page. It describes the data on the web, it marks it up. That's it. No visualization, no behavior. So, how can we build html5 layouts using progressive enhancement? Which is the basic technology we can use before it to assure wide support? Yup, there isn't any. Of course, we can build our layouts in the old way, but then we are not really using html5, only these features that work across the different browsers, like the short doctype, short charset, etc. That's a kind of compromise, it's neither progressive enhancement nor graceful degradation.

A great example of html5 and graceful degradation is Video for Everybody! on camendesign.com. It uses html5 video features, then it fails to QuickTime if your browser is not aware of html5, then it fails to flash, then it fails to image. But can't we reverse the process? Can't we build for the one that is unable to see video by any mean and then add flash, QuickTime and in the end - html5? I think it cannot be done right now, but it's still a not explored field. I might be wrong...

html5 Videos On Youtube

15 April 2010

Go to http://www.youtube.com/html5, click on Join the HTML5 Beta link and search for a video. You have to use a web browser that supports the html5 video tag and the youtube video format, which pretty much limits you to Safari 4 or Chrome 4.

Eric Meyer demonstrates an interesting flexibility when html5 is used instead of flash.

Version 5

04 April 2010

If someone follows the URL to your web site and don't see a typical blog there, it looks ridiculous, preposterous, even tasteless. Of course what people think has never cause me to do something different from what I had in mind in first place. But it has made me think of the real cause I've changed the content, layout and the look and feel of radoslavpopov.com so many times in the last several years.

Through the years I've used this place to improve my skills as a web developer. This was the place I've first learned how to use tables to structure my content... and later to use divs for everything I could mark up... and later to use semantic mark-up, and how to separate content, styling and behavior... and what is unobtrusive JavaScript... and so on.

If we met each other in the last two years it has a good chance that you know my daily work is not related to Front-end development any longer. And I missed some epic events in the scope. The release of IE8. God help me if I need to build even the easiest layout and something goes wrong. The emerging css3 and it's support in most modern browsers. All the buzz around html5. The next big thing - fonts in modern web design.

One sunny day I got sick, stayed at home and decided that this tendency needs to be broken. I cannot afford to waste years in gained knowledge because of laziness and to become the typical server-side developer, one I used to hate so much in the near past. Besides that, I love Front-end technologies, it's just that... well... I've forgotten about this love lately.

So, this is the result - a brand new version of my web site (I called it v5 in accordance to the html5, although it should be near 10 if I'd counted correctly). It will continue to serve as a place to gain knowledge about one of the fields I love the most.

Btw, don't be too disappointed if you've opened the source only to see the old looong boring doctype. There is a reason I'm not moving too fast to the html5, but this is a topic for a future post.