Want to fix the mobile web? Are you developing mobile apps using web standards and libraries?

At Mozilla we are right now planning our outreach to libraries and tool makers to support more than one platform when it comes to mobile web development. To make sure that we change where it is most needed we need some more information.

Could you do me a favour and fill out a quick survey about libraries and developer use?

I killed my Macbook Air the other day and I am still not convinced about the current ones. The intel video chipset has/had problems with WebGL on Chrome and when I tried to connect to a projector, it did nothing whatsoever which is a deal breaker for me as a presenter. It seems the way to fix that issue is to reboot the machine with a power lead attached and connected to the projector. But this still sounds like a hack to me and I don’t buy macs to reboot them before a talk. So I am waiting for the rumoured MBP 13” upgrade which would be cool.

What this taught me though is things I told people for years – back up all your stuff online as you can get it there as a last resort. Of course this is more frustrating than anything when you are on the road and offline or on a very slow hotel connection, but it is better than being stuck as it means that if your hardware deserts you, you can still use some other machine.

For the moment I switched to the company 15” macbook pro for work but it is incredible how unwieldy and slow this one feels in comparison. It has a traditional hard disk, and coming back to that from SSD is just weird – especially for video and presentation work. For example I recorded a voiceover for slides using the Quicktime recording in Keynote and the audio and video was completely out of sync.

So I thought that this is a great opportunity to make a total switch and give full online working a go. I am writing this on the Chromebook I got at the last Google IO and which subsequently left a shy retired life on my shelf. Upgrading to the latest Chrome OS I found it to be actually quite useful. The machine is not as heavy as the 15” MBP to carry around and the keyboard is good. The trackpad is utterly woeful however, but I am 90% a keyboard user.

For editing I use WordPress, Google Docs, Wikis and Etherpad. For coding I am using Cloud 9 IDE which ties in with Github. Storage is Google Drive (although dropbox might be better, just not sure how to do that with a Chromebook. I miss Skitch and I am still not quite happy with Twitter’s page instead of Tweetdeck/Client. I also would love to use Spotify but alas there is no web version except for setting up my own play buttons.

Things I can not do of course is video editing, but I might give the YouTube editors a go.

All in all it is incredible just how much you can do online already and in a lot of cases our offline storage is more of a Linus blanket than really having things handy as we fill up our hard drives without tagging or naming files properly. I will see how far I can go with this and try out the new features the Google infrastructure promises us.

Being able to correctly estimate time is a very important skill for speakers and people who record themselves on screencasts and the like. The media loves you when you can deliver a sound-bite of a certain length. So I thought it would be a fun thing to build a very simple game to test your sense of time.

So go and play Time yourself (source on GitHub). All you need to do is to accept the challenge and you get a message telling you how many seconds you should press your mouse or a key and it will tell you how many milliseconds you were off. Of course it then also gives you a chance to boast about your skills on Twitter using the #timeyourself hash tag.

Under the hood this is a demo for an upcoming event article for Smashing magazine and it uses the timeStamp of click and key events to measure how long you pressed the key or the mouse.

Enjoy!

Summary: my laptop broke, I needed a new one, and I am thoroughly disappointed by the new Macbook Air and Apple’s helpfulness when things really need quick solutions. First-world problems, I know, but it might be interesting for some.

I am writing this on my Mozilla 15” Macbook Pro, a machine that so far I only used for heavy lifting tasks at home. I was a happy user of the hefty version of the Macbook Air when it came out:

Water and Air don’t mix

Now, on the flight over to Webvisions Barcelona, a glass of water succumbed to gravity and poured itself over the computer, leaving it as a slightly dripping black wedge to cut cheese with (anything else stopped working).

Meeting the genius (part one)

Right after landing, I went to the hotel, checked in and took a cab to the nearest Apple store to get the machine opened and hopefully saved.

After being told that the next appointment with a Genius is in 6 days time, I reminded the person of the urgency of the matter and that an expensive piece of hardware might be salvagable including my peace of mind and the keynote I have to give 2 days later.

We found a way to have a genius look at my machine, and look he did. He took it back to the lair of awesome where machines get to heal, opened it, took photos of the water damage, closed it and gave me the computer back – closed – showing me just how much water was in there. Foolishly I thought leaving the machine open and maybe next to a huge fan would be a good plan, but I am no genius (and I don’t want to sell hardware).

With the talk date looming I thought I bite and asked to buy a new Macbook Air. They didn’t have a 8 GB memory upgrade and only ones with Spanish keyboards, but hey – I can touch type and it would be cool to confuse people with it. So I forked over 1544 Euro and went back to the hotel to re-set my computer and install and download all the things I need.

Setup and first issue: WebGL and Chrome

The hotel wireless was free but also flaky so I ended up writing most of my talk in HTML in textedit and waited until the conference next day and a better connection to download all the things I needed.

The first thing I realised when I did the screencasts for my slides that WebGL and 3D transforms didn’t work on Chrome any longer. Seeing that a lot of the demos I wanted to show ironically ask you to use Chrome I had to hack my way in by spoofing the user agent string in Firefox which worked fine. Setting the “Override software rendering list” flag was proposed as a fix, but that lead to crashes of the Air – repeatedly.

This, I am sure, is a temporary issue until Apple get their act together and fix the drivers.

After setting up the machine for a day and grudgingly coming to terms with the non-upgraded RAM (I don’t care for harddisk size, I want 8GB of RAM) the morning came where I was supposed to give my talk.

Deal breaker: Macbook Air + long cable = no presentation

I set up on stage, opened the shiny new expensive laptop, connected my VGA cable and saw some blue bars – that’s it. The new Macbook Air does not connect to projectors via VGA with long cables. We verified that with mine, Matt May’s and some other speaker’s Macbook Air in two rooms, with different cables, different connectors, projectors and all the settings we can think of. It seems the great shiny new Thunderbolt connection is good for file transfer but underpowered for projection.

This was the final straw and after presenting from another computer I went back to the Apple store to return the computer. I bought an external harddrive to do a time machine backup not to lose all the stuff I set up and – receipt in hand – went to return the annoying machine.

After having to explain to 5 different geniuses that as a public speaker having a computer that does not project is a bit of a deal-breaker and that showing me that it does connect to a nearby monitor with a one foot cable is not a proof that it should work I got my money back.

Not sure what to pick – Apple might lose a customer

Now I am using my company machine for company work and I am pondering to give the chromebook a try for working in the cafe (using Cloud9IDE). Of course I will buy myself a new computer, but I have a hard time choosing what I want from Apple:

• The Air is out of the equation with these bugs (the latter being a hardware fix I don’t see them doing any time soon)
• The 13” MBP would be great for traveling, but it only goes up to 1280 resolution (how come the lesser specced Air goes up to 1440? – riddle me this)
• Retina looks sexy, but I don’t see the point of it as it gives me a false sense of what people I work for would see
• Seeing the Chrome issues I am not convinced at all about the Intel graphics chipset and I want NVIDIA
• I want to have a beefy machine that is very portable which was the Air but the latest update really broke a lot of things I need.

Maybe it is time to go back to Windows or be a man and use Ubuntu.

Update: there are now videos (screencasts) and audio of the talk available on the Mozilla blog.

I am currently at the Webvisions Event in Barcelona, Spain and tomorrow I will give a talk about “HTML5 and the future of the web”. To spice things up a bit, as I enjoyed watching The Lorax on the plane and seeing that a lot of people at the conference are parents, I thought it would be a good plan to write my whole slide deck in Dr.Seuss rhymes. This may go down immensely well, or fail horribly, but you got to take chances.

The talk (with a few extra slides) is available on Slideshare, as a PDF on Dropbox and as a styled HTML version on GitHub. Also thanks to Eric Shepherd for some rhyming help.

Enough of this – here we go:

1. There’s a big web out there, 
   it’s huge – I tell you, 
   it spans the whole world, 
   but it was boring and blue…
   
2. Then change came about, 
   in the shape of a fox, 
   it was cunning and open, 
   and it broke all the locks.
   
3. Others showed up,
   and joined the good fight, 
   a singer, an adventurer, 
   and a shiny new knight.
   
4. These all played together, 
   and spoke the same tongue, 
   which brought back old players,
   to join them in song. 
   
5. A standard was set, 
   and it changed a few things,
   a richer web for apps, 
   was the promise it brings.
   
6. Bah, standards! Who needs them?
   Some flashy ones said, 
   till a phone that was smart,
   kicked them out of its bed.
   
7. We moved past one standard, 
   as web work is richer,
   so “HTML5 and friends“,
   paints a much better .
   
8. Things that are fun, 
   should be shiny and cool,
   that’s why the new standards
   bring many a new tool.
   
9. Watching and hearing,
   are what people like to do.
   Using and is simple,
   and you can do it, too.
   
10. Both of them are web-native,
    which is a reason to clap.
    They can interact with other content,
    and Mozilla Popcorn makes that a snap.
11. If beats and frequencies are
    what you need to play,
    check the Web Audio API -
    it gives you just that – even today.
    
12. To play nice with batteries,
    use requestAnimationFrame(),
    don’t let it stop you
    that it has such a long name.
    
13. 3D graphics are thrilling,
    as gamers will tell,
    we now have that on the web
    and it is called WebGL.
    
14. Water goes everywhere you pour it,
    just ask Chris about his Macbook Air :(
    MediaQueries allow you be as fluid
    and respond instead of despair.
    
15. Natural movements are smooth,
    just open your eyes.
    With CSS animation, transforms and transition,
    you can mimic this – nice!
    
16. “The web means you need to be online”,
    I hear smartypants gloat,
    well, we have offline storage,
    so there – take your coat.
    
17. Got a cam and some friends,
    and do you want to chat?
    WebRTC is what you need,
    even to show off your cat.
    
18. Rhymes sometimes don’t come easy,
    as you just became aware.
    So let’s just move ahead quickly,
    this was just too much to bear.
    
19. An artist needs a ,
    and HTML5 gave us that.
    Read, write and convert pixels,
    All in the client, it’s mad!
    
20. “We don’t have rich elements!”
    many people complain,
    Use Web Components with X-Tag
    and create them – easy to maintain.
    
21. Passwords are tough, 
    it is easy to see, 
    so allow login with emails,
    using BrowserID.
    
22. The web is a mess,
    with third party buttons abound.
    Web Intents make them pointless,
    let’s not have them around.
    
23. By design HTML5 is forgiving,
    its parser is great.
    It didn’t want to break the web,
    so let’s not break it in its stead.
    
24. Course you can write weird things,
    and they will work – there’s no doubt.
    But will they be readable by others?
    This is what it’s about.
    
25. You don’t create for yourself,
    or your friends who are the same.
    You develop for the next guy,
    so make sure you’re not to blame.
    
26. You don’t jump in a river,
    if you don’t know its depth.
    On the web using Modernizr,
    should be your first step.
    
27. Give new stuff to new players,
    and use it to enhance.
    Don’t support when it’s not needed
    IE6 walks – it can’t dance!
    
28. With a vendor prefix browsers tell you
    “this is not ready”.
    So by all means, give them a go,
    but don’t expect to go steady. 
    
29. And those prefixes vanish,
    you mustn’t forget!
    End with a prefixless version,
    It’s your very best bet.
    
30. So we ask you to help us,
    build a web that will last.
    Be future friendly and look forward,
    and stop building for the past.
    
31. The web is on phones,
    tablets, computers, TVs.
    We have to move it forward.
    or else our existence will cease.
    
32. Hardware that is locked up,
    is not what we are about,
    so check out Firefox OS,
    if you like the web – you will like it – no doubt.
    
33. Last but not least,
    if you find something’s wrong
    please file a bug and tell us,
    this is how things get done.
    
34. So there you have a lot to play with,
    check out and share.
    We really want you to do that,
    come on, show us you care.
35. Unless someone like you
    cares a whole awful lot,
    nothing is going to get better.
    It’s not.
    
36. So well done for reading and listening,
    and going great lengths,
    that’s all we got time for today,
    so good-bye and thanks!