Episode 75 of The SitePoint Podcast is now available! This week your hosts are Patrick O’Keefe (@iFroggy), Stephan Segraves (@ssegraves), Brad Williams (@williamsba), and Kevin Yank (@sentience).
Listen in your Browser
Play this episode directly in your browser — just click the orange “play” button below:
Download this Episode
You can also download this episode as a standalone MP3 file. Here’s the link:
- SitePoint Podcast #75: Awesome Overkill (MP3, 63.4MB, 1:06:01)
Subscribe to the Podcast
The SitePoint Podcast is on iTunes! Add the SitePoint Podcast to your iTunes player. Or, if you don’t use iTunes, you can subscribe to the feed directly.
Episode Summary
Here are the topics covered in this episode:
- Google Wave Post-mortem
- Facebook to Remove Boxes This Week
- The Official Tweet Button Launched
- Adobe Fonts Come to the Web with Typekit
- IE9 Beta Coming September 15th, Despite PR Fail
- HTML5 Boilerplate Makes Web Development Easy, But Look Hard
- jQuery Mobile Project Shines Light on Smartphone Browser Landscape
Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/75.
Host Spotlights
- Brad: Internet Explorer’s 15th Birthday
- Kevin: HTML Sanitisation: The Devil’s In The Details (And The Vulnerabilities)
- Patrick: Bleep Bloop: Drone Robocopter
- Stephan: Double Rainbow 404
Show Transcript
Kevin: August 20th, 2010. Facebook boxes, Twitter buttons, Adobe fonts, and jQuery charts. I’m Kevin Yank and this is the SitePoint Podcast #75: Awesome Overkill.
And it is a packed episode of the SitePoint Podcast this week. We have so much news queued up I think I tempted fate by talking about our non-technical show a couple of weeks back, and tons of stuff to talk about, a lot of it technical, Brad why don’t you lead us off.
Brad: Sure, to lead things off we actually have another entry in the good old dead pool, and that is Google has announced that they are ending development of Google Wave, so everybody wave goodbye to Wave.
Kevin: Oh, goodbye Wave.
Brad: Yeah, Wave was actually debuted in June 2009 so it’s really just over a year old, and I believe it came out of beta in May of this year, so it was only officially a product for a few months prior to Google pulling the plug.
Kevin: There is a SitePoint connection to Google Wave as well. SitePoint author Cameron Adams, who I co-wrote Simply JavaScript with, and he also contributed to a couple of our other books, he was one of if not the front-end designer for Google Wave. And I don’t know if you guys used Wave much, but during its early days every week or so they would take the app down for maintenance, and the maintenance web page you saw said something like “Chill out, Wave will be back in a minute,” and it was a guy’s feet on a beach and the clouds floated by. And Cameron Adams feet, that’s what you were looking at when Google Wave was down. (Laughter)
Patrick: Trivia! Very nice.
Kevin: Trivia, yep.
Patrick: You know when I saw this announcement I was a little bit surprised by I guess the negativity on Twitter about it, at least with the people I follow, about Wave, “Wave, oh well, good riddance, I didn’t use Wave anyway, what was it good for,” etcetera. I was a little surprised by that because, and I’ll confess that I, myself, didn’t really get into Wave right away, but I did find its usefulness or its power, thanks to my friend Wayne Sutton @waynesutton, and he swears by it, and he’s sorry to see it go because he used it for a lot of collaboration. And I was involved in a project with him and still am, and we were using it to talk and to share information and data and spreadsheets and whatnot, and it was very useful, so I could definitely see its usefulness, and in a way I am sorry to see it go.
Stephan: Yeah, we used it a lot at one of my projects, actually exclusively; we write a bunch of stuff, and there’s like six or seven of us that contribute and edit and things in Wave, and it’s been really nice and a pretty failsafe system until now.
Brad: One thing I wasn’t a huge fan of Wave from the start was the realtime aspect of it, and I guess my feeling is if I’m writing a message or I’m writing an email I like to make that email or that message as perfect as I can get it before I send it, so I don’t want who I’m sending it to to actually look at the message I’m getting ready to send them as I’m deleting words and spellchecking and things like that. I want to make sure its right before I send it in the first place. I mean I could certainly see instances where this makes sense just like it would maybe in a chat room if you’re talking with a team of people, but I never really liked that aspect of it so I never really got into it.
Kevin: I think there was at least in the original demo I seem to remember there was a feature where you could turn off the live update, if you wanted to work on some text without it being transmitted live, and then when you were happy with it you could switch the live update back on. That’s one of those features that may have fallen by the wayside during the design process, I kind of feel like they went back and forth on the level of complexity they wanted in the user interface. But yeah, certainly the odd mix between a realtime communication medium and a document-authoring environment I guess it’s what made people so excited about it to begin with.
Brad: Was it ahead of its time? Should this launch five years from now, would it do well, is it just too ahead of its time?
Kevin: I feel like Google needs to — they often are very good at the undersell, but lately they’ve been overselling things a little bit. Like when you think back to Gmail and Wave’s launch was very much a replay of the Gmail strategy that they launched this thing in beta where you needed to get an invitation from other people who were already invited, and so this closed beta environment that they hoped to turn the service’s users into their marketing force for it. But what you saw with Gmail was that it was kind of this thing that was barely even announced, and the first time I heard about Gmail was through people who were using it and saying check this out, I’ll even send you an invitation. Google, they took the wraps off of Google Wave at their big Google IO Conference, and with this hour-long video it was amazingly impressive, and then the next thing they told you was, no, you can’t use it yet. So I don’t know if that’s what sort of planted the seeds of the negativity that Patrick was talking about that we’re now seeing around this cancellation that, “Oh, yeah, I knew it was bound to fail all the time!”
Patrick: Well, I think it was a niche tool, and in some ways I would say how different is it from Google Docs, right; because Google Docs has a live aspect to it too if you’re sharing documents. I know because I worked through some documents there and there’s always, oh, xyz is editing this as well, okay well obviously if you want to control the document or it’s a message to a particular person then you might not want to do that there, but I could maybe see them rolling some of Wave’s features into Docs maybe optionally, right, maybe not necessarily a default feature but something people could use. And the blog post on the Google blog notes that central parts of the code as well as some protocols behind Wave’s innovations, that’s their words, like the drag and drop and the character by character live typing are already out there in open source, so customers and partners can play with those and continue to innovate upon them. So I don’t know if we’ll maybe see Wave in some other form from someone else, but they do say that they’ll provide some tools to get our data out of Wave as well, of course.
Stephan: If it reincarnates into Docs I’ll be really happy. Like if they do some of the features in Docs I’ll be really happy, the way the document management is and stuff like that; I’ll be happy if they do that.
Brad: You know who I feel sorry for the most is probably the developers that have actually worked with the Google Wave API and spent hundreds or thousands of hours making these cool apps that integrate with Wave and now they’re essentially useless. And I think if this trend continues, because we saw Google Wave, we saw Pownce go down, if this trend continues developers are going to be a lot more hesitant to dive right into a new API until they know that service is established and they’re not just wasting their time, which in turn may not help the new service or app grow, so I mean if this trend continues it could certainly be bad for developers in the API world.
Kevin: This topic, it’s kind of old news as we discuss it because the cancellation of Wave was announced just after our last news episode. And I think this is a milestone for us, guys, podcast listener Chris Trynkiewicz from Poland wrote in and he actually wrote in with his opinion on something that he predicted we were going to be talking about. I like this; this is initiative from our listeners. Chris writes: “My guess is that the marketing epic failed as Wave was released to public on the 18th of May 2010, that’s only two and a half months ago. Given the time that Gmail had to get its share, one can figure that this decision came too early; also there wasn’t even a solid way to connect Wave and Gmail or any other email account for that matter. What the heck were they thinking was going to happen in two months?” So, let’s talk about that for a bit. That two month period, was that Google Wave’s proving time?
Stephan: I hope not. I hope they thought about it a little bit more than that. I mean just recently they’re releasing features like you can invite anybody without a Google Mail address to a Wave document just like, I don’t even know how long ago it was, it was like six weeks ago maybe, and now they’re killing it off. Well, I hope no one sent out their stuff to people who aren’t going to be able to access it when it’s done. So I don’t know, it seems like it’s a really short time period for them to really prove the technology, maybe it just really was one of those Labs things where they said from the beginning this probably won’t survive, who knows.
Kevin: What struck me about the original pitch of Wave is it was announced at their developer conference, and really they saw Wave as the pipes underneath, and the user interface that they had built was really just sort of a proof of concept for them. They wanted developers to get on board and start building on top of this platform that they had assembled, and I feel like that public release two and a half months ago may have been sort of their last ditch attempt to gain the popularity that they felt this thing deserved, that after that closed beta period they kind of went, well, that didn’t work; maybe if we release it to the public that’s going to work instead, and so it was their last try at getting it the popularity they wanted. I don’t know, it’s hard to say, I for one have used Wave from time to time, I think I’ve written one document of significant size in the thing, and certainly I was inspired along with everyone else when watching their original demo, but it never really quite took off, it never really fulfilled the vision they wanted. And maybe it’s because their vision was so big and world changing, I mean they were taking on email and instant messaging. It feels like that’s the sort of revolution that would take five years even on the Web today, and maybe they were just pushing it too fast or trying to do too much at once. I’m sad to see it go and part of me is still hoping that because the Wave technology is open sourced maybe the mysterious benefactor with a longer timeline in mind will come along, rescue the technology, and we may yet see Wave rise from the ashes. Call it wishful thinking but I think Google had some good ideas.
Facebook, I don’t know if they have good ideas, but they are removing boxes from their application API this week. I don’t know if any of our listeners have written for the Facebook API, but for a while there Facebook was the app platform, it feels like, I don’t know, that Apple’s app store kind of stole its thunder a couple of years ago, but right up until that point Facebook was where web application developers were thinking of moving their skills to next. Rather than building a web app that sits on its own on your own website that you hope for people to discover you could build apps within the Facebook ecosystem and every Facebook user that installed that app would be displaying a box for your app on their profile page, and just by visiting your friends’ profile pages you could discover the apps they were using and hopefully install them yourself, and this was a way of promoting apps within this social environment. Well, that’s all going to change this week because boxes are going away. And depending on who you ask this is either a huge deal or no one actually cares about boxes anymore. Guys, when is the last time you actually remember seeing a Facebook box?
Brad: I have some.
Patrick: I would say recently.
Kevin: Recently, yeah?
Patrick: Recently. I can’t place a specific date and time necessarily, but I guess recently when I looked at someone’s profile. I think another question is when is the last time I actually installed a box, now that was a long time ago; I don’t even remember the last time I put a box on my profile.
Kevin: People are arguing that profile pages are starting to be a bit irrelevant on Facebook at the moment, that people live on Facebook through their newsfeeds and through the apps that they use full screen. And the idea that going to someone’s profile page and checking out their apps, their boxes, what it is they’re trying to say through their profile page, is kind of a thing of the past on Facebook.
Patrick: I think that’s part of Facebook, though, is visiting and seeing what people did to their profile. I don’t know, I know there’s this sort of aversion to the MySpace that we think of as the music playing and glitter graphics and all of the sort of eye-catching things that area annoying to a lot of people, but Facebook has done a good job I would say of mitigating that through their different style requirements I guess I would call them where the boxes they look like they fit into the site, they match the same color scheme, you know it all kind of works together and looks fine. Now I just wonder, you know, if Facebook profiles are just a few things, let’s say, you can just have a box of your friends, you can just have your relationship status and your birthday, etcetera, you can just have your status updates. Then every profile will probably look the same unless they themselves step up with some sort of deeper customization options, because that was your option to customize your profile, to add boxes and to move things around. Now if that’s changing it’s going to be tabs, you know that’s not really much customization.
Kevin: I feel like Facebook has always tried to avoid customization, it’s something they’ve done grudgingly because they want to differentiate themselves from the ugly days of MySpace when everyone customized their page so much it was just a free for all and there was no MySpace look, the MySpace look was utter chaos.
Brad: I think that was probably a good idea. MySpace was fun for the short amount of time that everybody was on it, but then you’re right every page you went to blaring music came on and everything was flashing and you went into a seizure, I mean it was ridiculous (laughter).
Patrick: Did this actually happen or is this figurative?
Brad: I speak from experience. No, it’s figurative of course. But then when everyone started looking at Facebook it was like wow this looks so clean compared to what we’re used to seeing over at MySpace, so I think the fact that they didn’t allow that is the reason Facebook is as big as it is today.
Stephan: You mean you don’t like twinkling star backgrounds? I mean come on.
Brad: I can only handle so many dancing babies.
Patrick: If you buy into the fact that your profile should be a reflection of who you are then sparkling backgrounds are maybe who you are and who you want to be seen as. Whereas if you’re like me and you look at my MySpace profile, because I never really got into it, it’s just the very default things and one song and a little bit of information, and that’s about it. But Facebook, I don’t know, uniform individuality, is that a fancy phrase I just made up or is it an actual thing? Because that’s what it feels like.
Kevin: I feel for the developers here who have crafted experiences and designed their apps around a certain interaction model, that their apps could expose themselves to the user’s social network through this small box on their profile page, and now the standard user interface for an app to advertise itself is an entire tab. And what I’m seeing at the moment is that a lot of my Facebook apps that I had installed I can now put them on tabs, but they are still designed to be about the size of a small box, and so now you have this whole tab on your profile and when you click it you just get this teeny, tiny bit of content at the top of the page. This is like a fundamental change in the user experience, the user interface standards for the Facebook API, and what’s this doing to their app ecosystem? Is this how long we can expect a platform to last and remain stable on the Web? It’s two years, and if I was now considering building a Facebook app would I have to do that understanding that Facebook could be completely different in two years time and it’s a moving target that I’m targeting?
Brad: Yeah, you said it right Kevin, this is going to force Facebook application developers to really rethink how their apps not only work but how they promote themselves, because I mean one of the primary focuses of any app is to get people to install it; you want as many people to install it as you can and send it around virally and share with their friends. Now that it’s kind of hidden on a tab and less noticeable and a lot less people are going to see it these developers are going to come up with more creative ways to get that content into your newsfeed to promote their app because there’s really no other way to do it. So I would expect to see a lot more kind of spammy looking kind of posts of the newsfeed and things like that.
Patrick: Well, many bloggers out there use the TweetMeme Twitter re-tweet button on their blogs, myself included. Those days are numbered, let’s say, because Twitter has launched their own Tweet button and you can embed it on your blog today.
Kevin: They’ve gobbled up TweetMeme.
Patrick: Yep. they’ve licensed the technology from TweetMeme basically, and TweetMeme, while it’s still online obviously and even growing through August, they’re now going to switch their focus to other endeavors and let Twitter, I guess understandably given the fact that competitively speaking Twitter will crush them based on their traffic alone and the link on their own website, so TweetMeme has just gracefully ceded that entire market to them. You can embed, like I said, the Twitter button from twitter.com/tweetbutton and it looks different from the TweetMeme button, pretty attractive, you can specify things like accounts that can be suggested to the user to follow after they’ve Tweeted the button. So yeah, what do you think?
Kevin: Well, this is the same thing that we saw happen with Bit.ly and the URL shorteners. There was this ecosystem of URL shorteners out there, there were ten of them that people used and suddenly overnight Twitter gave their blessing to Bit.ly, and just like that Bit.ly was the only game in town. And now we’re seeing the same thing with TweetMeme, I mean there are alternatives out there and one that I’ve recommended a lot is backtype.com; if you go to backtweets.com they have this BackTweets Pro service that you can sign up to and pay fifty bucks a month to monitor people talking about your content on Twitter, but they also had this free widget that was pretty much the same thing, this button that showed you how many times the URL of the current page had been Tweeted about and gave you a retweet button. And suddenly all of these competitors I think are going to slowly disappear because TweetMeme is where it’s at. On the surface this looks bad for TweetMeme even, but it looks like they’ve done a deal with Twitter where Twitter gets the tweet button technology, and TweetMeme is getting inside access to stuff that’s going to let them improve their service, it looks like they’re going to be partnering with Twitter to provide services based around the Twitter Firehose, this high performance API for accessing everything that is posted on Twitter in real time. So it should be exciting, I’m interested in seeing what the next chapter for TweetMeme looks like here now that they’ve handed over the Tweet button to Twitter, what is their business going to look like exactly?
Brad: I really like this, I mean I feel like the sharing or the Tweet button it feels like a service that should go hand in hand with Twitter rather than a third-party service, it feels like something they should offer; I’ve always thought that, now that they are doing it it’s great, I mean they’ve made it extremely easy to integrate, you drop like a line of JavaScript, you don’t even have to pass the URL, it does all that dynamically for you and it works, and it’s super easy, so you don’t have to be a hardcore developer to figure out how to integrate this. And they’ve also hooked it into their API, so if you are a hardcore developer you can integrate this however you want so you don’t have to use the provided code that they give you. So I’ve actually hooked this up on a few client sites, played around with it a little bit, hooked it up on my site, and I think it’s great, I really like how they did it.
Patrick: Yeah, I mean who wouldn’t want to embed something hosted by Twitter, you know, what’s a fail whale? They don’t seem to have any problems with that so why wouldn’t I want to embed something from them.
Kevin: (laughs) Ah, Patrick, cynical as always. (laughter)
Stephan: Smart aleck.
Patrick: No, aw cynical? I do like this; it’s very nice, very slick. The one thing that jumped out to me, though, that I liked about some of the services I’m already using is that I have to use t.co, the Twitter URL shortener, I can’t use my bit.ly API, I can’t track that traffic anymore. I don’t like that.
Kevin: I think it should still, the number of tweets that it counts includes URLs that have been shortened with other services, so that’s not an issue, but yeah, if you like your Bit.ly stats you’re not going to get them through Tweets made through this button.
Patrick: Yeah, but there are some improvements like the following, you know, you can enter a couple of accounts and after they Tweet they’ll see “Here are some accounts we suggest that you follow,” so that’s a benefit.
Kevin: Yeah. That’s really interesting to me because I think suddenly now blogging platforms like WordPress and other content management systems are going to be scrambling to include a field for all of their authors to put in their Twitter account because when someone clicks the Tweet button on a page you want to be able to suggest to them not only that they follow, say, the Twitter account for the website as a whole, but also maybe the Twitter account for the author of the particular piece of content that you clicked the Tweet button on.
Stephan: Plugin idea Brad!
Kevin: Yeah, exactly, if it’s not already done, yeah, you want to suddenly be including the Twitter account of all of your blog authors in there so that can be integrated in there through the Tweet button. The race is on.
Adobe fonts are coming to the Web with Typekit, and this is another service just like TweetMeme that I feel like they’ve suddenly got a leg up on the competition through this unexpected announcement. Typekit hasn’t been the only player in the online fonts game, there have been a few competitors out there, but Typekit always seemed like the leader, and they have cemented that lead by partnering with Adobe. Suddenly all of these fonts that you’re used to getting on your system when you install Photoshop or Illustrator or any of the Creative Suite apps, all of these fonts are now coming to the Web, and this really closes a gap for me, this is something that I asked Jeffrey Veen, one of the co-founders of Typekit when they were first announcing their service. If you buy access to a font through Typekit you can certainly use it in your CSS on your website, but you can’t use it in Photoshop to do mockups for that website. And at least originally using it just on your development server to test your layout before it went live was something that wasn’t easily done either. And so Typekit while it was a revolutionary service it often meant that you had to find other ways to get the same fonts, access to them in development. But now by bringing the Adobe font library to the Web this is the set of fonts to some extent that many designers have been waiting for because these are the fonts that they’re used to, the fonts like Myriad, this is the default font in Adobe Illustrator, Myriad, is a beautiful font, and people will often just sort of start mocking stuff up with that font and then to be told that the new age of fonts on the Web is here but you can’t use any of those fonts that you’ve been using in your creative apps it was a problem, and that problem is now being solved. Adobe is going above and beyond here, guys, they’re not just converting over these fonts dumbly, they are going through them one by one, character by character, and hinting them for screen use. This has been a common criticism of web fonts in the early days was that the fonts that people were using were designed for print and they didn’t look so great on the Web, or on the screen, especially at smaller font sizes. And it looks Adobe is going to the trouble of updating their fonts one by one so that they also look good on the screen. So fonts like Adobe Garamond, Myriad, as I mentioned, Dominion, Cooper Black, all of these fonts are now available on Typekit with more to come. Guys, have you been holding off on embracing these web fonts?
Patrick: (chuckle) No. But I will say this is a cool service, and I just pooled through the pricing real quick and it looks like you can get access to all of the fonts released here for $49.99 a year as part of the Portfolio package. The personal one, $24.99, allows access to some but not all, so the $49.99 one per year is the one that you’d want if you want access to all of them. And this is an interesting service, I haven’t really looked too much at it, but let’s say you’re signed up with Portfolio, right, you have that package and you develop a site for a client, right, you have the license yourself, it’s yours. So you give that site to your client are they good or do they have to buy another license?
Kevin: The Typekit service, the license applies per site, so you buy the license for that particular client’s site and then the next site you have to develop you buy another license for that.
Patrick: Okay, the Portfolio package it says unlimited websites, so I guess that would give you free range.
Kevin: Ah, yeah, then you get this bundle that, yes, you apply your Portfolio package subscription to that site and, yeah, as long as you continue paying the bills your client continues getting the fonts.
Patrick: Cool. That’s interesting. I guess if you’re as detailed as I am you’d probably want your own license, not to have your designer control it, but that’s very cool.
Kevin: Yeah, probably, but it becomes another bill you pay just like your web hosting, I would say, if you want to be independent of your designer.
Patrick: The font hosting bill (laughs).
Kevin: But, hey, you can even try this stuff out for free. The Adobe Garamond font is included in their free trial plan, so if you are a particular fan of that, and that is a very nice font, it’s a serifed font, it’s a clean body font, so if you just want to give the main text paragraphs on your site a slightly different look from the everyday you can sign up for a free Typekit account and take advantage of Adobe Garamond. It’s a really nice service.
Patrick: So the Techcrunch office has received an interesting package care of Microsoft, some markers, some crayons, some clay, sketch book, basically a complete art package. What was missing, though, was the website that that package promoted which was beautyoftheweb.com. When a Tech Crunch reporter, Jason Kincaid, went to visit the site it was down with a 401 error. Eventually, though, he discovered that this package was meant to promote the September 15th debut of IE9 beta.
Kevin: You know, Techcrunch, they have their style, and I was reading this story and this is the kind of story that makes me feel bad for Microsoft. Just this starting out by saying it was a sweaty guy on a bicycle that came and delivered this package, I mean is that really necessary? (Laughter)
Brad: Yeah, sets the stage, set the mood here. (Laughter)
Kevin: Let’s give Microsoft some credit here. This site, beautyoftheweb.com, which does now work even though it wasn’t working at the time it should have been for Techcrunch, it is a demo really of the <canvas> tag and what it can do; you go to beautyoftheweb.com and it invites you to find a secret word by typing letters, and those letters are arrayed on your screen, and I’ll give you a spoiler: the password you’re looking for is “native,” and as you type out the word native the puzzle pieces fly in and slowly make up this invitation in the middle of the screen. And credit to Microsoft this page is written in HTML5 using the <canvas> tag, the JavaScript that runs it has the fallback code for browsers that don’t support <canvas> tag like IE8, for example, so it works cross-browser, but it even includes HTML5 tags like <header> and <section>, things like that, so they’ve got the necessary the JavaScript code in there so that those HTML5 elements are styleable in Internet Explorer 8. They’ve gone out of their way to eat their own dog food here, whereas when I first landed on this page and saw the animated password form come up I thought, oh, here we go, I bet this is Silverlight, but it’s not, it’s <canvas>, it’s HTML5. They haven’t gone quite all the way with it, I do have some criticism, which is that this page is basically a blank page if you disable JavaScript on your browser, and there is no content really here for screen reader users, so it’s pretty inaccessible; if you land on this page on a screen reader you’ll hear it read out “unlocking the native web, type the letters below to unlock your invitation,” and that’s it. And there is no hint of what letters you should be typing or what it is you’re seeing in response to typing those letters.
So, the exciting news I suppose that Microsoft would want us to be talking about here is that Internet Explorer 9 beta is coming out on September 15th. So September 15th is that magical date when regular ordinary users may start hitting your websites using an IE9 browser, so the call should go out for you to start testing on the current developer release. But, you know there’s a reason Techcrunch can write snarky stories like this, and I feel like the reason is that Microsoft doesn’t know how to build AAA quality websites. They’ve clearly gone out of their way with this demo to try and build a top quality HTML5 page that will be impervious to criticism and yet they’ve still fallen short. I wonder, is Microsoft’s biggest problem when it comes to Internet Explorer that they don’t have any truly talented, passionate web developers in-house that are going to push this browser to put its best foot forward.
Brad: Well, you don’t want to know how long it took me to get to the word “Native,” there (laughter). It took way longer than it should have.
Kevin: Yeah, me too, I stared at those letters for a long time before I came up with native, and I think I clicked the “skip intro” button, and then it shows you the answer and then I went back and typed it myself just to see what would happen.
Patrick: You know I agree with you about Techcrunch kind of, though, because when I saw this I thought well you know what, just donate art supplies to a school and call it a day. I don’t know, there’s an effort here, and maybe they didn’t take care of every last result, and I don’t know why that is, but let’s not just get on the bash-fest, I guess, of Internet Explorer, that’s far too easy.
Kevin: By all reports IE9 is shaping up to be a really good browser. The tech demos have been solid, not only have they added huge amounts of support for CSS3, HTML5, all of the stuff that developers are craving, but by all reports the browser is flying compared to previous versions. Internet Explorer 9 is going to be a lean, mean thing compared to the sluggish, bloated previous versions of Internet Explorer. We have yet to see what the user interface holds for end users, the focus has really been on the Web platform work, so I’m wondering how much of this September 15th release will unveil a new look and feel or a new user interface or whether they’re going to be sticking with what they set up in IE8. But it’s feeling like browsers, especially led by Google Chrome, have really been pushing forward a minimalist interpretation of what the user interface should be, and if Internet Explorer doesn’t get on that bandwagon they’re going to look more and more obsolete even though their rendering engine may be right up there with the others. Brad I know you’re a Chrome fan, could you ever see yourself going back to the toolbars of Internet Explorer?
Brad: Um, it would take a lot. I mean I feel like any developer or designer, pretty much anybody that works on building websites in some facet, has a little bit of a hatred towards IE mainly just because of IE6, I mean 7 has its issues sure, 8’s obviously a lot better; 9, like you said, is shaping up to be great, but you know just when you hear the word Internet Explorer the first thing you think is, oh God, it’s just — and I don’t know what it’s going to take to get past that for me personally. If they come out with some groundbreaking feature that nothing else has I’m always open, I’ll give it a shot; I never thought I’d switch off of Firefox and I did, so you know, I try to keep an open mind when new versions come out.
Patrick: I know what it’ll take: Hello, this is Jim Smith over at Microsoft, is this Brad of Webdev Studios? We’re looking to have some development work done, can we pay you money? (Laughter)
Kevin: Internet Explorer 9 with a $20.00 bonus payment to everyone who installs it. (Laughter)
Stephan: We’ll pay you to use the browser.
Patrick: Cash back rewards. Hey, don’t joke about that, Google with the AdSense platform paid those referrals as far as Firefox; they were all hooked in there, so maybe Microsoft needs to do something like that to incentivize publishers to promote IE again. I mean would that be a funny thing to see where a publisher was getting paid for downloads of Internet Explorer? I don’t know.
Kevin: Yeah, they need an affiliate program.
Patrick: Yeah, exactly, take a page from the, I guess the Firefox book of how they caught up to Microsoft and go back to that kind of grassroots approach even if they do currently have the leadership role overall it’s declining, and maybe they need to take that approach of the underdog.
Kevin: SitePoint marketing manager Shayne Tilly has an infamous blog post on SitePoint from I guess it’s nearly a year ago now, and I think it was an update to a previous blog post where he was calling for the “inevitable death of Internet Explorer,” and he shows basically a graph of Internet Explorer market share declining as all of the others rise, and when you do that the Internet Explorer market share line is a surprisingly straight line downwards, and he’s just sort of extrapolated that line out and said, yeah, the year Internet Explorer dies is 2013, I think he said, at that rate. And obviously that got a few upset comments, but he’s sticking by it, and he was just telling me yesterday that he’s been updating the numbers for another year, and the line continues downward unabated. It will be interesting to see whether IE9 can make a difference.
Patrick: What I want to know is what Shayne’s thinking, because haven’t we — I know I have heard before, I don’t know of the scientific numbers, but IE uses click more ads and maybe even spend more money than other users, so as a marketing guy here let’s think about this a little bit. I think we want those IE users and we want them to grow, no, I’m just kidding, but yeah, that’s what I have heard before so from a marketing perspective if you want to take that as being the more casual user, you know, that’s a reasonable claim to make I would say, and so they click more ads, but it’s just the way it is right now.
Kevin: That sounds like a good marketing angle for the Microsoft affiliate program, “Marketers get more valuable visits to your site by getting your users to install Internet Explorer. And we’ll pay you twenty bucks.”
Patrick: This web page best viewed in IE9.
Kevin: If Microsoft would like some tips to build their next <canvas> HTML5 driven invitation page for their next browser beta they could do worse than visiting html5boilerplate.com. This is a site that I’ve seen tossed around for the past week or so, and it purports to give you a ZIP file that you can download and it contains everything you need as a starting point to build a modern, HTML5, standards compliant website. And depending on what type of developer you are this is either going to dazzle you or horrify you. You know, I’d like to consider myself across a lot of the things that belong in a brand new website these days, obviously I went to Microsoft’s invitation page and started picking holes in it, oh they didn’t do this, they didn’t do that, why didn’t they include this bit of code. And html5boilerplate.com seems like the ultimate expression of that, they have combined all of these nitpicks, these things that if you took your web development seriously you would include this line of code on every site you build, and they’ve put all of those lines of code together into this set of files that you can use as a starting point. And you can just scroll down the page and they have beautifully syntaxed highlighted versions of all of these code files complete with comments explaining what everything does, and man it amounts to a lot of code. I think you can hit page down 20 times before you get to the bottom of this code on a typical screen size.
And this is just the code that you need to have before you have before you start writing your website, so all this will give you is an extremely standards compliant well-performing blank website, and your work starts from here.
Stephan: The .htaccess page is probably the funniest one. It’s 183 lines, and a lot of it’s white space.
Kevin: (Laughs) Yeah, this is the, for your Apache server it tells Apache the special ways to treat this website when serving it. And, yeah, it’s 183 lines including comments of stuff. And this is code that does things like serve HTML5 video properly, it also serves cache headers so that any static file, so images, fonts, CSS, JavaScript, these types of files are all served to the browser with the message ‘you can cache this for a month’, ‘I don’t plan to change this for a month’, and what this does is increases the likelihood that these files are cached by your browser and increases the performance of your site. As a developer if you do want to change one of those files and have your users see those changes you need to refer to them with URLs with a query string that says last updated on this date, or something like that, which forces the browser to re-download the files that it would otherwise continue to cache for a month. But yeah, that’s just one example of the dozens of little tricks that are scattered throughout all of these files. And in many cases they are barely documented, like let me just have a look here, here’s one line of code in their CSS style sheet that says it normalizes monospace sizing, and then it’s got a link to Wikipedia regarding some sort of teletype style fix for Google Chrome. (Laughs) This is the ultimate in pedantry I think; yes, every single line of this does something useful. Do you need to understand all of this to be a web designer today? I remember the days when I sat my dad down and he wanted to build a simple web page that had a few family photos on it, I said well you start with an <html> tag and then you have a head tag, and when you’re done with the head tag you have a body tag, and here’s how you put images on a page. And in the space of half an hour he felt like he could build web pages for the real world. This mass of code is something that you’ve got to be really dedicated to the science of web development in order to even get through reading the thing, let alone using it on all your projects. Is this making web design too difficult is what I’m saying?
Stephan: I don’t know if it’s making it difficult. I think it’s making it a little intimidating.
Kevin: Yeah. Patrick is this the nail in the coffin that you read this and you decide that’s it, I am never writing code ever again?
Patrick: I love how I’m the go-to. I know my place on this show for that sort of stuff. (Laughter) You know I have to say with my limited knowledge I kind of already knew this was the case which is why I just don’t even try to get into this stuff. I almost think that was the purpose here. I almost think that the purpose here was to create this to say, you know what, here is everything, here’s every last thing that we can throw at this, okay, this is every last detail, every single thing we can do. It is a little pedantic maybe for some, but that’s the goal I think is for it to be that detailed, that specific, that pedantic, if you choose to describe it in that way, to say here it is, it’s all in front of you, it’s all on the table. And I don’t really see necessarily how that’s a bad thing, I guess, I think it might serve to educate some people; it might serve as a good starting point, a good template for people to use. You don’t have to use it, it’s better than Geocities homepage builder, right, so just look at this as sort of homepage builder for that HTML5 loving web designer.
Kevin: Stephan you describe yourself as a recovering programmer from time to time (laughs), is this your nemesis? Is this the kind of code that makes you never want to be a programmer again?
Stephan: Yeah, I mean I wouldn’t say never again, but this is pretty intimidating for someone who hasn’t touched some of this stuff. I mean I can’t imagine coming in here and looking at, one, the .htaccess file without understanding anything about Apache is really intimidating. And the CSS is blank for the most part, but it’s a lot of stuff, I mean there’s a lot of stuff in the CSS that I mean I’ll be honest, I don’t understand all of it, but I don’t do CSS all the time, so to me it’s a little overwhelming and I feel like I’d have to go in, and maybe Patrick’s right that I would have to go and do some serious reading to really get into the CSS in this thing which is probably a good thing, I need to get back into it.
Brad: Yeah, this is intimidating for someone like me that does this on a daily basis; I mean there’s a lot of stuff here. But, having said that I think it’s a great reference, I mean there’s things in here we don’t use on websites, but it’s interesting to see if this is something that should be in there, and maybe we’ll do some research and see if it makes sense. I mean going as detailed as having an apple-touch-icon link in your header, stuff like that is very kind of obscure, but I think it’s kind of neat, I’m anxious to kind of take this download the stripped out version which gets rid of all those comments and slap it on a WordPress team and see if it is truly a great starting point or if it’s just more than what’s needed I should say. So I don’t know; you know I eat code for breakfast so this is kind of cool to me.
Kevin: Some of the cross domain stuff in there is going a bit far for me, and it’s some of the most intimidating stuff when there’s a comment in — there’s this crossdomain.xml file, which is a file that a typical web developer if you haven’t done any hardcore JavaScript you will have never even seen a file like this before and you won’t even know what it has to do with. And there’s a comment in that file that says “If you host a crossdomain.xml file with allow access from domain = * and don’t understand all of the points described here, you probably have a nasty security vulnerability.”
Stephan: But then they have the line in the code.
Kevin: Yeah, and then they have the line, so you’re whoa, whoa, whoa, whoa, wait a minute, does that mean that out of the box this code is a nasty security vulnerability? This is the stuff that’s going to scare people away and go oh, oh, oh okay, um; I don’t think I can do this. It’s a strange duality, you land at the site and it says it’s going to give you “A rock solid default for HTML5 awesome!” and “why is it awesome” and “why is it awesomer,” and “future awesome coming soon.” It sets you out to get all excited about this and then kind of beats you over the head with it. I would have liked to have seen— You know every one of these files, let alone every one of these files, every line in these files, it feels like you could have a whole article written about it explaining it. And if you went to the trouble of reading every one of those articles you would have a really solid foundation in web development. Maybe that’s a job for someone to do is to document all this stuff in detail.
Patrick: SitePoint! Get a few authors on that, stat.
Kevin: Yeah, just the HTML5 boilerplate book I could see it, I could see it, and we might be talking about that later at the office today. One last story before we close off here and that’s the jQuery Mobile Project. This is something John Resig, the creator of the jQuery Library, has been talking about on the conference circuit for a few months now, but it seems like they’re finally ready to do it. He’s been researching whether it’s doable, and now they’ve announced that they’re going to do it. Rather than develop a whole new JavaScript library just for mobile browsers, they are going to add support for mobile browsers to the existing jQuery library, they think they are able to enhance jQuery with support for mobile browsers without harming it as the top library for desktop browsers. And then on top of that once they’ve done that work they’re going to build a user interface widget toolkit for mobile phone browsers so that you can build these web apps for iPhones and things like that using jQuery, and it’s really exciting. It will be a while yet before they have something that’s really practical to use, but they’ve got some big names behind them supporting them, they’ve got Palm with their webOS platform, they’ve got Mozilla, who are working on Mobile Firefox, and the Filament Group which is one of the big names behind the jQuery UI library for desktop browsers is supporting the development of this as well. What really caught my eye about this story, though, was their chart showing— the Mobile Graded Browser Support chart which lists all of the major mobile phone smartphone browsers and the level of support they believe that they can give to them in this upcoming library. And if you thought supporting desktop browsers was difficult, well, take a look at this chart. In some ways it is less expansive than I would have expected, but I think it’s just because they have limited themselves really to modern smartphones.
Brad: I’m glad I’m not doing this. You know we develop for five or six different browsers and some different versions, but this is insane, you’re talking, what, eight different mobile browsers on 10 to 15 different platforms, I mean multiple versions, and I mean it’s crazy. And it’s being developed at such a fast pace, and this is something we’ve talked about on some of the previous episodes, how the Mobile Web is still so young compared to the regular Internet that these browsers and new versions of the operating systems and the software they’re running is being developed so fast that it’s almost impossible for developers to keep up because it’s evolving so quickly. So it’s certainly an interesting project, the first thing I thought about when I read this is something that you mentioned, Kevin, a few episodes back about how the Web isn’t really built for mobile especially with the drag and drop type of stuff. And I think it was with Flash and the iPhone topic that we talked about, so I’m curious because a lot of the jQuery elements that I’ve seen on websites I wonder how well they would work on a mobile site if they actually worked how easy would it be to kind of drag down a menu or use some of the drag and drop features. Some of it makes sense, but some of it I’m not sure would work at all, so.
Kevin: Yeah, I think that’s what we’re going to be seeing happen here because right now it really doesn’t work very well at all. I know Google Analytics, for example, is a very JavaScript heavy web application that does not work at all in mobile smartphone browsers, and we’re talking even on Apple’s iPad it is virtually unusable, not just because they use Flash to display graphs, but as soon as you get into customizing a report in Google Analytics the user interface is all about dragging things from the left side to the right side and dragging them up and down in the order you want, and none of that works in a touch-based user interface. And so the work that jQuery is going to be doing on their library here is really to bring those touch user interaction events into the library as first-class citizens, and then building widgets that respond to those types of events just as well as desktop-like click and drag events that you get from desktop browsers. And so, yeah, that’s where I think a lot of the work is here. Now that they’ve done this survey of the landscape it seems like you can read this graph and see they’ve made some decisions. For example, they’ve decided Opera Mini, they’re not going to be supporting; Opera Mini is entirely marked as a C grade browser which is to say it is an extremely low-quality browser with high market share. To some extent that’s a rough judgment on Opera Mini because really that browser is designed to be very simple, and it has almost no JavaScript support whatsoever by design, it’s sort of designed to give you a static, non-interactive view of the Web, but the speed increase and the bandwidth savings you get from that is kind of the point of that browser, so I’m not sure I would’ve even put Opera Mini in this chart, but nevertheless it shows there so users can see what to expect. Opera Mobile, however, their first class, fully interactive browser for smartphones, it looks like it hasn’t been very good right up to version 9.5, but the version 10, which is out for Symbian Series 60 phones and coming soon on Android and Windows Mobile 7, that one’s looking pretty good, and it looks like they do plan to support that. And then there’s the whole native column, which I think is shorthand for WebKit because all of these phones that have native browsers marked A-grade here are the same phones that tend to use WebKit. So those seem to be the two browsers they’re going to be mainly supporting is Opera Mobile 10 and WebKit, and if you’re lucky enough to have a smartphone with one of those browsers I guess towards the end of this year you can expect to start seeing rich websites built with jQuery that have full support for touch interaction. It’s exciting; it’s really ambitious. I agree with you Brad, I enjoy writing JavaScript, but I am glad this isn’t my job to make this work. And so kudos to the jQuery Project for taking on what is obviously a difficult problem.
Before we get to our host spotlights I wanted to go through a piece of listener feedback that dedicated podcast listener powerpotatoe sent through in response to Podcast #73, our last news show. Guys did you check out this big comment on the blog?
Patrick: I did.
Stephan: Yep.
Kevin: So, let me just run through it here, you guys can give your quick reactions to powerpotatoe’s thoughts here. We were talking about validation and whether it is still relevant, powerpotatoe says, “I still use the W3C validators mainly for troubleshooting. If something is not working in the code I’ll run it through a validator and check for any typing mistakes or other human errors. I once as a very young developer thought it cool to post the validator icons on my sites proving I was a master at web standards. But then I realized that running a validation for the whole site and adding the icons to each page was not worth the effort.” Brad what do you think, validation?
Brad: Yeah, I agree, I think it’s in the long run it’s probably not worth the effort. You’re going to be spending a lot more work than it’s worth to validate every page across your site. I used to use it a lot more when I was younger too just so I could talk about it a few years ago, so I’d certainly agree with that point.
Patrick: Yeah, I don’t think you were alone. I wouldn’t be surprised if SitePoint or Webmasterbase or Webmaster-Resources at one point had those icons too.
Kevin: Yeah, definitely. Powerpotatoe goes on to talk about paywalls. He says, “I have yet to pay for any service I use on the Web,” which that is a big call. I don’t know, I think even most people by now have put their credit card into some sort of website I would think. In any case he says, “In terms for news it makes sense to me to pay for a printed newspaper, but I feel taken advantage of if I have to pay for the same content online. This is due to an internet spoiledness, web content has been free since the beginning mostly. Take SitePoint, for example, if I had to pay to access the blogs, articles, or this podcast, I would quickly move on.” Oh, you’re crushing our dreams powerpotatoe.
Patrick: There’s our model. Aw.
Kevin: (Laughs) “Even knowing the benefit of this site for me I do not think I would stick around if I had to pay. However, every time a new book comes out I take a look at my budget to see if I can afford the purchase. I will pay for the books because I do not consider them a part of the site content, rather they are another product of SitePoint.” Patrick this goes back to some of the stuff you were talking about during that show, right?
Patrick: It’s the web publisher challenge because you have the paid newspapers, they have costs, paper, ink, printing, etcetera, but so does the Web; servers, hosting, domain names, etcetera. So, how do you get over that? I think what ESPN did, like we mentioned a couple of episodes ago, was a good example of paying for premium content. And like I told powerpotatoe in the comment thread I think when it comes to revenues strategies there’s one simple truth: that everyone wants to make as much money as they possibly can in a manner that’s appropriate for them. So if anyone has an idea everyone’s ready to listen and jump on it, but you get money in one of two places: either you get it from the people who consume your stuff, or you get it from the people who want to reach those people.
Kevin: Powerpotatoe goes on to talk about advertising and how he would love to see alternative revenue models work on the Web. I encourage you, listener, to head over to sitepoint.com/podcast and chime in on that comment thread; it’s a really good discussion. And that is it guys, let’s dive into our host spotlights, Brad?
Brad: Yes, well somebody had a birthday and I wanted to make sure I mentioned that, and that somebody is … Internet Explorer (laughter).
Patrick: Oh oh oh. I was like, did I forget? Was it Kevin’s birthday?
Brad: Yeah, Internet Explorer actually turned 15 just a few days ago on August 16th. Internet Explorer version 1 debuted on August 16th, 1995; can you believe it’s been that long?
Kevin: Say what you will about Internet Explorer, for a piece of code to be running, and not only be running but still the most used browser on the Web, 15 years later is a remarkable achievement.
Brad: Yeah, I would agree, whether you love it or hate it I think we can all agree that Internet Explorer kind of helped launch the Internet into the mainstream, it really made it accessible, easy to use, and you know, whether like I said you love it or hate it today we can at least respect that it did help shape what we all know and love, so happy birthday Internet Explorer.
Kevin: Happy birthday.
Kevin: My host spotlight is a big article called HTML Sanitisation: The Devil’s In The Details (And The Vulnerabilities). This is a must read if you are a PHP developer, especially if you have built or are considering building a site where users can type in HTML code that will be displayed to other users on that site. This is where you need an HTML sanitization library, certainly if you are thinking of writing one yourself reading this article will make you think twice and then throw that idea right out the window. It is a delicate science, and HTML can contain all sorts of dangerous things that you don’t necessarily want people to post on your site, not the least of which is JavaScript code that can be the source of cross-site scripting vulnerabilities. So in this article the author has gone through and surveyed the four most eligible HTML5 sanitization libraries, these libraries that you can feed it a piece of HTML code and in theory it spits out a version of that code that is safe for you to publish on your site. And he finds frightening vulnerabilities in at least two of them, the third one is built into WordPress, and he was able to find vulnerabilities which were then fixed in WordPress 3.0.1, but it is interesting nevertheless to see that such a long maintained and heavily used library can still have a vulnerability of this type in it. And then the last one, HTML Purifier, I’ll give you a spoiler now, is the only one he recommends as a rock solid solution for this. But in general if you can get away with using some other formatting language like BBcode, which is common on forums, or Markdown which is common in many blogging platforms, these are generally better solutions than risking HTML, but if you have to use HTML you definitely want to read this article so you know what you’re getting into. Patrick?
Patrick: My spotlight is a video that’s part of collegehumor.com’s Bleep Bloop series which focuses on video games primarily, but this one is for a product called AR Drone, and it’s called by the company The Flying Video Game; ardrone.parrot, like the bird, .com, and it is the first Quadra Copter that can be controlled by an iPhone/iPod touch/iPad, so wrap your brain all the way around that because I’m not into that sort of robotic stuff, but it was really cool to see this four blade thing flying in the air and being controlled by an iPod or an iPhone or an iPad, so I definitely think it’s a product for our listener base.
Kevin: This is one of those products that I was afraid it was going to be Vaporware, like it did the rounds about a year ago, they were sort of demo-ing it and they said you’ll be able to — we’ll be opening up pre-orders at some point next year. And you can now finally pre-order this thing, and I don’t know the exact price but I remember checking and going, wow, that is surprisingly affordable.
Patrick: Yeah, you can buy it from brookstone.com for $299.99 pre-order.
Kevin: Yeah. And when you think about what they charge for a remote control helicopter that you just know you’re going to fly once and crash it into the side of a building, those things you think of as being pretty expensive toys, this is remarkably affordable. So, yeah, it’s basically a remote control helicopter that you control with your iPhone, and it has a camera on the front so you can go and fly up to the roof of your house and have a look at what’s going on up there, you know.
Patrick: And there’s some sort of ability to play with other people through Wi-Fi, I don’t even know how that would work, but it’s possible to quote-unquote battle.
Kevin: Oh dear. AR Drone chicken.
Stephan: Alright, I’m getting one.
Kevin: (Laughs)
Patrick: This sounds like a worthwhile investment for SitePoint, get a few of these flying around the offices.
Kevin: Yes, yes, absolutely. Stephan what’s your spotlight.
Stephan: So I had a hard time this week, but Patrick showed me the light with his link to the blippy.com 404 page, I think it’s hilarious just because it hits on a subject that I think we all enjoyed recently, the double rainbow YouTube Meme.
Kevin: And I’ll have to include a link to that in case any listener has not seen the double rainbow.
Stephan: Yeah, if you’ve seen it it’s pretty hilarious three minute video, and the Blippy 404 page is a fantastic take on it. So just click on the little guy down at the bottom left and have yourself a nice laugh.
Kevin: (Laughs) So, as predicted a massive episode this week, but we have come to the end of it, and guys let’s go around the table.
Brad: I’m Brad Williams from Webdev Studios, and you can find me on Twitter @williamsba.
Patrick: I’m Patrick O’Keefe for the iFroggy network, ifroggy.com, on Twitter @ifroggy.
Stephan: I’m Stephan Segraves, badice.com is the blog, and you can find me on Twitter @ssegraves.
Kevin: And you can follow me on Twitter @sentience, and follow SitePoint @sitepointdotcom. Visit the SitePoint podcast at sitepoint.com/podcast, we’ve been getting some great comments in response to episodes, comments like the one that we read from by powerpotatoe this week. Why not send us in a comment and make yours the one we discuss on our next episode?
The SitePoint Podcast is produced by Carl Longnecker, and I’m Kevin Yank. Thanks for listening. Bye, bye.
Theme music by Mike Mella.
Thanks for listening! Feel free to let us know how we’re doing, or to continue the discussion, using the comments field below.
Related Posts
- SitePoint Podcast #59: Speaking of Fail
- SitePoint Podcast #45: The One Without Kevin
- SitePoint Podcast #70: Youth, Business, and Podcasting with Dave Moyer and Jeff Chandler
Related posts brought to you by Yet Another Related Posts Plugin.
Comments