Episode 150 of The SitePoint Podcast is now available! This week the panel is made up of Louis Simoneau (@rssaddict), Kevin Dees (@kevindees), Stephan Segraves (@ssegraves) and Patrick O’Keefe (@ifroggy).

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #150: The Vendor Prefix Kerfuffle (MP3, 38:29, 35.3MB)

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 main topics covered in this episode:

• TL;DR on Vendor Prefix Drama | CSS-Tricks
• 2011 Top Level Domain Sales
• 24 Hours » The Kickstarter Blog — Kickstarter
• Top Domains: ViSalus Dishes Out $825K To Buy “Challenge.com” and “Vi.com”\

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/150.

Host Spotlights

• Patrick: Superbowl Ad Video (comedy)
• Stephan: YOURLS: Your Own URL Shortener
• Kevin: SSH tricks
• Louis: Subscribe — Destroy All Software Screencasts
  How and Why to Avoid Nil — Destroy All Software Screencasts

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint Podcast, I think it’s episode 150, is it not?

Stephan: It is 150, I believe.

Patrick: Everyone believes, no one knows, that’s how all opt-in we are (laughter).

Louis: That’s how organized we are. So we’ve got a panel show this week; Patrick, Kevin and Stephan are all on the line, hi guys.

Kevin: Howdy, howdy.

Patrick: Hello.

Louis: How you guys been?

Stephan: Busy.

Patrick: Pretty good; last show I was down in Orlando to record it with Kevin on his couch, and spend some time in Atlanta, spoke at CNN, and I’m actually drinking a Coke from a glass bottle right now, so, there’s that, I got it from the World of Coke in Atlanta. Which if you know me you know I love soda, and I love the World of Coke where you can drink over 60 different soft drinks from around the world, but also the new Coca-Cola Freestyle machine which dispenses another 100+, so, yes, it’s a great place.

Kevin: I absolutely hate those Coke dispensers because they are not as carbonated as they should be, and it feels like a mixed drink that hasn’t been mixed thoroughly, so, you know, and you don’t want to mix a coke because then you lose all your carbonation, so it’s like you don’t have enough carbonation and then you mix it and they don’t have any carbonation anymore, so now you’re drinking a flat soda. Cool idea, bad implementation.

Louis: (Laughs)

Patrick: And then it turned into the soda show (laughter). No, I love the Freestyle, I love the Coca-Cola Freestyle, but I will say that there are some sodas, and it’s really like one or two that I prefer the standard mix versus the Freestyle, but the Freestyle is actually kind of new and kind of cool technology that our audience might appreciate because it dispenses the syrup and the carbonation and the water in like a precise formula so that the restaurant can’t change that and mess it up, so this is how it’s supposed to actually taste, so, I thought that was interesting.

Louis: Years ago when I was traveling through the U.S. I was in a, um, I think it was a McDonald’s, and they served I think it was a Sprite where it was too much syrup, where they’d messed up the mix, and it was just like — it was just like liquid sugar with a little bit of water and a little bit of carbonation, it was awful.

Patrick: Yeah.

Louis: Anyway, I don’t do soda anymore, not because of that (laughter).

Patrick: You came to America and America totally turned him off to soda because of that McDonald’s, shame on you.

Louis: Yeah, no, that’s not how it happened. Anyway, so we should talk about things other than soda because I’m sure that, you know, that’s not what brings our audience to the SitePoint Podcast, although it may in the future; if you like hearing soda-related tidbits come back next week.

Kevin: Soda-cast!

Patrick: Yes!

Louis: We should make a soda-cast. Anyway, so the major story this week, at least that crossed my radar, has been an ongoing kerfuffle, let’s call it that, at the CSS Working Group and W3C. So this all sort of came to light on Thursday of last week when Daniel Glassman, I hope I’m pronouncing that name correctly, wrote this blog post describing some of the goings on at the latest meetings of the CSS Working Group. And basically the rundown of the situation is that as many of you will know, recently as new CSS features make their way into browsers, a lot of browsers sort of testing the waters with their implementations, and they’re not exactly sure how — or the spec isn’t finalized yet, for example, so they’ve been using vendor prefixes, you’ll be familiar with a -webkit- property name, so like WebKit box shadow or a WebKit border radius, the Mozilla one is Moz, and the Opera one is just an O, so obviously developers have been using these pretty extensively; Kevin and Stephan you guys write some code, have you guys done a lot of work with vendor prefixes?

Kevin: Too much.

Louis: (Laughs)

Kevin: To sum it up.

Louis: Right. So, anyway, the goings on at the Working Group were that the other browser makers, that is to say not Google and Apple, have said, look, everyone’s just implementing the WebKit ones, web developers, that is to say, are writing sort of WebKit-only pages to sort of test these experimental features, even when those features are available in prefixed form, or even in non-prefixed form, you know, the browsers including mostly Firefox and Opera, but also for some properties I guess Internet Explorer. And what happened is that Firefox, or the makers of Firefox just sort of said, look, we are gonna start supporting the WebKit prefixed one, and that’s what everyone’s doing, and people don’t seem to know that in the case of some stable features they can just drop the prefixes, and in the case of other features there is a Mozilla equivalent; people are just writing the WebKit ones because they’re trying to support mainly IOS and Android on mobile, and also Chrome and Safari on the desktop; WebKit has a pretty big market share at the moment. So obviously this caused a bit of uproar, and Glazman wrote this big, I guess, call for action is what he calls it, saying look if we let this happen it’s pretty much the return to the days of proprietary features in IE6, and then everybody came out sort of in support of that. So, I wanted to get your guys’ read on this, maybe Kevin especially because you do a bit more front-end stuff.

Kevin: Yeah, so, I mean prefixes are kind of the cola wars of browsers, in my opinion, you know it’s not as flamboyant as it was back in the IE5, IE6 days where everybody was just kind of up in arms, you know the Firefox one day just, well, just, you know, everything coming to a head, and the invention of Ajax and all that, so all those things were good, though, right, I mean that’s what brought us to the Web where are today. So, like I said, we have Ajax where we can do asynchronous calls to XML files, even JSON, you know, any kind of document we want. Now today it’s the prefix, right, and it’s been a big topic because it’s kind of a valid way of doing this because it’s in the CSS specification where you can — it’s basically set out that you can use vendor prefixes. And so to me that’s what makes it more of a cold war, right, because it’s legal everybody’s just kind of doing it under the table, doing their own thing. And so to other vendors picking up other vendors’ prefixes seems a little scary to me because that’s stepping outside of what the W3C had set out to do with these which was prevent that very thing from happening, like you had with the filter element in Internet Explorer, right. And so, yeah, you know, this doesn’t give me a good feeling, I like the idea of vendor prefixes, I think it’s great for expanding on ideas and trying out new things without effecting the way things can be implemented in the future, but at this point it looks like I think this is really a problem that’s been designer related, right; designers and developers have created this demand for these features, and since the W3C can’t move fast enough to feed the designers what they want, and the developers as well, I’m not trying to make this a one-sided argument or anything, I think that’s kind of what’s causing this issue is the impatience of developers, and that kind of thing. And so the only solution that browser makers can do, because nobody’s going to pitch their browser if they’re behind, right, I mean you can see there are a lot of things in play here, and so, yeah, I think it’s just a big, crazy mess, and the W3C has to figure something out to work with all these browsers, I mean it’s nothing — it’s hard to just make a small comment on because it’s so complex.

Louis: Yeah. So, a couple of things related to some of what you just said, one of them is saying that developers are impatient for these features, and that’s true to some extent, and there are cases that are more similar to filter, in the case of, for example, WebKit Text Size Adjust is a property that was created in WebKit, and it’s used on IOS and Android but was never in the CSS specifications, but a lot of these things are properties that were in the specifications and either, well, first of all the CSS3 spec is still in progress, the browser didn’t want to lock down –

Kevin: Exactly.

Louis: — and create a version of that that might then be not backwards compatible. A good example of that is the original gradients and syntax that existed in WebKit is not the syntax that’s currently used in the W3C spec, and it’s not the syntax that was used by the other browsers. So currently if you do WebKit gradient that does something entirely different from the linear gradient and radial gradient properties, and the fact that it was boxed away into a vendor prefix form sort of protects us because we can now use the standardized form, and it won’t break on those older versions of Chrome and Safari, of which obviously there are a few because the browser upgrade cycles have improved as well. And then putting it back on the W3C, as you said, they have to come up with something; I don’t think it’s necessarily up to the Working Group and up to the browser makers, there’s not a lot they can do, and Eric Meyer wrote a good blog post sort of summing up what he sees as the browser makers positions here, so I’ll just quote briefly from his blog post, “As a vendor it may be the least bad choice available in every competitive marketplace, after all, if there were a few million sites that you could render as intended if only the authors used your prefix instead of just one, which would you rather: A) embark on a protracted massive awareness campaign that would probably be contradicted to death by people with their own axes to grind, or just support the prefix that people are using and move on with life?” So in this case he’s saying if you’re Mozilla, yes, the correct thing to do is to keep pushing the -moz- prefix and supporting a standardized non-prefixed form once the thing is stable and you feel like you’ve got a solid implementation, but if there are a million sites out there on the Web that look broken because they’ve only used WebKit, then for user browser makers your main prerogative is to serve your users and make the sties that they visit not look broken, right. I think it’s largely up to developers to really not be lazy about this, if you want to make a cool demo and you use Chrome and you have an iPhone that’s great, you can make a cool demo, but take the time to find out whether the property that you’re demoing actually exists in Firefox and exists in Opera, and chances are it probably does, and if it does don’t just do the WebKit one, right — right?

Stephan: Right. (Laughter)

Kevin: You know sometimes you have to stop and think about these kinds of things for a second, it’s hard to — because I mean it is a complex situation; you know right when you think web standards has won, you know, something like this comes out and happens and it’s a little scary, and something you have to be watchful of, it’s good that people are talking about it, you know, but at the end of the day web standards are just that, they’re standards, and you’re trying to create a unified language for everyone to use that way when, like you said, a browser gets updated your site doesn’t break. And so the danger that I see in this is, yeah, you’re gonna go and adopt this other prefix, let’s say you’re at Firefox, right, and you adopt the WebKit prefix, you go and do this but it doesn’t change people’s code, you know what I mean, it’s like it doesn’t help standards at all, it only hurts them.

Louis: Absolutely. I’m not saying that this is a good thing for Mozilla to be doing, it’s a terrible, terrible idea, but from the perspective of a browser maker, like what Eric’s article was trying to say, is that it seems like it’s the logical thing for them to do, even though it’s the wrong thing objectively for the Web and for web standards going forward. I mean the last thing we want is for these WebKit properties to wind up in all browsers, and that sort of circumvents the W3C entirely, right, then it’s just whatever WebKit does other browsers decide to support if they like it, if they don’t they don’t, I guess, and then you don’t have a standards process, then you just have one browser maker controlled by a few ginormous companies that — or, to be clear, WebKit is open source but a large percentage of the contributions come from Google and Apple, you know, that’s definitely not the way we want to go.

Kevin: You know because there are so many platforms in place, I mean you have Windows, Linux and Apple, right, right now, and those are kind of the big-time, I mean you have other proprietary operating systems, but those are like server software and that kind of thing, so you don’t really have browsers on them. But, uh, it’s something where I mea I know they’ve been fighting for this for a long time and we’re probably pulling this out, this conversation out a little bit, but it would be nice if everyone could just get together and say here is our one rendering engine, and I know this isn’t gonna happen because there is a certain amount of control that you need on an operating system to please, I mean it’s a business. At the end of the day what I’m trying to say is it’s a business, and whether you’re Firefox, Internet Explorer or Google your business is getting people to see your brand, and since everybody surfs the Web, the browser’s an excellent way to do that, and I think until that goes away we’re always going to have standard problems.

Louis: Okay. So first of all I don’t think that’s a fair call because at least one of the rendering engines out there, which is to say Firefox from Mozilla, is not a business, it’s an open source project put out by a non-profit.

Kevin: This is true.

Louis: And to some extend WebKit also sort of falls in that realm, even though it’s championed by two very large companies, and those two very large companies another valid point is that they’re often at each other’s throats, so saying that they’re trying to push the browser engine WebKit to try and advance through an agenda is valid, but they’re also helping their competitor, right, so it doesn’t — it’s not just business, I don’t think that’s the only reason why the standards process is difficult, and I think it was actually kind of working, I mean these vendor prefixes were effective. One of the suggestions people have made is that the experimental ones shouldn’t still be there after the property is stabilized, so that means if you support box shadow in an un-prefixed form in your browser then there’s no reason to still support WebKit box shadow because you want to push developers towards using the standard form, right; these are only sort of an interim stopgap solution while you’re testing things.

Kevin: Right. That still kind of breaks the Web in a way, though, because you lose future compatibility versus backward compatibility.

Louis: Yeah. Another suggestion that I read that I really liked, I don’t remember who suggested this, but someone had mentioned that a good idea might be to have the vendor prefixed properties only exist in develop versions of the browsers. So if I’m using the nightly builds of WebKit then I can test around with these WebKit ones, but as soon as it goes to a full release where it’s pushed out into Chrome and Safari either you support the property or you don’t.

Kevin: It’s an interesting idea.

Louis: If you do then there’s no prefix, and if you don’t then it’s just out, which I think is probably — it seems on the surface of it like a good idea, I haven’t given it a whole bunch of thought, but it seems like it might sort of solve some of these problems where people are making websites out in the wild using these experimental properties and sort of tying their sites to one browser or one rendering engine.

Kevin: Right. Yeah, I like that idea because at the end of the day what a lot of browser makers need is feedback from implementers, right, and so that would be an excellent way to do that, I think. Now, you wouldn’t get as many implementers because not everybody runs develop builds, but you would still get a good many.

Louis: Yeah, and without necessarily running the risk of people developing production websites with experimental properties. Anyway, I just — it’s good to get a bit of a read on this, it’s been obviously a huge outroar on the Web, there have been blog post far and wide, SitePoint, long time SitePoint friend Rachel Andrew wrote a blog post decrying this action on the part of Mozilla and other — well, basically just saying look we’ve got to fix this, so people have come up with — there’s a petition and a pledge telling browser makers not to implement WebKit vendor prefix and promising to update the sites that you do control, so if you do feel like this is something that matters and you don’t want the other browser vendors to start standardizing around the WebKit form then there’s that option, there’s also a project started by Christian Heilmann, who’s of Mozilla, which is called Prefix The Web, I’ll put a link to that in the show notes, and that is people going around finding open source projects on GitHub and demos of CSS3 functionality that people have put on GitHub, and just patching that code to support other browsers where possible, so there’s a whole list of those of projects people have found and updated to be more cross-browser compliant, so a lot of things that, you know, a lot of people are jumping into this bandwagon and trying to get people up and angry about this, so that’s good, we’ll have to wait and see what happens though.

Kevin: Yeah, it’s the nature of the Web, right, there’s always something crazy going on, it really is.

Louis: Yeah, cool. Well, I guess that wraps that if someone wants to jump in with the next story.

Kevin: So, I have an interesting article to get off the CSS train for a second and talk about the Kickstarter.

Patrick: Yay. (Laughter)

Louis: Yeah, what happened to the train, we haven’t heard the train yet today Kevin?

Kevin: Yeah, yeah,

Patrick: whoo whoo (laughs)

Kevin: I’m sure it’ll be around later, I think it comes at 7:30, but maybe 7:45 today, we’ll see.

Patrick: It’s running late from Albuquerque.

Kevin: So, there’s a blog post up, it was posted on February 10th, about the last 24 hours, of course then, of Kickstarter and how they’ve made some giant leaps and bounds in what they’re doing. And I think Kickstarter is a worthy company and project to talk about because it helps other people work together to finance ideas and projects and that kind of thing. Basically what they have going on is basically a timeline on this blog post of all the things that have happened over 24 hours, it was a big day for Kickstarter and just all the different things between political efforts and some very large projects that they have going on; I believe Elevation Doc saw close to a million dollars for their project. And so I was wondering maybe if you guys had thoughts on a project like this that kind of takes off, like your opinions and stuff on maybe what other people could do to get involved in a project like this. Like how — I think, Patrick, you would probably have some opinions on this, but, you know, I’m sure you’ve heard of Kickstarter, but how would somebody go about getting involved not only in like one of these good projects, but also starting their own project. Like because I think on the cusp of something like this it’s good to kick into the imagination; I know I’m stumbling all over my words here, but, interesting I would say.

Patrick: Kickstarter’s awesome, I mean I think I love the idea of it, it’s not like a complex idea, it’s a pretty simple idea, it’s a simple concept, and they’ve got the community and the traffic to make it a successful venture, and that’s really what it’s about, not necessarily the idea but the execution. And I think it’s great for them to hit this mark and to have projects that go over a million dollars, it really makes me think creatively about what I could do with the platform myself if I have different ideas for different projects that I want to fund, and to be able to get that funding before laying out the investment. Not that it really disrupts venture capital so much, I think that space is still kind of its own sort of country and has it’s own sort of norms and principles, but definitely this is a case where people can go out there and more simply get funding and maybe maintain more control of their idea by delivering it directly to the people who want their product or want to see them release whatever it is they are interested in putting out. So, to me it’s a great idea and it’s great to see them be successful, and it’s great to see so many different content creators and product developers look to Kickstarter to put out something; I notice a lot of web video channels, a lot of successful — YouTube channels especially, putting out Kickstarter campaigns or similar campaigns to fund their next big thing, or maybe they’ll want to do a movie or a longer feature, and so they’re using Kickstarter or something similar to fund it, mentioning people in their videos, having people pick elements of the video; there is a series called Beer and Board Games from Blame Society Films that is a lot of fun, and they have people who you can pick the beer, you can pick the game they play, and so they get the funding but then they make the people a part of the project as well, and I think that’s a lot of fun.

Louis: Yeah, it’s an awesome thing, and it’s great for people who have ideas to be able to just kick it directly to their fans, especially if they’ve already got a following and just want to, like you said, do something a bit bigger and more ambitious. I have to say — I’m just gonna nerd this up a little bit; I was kind of disappointed because when I see these like, oh, we had this crazy 24 hours blog on a startup website I’m hoping for like our servers were getting hammered and here’s what we had to do, and all the nerdy technical details. And just so the listeners aren’t disappointed, there’s none of that, it’s all about successful and just how it blew up on social media, not about how they weathered the storm of all the increased traffic.

Patrick: Right, no, none of that (laughter). It’s a mainstream blog post; we’ll put it that way.

Louis: Yeah, maybe they have a technical blog as well; maybe I’m just not looking at the right place.

Patrick: Yeah, it’s possible.

Kevin: I think I’m a little biased to Kickstarter in a way because it’s such a good site, right, I mean I’ve seen really good things come out of it, there’s projects for like WordPress plugins, and that kind of thing, and I think even some iPad gear came out from this, and these are all just individuals who have an idea and want to get other people who like that idea, or have similar interests, to get involved so you can help create things that aren’t just blah, if you know what I mean, like it’s a quality product, right, because there is some investment, and you can put time behind the things, and I just love it, I think it’s great.

Patrick: Yeah, it is, and have you funded anything, Kevin?

Kevin: Yes, I have. So, one of my friends, he works with a lady and they do music albums, and so I supported them, it’s the Hannah Miller, you can look them up, I love that music, it’s good.

Patrick: Okay, yeah, I haven’t funded anything myself, not yet anyway.

Kevin: Right.

Patrick: I want to, though, I will one day, I’m sure. Put your money where your mouth is, Patrick.

Louis: That’s right. Yeah, let’s do it. Speaking of money, that’s a perfect segue.

Patrick: So, speaking of money, I picked up a story on TechCrunch by Rip Empson, and he reported on the sale of two domain names, not your everyday sale, though, because it was challenge.com and vi.com, and challenge.com was sold for $500,000.00, while vi.com was sold for $325,000.00 to a company named Visalus Sciences, I believe. And that story linked me to bigger lists of the biggest domain name sales of 2011, so last year’s top 100 domain name sales by the actual cost of the domain name. So the number one domain name last year sold, the most expensive one was social.com, which was sold for 2.6 million dollars, then domainname.com, and dudu.com, I assume that means something to someone or in some other language, both sold for a million dollar each, and there’s this long list of names, 3d.com jumps out to me for $500,000.00, and for the kind of web dev technical audience that we have, datacenter.com sold for $352,500.00, and livecloud.com sold for $92,000.00, so, yeah, I’m always curious of what domain names are worth, so this helps to guide me; not that I have any that are worth half a million, of course.

Louis: Yeah, I mean that stuff is kind of crazy, it’s really surprising to me to look at this because — and so what did you say social.com sold for, sorry?

Patrick: 2.6 million. It was the most expensive by far, like the closest one was domainname.com for a million.

Louis: Yeah, but I mean even let’s go with $500,000.00 and up, I find it difficult to imagine other than, you know, if it’s your brand, if it’s like hp.com or apple.com then obviously the value of that to you as a company could reach that kind of number, but I can’t possibly imagine anything that you could do with social.com that would reach anywhere near that level of investment that you couldn’t do with a different domain. Increasingly it seems like the domain name is less and less relevant in web ventures because everyone finds things via Google, or you’ve got a Facebook page or Twitter, I mean it’s easy to find anything. I think even as recent goings on with like, for example, Facebook login being the most commonly searched thing in Google, right, or it was at some point, or it was in the top ten of searches, right; people aren’t even entering Facebook.com to go to Facebook, so it seems like the domain name is kind of irrelevant, and especially something like social.com where it doesn’t have a strong branding, it’s just sort of this random word, it kind of baffles me.

Patrick: Yeah, I mean I can understand that. There are two, you know, there’s a couple thoughts, domain names, branding, it can have an impact on getting funded, I’ve heard multiple people say this before that if you have a great pitch and great domain name you’ll go a lot farther than if you just have a great pitch. Is that fair? Is that vanity or cosmetic? Perhaps, but it is something that I’ve seen repeated multiple times, and so you do have as far as, like you said, people go to Google, the domain name does impact searches and results, what’s in the domain name. So, for example, domainname.com might have a decent chance at ranking for the search term domain name if you were starting now versus starting as eNom, let’s say eNom has built up links and they’ll get credit for that, but if you are one of those right now and you’re targeting that term, domainname.com is gonna put you head and shoulders above generic branding. But I can understand your point because that’s a point a lot of people make is that if you have a million to spend on a domain name then you have a million to spend on something else.

Louis: It just seems to me like if you’ve got — let’s say I’ve got an idea for a website that is gonna be the next social network, right, I can either spend 2.6 million dollars hiring developers and designers and making a product, or I can buy social.com and then spend a thousand dollars hiring designers and developers making a product. And if feels to me, like my gut feeling is that the better product is a more worthwhile investment of my time, whether or not it’ll be more successful, and you mentioned funding, I mean the funding thing is crazy too, right, because that’s not an indication of actual success, as we’ve seen recently with Groupon and things like that, you know, getting funding isn’t an end in itself, right, it’s just another step along the way, and if you don’t have a business model or if you can’t turn a profit or if you don’t have a product then that’s not getting you any further than a good domain name is.

Patrick: Yeah, and one thing that you might throw out there is that if you have the money to pay developers and you have the money to get a great domain name, then it’s maybe better to have both instead of one. But if you have to choose one then you want to be careful where you invest it.

Louis: You know up to a point, I can understand if you’re starting a new venture that domain names you want aren’t necessarily available, right, or if somebody’s got them and you can get them for two or seven or even ten thousand dollars, if it’s part of a big business venture and you say this is the domain name, and I’m not expecting you to be able to start — I’m not saying that people can ‘I want to start a new website about whatever’ and the domain name is just gonna cost me the ten dollar registration, I don’t think that’s very common anymore because a lot of domain names are taken or squatted, right. So you might have to pay something for them, but it just seems to me like paying that much for them is kind of crazy. Again, part of it is coming from the perspective that I come from working at Flippa where we do a lot of sales of websites, established websites, and not a lot of sales of domains like Sedo, which is mentioned in this article, do more domain sales, but for us we’re seeing like when you’re looking at a website it’s all about traffic and links and even revenue, because these are real businesses, right, you’re buying something, not just a property, which is hard to quantify anything about other than it’s a dictionary word and it’s short and so it’s worth two million dollars, I don’t know, it baffles me. Clearly it doesn’t baffle people who have two million dollars, and maybe they’re smarter than me because that’s why they have two million dollars.

Patrick: I don’t know if that’s the case, but domain names do have value, I think, at the end of the day, so that it’s kind of like that — the address or the real estate of the Web, there’s value there, and there’s different examples, like I could say Flippa, for example, if you search websites for sale Flippa is number one right now, flippa.com/buy, and that’s a great place to be. Of course Flippa has the SitePoint –

Louis: The SitePoint bump.

Patrick: — party limited. Yeah, the SitePoint bump, but if you go to the third site there, Websites for Sales, plural, is the third site listed there. And the site that I go to is nothing particularly nice let me tell ya. So, there is something to be said for that, but I do agree with you, and, you know, I think it’s an interesting discussion, and also one thing I wanted to point out also was country code domain names, the most expensive country code domain names, so non-.com, .net, .org, specific countries, was at Aktein.de which is stocks in German, that sold for $725,000.00, and on the web development note, or at least the Web note, internet.co sold for $40,000.00, seo.in sold for $18,500.00, servers.eu and addserver.d sold for $18,000 and $17,940 respectively.

Louis: You know, of that I would have to say that seo.in sounds like that was a bargain, like it sounds like you would expect to pay more than $18,000 for that given the sort of explosion of SEO. So, in is India, right, I’m not getting that wrong?

Patrick: I believe that is the case, yeah.

Louis: Yeah, anyway, I think someone got a steal with that one, but, again, I don’t know anything because I don’t have two million dollars.

Patrick: I wish I had lots of money. I would have many beautiful domain names. With that said, I think it’s time to talk about spotlights, and I will go first with my patented offbeat spotlight, Patrick’s offbeat spotlight corner, a regular series here on the SitePoint Podcast.

Louis: Is Patricksoffbeatspotlight.com available? (Laughter)

Patrick: It might be.

Louis: Is that worth $18,000.00?

Patrick: I think it’s worth the registration fee; might not even be worth that. But, so my spotlight is a commercial from the Superbowl called Man’s Best Friend, it was part of Doritos Crash the Superbowl website where people can submit different commercials, this one was by Jonathan Friedman, and the description is: while working in his yard a man observes a crime being covered up, but the culprit has a unique way of keeping the two witnesses quiet, and I kind of don’t want to talk about it because it’s 30 seconds, so if I describe it it’s ruined, so just check out the link and enjoy the commercial.

Louis: Right. And the Superbowl is an American football competition, if I understand correctly.

Patrick: Yes, yes, and assuming — it’s inconsequential to what we’re discussing here. Now, the one thing is, though, I’m hoping that people beyond U.S. will be able to see the commercial. I can’t guarantee that for sure, but hopefully that is the case.

Louis: We’ll find out. Yep, I just tested it and it works here, so most likely it is available in all countries, or at least most countries.

Patrick: That’s what they say about Australia, right, if you can make it here you can make it anywhere, isn’t that Australia?

Louis: (Laughs) if you can see it here you can see it anywhere, that’s what they say about Australia on the Internet.

Patrick: There we go. Down to the last minute. Stephan, what do you got?

Stephan: I can go next. I’ve got this website called yourls, it’s y-o-u-r-l-s.org, and it’s a custom short URL creator, and it has a plugin for WordPress, so it’s a set of PHP scripts to create your own short URLs. I know we love those on this show, so I figured why not.

Louis: Yeah, I mean I think we have talked about this before, and it is definitely cool to be able to have your URL shortner on a server you control so you have it in your own database, and it also does click tracking and statistics like Bit.ly does, yeah, it looks really cool.

Stephan: Yeah, simple.

Patrick: Do you use this, Stephan?

Stephan: No, I don’t, I just found it today, so I thought it would be neat to share.

Patrick: Yeah, I’m familiar with it, I just haven’t made the decision of what I want to use, like, and if I want to even do it, because I have ifrog.gy, so ifroggy but i-f-r-o-g.gy, and I’m not sure if I want to put it on bit.ly or if I want to use this, or what; if anyone has a recommendation leave it in the comments.

Louis: What’s gy?

Stephan: I think it’s Guyana.

Patrick: That’s correct, Stephan, it is. Gee-yana, Guyana, something like that.

Louis: Was Guyana fairly easy to deal with registration.

Patrick: I paid via carrier pigeon.

Louis: Like some of them you have to fax something in, some of them you have to prove you’re a business.

Patrick: No, it’s a bad joke, but yeah, I mean it was a slow process, I had to register, like wait a month and wait for it to go through and them to email me, because the site that I registered through, 101domain.com, they’re a pretty well-known registrar, but I guess it was the actual person who manages the registry in that country that takes a long time, but once it’s set up and on the server I mean my assumption is that it should be okay, but that is part of my hesitation.

Louis: Yeah, a friend of mine was trying to register at .ie, a domain name, which is Ireland, and apparently they just said, no, that’s not a website devoted to an Irish business, like you really have to demonstrate that you’re making an Ireland-related website or you’re an Irish business.

Patrick: Yeah, yeah.

Louis: You can’t just use it as part of a word like people do with ly or gy in your case.

Patrick: Yeah, different countries have different restrictions as far as what you can do, and many of them do require you to at least maintain a presence in the country or in some cases even stricter than that.

Louis: I’d maintain a presence in Guyana, I could get a little beach house.

Patrick: (Laughs) I don’t know.

Kevin: Carrier pigeon.

Louis: Just for the domain name, of course.

Patrick: Yeah, I’m looking at the Wikipedia page for a list of Internet top-level domains, and like Finland requires you to be a company or organization registered in Finland, or be a Finnish national, Guinea requires a local contact, so, yeah, it seems like — I don’t know how common that is or how restricted they are, but in some cases it definitely is the case. I mean they make less money, but I guess they maintain a more, how do I want to put this, pure domain pool, I don’t know.

Louis: Yeah.

Patrick: Kevin! What do you got?

Kevin: I have an excellent article on SSH, since SSH is super exciting.

Patrick: Yay.

Louis: I’m really excited by SSH, I don’t know about anyone else, but I didn’t even take that sarcastically. (Laughter)

Kevin: It actually is a very cool thing, in fact, it can be more cool for you if you’re using it for just secure — connecting to your server securely, connecting to a server; you can use it for a lot more, and this article covers just that, and so they cover why you should use SSH, and then also maybe executing remote commands, copying files, you know, so there’s a lot of really cool stuff in here you need to check out if you use SSH. I use SSH for everything; I use it to connect MySQL databases, I use it to — I mean if it has to do with a server I use SSH, and I think this is an excellent article on the topic.

Louis: Yeah, I spend pretty much ten hours a day everyday shuffling through SSH because I develop on a virtual machine and I SSH to the terminal.

Patrick: Ouch!

Louis: Any little tips and tricks I definitely appreciate. Speaking of tips and tricks, see segue, man, we’re all about segues this week; my spotlight is a series of screencasts created by a guy called Gary Bernhardt, and they are called Destroy All Software. So, he bills it as screencasts for serious developers, they are not free, they’re a nine dollar a month subscription, but they’re great, we’ve collectively bought a subscription here at Flippa for our dev team, and I’ve been powering through them in the last couple of days, and they’re really good. So they’re kind of more advanced developer topics, so either UNIX command line stuff, test driven development, a lot of stuff about VIM and using VIM effectively, and Git for version control. The bits that are about development and software tend to focus on Ruby, but there are little tidbits and design patterns sort of useful in any language. But it’s one of those things where you’re watching them, and they’re very, very dense, he does a lot of stuff in 10 to 15 minutes per screencast, but just being blown away by how fast and how effective the guy is using his tools and understanding the code that he’s writing, and it really gives you a good insight into the stuff. So if you use any of these tools I recommend checking it out, there’s one of them that is available for free as a demo, and it is the one about avoiding nil or nul values in your code, why that’s important and how to do it, so I’ll put a link to the one that’s free as well in the show notes.

Kevin: Interesting. See now you have me excited.

Louis: Awesome (laughs).

Kevin: It’s a good trade, it’s a good trade.

Louis: That’s what we aim for. Alright, so that wraps it up for this week, and let’s just go around the table.

Kevin: I’m Kevin Dees and you can find me at kevindees.cc, and on Twitter as @kevindees.

Patrick: I’m Patrick O’Keefe for the iFroggy Network; I blog at managingcommunities.com, on Twitter @ifroggy, i-f-r-o-g-g-y.

Stephan: I’m Stephan Segraves, you can find me on Twitter @ssegraves, and I blog at badice.com.

Louis: And you can follow SitePoint on Twitter @sitepointdotcom, that’s sitepointd-o-t-c-o-m, you can email us at podcast@sitepoint.com, and course you can go to sitepoint.com/podcast to find all of our show, subscribe to the RSS, leave a comment, anything you want to do with the podcast will be at sitepoint.com/podcast. Thanks for listening, next week I hope to have maybe a little mini-panel of interviewees talking about the whole vendor prefix kerfuffle, so tune in next week; we should have a great show of some experts being able to comment on that.

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.

Episode 149 of The SitePoint Podcast is now available! This week our regular interview host Louis Simoneau (@rssaddict) interviews Ross Boucher (@boucher), one of the co-creators of the Cappuccino Framework; to talk about his current work on a payment processing service called Stripe, as well as the current state of JavaScript web application development.

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #149: Drinking Cappuccino with Ross Boucher (MP3, 31:12, 28.6MB)

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

Louis and Ross cover how the Cappuccino framework came about, what the Stripe team faced as challenges, how they got through those challenges and how javascript debugging in browsers has and continues to move forward.

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/149.

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint Podcast, my guest on the show today is Ross Boucher; hi, Ross.

Ross: Hey.

Louis: Ross is a web developer; the co-creator of the popular Cappuccino Framework for creating browser based web applications, and is currently working at Stripe. So, do you want to talk a bit about what you’re currently working on, Ross?

Ross: Sure. So I’m working at a company called Stripe, stripe.com, and we are payment processors, so we try to make it easy, as easy as possible to come and signup on our site and be able to start processing credit cards on your own site right away. And at the end of the day like this is kind of similar to what a lot of other people are doing, obviously you can do this with PayPal or a number of other companies, but we think that our software is both better, it’s easier to use than a lot of these other companies, and also we place a lot of importance on eliminating the amount of sort of manual effort involved, making integration as quick and painless as possible, and, as I mentioned, making signup really easy; you can come to our site and fill out the online form in probably just about two minutes and start charging real credit cards right away.

Louis: Right. Having recently spent, well, I didn’t personally, but another developer on our team has spent I think more or less the last month trying to get recurring payments working with PayPal; I can say that a one day or even a few hour turnaround sounds very impressive.

Ross: Yeah, we’ve heard a lot of similar stories, and a lot of people here come from backgrounds were they were doing other startups or working at other companies and experienced the same problems themselves, so I think a lot of the motivation for Stripe is born out of our own internal frustration.

Louis: Right. It’s always interesting to me; I talked with one of the guys from Shopify on the podcast last year. For those of us who develop web applications where we might sell products or just provide an online application for people, it does seem like stepping it up to another level when you’re dealing with credit cards because you have a lot of concerns that maybe other app developers don’t have to worry about so much.

Ross: Yeah, I think that’s definitely true. Stripe is even a bit different in that because we are essentially offering a piece of infrastructure for other companies, you know our primary product is our API; we’ve got an even different set of problems to worry about. I think API driven products tend to just have different problems, and, for example, reliability is paramount to us; we don’t want other people to ever have to worry about not being able to accept payments because our servers are down.

Louis: Yeah, absolutely. How long has Stripe been in operation?

Ross: Stripe has been processing payments for just about two years now, in fact, I was the first user of Stripe at my last company, but it’s only been public for about four months now, five months, September of last year.

Louis: Okay, so it’s fairly new on the market if anyone was looking for a payment gateway.

Ross: Yeah, it’s fairly new. And we also, I guess I didn’t mention this before, but Stripe integrates both the traditional payment gateway and merchant account features into one, so when you come to Stripe you don’t need to bring with you a separate gateway or merchant account, we just package that all into one simple product.

Louis: Right, so the payment that you receive, for example, go into a Stripe account?

Ross: When you get paid with us we hold your funds, actually our partner Wells Fargo holds the funds in your name, we’re never actually in control of them.

Louis: Right.

Ross: And then we transfer those funds to you to any bank account after seven days, seven days after each payment is made.

Louis: Alright. Yeah, I mean it’s really interesting, especially in a market where I think a lot of people tend to think a big player like PayPal is sort of the only option out there, and given the experience that most people have had dealing with PayPal’s support and API, I think it’s definitely a good space to have a bit more competition in.

Ross: Yeah, we’re excited about growing and about the challenges ahead.

Louis: I’m really looking forward t seeing it grow. I guess the thing you’re probably better known for is as co-creator of Cappuccino. Now, I think Cappuccino when it was first released was probably discussed on the SitePoint Podcast, though I was not doing the show at that time, but for anyone who’s unfamiliar with Cappuccino do you want to talk about what it is and how it came about?

Ross: Sure. So, to start out with a quick overview, Cappuccino is, as you said at the intro, a framework for building browser based apps, and what we mean by that is what’s I think come to be now known as like single page apps, or some people call them like fat client web apps, things like that. And the idea is an application like Google Docs or our own 280 Slides, or even to some extent Google Maps, is really something that you load once and most of the logic of running the app is happening in the client and it goes to the server just to fetch new data to act on that data. So that whole model of apps which I think we’ve seen become really popular over the last two years or so is what Cappuccino is really designed to build. And Cappuccino itself was started, well, it started in our college dorm room about 2005, but that was just really a hobby for a while, and then in 2008 we started working on it full time and started a company called 280 North to do that, and then we released it to the public I believe in August of 2008. So it’s been out for just a little over three years now.

Louis: Right. And it’s worth mentioning Cappuccino is open sourced software.

Ross: Yes, it’s open source, it’s on GitHub, it’s currently on version 0.9.5 I believe, and it’s licensed under the LGPL.

Louis: Right. So the idea behind Cappuccino was sort of from what I understand to somewhat recreate the experience of developing native apps in Cocoa and Objective-C for the desktop Mac environment –

Ross: Yes.

Louis: — inside the browser.

Ross: Right. I guess I should have mentioned that. When we were thinking about writing Cappuccino we were actually — the problem we wanted to solve was to build an app in the web browser, and we’d been working on that for a while, and as we got further along on each project we would hit these roadblocks and realize this is actually really hard, it’s really hard to build this kind of app in the browser. But the three of us that were working on it at the time also had experience writing Mac apps, and so we thought to ourselves why don’t we try to work on a framework that looks similar to Cocoa; Cocoa seems to work well in building these kinds of complex apps. So we started playing around with ideas that were modeled after Cocoa, and then eventually Francisco, one of my co-founders, had the idea that why don’t we just try to actually write Cocoa. And so he for fun wrote Objective-J, which is the language Cappuccino is written in, it’s a set of extensions to JavaScript that are compiled on the fly in your browser, so we added this set of language extensions to add certain features like code importing and classical inheritance and dynamic dispatch.

Louis: Right.

Ross: The same set of features that Objective-C added to C. And so after he’d done that we set to work on porting a lot of the actual Cocoa framework, and so that’s where Cappuccino is today.

Louis: Right. And you said that the compiling happens in the browser, happens on the fly, something like CoffeeScript where you put it through a pre-processor.

Ross: It’s actually extremely similar to CoffeeScript. We have the capability to do it both in the browser or ahead of time on the command line, which is something CoffeeScript has as well, I believe. And so typically the development cycle for a Cappuccino app will be to make changes to your .j files and refresh your browser just like you would normally and those changes will be compiled on the fly in your browser. But then when you deploy we recommend compiling ahead of time and running all of our various optimization scripts to get stuff as tight and fast as possible so that you’re not doing repetitive work every time one of your users loads your app.

Louis: Right. And this is — because it’s running in JavaScript and it’s compiling down to more or less straight up JavaScript, what’s the level of browser support that you get out of that?

Ross: So, officially I believe we’re supporting pretty much any browser, IE7 or newer. I think Cappuccino works in IE6 as well, but we don’t really support it because we used a lot of transparent PNG’s and not really interested in that problem.

Louis: It’s weird; it’s been long enough that until you brought that up right now I had forgotten that IE6 didn’t do transparencies.

Ross: Yeah.

Louis: And it was just like oh, wow, that thing was really archaic.

Ross: Yeah. Yeah, when we actually released, or when we wrote our first Objective-J, IE6 was the newest Internet Explorer, so we spent a lot of time figuring out how to make compiling this language in IE6 fast enough to be realistic.

Louis: Right. I mean that sounds — so, to me telling the story of how you came up with the idea on how you started working on it, it sounds totally like one of those things where oh, wow, it’s hard to write complex applications in JavaScript, it’s really easy to write complex applications in Cocoa, we should just rewrite all of Cocoa in JavaScript, and then you’d spend like a day trying to do that and then realize that that was really hard and stop

Ross: (Laughs)

Louis: So big props to you guys for not doing what I think I would’ve done in your shoes.

Ross: Yeah. It was definitely fun and interesting and challenging and probably harder than any of us thought, but it was also a really good learning experience, I know a lot more about how JavaScript works and about how Cocoa works as a result, and I definitely enjoyed that aspect of it.

Louis: Are you still working with Cappuccino in your day-to-day work or on any of your projects you’re working on at the moment?

Ross: I keep active on the Cappuccino mailing list and with some of our bug and pool requests, but I haven’t really had a lot of time in the last year or so to do Cappuccino development myself. At Stripe I’ve been working on a lot of different things, including a lot of backend code, but we also re-wrote our front-end recently, and we chose to go with CoffeeScript and Backbone, and then a custom framework that we built on top of that.

Louis: Right.

Ross: So, I’m not actually developing Cappuccino stuff at Stripe.

Louis: Right. I was actually going to ask you how you felt that Cappuccino played against or sat in relation to something like Backbone, because it seems like they’re both sort of in a way trying to solve a similar problem, although I guess Cappuccino has a lot of UI components that Backbone doesn’t really concern itself with.

Ross: Right.

Louis: But the idea of dealing with sort of more complex apps that run in the browser.

Ross: In some ways they’re trying to tackle a similar goal, in some ways they’re actually kind of complimentary. Backbone doesn’t really make any attempt to do anything on when it comes to the view layer, there’s, you know, a few handy little functions in there to help define events, but there’s not really a whole lot going on there. And the real strength of Backbone, I guess, is just making it easy to tie models and collections together with like a restful backend, and with as little code as possible; I see that as probably Backbone’s strongest point. And Cappuccino actually as it stands now doesn’t really try to do much about that, it tries to be pretty backend agnostic, our goal was really, you know, we want to write this front-end, front-end focused thing, and then however you want to get data back and forth will be up to you. On the other side of the spectrum, Backbone is a really tiny — I think it’s 10k of JavaScript, or something, framework, and Cappuccino without images I think approaches some 300k or possibly more. So there’s definitely a size difference there, Cappuccino has a lot of functionality built into it, a lot of different view components, a lot of image resources, because as you said, you know, we have sort of our own full style that you can use.

Louis: Right. And does Cappuccino work in a way that’s similar to say jQuery UI where you’ve got this set of interface components but they can be switched out with whatever other custom set you might come up with?

Ross: In some ways it does, yes, so, but in other ways it’s actually pretty different. So, one of the things that jQuery UI is focused on, and Backbone and really all the other frameworks are doing that kind of thing, is that they still want to be using HTML and CSS to define sort of the individual style of things and the organization of their elements. Cappuccino takes I guess some might call it a radical approach of not using CSS or HTML at all, so you’re never writing CSS or HTML code when you interact with Cappuccino, everything’s a JavaScript object; in Cappuccino it’s called a CP View, which obviously sort of maps to the NS View hierarchy. And so, you know, in some ways I actually think Cappuccino makes it much easier to share components with other people, because one of the problems with traditional web apps and with sharing your view components is that everything in CSS and HTML is really tied together, the structure of your CSS can be broken really easily if you change the layout of your HTML; you have to have a lot of knowledge about how the HTML is ordered and nested and how the CSS applies to that, and you have to carry a lot of these sort of dependencies across with you, across different places. And Cappuccino doesn’t really have that problem because everything is written in code.

Louis: Right.

Ross: And Cappuccino does lose some flexibility there because you lose the expressiveness of CSS to declare like static visual style, which can be nice, but Cappuccino does have a theme system that we added that lets you do — that adds some of those features back in so you can use standard view components but modify the way they look with our theme system.

Louis: Right, yeah. You mentioned that in your work at Stripe you’ve also been doing some backend stuff, what sort of server side code are you working with at Stripe?

Ross: Most of code is written in Ruby, usually on top of Sinatra, though not always. And I’ve been doing a lot of work on our API and designing sort of the structure of the API and the actually interface that we expose to the users, not so much the implementation of specific functionality, I’ve done some of that, but a lot more of that was there before I started.

Louis: Right.

Ross: The most recent thing that I’ve been working on is we just released this week a new Webhook feature which works pretty similarly to GitHub’s post-receive hooks, if you’re familiar with that. So you can just signup and arbitrary number of URLs in your Stripe account, and we’ll send events to those URLs anytime something interesting happens, so you can, without having to pull us, track the history of changes across all your Stripe objects.

Louis: Can you give an example of what kind of thing that would be used for or how that plays into a regular use case?

Ross: Sure, so one of the things that people use it for most commonly is we have a recurring billing system, and a lot of people will want to add usage charges at the end of the month, so you charge your user for some month, let’s say you’re charging cell phone minutes, and then they use all of their cell phone minutes plus another 60 minutes, so you want to add an additional charge based on that extra 60 minutes, so we will send you a web hook telling you that their billing period is over, we’ve created an invoice for them, and all the details about that invoice and sort of the dates that it’s affected for, and we give you an opportunity to send a message back to us saying, okay great, add this amount of money to the invoice before you try and pay it.

Louis: Right. Yeah, that sounds really good. And so in your work with Ruby you said you’re working a lot with Sinatra, and I guess because you don’t have to deal with as much of a full ViewStack as a traditional web app because you’re working more with an API, or since your main product is an API, as you were saying earlier, it made sense to go with something light like Sinatra instead of a fuller framework like Rails?

Ross: Yeah, I mean I think that’s an accurate description. Rails definitely has some nice features I think even if you’re writing an API, but for us, both in terms of what we’re working on and our own needs, it just wasn’t the direction we wanted to head in. So we used Sinatra for our API, and we also use it for our website, our management website, and we actually use our API for that management website, so, as I said, it was written in Backbone, Backbone is actually just calling out to our regular API, the same API that our customers use. So, most of the features that we expose on the website we expose in a way that would let users build their own competing dashboards if they wanted to, and that’s actually been really helpful for us in understanding the right features to build in the API, and also where the biggest performance problems are.

Louis: Right. I actually thinks that’s a really interesting approach, and it’s something that I haven’t heard of anyone doing before. I guess most people’s approach to building a Web app that includes an API is to build the app with some views and then do the API that renders out XML or JSON, or what have you, but I guess if you’re building an app or a dashboard that is entirely sort of like one of these one page JavaScript apps, then simply consuming your own API is first of all a great way of ensuring that the design or your API is sensible and that’s it’s easy for other developers to use, and as you said, to pinpoint any problems that might exist in it.

Ross: Yeah, that was our goal, the first verson of the site was not written that way, it was a much more traditional website, and when we did this rewrite as a single page app one of the things we thought we could really win out of doing that, on top of just sort of the standard, you know, make it more responsive, make it faster loading, etcetera, was this ability to communicate directly with the API and use the same JSON data exchange to really make sure that our users would have a good experience using the API.

Louis: Yeah, that’s really good, I’ll definitely keep that in mind the next time I’m working on something like this. So, in the kind of situation where you’ve got your entire front-end is built on Backbone and you’re consuming an API, does that mean you’ve sort of abandoned the non-JavaScript support for your dashboard?

Ross: We have, yeah. I think you could build the site in such a way without changing much from what we have now that it would work without JavaScript. All of our stuff is written in the front-end with Eco, which is the CoffeeScript templating language, and we could run that in Node on the backend and generate first page and send you that HTML if we wanted to. We decided that based on our users, based on the functionality we wanted to offer it really wasn’t going to be that big of a deal to require JavaScript, in terms of SEO it’s not a problem because the site is behind a login wall, so for us we decided it wasn’t really worth the development time, but I think you could build a similar system and have it still render if JavaScript is disabled.

Louis: Right. So how do you feel about that in the broader Web, I know you were mentioning specifically relating to your users and the type of service you’re creating, but do you feel the trend is moving towards whereas a few years ago most people who were web developers who were blogging about this would’ve said you have to make a site that works with JavaScript disabled, it’s an accessibility concern, it’s all these things; do you think that that has changed significantly or is changing? Do you think that there will be a time when every website will assume JavaScript all the time?

Ross: Uh, that’s a good question. Right now I would say it’s definitely not — the thing is it depends a lot on what you’re building, if your site is primarily content and it’s primarily about getting people to link to you and have Google pick up your content, you know you really do need to run without JavaScript. To some extent the browser, the search engine’s going to get better at that, right, and so if Google was able to really accurately pull pages that had JavaScript required apart and get the right content, maybe that’ll even become a non-issue; I’m not really sure if that’s a problem they’re working on. But, in terms of other concerns like accessibility, you know the screen reader software and really all the browsers have gotten so much better at that kind of problem, all the mobile browsers that are coming out these days support JavaScript really well, so I think it’s less of a technical concern, it’s less of a concern from a usability standpoint. Some people may choose to run with JavaScript disabled, and for some, for a lot of websites it probably still makes sense to offer them some experience, but I do think right now the real motivator between working without JavaScript is search engines and sort of the ability to index content.

Louis: Right. It’s probably also fair to say that you’re reaching a point when if you had JavaScript disabled on your browser a lot of the Internet would be frustrating to you.

Ross: Oh, yeah. I’m pretty sure Facebook doesn’t really work that well without JavaScript, I’m not sure how well new Twitter fares. But, yeah, I mean it’s definitely the case that a lot of major sites would not work very well without JavaScript.

Louis: And so you mentioned in there accessibility and screen reader software getting better, is that something you guys have played around with and tested a bit?

Ross: It’s not really something we’ve played around with at Stripe, though it was something I paid attention to when I was working full time at Cappuccino; as you can imagine because Cappuccino is not even using HTML, it’s doing everything in JavaScript, it gets particularly difficult to interact with screen readers, they have a pretty difficult time because of some of the tricks that we’re doing. And one of our goals was to make that as good as possible, unfortunately back then when I was working on this about two years ago, the accessibility spec ARIA was just sort of getting started to be implemented in browsers, and so it wasn’t a ton that we were able to make happen. But I’ve talked to some people recently, and my understanding is that they’re working on some newer features in ARIA, or in the next version of an accessibility spec that could be really interesting for frameworks likes Cappuccino that want a lot of control.

Louis: Right. Yeah, I did have a look at ARIA when I was working with SitePoint on the HTML5 and CSS3 book, and it seemed like it was definitely a really good step in that direction, of course it remains to be seen how quickly browsers and screen readers are able to adopt that.

Ross: Yeah, I’m not sure what the state of adoption is, but I definitely know that it’s getting better than it was two years ago.

Louis: Yeah, and I think with all of the browsers moving as quickly as they are now it’s something that’ll really be moving along a lot faster than those of us who’ve been working in the Web for any length of time are accustomed to.

Ross: Yeah, actually I’m really excited about the pace that things are moving in the Web, you know IE6 is pretty much a non-factor for most people these days, even IE7 seems to be pretty low traffic on most sites, probably unless you’re doing something like explicitly corporate Internet or targeting specific countries it won’t be very long before IE7 isn’t a major concern for most people. And you know IE10 I think is the next one coming out, and it’s supposed to have really good JavaScript performance, and they’ve got Canvass support now, and so I think we’re moving a lot faster in the Web world than we had been for a really long time.

Louis: Yeah, finally. Yeah, I mean that’s been sort of the opinion of everyone I’ve spoken to on the podcast over the past year is just that level of excitement about not only the movement in the browser space, but also in the specifications and in the kind of playfulness in general experimentation that’s going on in the Web.

Ross: Yeah, and at the same time I think we may be headed for some rocky times ahead because there’s a lot of fragmentation I think going on, not necessarily in a bad way, but like you said, playfulness, there’s a lot of experimentation with things that Google’s putting into Chrome and stuff that Firefox is putting into Mozilla, and those don’t always match up. And I think that there’s been more sort of negative opinion of standards bodies, which I can’t really blame people for because they are part of the reason why things move so slowly, though I guess there’s pretty good reasons for why they move so slowly. But, yeah, I don’t want to — I worry a little bit that we’ll end up in a world where the Web will go back to a sort of ‘works best in this browser’ mode, and I definitely don’t want to see that happen.

Louis: Yeah.

Ross: But there’s a lot of pressure obviously from native apps on mobile platforms like iPhone and Android, so, it’ll be an interesting next few years.

Louis: Yeah, definitely. Although it feels to me like there’s some movement towards that kind of thing on the more experimental edge, you know people will make a demo of something that only works in Firefox, only works in WebKit, because they’re using some new feature that’s just been added. But it doesn’t seem like it has the potential to spread out into the broader Web in the same way you saw those kinds of built for Netscape Navigator 4 banners on actual clients’ sites, right?

Ross: Yeah. Yeah, hopefully not. You know the biggest potential things I worry about are sort of the future of JavaScript, you know Google’s working on their Dart effort, the next version of ECMA is sort of making its way through committee and there’s still a fair amount of disagreement about what features to put in, yeah, (laughter). But, you know, yeah, I’m pretty optimistic, it seems like — I’m sure everyone remembers the past, it wasn’t really all that long ago, so I don’t think people will be rushing into the same mistakes.

Louis: Yeah, definitely. Speaking of the speed of browser releases, as we record this the latest release of Firefox came out yesterday; have you had a chance to look at the new developer features in it?

Ross: I actually have not looked at it at all.

Louis: Alright.

Ross: Truthfully I haven’t.

Louis: I only ask because it happened to come out yesterday and I happened to have you on the line, and it’s a big leap because previously there were no built-in, or very few built-in developer tools, and it was sort of relying on Firebug to provide that.

Ross: Yeah, I know they’ve been away from the Firebug model I think for a lot of reasons, one is that all these other — or a lot of other browsers are coming with built-in tools that are really good, and I think Firebug was also having trouble sort of getting resources to keep working on it.

Louis: Yeah, and keeping up with the faster release schedule.

Ross: Right. Truthfully, though, I haven’t been a big Firebug user since Chrome came out, and in particular I think the developer tools in Chrome are really great, I’m really impressed with how far they’ve come in the last few years. I can remember a time when there was no other option but alert to bugging, and now I think Chrome is really a better debugging experience than Ruby, and then really most of the things I’m doing on the server side.

Louis: Hmm, yeah, that’s a valid point, working on the server side you often wind up with almost the equivalent of alert debugging in the sense of just dumping something out and refreshing a page. Whereas working in JavaScript you really do have the power of the console, and that’s one of the things I find interesting about the new Firefox tools is with the addition of syntax highlighting and coding in the new scratchpad thing, it looks like it really has the potential, and they’re taking it in a different direction, not really just copying Firebug or copying the Web Inspector. Obviously it’s only been out 12 hours, and I was sleeping for most of those, so I haven’t actually played with it very much, but it does look promising, so.

Ross: Yeah, I’m actually definitely interested in looking at it because definitely more competition in the tool space is what’s helped us to get as far as we’ve come now, so it definitely will be exciting to see that pick up.

Louis: Yeah, absolutely.

Ross: I’ve always actually been really surprised by how little people know about the tools that are available in the Chrome debugger and the general Web Inspector; people have been using Firebug for so long I think they may not have been looking at how much stuff has happened in Chrome and Safari, and they’ve got a keep analyzer, they’ve got all kinds of tools to tell you about memory problems that you’re having, to tell you about performance problems, it’s sort of like a YSlow equivalent that’s sort of built-in, and you know you’ve got the CPU profiler, there’s really just actually a lot of great stuff in there.

Louis: Yeah, I remember again back working on the HTML5 book for SitePoint that I was using Chrome a lot because at that point Firebug didn’t have any way of looking at local storage, or is it the — does it have Web DB access in the Web Inspector, I think it does.

Ross: I think they do, yeah, and you can inspect definitely all of local storage and session storage if that’s still in there, and cookies; you can also set like breakpoints on events now, like on DOM events, so you can say like break on events of this type, or break on like HXR’s to this URL, it’s really flexible.

Louis: Hmm, yeah, it’s fantastic. And although I haven’t been working — I’ve been working exclusively on the server side for some time, I’ve been sort of looking enviously over into the JavaScript camp watching things like Backbone come onto the scene, and as the debugging tools become so much better, and then sort of getting a little bit itchy to maybe get back on the front-end at some point.

Ross: Yeah, you should.

Louis: Well, it’s been a pleasure having you on the show, Ross.

Ross: Yeah, it’s definitely been great to talk to you.

Louis: And so if listeners want to find you online what are the main points of contact?

Ross: You can find me on Twitter at my last name, so that’s @boucher, if you can’t spell it it’s b-o-u-c-h-e-r.

Louis: (Laughs)

Ross: I don’t know if you want to put that in at all. I have a website, rossboucher.com, I don’t really put very much up there but I’m working on rebuilding that, so hopefully some day I’ll do that. So, yeah, I guess Twitter is the main way, my email address, and any multiple ways of getting in touch with me are on my website.

Louis: Alright, well, thanks very much, again, we look forward to seeing what comes out of Stripe, and I’m very excited about having other alternatives for payment online because it’s as I mentioned something that we’ve definitely struggled with, so yeah, best of luck going forward with that, and I look forward to seeing what comes out of it.

Ross: Thanks.

Louis: Cheers.

Ross: Cheers.

Louis: And thanks for listening to this week’s episode of the SitePoint Podcast. I’d love to hear what you thought about today’s show, so if you have any thoughts or suggestions just go to Sitepoint.com/podcast and you can leave a comment on today’s episode, you can also get any of our previous episodes to download or subscribe to get the show automatically. You can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. The show this week was produced by Karn Broad and I’m Louis Simoneau, thanks for listening and bye for now.

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.

Episode 148 of The SitePoint Podcast is now available! This week the panel is made up of Louis Simoneau (@rssaddict), Kevin Dees (@kevindees), Stephan Segraves (@ssegraves) and Patrick O’Keefe (@ifroggy).

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #148: All Aboard the Facebook Train (MP3, 50:21, 48.4MB)

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 main topics covered in this episode:

• Curebit Apologizes for Copying 37Signals: “Stupid, Lazy, and Disrespectful” | TechCrunch
• The Trouble With “Free”
• Riding Rails: Rails 3.2.0: Faster dev mode and routing, explain queries, tagged logger, store
• Facebook is Killing Local Social Networks around the World

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/148.

Host Spotlights

• Patrick: WP Late Night – The Podcast for WordPress Users.
• Stephan: Convert Bookmarklet to Chrome Extension
• Louis: Making Love to WebKit — Acko.net
• Kevin: List.js – Examples of how to use the script

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint Podcast. We’ve got a full panel today for the show, Patrick, Stephan and Kevin are all on the line with me, except for one slight difference, we only have two actual phone calls going on because Kevin and Patrick are cuddling (laughter).

Patrick: That’s right, getting up close and personal here in Apartment of Kevin Dees.

Kevin: I wouldn’t call it cuddling; if I need to grab a pillow and put it here between us, I can do that.

Patrick: We’re not really touching, we’re just sitting on a couch podcasting, don’t read anything into that (laughter and train sound).

Kevin: And, hey, there goes the train (laughter).

Patrick: I’m actually here in person to experience the old 7:15 from Albuquerque.

Kevin: That’s right. Is it the 7:15, everyday at 7:15?

Patrick: I don’t know, but there it is. Oh, boy.

Louis: Awesome (laughter and train sound). That sounds even louder than usual.

Stephan: That’s really loud.

Louis: Alright.

Kevin: Welcome to Orlando.

Patrick: Kevin is in downtown Orlando.

Louis: Alright, cool. There have been as usual some developments in the Web world of late; who wants to go first with a story?

Kevin: Alright, so I have a very controversial story involving 37signals who happens to be also redesigning their main product, Basecamp, which we can’t actually get into today, but today’s subject is the copying of 37signals Highrise application. So a company called Curebit, I guess this is how you would pronounce it, it’s C-u-r-e-bit if you go to their website, I found this article on TechCrunch and basically this company has gone in, and in some cases a designer will go in and find inspiration from a design or they’ll look at some code and take a snippet away, well, this company went in and took everything, images, everything, CSS style sheets, HTML, and 37signals found out about this because they even left like the long destination links inside of what they copied, so 37signals was having files downloaded from like this Curebit’s website. So, basically 37signals comes out and calls them out on it and now it’s on TechCrunch, and so I thought this would be an interesting story to examine, not only from what’s going on here with 37signals, but also to get maybe your opinion on how you feel about inspiration versus copying when it comes to web assets, web designs, and also programming languages, and maybe even content for that matter, like how much can you copy from somebody else, if, sighting, that kind of thing. I’m sure it’s been covered before, but I think it’s always good to circle back around to these kinds of things when something like this happens in the news.

Louis: Yeah, absolutely. I mean design is one of those things that’s tricky, and if it had just been sort of it kind of looks the same, it would have been a lot harder to demonize them as clearly because there’s a lot of that on the Internet, right, anything you look at will draw some inspiration from either Facebook comments or overall look and feel of some of the 37signals stuff; obviously Apple’s design has had a huge influence on the way a lot of web pages look; people were doing those sort of Apple-like reflections and shadows on all their sites for a long time, and I don’t think anyone got all too upset about that, I think that’s a pretty normal process for design, people follow trends, right. And 37signals especially, right, they had a big impact on the way a lot of people did this kind of web application because first of all Ruby on Rails came out of 37signals, so a lot of Rails designers, or Rails developers, sort of looked to 37signals for design cues, and they also made some really, really nice, simple, easy-to-use applications. And that’s another thing to remember here is that 37signals from a design standpoint there’s not a lot of flash there, right, there’s not a lot of colors or textures; it’s not super obvious that you’d be copying it because a lot of times it’s just sort of text on a page laid out in a certain way, right.

Kevin: Right. Exactly.

Louis: So that’s one thing. So design is one thing, and I think that’s probably I wouldn’t have even noticed this story if it had just been design. Copying bits of HTML and CSS, now there’s another thing, right, so I don’t know about you guys, but people who have been on the Web for a long time it happens pretty frequently that I think especially in the early days of CSS and JavaScript where you’d see a cool page with a cool effect and be like oh how did they do that, you know, you flip open the view source, you look at the CSS and you might take a little snippet and use the same effect on your own site, right, I don’t think that’s weird. Obviously when you make a web page all the code is out there in public sort of by definition, and that’s the nature of the Web and I think it’s one of the things that makes it really easy for new designers to get into the game is to be able to look at how things are done behind the scenes, right. Obviously when you get into hotlinking images or wholesale copy pasting of huge chunks of CSS which includes like, you know, logos that people have made and little icons that people have made, and those are actually hotlinked because you haven’t even bothered to create your own images and go through the CSS, you’re not doing work, you’re just stealing. So in this case it’s cut and dried, but I think in this you really have to go this far for me to get upset about it personally.

Stephan: Was the point of them copying it to make money? I mean are they trying to create the app to compete with 37signals, or what were they doing? because I’m reading the article and it doesn’t actually say

Louis: Well, at the top of the article it says that Curebit just got a 1.2 million dollar round of funding, so they’re clearly a commercial enterprise. As to what their product actually is — a social referral platform, “Get your customers to refer their friends.”

Stephan: So basically they stole the design to use for something else.

Louis: Yeah.

Stephan: Yeah, okay.

Patrick: Moreorless. I mean they copied, pasted code, they made some adjustments, they changed a logo, but of course the damning stuff is the stuff that’s easily attributable like images that are left in the code that are hotlinked to the 37signals servers.

Kevin: Correct, yeah.

Stephan: Yeah.

Kevin: Wow.

Louis: Right. If there ever was a smoking gun (laughter).

Patrick: It’s like their domain name is still in the code (laughter). Not even a ‘replace all’ was achieved here.

Kevin: Do you feel like this might have been a publicity stunt, Patrick, like maybe they were trying to get some bad press? In a circumstance like this where it’s like you’re a company and you make a product, you’re not dumb, you’re not stupid, you know what I mean, you know what you’re doing is wrong if you do this. Could this perhaps been seen as a way to — 37signals is no small company, so in a way if you tick them off they’re gonna talk about it, other people are gonna talk about it, and you’re going to get — like I never even heard of Curebit before until this happened.

Patrick: You know that’s a good point, I had never heard of them either, and, you know, the way Louis’ talking I don’t think he had heard of them either, so he doesn’t know what they do, and I still don’t know. You know, yet I could see that, I mean people do that; now me personally I would never do that, I think that’s a very stupid strategy, I think that getting known and being known favorably or known infamously are two very different things, and obviously Curebit has a bit of a negative that they have to come back from to have a successful business, because they’re a young company, and things like this can kill young companies I think, a lot of bad publicity. So, not to say that they’re done with, not to say they’re over with, that’s fine, but you know that they did this just speaks poorly of them and speaks poorly of the people who made the decision to do it. And you know you say that you know it’s wrong, I mean the tough thing is that a lot of people probably don’t think this is wrong; hotlinking is something I’ve disliked for a long, long, long, long time, and it’s something that I work to prevent on my communities in the spaces I manage, but a lot of people don’t understand that. I mean the reality is that most people who don’t understand it tend to be non-techie people. The scary thing here is that it was in the code for a service that is run by techie people, and I’m sure it was left in accidentally, but that they didn’t take care of those details, uh, speaks to their, I don’t know, lack of techie-ness, their lack of attention to detail that they didn’t clean it up enough to remove those traces. But I think they’ve certainly paid a penalty, I’m not above accepting an apology and moving on, obviously they responded to it poorly at first and didn’t take it seriously enough, but to fix it, to come out and apologize, I think they can come back from that, but it doesn’t change the fact that they have some work to do to salvage their reputation in this kind of techie space.

Kevin: Yeah, I don’t know what I think about it personally, I mean I feel like it’s a little bit of publicity stunt just because anybody in our space knows that you just don’t copy code, I mean you just don’t copy things.

Patrick: You speak very well of our space.

Louis: Yeah, I don’t know if that’s as true as you think it is because this stuff seems to just happen non-stop, I mean we’ll all remember this was several years ago now, but there was a famous instance of hotlinking images and pranking when I think the John McCain website had hotlinked images that were on servers controlled by Mike Davidson, do you guys remember this story?

Stephan: Yeah, and then he replaced the hotlinked image.

Patrick: I don’t remember it.

Louis: Yeah, so obviously the thing is if someone else is serving images from your servers if you just put any other image there with the same filename and have your servers updated so that your code is using a different filename, you can put any image on their website, right. And in this particular instance a few years ago the images used were distasteful to say the least, and that drew a lot of attention to the idea that, ooh, you know, not only is hotlinking unethical but it’s also really dangerous, right.

Patrick: Right.

Louis: Because it gives someone else the ability to arbitrarily display whatever images they want on your website, and personally if I had been in David Heinemeier Hansson’s shoes at 37signals and then discovered this hotlink, my first thought would not have been, oh, I’m gonna call these guys out on Twitter, my first thought is, hmm, what can I show on their website.

Patrick: Right, right.

Stephan: I think I’m a little overly sensitive to this, and Patrick will understand why. I recently had an image taken from me, my own intellectual property being used as someone else’s on another website, a fairly large website that makes a decent amount of money and is a big deal here in the state of Texas. And when I called them out on Twitter and then email, the response I received was we don’t really care, it’s not a bad thing to steal; they didn’t even use the word ‘steal’, to ‘borrow your image and use it on our website’. So, I don’t know, I think we’ve just gotten complacent, or other people have gotten complacent, and people are so passive about it now that it’s so easy to Google something and do a search and then save that image and then put it on your own website that people are becoming used to it where it’s no longer a big thing for people to steal. I mean I just don’t understand that I guess, how people can say I’ve done this work — like I don’t understand how people can say I’ve done this work and they put it out there and then someone else takes it and they’re like, oh, that looks cool, we’re just gonna use that ‘cause that’s useful to us, like how lazy are you?

Patrick: Right. And you know in your case, so it was a publication that is pretty good size publication, gets good traffic, has paid staff, you know, this is a real operation, this isn’t some random kid in high school or some once off blog, this is a serious publication. And they just randomly took a photo from the Web that was related to their story and put it in the story, and it’s more common than you’d think I guess, and Paul Carr over at PandoDaily made an interesting point about this particular story. Basically he said that copyright theft is bad when it happens to people that we like, especially in the tech space; in this case you had 37signals and Mr. Hansson going at Curebit, and in a case that — I’m with him, I don’t fault him at all, I’m totally with him on this, and I’m not totally with anyone who is saying it’s inappropriate for Curebit to do this. But the point that Carr makes is that the tech space, obviously it’s a diversified space, lots of people, the space doesn’t feel one particular way, there’s a lot of people in it, but a lot of folks in this space don’t necessarily care all that much about copyright or intellectual property unless it happens to them or it happens to someone that they like. So you have things in Hollywood and what happens to content and things produced by Hollywood, for example, or for any number of industries that maybe they wouldn’t care about, a lot of people in this space wouldn’t care about, but when it’s 37signals and it’s a beloved company that’s in this space we all care about, then it’s a big deal and it’s off with their head and they shouldn’t be forgiven, and on and on. So, I think with some people there’s a double standard in this area with the tech scene where if copyright is enforced in some areas it limits innovation, but if it’s the tech space and a company we like then, oh my gosh, we need to go after those people.

Louis: Yeah, I mean without wanting to get into too much of a debate, because I know from experience reading Patrick’s thoughts on Twitter and Facebook and Google+ that we don’t exactly have the same viewpoint on this. I feel that it’s probably not just the issue of it being the tech community and people we like, I think there’s definitely an issue of — and like Stephan was saying when his image was used, this is a serious publication, right, this is a business, and if you’re a business you can make your own stuff and sell your stuff, and I think there’s a difference or a line to draw, I think Stephan, I mean correct me if I’m wrong, but if the same image had been used on some kid’s blog that wasn’t trying to make any money and was just trying to make a goofy point or if there had been some stupid caption on it, or whatever, you might have been a little bit less incensed, right?

Stephan: More than likely, yeah. I think had it been someone, you know, I may have sent them an email saying, hey, you know you’re using my image, you mind at least linking to me or something. If it wasn’t a business, if it wasn’t someone who was making money on, and had ads and things on their page where my picture was being posted, then yeah I don’t think I would have had as big of a problem with it, but it still would have been a problem.

Louis: Yeah. Anyway, so that’s kind of where I fall in this case, because they’re a business and because they’re clearly you know they have developers in-house, I mean it’s not outside of the realm of their abilities to just do the work and get the stuff done, and to be so lazy and disrespectful obviously is just stupid. Unless as Kevin said it’s a publicity stunt, in which case it’s despicable.

Kevin: (Laughs) it’s true though, is it not true?

Louis: It’s either lazy and stupid or unbelievably evil (laughter).

Kevin: It’s like going and shooting somebody in the kneecap just to get on the news, right.

Stephan: Yeah, that’s –

Kevin: Maybe not.

Louis: I guess it’s exactly like that.

Patrick: Yeah, I mean just to frame I guess what I was trying to say was actually Jonathan Bailey at Plagiarism Today made an interesting point where he said, “For the first time in history almost everyone is both a massive consumer and a massive producer of copyrighted work, so everyone now lives on both sides of the imaginary fence. We’ve seen both the power of file sharing and the frustration of having our posts scraped by some Russian spammer,” so all of us are kind of copyright craters and also consumers, so when we talk about the issue it really affects all of us in both ways, not just as consumers but also as programmers or creators of content ourselves, so it’s interesting to frame the discussion in that way and always understand that.

Kevin: Yep.

Louis: Indeed.

Kevin: I think we’ve beat this one down.

Patrick: And I’ll be copying Louis’ articles and posting them on my blog, I’m sure he won’t give a damn.

Louis: We can keep beating this horse.

Kevin: Yes, we can (laughter). Should we drown it next?

Louis: (Laughs)

Patrick: Nay (horse sound)

Louis: Awesome. Cool. Let’s do it. I actually have a story that’s somewhat related, albeit indirectly. This happened about 10 days ago as we record, so it’ll be about two weeks when this is published, but on the Ruby on Rails blog, Rails 3.2.0 was released, and obviously the relationship there is that the lead Dev on Rails is David Heinemeier Hansson who was involved in this controversy with Curebit. So, anyone who’s into Rails have a look, there’s some cool stuff in 3.2, and one of the most notable things is they’ve done some big performance improvements in developer mode, so when you’re working on your own site in development which used to be a little slow because it had to try and reload all of your files, it wasn’t caching anything, now it’s being a bit cleverer about caching, and the routing is also much, much faster. So if you have a lot of links on one page, whereas before trying to figure out where all those links should point to would be something the Rails engine would struggle with a little bit, that’s been made a lot faster. And there’s a lot of other cool things as well, so check out the blog post and hop onto Rails 3.2 if you’ve got a project in development.

Stephan: Are you a Rails developer, Louis?

Louis: I am sort of, yeah, so at Flippa we’re in the process of sort of migrating our application from a sort of custom PHP framework over to Rails, so about half the work I do on a day-to-day basis is Rails; for every new feature we’ll develop in Rails, and the old stuff gradually moving across.

Stephan: Oh, cool. Okay, because I haven’t jumped into it yet, so I’ve seen it and I know a lot of people use it, I just — I never have.

Louis: Hmm, well, it’s definitely — I mean for us at Flippa it’s been fantastic, I was very skeptical when the other developers on the team suggested that they were going to start moving, you know it’s a mature application, hundreds of thousands of lines of code, and thinking of migrating that entire thing sounds just incredibly daunting. But now seeing like the ones we’ve ported over a given feature, subsequent maintenance updates to that feature a lot faster because it’s just a lot easier to work with and we wind up with a lot less code. We port a feature that was a two thousand line file in PHP and we wind up with three or four hundred lines of Rails because so much of the stuff is handled behind the scenes.

Stephan: Oh, cool.

Louis: I’ve been a big fan and, yeah, looking forward I don’t think we’re on 3.2 in development yet, but definitely have a look. And that means that as of now the master branch of Rails on GitHub is targeting Rails 4.0 which will require the latest versions of Ruby, so all of the development is now going to be focused on the 4.0 branch, and definitely look forward to seeing what’s coming in that.

Stephan: Cool.

Kevin: Yeah, I think your story is actually really interesting, Louis, just because I’m starting to see that this, and it’s been going on for a long time now, especially with things like WordPress’ content management systems, where you see less and less companies actually developing or using their own proprietary system, you know, using that to sell to clients or to develop their own in-house application. And I think this is a good move because it puts you in not only an open source environment where you contribute and gain from that open community, but you can also have those updates coming in, and so you don’t have to worry about developing that next feature that’s going to be more compatible with not only legacy systems but future systems as well, right, because you want to be able to update your software on your server and your server’s hardware, so whether using Ruby on Rails as a framework or you’re using WordPress or you’re using CakePHP, whatever system that is I think it’s really helpful.

Louis: Yeah, definitely, and it’s good to be able to — I mean you know we’ve experienced this a lot, I mean it’s true working with just about anything because PHP is open source and most of the libraries in PHP are done open source, but in terms of something like Rails or like Cake where you’ve really just got a full stack framework that’s really focused on helping you make web applications it does make it easier to get out there, and if you run into a problem you get on the message boards or on the community and either someone else will have encountered a similar issue and come up with a workaround, or just from the fact of talking about it someone will be like oh that’s interesting, I wasn’t aware that that — and you know a couple people get to looking into it, and then you do another test case, and then eventually you wind up with a fix and you’ve given something back.

Kevin: I agree, I mean when you look at something like an open source piece of software or a framework, as in the case of Ruby on Rails, you can run into a situation where you might be concerned about security, right, because the code’s out there for anybody to use, anybody can exploit it when something’s discovered, and I think that is a false assumption in open source because those things are normally patched really quickly when you have a popular framework like Ruby on Rails, right, or WordPress. So, while those concerns are there, it affecting you in a major way is I think minor, number one because the best security plan is simply to back things up and make sure that you have redundancies in different places, because it’s not a matter of if you get hacked but when you get hacked, right.

Louis: Yeah, quite possibly. Yeah, I think that’s definitely a concern. I mean when you’re talking about security it’s really interesting because we did have one, it wasn’t even a real security issue, but one thing that happened to us when we upgraded to the latest version of WordPress for our blog we came up against this weird issue where we’re doing — I have a WordPress plugin that I wrote for Flippa where if you’re logged into the Flippa web application you’ll automatically be logged into the blog when you go over to the blog, right, so that does an OAuth request, finds your user and then creates a new WordPress user if there isn’t already one with that name. And when we upgraded to the latest one at some point I don’t remember, someone was doing something, and then they found out they were logged in as this old admin account that hadn’t been used in forever, and there was no explanation to why this happened, and it turned out there was something deep in the new version of WordPress where when you tried to get a user from the database and it returned an error object, that error object would be passed down the chain as if it was the user’s ID, and because of some weird typecasting in PHP it treats that — it was trying to cast it to an integer, and any object casted to an integer was coming out as a one, so it was getting the user with the ID of one.

Kevin: Interesting.

Louis: And it took about — one of our developers who was active on the WordPress core team way back in the day posted this to the message board like hey this is weird, we found that if for some reason the database goes away for a split second and you get an error trying to load the user it’s possible you might wind up with the first user by accident, and that was patched and rolled into WordPress within I think 24 hours. So, like you said, when you’ve got this thing that everyone starts using and is playing around with, and this was a really weird edge case where we were doing something unconventional, it required a failure in the database, and it only happened intermittently, so a really hard thing to find, and yet still it got fixed with 24 hours on WordPress.

Kevin: Right, exactly. I think that is probably one of the biggest like fights or arguments that people have against systems like that, and at the end of the day security is important but, you know, like you said, these things get patched quickly, and I don’t mean to sound kind of like a cliché when I do say it’s not if you get hacked but when you get hacked, but I mean it’s absolutely true, I mean if somebody really had it out for you they could find a flaw whether it’s in WordPress or some other user on your even server level, right.

Louis: And more importantly, whether or not that’s actually true, whether or not it’s true that you will eventually be hacked, it is totally reasonable to behave as if that was true.

Kevin: Right.

Louis: And if you have the kind of preparedness where you know that even if someone tomorrow gained full access to your production database you could still recover your application quickly and be back online in a new secure environment quickly, and then that’s what you need to be ready for and to be able to handle. I don’t know how we got from the new version of Rails to worst-case security scenarios, but it’s good traveling down these roads with you guys.

Patrick: Good discussion.

Louis: Who’s the next story?

Stephan: So I came across a blog post on Slate’s Moneybox by Matthew Yglesias, and about kind of the trap of Google and these recent privacy changes that they’ve rolled out and you’re having to read the email now of what the privacy changes are. And is it really a problem, and is the cost of free now your privacy and your data? And if that’s the cost of free is it worth it? And the argument he makes is, he actually links to another blog post by someone else named Kevin Drum, and Kevin points out that Google’s kind of got us in this space now where you can walk away from their service if you want, you know, unless you have an Android phone or if you’ve been using Gmail for six years or however long it’s been around, or YouTube, and you can go use a new platform, but are you really gonna do that? And so it’s an interesting discussion, and I thought it’s worth talking about here.

Kevin: I think Google has a very quality product, so it’s harder to walk away from something when it works and it’s good and it meets your needs, and, of course, it’s free.

Patrick: Right. And the thing about this, it’s a great point, is if you’re using something for free what is the actual cost, because there is a cost and when it comes down to it how websites make money is going to be one of two ways, you can bring it down to one of two things, either you’re going to give them money or people who want to reach you are going to give them money; it’s one or the other and there’s a lot of subdivisions between those two things.

Louis: Well, there’s this old aphorism, it’s probably not really an old aphorism because it’s only been around for a few years, but if you’re not paying for it you’re the product, right.

Stephan: Yep, yep.

Patrick: That sounds right. Yeah, it’s a good point, it’s a good way to say it, it’s a more attractive way to say it than what I just said. So, there is this sort of thing with Google about do no evil and the privacy settings and how that plays in with one another, kind of the bigger story or one of the stories in this kind of wave of privacy news is that Google’s consolidating it’s privacy policies, because it had like privacy policies for each product or across different platforms, or whatever, and now it’s going to consolidate those into a more simple document that you can access in I guess one simple place. I saw the email, I actually got multiple emails, so it’s probably more then one person did if you have more than one Google account or more than one YouTube account, or whatever it is, I’m sure you got an email. And, yeah, I think Kevin makes a good point about it being a quality product because you can stop using Google, like Google isn’t — Google’s not like it’s a right, it’s not like breathing, there are other services out there, the question is will you. And even then would you pay for Google, I think the answer for most is probably no depending on the service; a lot of people would pay for Gmail based on functionality that was provided, but no one’s going to pay for Google search I would think for the most part, you know, it depends on the service and the offering, and that will determine whether or not anyone would pay for it. And if it’s put that way to you, to the average person, that you could pay and have privacy, it’s not probably an attractive sell because a lot of people feel like they should have privacy by default, but when you go out into the public Web, so to speak, and you use these services, I don’t know how much privacy you’re really entitled to, it’s a tricky question, and I think there are competing services out there that will provide you with the level of privacy you want, but then you come back to the question of quality and if they can actually compete with Google on the question of offering and what they’re actually providing to you.

Kevin: If privacy is that important to you more than likely you’re going to be using an app on your computer, because anything on the Web by its own nature is not that private, I mean you’re on the Web, you’re sending bits across a wire, it’s not like you can sniff those out in a network if they wanted to, you know, whereas if it’s on your computer you’re a little more isolated, you can unplug completely if you need to.

Louis: I also think it’s fair to note that if you really wanted to be private it would be entirely possible if you didn’t have a Google account, for example, and you were just using the search and start viewing videos on YouTube, if you were being careful using your browsers in their anonymous modes and using anonymous proxies, I think you could get yourself pretty close to untraceable without great amounts of technical expertise or difficulty.

Patrick: Yeah, that’s a good point.

Louis: So it’s possible. I mean obviously in this case, like you mentioned, or like Stephan mentioned, a lot of these services are so attractive the integration of Gmail and YouTube and especially if you have an Android phone, you know, it all comes together very nicely and it’s a very slick experience if you have a Google account because everything sort of follows you around. And I do think for me anyway it’s similar, I don’t think their privacy policy, even the new one, is any worse than what Facebook is already doing, and I kind of prefer the Google experience because it’s just sort of there in the background as the infrastructure to my web browsing, whereas Facebook tries to be the entire Web, right, and you know when you click on a link to leave Facebook it’s like ‘are you sure?’ the Web out there is big and dangerous!

Patrick: Don’t talk to strangers.

Louis: (Laughs) don’t talk to companies that aren’t Facebook. I don’t know, obviously it’s a tricky issue. I actually saw a story about the same thing, oh, it’s actually a little post that Tim O’Reilly wrote on Google+ recently sort of talking about his opinion of this whole reaction to Google’s changes in privacy policy, and sort of saying he thinks it’s overblown and that collecting data isn’t really evil, and that there’s a lot of — it would be potentially what they do with the data; if they start doing something unethical with that data down the line that would be evil, but right now all they’re doing is collecting data and making links for their own analytical purposes, which we can’t really decry on principle, especially as you noted using these services voluntarily.

Patrick: I think that’s a fair point. As someone who runs a service that people use voluntarily, and obviously you’re involved in those services, and so we have that perspective. And when it comes to monetizing a website or even — there’s a lot of uses for data, let’s just not say it’s money, right, because that’s part of it, we use that data for AB testing, if we don’t serve ads we use to find out how to get you to buy faster or how to get you to completion faster, but, that data’s also used to improve websites in other ways when it comes to usability and design and functionality, you know we base how we target our sites, what geographic regions we target them to, what times of day we update; all those things are sometimes targeted based upon the analytics we collect when you visit the website to put together research, to make smarter decisions. So it’s not just if you want to think money’s evil, it’s not just the evil pursuits of our organizations that use data, it’s in a well-organized company, it’s all facets of the organization that use that data.

Kevin: It makes for a better web. I would almost argue that we want Google to invade our privacy just a little bit because if it didn’t I mean the Web really wouldn’t — or Google wouldn’t be what it is today, I can’t say that the Web wouldn’t be what it is today, it’s too broad or a sweeping statement, but yeah.

Louis: It’s interesting to see because in some senses it is sort of a gradual erosion, right, because I remember when Google first started running ads, or contextual ads alongside Gmail, right, where the ads that you see on the right side of your Gmail would be contextually related to the content of the emails that were being sent, right. I don’t know if you guys ever heard anything about this, but I remember some people were like, ooh, that’s kind of creepy, I mean Google is, you know, or Google’s computers anyway, are reading the emails and serving ads related to that, but then that just sort of became background and nobody really worries about that so much anymore. And I do kind of wonder if it’s easy to move the goalposts of what is considered normal gradually like this, you know, what is the point at which — is there a point at which people will be like whoa, whoa, whoa, now we’ve actually gone too far, or is it all just sort of gradually become normal.

Kevin: Yeah, I think the thing that concerns me most is like, for example, the email situation that you’re talking about, it’s whether or not these services or in general people associate you with what they’re talking about, right. So, if you send me an ad for something I’m cool with you sending a company information about what it is that’s in my email as long as you don’t tell them it’s me, because people already know that these things are out there, if you understand what I’m saying.

Louis: Yeah, yeah, definitely. Obviously it’s a matter of how they treat that information; because I use Google services voluntarily I understand that Google will be using the data in here to decide what ads to show to me, but then when I click through, for example to that advertiser, what kind of information do they have, and what kind of information is Google providing to these third parties, and how personally identifiable is it, because that’s a place where I think everyone gets a little bit on edge talking about the idea of providing this or making this data available easily to advertisers.

Kevin: I think it’s interesting. And you know Google isn’t the only one facing these issues, I mean this is also companies like Facebook.

Patrick: Everyone. I think everyone who runs a social platform or an online community or anything that has people signup for accounts especially is facing these issues. On the more basic level if you use that data for the things I discussed you could get that from guests, so everyone’s being collected from whether you’re logged in or not. But, Louis, I actually wanted to ask you something; are you still in your Facebook hiatus?

Louis: Uh, sort of. My really strong objection to it, it was actually just a couple of apps, sort of the passive sharing ones that they introduced.

Patrick: Right, yeah, yeah, I know exactly what you’re talking about, like the Washington Post app where you have people saying they’ve read this article, but if you click it then it’s go through these steps, install this, and you can’t get to the article directly.

Louis: Yeah. So there was particularly the Washington Post and The Guardian were the ones that were really annoying.

Patrick: Right.

Louis: So I guess I haven’t really posted updates to Facebook in a long time, I don’t really –

Patrick: No, you haven’t. I was just on your profile and it’s basically all me (laughter).

Louis: Yeah, it’s you tagging me in things, and it’s sometimes I’ll tick the box when I’m checking in on Foursquare to share it on Facebook because I figure some people might just be looking at Facebook and be able to come out for a drink or whatever. But, yeah, I’ll occasionally check in just to see what some people are doing who aren’t on other services because a lot of my friends especially from back home don’t use Twitter or Google+. Yeah, I don’t like it, I’m still — I still feel kind of icky going in there because of the way they sort of put a little bit too much attempt — too big an attempt to control the way I use the Web, and the ability to just share a link really is the fundamental interaction mode that I want out of a social network.

Patrick: Right.

Louis: And right there they’ve sort of broken the ability to share links from some sources because they’re being intercepted by these apps. And basically it’s the basics of social recommendation for me, right; I want to recommend something after I’ve read it.

Kevin: But doesn’t that architecture fall apart on itself, I mean eventually they’ll stop doing this because people are going to react in an adverse way to the way whatever company it is that makes the applications that do this, right. So, it’s kind of a, I would like personally, it’s a situation that fixes itself over time. So Facebook wouldn’t necessarily have to go in and critique how they say people have to make applications, I mean they can, which would make Facebook better.

Louis: You know it’s possible that things will just get better, but from users sort of rebelling against these things, but that doesn’t, like we said, that doesn’t happen a lot; most of the time people just sort of grow accustomed to something and treat it as the new normal.

Kevin: This is true.

Louis: A little bit too easily in my opinion.

Kevin: Yeah, things like IE6 that sit around way too long (laughter).

Patrick: It’s gone now, okay, can we stop! (Laughter)

Louis: It is gone instead.

Patrick: What’s that; let the dead rest?

Stephan: Let sleeping dogs lie.

Patrick: Whatever it is, yeah, whatever it is just leave it.

Kevin: You mean rest in peace, RIP?

Louis: It’s not just sleeping, it’s dead and buried.

Patrick: It’s like don’t dig it up. So, speaking of both Facebook and dominating services, the last story of today is the world map of social networks, this is from Vicenzo Cosenza, who’s an Italian Digital Strategist, and I picked this up through The Next Web in a story by Nancy Messiah, basically Mr. Cosenza tracks social networking use in various countries throughout the world.

Louis: Oh, my God, the train is back (laughs).

Patrick: (Laughs) the train is back! Zuckerberg?

Kevin: No, Zuckerberg just doesn’t want us to talk about this topic.

Patrick: But, yeah, so he tracks 136 countries and 127 of them have Facebook as the most popular social network. And it’s important to put this data in the right light; the data is in care of Alexa and Google transfer websites traffic data for December 2011.

Kevin: You have to speak louder, Patrick.

Patrick: Yes, thank you. So, basically he trends it over time, right, from June 2009, I believe, through December 2011 he has a map of the world that makes it really easy to visualize, it’s based on colors, Facebook is obviously blue and the color blue is in the countries where it’s most dominant, and you can see over time how Facebook has become more popular throughout the world. There are still a few holdouts for Facebook’s dominance, at least at this point, one of which is Latvia, another is Russia, and then there are China which is a holdout and a couple others, but mostly it’s Facebook around the world, the world is pretty blue right now. Of course there are some differences here and there based on the country you’re in, but overall Facebook is the most popular social network globally in most countries where this sort of data is tracked. And I guess this isn’t that deep of a story, it’s a fun map to look at and to consider, you know we talk about Facebook and some of the minor things, or major things in some cases, with Facebook that we don’t like; is this a good thing or a bad thing, does it matter, is Facebook becoming the Google search of social networks where eventually they’ll have 90+% market share of the world, or is this just a trend, is Facebook going to eventually go the way of platforms that came before it?

Kevin: I don’t agree with the democratic world that Facebook is painting on this map, but I think that Facebook kind of has a, like Google, right, it has a lock on — like Google has a lock on the Web as information, right, you can now search almost anything on the Web and have some result for it unless you’ve been blacklisted, or whatever, where Facebook has a connection like it’s built a platform of people in their connections. So you have Google which is the connections between information and documents, and then Facebook which is the connections of people and their lives. And I think that once you have something like a web that big it’s hard to step out of because it’s your personal life, right, it’s your investment. And like I just said, it is your investment; you’ve put a lot of energy into a service like Facebook.

Patrick: Right, there’s a deep data investment, and also the connections that you have built up over time. Louis?

Louis: Yeah, I mean it’s interesting to watch this; you’ve got an animated version of this map where you can see the spread. It’s interesting because there are a couple — most notably for me is Brazil where Orkut was dominant for a long time and it was one of the things, it was one of those places where this social network that sort of didn’t catch on anywhere else was hugely popular in this one area, and I see that in the latest iteration of the map, so just recently December 2011 Brazil went from being pink to being blue all of a sudden. So I see a couple of longstanding holdouts, so namely Brazil and I think Mongolia was one of the last ones to switch as well away from, what is that, hi5 over to Facebook being the dominant one. Yeah, so it’s interesting watching it wipeout, and it’s interesting, it draws for me a parallel of sort of any kind of big multi-national, say, retailer or restaurant chain having a similar effect on local businesses. I know a lot of these social networks might not be local to those markets, I think the Russian one is, so Russia’s still — is still a holdout, and I think China as well, and I think both of those networks are indigenous networks. But, yeah, it does feel kind of a little bit disappointing for me because it feels like you kind of want to root for the underdogs, right, you want those smaller local networks with a strong regional focus to remain active. But at the same time if Facebook can provide all of the same benefits through translation, I know they put a lot of work into internationalizing their interface, but also give the advantage of being able to network with people throughout the rest of the world, then that might be a good thing.

Patrick: I agree with what you said, Louis, and I think it’s important to recognize the difference between say the social network of kind of the Facebook model or the MySpace model, or whatever model you want to put it on, the Friendster model, but it’s important to separate that from other types of online communities and platforms, because Facebook is great at certain things that Facebook does. What Facebook is not so great at is let’s say you want to interact with a group of people that you don’t already know in a specific state or city or region or even country, you know, you want to build up or talk about what’s going on in that country, Facebook isn’t really the platform for that unless you have a huge following of people, unless you have tons of friends or a popular fan page. I mean if you want to discuss with people in the country you’re going to go to a community and a platform that is focused at that country. Facebook is more about personal aspects, personal connections, not so much connecting around a topic or an interest.

Louis: Yeah, that’s a good point because even a good Facebook fan page with a lot of interaction it’s very timely, right, you’ll see a post on something and people will comment on it, and then the next day it’s sort of gone and it’s even hard to find these older discussion threads.

Patrick: Right.

Louis: Whereas on software that’s a little bit more focused around the idea of discussions, and that could be, you know, whether it’s in person stuff like what you get on meetup.com or forums or the kind of software question and answer type things like Stack Exchange. There are all kinds of software that’s maybe better at certain types of discussion, definitely. So, I don’t know, maybe it does make sense to have this one underlying network that anyone can use to connect with people throughout the world and just keep in touch. For me, I use Facebook kind of as a phonebook, right; everyone I’ve met is sort of in there, and if I ever need to contact them and I don’t have their email, or whatever, I know that I can find them on Facebook.

Kevin: I mean I know people that don’t use Facebook, but it’s a rare occurrence and usually it’s for reasons, I don’t know, personal beliefs, but more of a boycott than anything, you know.

Louis: Yeah.

Patrick: Just like there are some people who aren’t listed in the phonebook.

Kevin: Yeah, exactly.

Louis: Man, I just got a stack of Yellow Pages delivered outside my apartment; why are we still getting these things, sorry, I have to go on a rant about phonebooks, but nobody’s even picking them up anymore.

Stephan: They just leave them out.

Kevin: Right.

Patrick: Right, a lot of people aren’t using them.

Louis: Like not a single person has taken one, it’s the same stack that’s been sitting there for two weeks.

Patrick: I mean I’m not so much — I don’t think they should stop producing them as much as they should maybe make it upon request.

Louis: Yeah, I agree with that.

Patrick: Yeah, because I know some people who use phonebooks, but I know myself, I mean if the power is out I suppose it might be interesting because the phone would still work, so I don’t know, that’s the like case where it would be useful to me, but that’s like an edge case, so otherwise I won’t use the phonebook.

Kevin: Now, you can correct me if I’m wrong, and I’m probably wrong here, but I think that advertising model for the phonebook is when you buy an ad in the phone book you’re buying an ad for so many prints, not for so many deliveries.

Patrick: I don’t know; I mean you’re making a good point that advertising is a part of why they produce phonebooks.

Kevin: Right, so even if they don’t give any of them away, because you pay for your ad they still have to print that number of books. Now, again, I could be wrong but I think that’s why.

Louis: Well, see, this is another example of old, broken advertising models.

Kevin: Right, exactly.

Louis: And it’s the same reason why we still have like pagination on website articles, it’s just an old advertising model where they want to drum up impressions, and it makes no sense, the advertiser’s paying for the same person to see their ad a few times in a row which is a waste of money, but this is how they’ve always done things so they can keep spending money. That was my rant, it had nothing to do with anything (laughter), I’m just annoyed about getting Yellow Pages, alright.

Patrick: That’s the podcast; it’s not to do with anything.

Louis: (Laughs) speaking of not to do with anything, spotlights; Patrick you can go first since yours is the most likely not to have anything to do with anything.

Patrick: I’m the king of that. But I think tonight I’m going to be a disappointing king, I’m going to be a king you want to overthrow because it’s not directly related but it’s related enough. So my spotlight is WPLateNight which is a new WordPress-focused podcast that is co-hosted by our old friend Brad Williams of the SitePoint podcast, formerly.

Kevin: It’s a good show, I’ve listened to it.

Patrick: Okay, cool, yeah. I haven’t because I don’t listen to podcasts (laughter), but — but, no, Brad is co-host with Ryan Emil of WPCandy and Dre Armeda, and it is hosted by WPCandy, wpcandy.com, and we’ll have a link to the show directly in the notes. They’ve only released one episode, so partly kicked it off, it’s a video podcast, not just audio but also video is available, so if you’re interested in WordPress at all definitely check it out, it’s a good group of guys, and I’m sure that Brad will bring his insights to that show as well; just don’t forget where you honed your skills, Brad.

Louis: Alright. Stephan, you want to go next?

Stephan: Yeah, so I have a bookmarklet, I shouldn’t say it’s a bookmarklet, a little application that converts your bookmarklets to Chrome extensions, it’s pretty neat, you just put in a name, description, and you drag the bookmarklet into this box and it generates an extension and you’re good to go, so, kind of cool, kind of useful.

Louis: Yeah, that’s really useful. So we’ll drop a link in the show notes, is it — it’s a link that’s hard to say.

Stephan: Yeah, it’s sandbox.self.li/bookmarklet-to-extension, so yeah, we’ll put a link.

Louis: We’ll put a link (laughter). Cool, my spotlight for this week is at hellohappy.org/beautiful-web-type, they’ll be a link in the notes. What it is is this really nicely designed page which aims to be a showcase of the best typefaces from the Google Web Fonts Directory. So most people will be familiar with the Google Web Fonts Directory, it started — we talked about it on the podcast just when it started, it was at the time maybe I think a dozen or so fonts that were made available by Google, hosted on Google servers, that you could just drop a link to a style sheet file and then use that font in your CSS, and it started with only, like I said, a few fonts, but apparently there are currently 404 typefaces in the Web Fonts Directory, so it’s grown pretty impressively over a short period of time. Of course a lot of those fonts aren’t great, but this is a webpage made by a type designer who wants to highlight the really good ones, and they’ve done sort of these little compositions, typographic compositions, showing off some of the better fonts; they’re really all nice compositions, so even if you’re not interested in using these particular fonts it can be cool to just have a look and see how they’ve played with type and done these interesting little things, and it also gives you pointers to which of the fonts are really good and can be used in really interesting ways.

Kevin: Awesome. My spotlight is an excellent little JavaScript-like manipulation cool plugin thing, if that describes it properly, it’s called List.js, you can check it out at listjs.com, and if you go to the site you can check out some of the examples that basically gives you a lot of cool features, if you have long lists on a website it allows you to sort those by category, by name, you can do searches against them, edit, add or remove, you can start paging them, you can add some performance, I mean there’s a lot of things added in there that make this specific little script very happy to be at your website, if that makes any sense.

Louis: Yeah, it looks cool. I’d have to have a longer play around with it to see what it’s really up to, but I like the way the pagination works. If you go to the pagination page and you’re on page one and then it’s got the ellipsis, and if you click on two and then three and then four, the ellipsis kind of moves across and then eventually it ellipses before where you’re at and after where you’re at, so it’s pretty clever, definitely nice if you’ve got lists of things on your website, and most websites have lists of things on them.

Kevin: Right. I could see this being really helpful if you have like a list of people maybe going to a conference, like if you run a conference you could use this for like the registry, so you could search to see if your friend’s going to it without having to scroll through a really long list, and because that data is relatively small when you list things out on a website like that, you could pump that data out and just sort it using JavaScript which would be much faster and less requests as far as your web server’s concerned.

Louis: Right. Is it based on jQuery, does it require jQuery, or is it standalone JavaScript?

Kevin: Yeah, so the examples on the site are built using jQuery but it’s not required.

Louis: Oh, that’s cool, good to know. A lot of newer libraries tend to sort of sit on top of jQuery as a plugin, but it’s nice that this is library agnostic.

Kevin: To have something that you can use outside of something like jQuery I think it’s a good thing because that’s one less thing you have to download if that’s all you really want, right, so it helps support a smaller web, not in that the Web should be smaller, but the Web should be less bytes.

Louis: It should be fewer bytes or it should be lighter, we should say we want a lighter Web.

Kevin: A lighter Web, a lighter Web.

Patrick: Yeah, so when you’re taking a byte out of it you don’t gain as much weight. Bah-dum-bum.

Louis: Okay. (Laughter) I think that is a clear indication that we’ve run our course for this week, so let’s give it a run around the table.

Kevin: Right, so I’m Kevin Dees, you can find me at kevindees.cc and on Twitter as @kevindees.

Patrick: I am Patrick O’Keefe for the iFroggy Network, I blog at managingcommunities.com, on Twitter @ifroggy, i-f-r-o-g-g-y.

Stephan: I’m Stephan Segraves, you can find me on Twitter @ssegraves, and I blog occasionally at badice.com.

Louis: And you can follow SitePoint on Twitter @sitepointdotcom, that’s sitepointd-o-t-c-o-m, and you can follow me on Twitter @rssaddict. Go to Sitepoint.com/podcast to keep up with all our shows, you can find our previous episodes, leave a comment and you can also subscribe to the RSS. You can email us at podcast@sitepoint.com, and of course we are available on iTunes as well. Thanks for listening.

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.

Episode 147 of The SitePoint Podcast is now available! This week our regular interview host Louis Simoneau (@rssaddict) interviews Ryan Seddon (@ryanseddon) about his course on Modernizr, his work on fontdragr.com, and his other CSS projects too.

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #147: The CSS Ninja with Ryan Seddon (MP3, 26:05, 23.9MB)

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

Louis sits down with Bruce Lawson to talk about HTML5 semantics, usage, developed, packs, workarounds, polyfills and everything in between.

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/147.

Interview Transcript

Transcript to Follow.

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.

Episode 146 of The SitePoint Podcast is now available! This week the panel is made up of Louis Simoneau (@rssaddict), Kevin Dees (@kevindees) and Patrick O’Keefe (@ifroggy).

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #146: Patrick Accidentally Installs Chrome (MP3, 32:29, 31.2MB)

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 main topics covered in this episode:

• Scripting News: Could Bing seriously challenge Google?
• Official Google Blog: Search, plus Your World
• JQ.Mobi Is A Mobile-Optimized HTML5 Rewrite Of the JQuery Framework
• jQ.Mobi – Home

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/146.

Host Spotlights

• Kevin: visualizing.org – Make Your Data Interesting
• Patrick: Fotoshop by Adobé on Vimeo
• Louis: Making Love to WebKit — Acko.net

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint Podcast. This week on the panel Stephan is away, but we do have myself, Kevin and Patrick; hi, Kev, hi Patrick.

Kevin: Howdy, howdy.

Patrick: Hey, guys.

Louis: How’s it going?

Kevin: It’s going okay.

Patrick: Doing good, listening to some Bach (laughter), you know, keeping it real, it’s busy times.

Louis: We did some comments from users about the temporary typo in the title of the last post, it was spelled Bachbone.js, and I suggested — we were talking before the show and I suggested that we should — someone should write Bachbone.js just to make that make sense, make it about composing Baroque music in JavaScript, it would be awesome. Anyway, I spent the weekend at Rails Camp out in Adelaide, that was a lot of fun.

Patrick: Oh, yeah?

Louis: I spent the weekend hacking in a cafeteria full of other nerds, it was lots of fun.

Kevin: Cool.

Patrick: Very cool, very cool. Did you make any meaningful new connections or meet any new cool people?

Louis: Yeah, absolutely, I met a lot of cool people there. I spent the weekend sort of working on — I don’t know if you remember the Google AI challenge, the most recent one with Ants?

Patrick: Okay, yeah.

Louis: You saw this thing? Yeah, so someone put up a server on the first day, they built this little server in Rails that you could upload a button; they’d play against each other, so a few of us started hacking at that. I started out as being, oh, let me have a quick look at this and see how it works, see how the bots work, and then 16 hours later I hadn’t moved (laughs).

Patrick: Wow.

Louis: Then I went to bed. So I spent the whole weekend, yeah, pretty much working on getting an ant to be able to find out where it was going.

Patrick: Yeah, it sounds like it was quite an event because the website says, “Starts on the afternoon of Friday, January 13th, and runs until midday Monday the 16th,” so it must really have been running constantly and keeping everyone busy.

Louis: It pretty much was. Not a lot of us slept very much, let’s just say that.

Patrick: Well, I guess depending on how you camp.

Louis: Yeah.

Patrick: If camping includes sleep for you then it might not have been a camp, but if camp is just constant, you know, slumber party energy and no sleep, then that’s what this one was.

Louis: Yeah. So, anyway, if anyone out there is interested in Rails or Ruby and there’s a Rails Camp coming up near you, I strongly recommend it, it was a lot of fun and you get to meet cool people, so check it out.

Patrick: Yeah, their website is railscamps.com.

Louis: Yep, absolutely. Alright, so with that aside maybe we can dive straight into this week’s stories. Who wants to go first?

Kevin: I’ll go first if you’d like me to.

Louis: Sure.

Kevin: Alright, cool. So, my first link for the day I guess is my only link since we each do one link, but it’s an article on whether or not Bing can seriously take on Google as a search competitor, and I mean obviously they are competitors, but a serious competitor is what we’re looking for here. This is an article on scripting.com, and I found it via John Gruber, and he had linked to this and it was talking about basically the clutter that Google is kind of becoming. You know it’s original intent was it was clean, it had one logo and a search box, which they have held true to on the homepage, but once you dive into the search it’s just — it’s really nasty, and things like DuckDuckGo and Bing may be able to take advantage of this weakness in that Google has kind of become what Microsoft was on the OS, and kind of still is; so, thoughts?

Patrick: Sure, so this ties a little bit into Google Search Plus, your world feature that they announced earlier last week I want to say, or the end of the week before that, and we’ll talk about that in a little more detail because that’s my story, but, you know, it’s an interesting point to make. But here’s the thing, Google is not hurting, I mean the market share shows that Google is not really threatened in any way, and maybe there’s a comparison to be made between Apple’s growth, let’s say on the desktop versus the market share, Microsoft still owns which is almost all of it still. So, what is a threat to Google, like seriously challenging Google? It’s so tough to see because it’s not even like if you consider like IE, for example, IE6, and kind of the stagnation that was the development of Internet Explorer and how other browsers kind of came up behind it and eventually made a serious dent in the market share; even now Internet Explorer is still the majority player. So, you know, is Google that vulnerable, are they as vulnerable as IE was? It took many years for that to happen and it’s difficult to see it.

Louis: Yeah, and moreover there was a reason for people to switch over from IE, right, I mean everyone they knew who was even slightly technically inclined was clamoring at them to change browsers, you know, it was known to be slow, some sites started using new features that it didn’t support, a lot of sites told you you should upgrade your browser, Microsoft pushed updates on their side but that didn’t really help, and a lot of people were concerned about the security. So a lot of reasons to switch, whereas if you’re a Google user now, like the only reason you’d want to switch is either your search is slow, which it isn’t, or you’re not finding the things you’re looking for, and I don’t find that that’s the case, you know, you’d need to actually be dissatisfied with your search engine for some reason, or for some other search engine to have a killer feature, and a killer feature is hard to imagine in the search space because it’s such a simple competition, right; the only thing you want is probably one or two relevant web pages, and if the thing can find those quickly then that’s all I need, I’m done.

Kevin: Right, so I mean but what do you guys think about the clutter of Google, do you feel like it’s becoming more cluttered and that you go there and now they have the map on the side of the page and they just added their new logo dropdown menu thing, and, you know, the weather at the top of the page; they’re adding a lot of elements and a lot of different things that can kind of pull your eyes in different directions as far as design goes, and so this is kind of what the article is talking about is that.

Louis: But it’s not enough to overwhelm. Like, first of all, Bing at the moment has more clutter.

Kevin: Right.

Louis: And it has since the beginning, it’s got a lot of stuff on the page, and it’s not exactly obvious what’s going on. DuckDuckGo, that you mentioned, is definitely less cluttered, and I find it does do well for certain types of search, it’s very effective and it’s capable of doing a bit of semantics that Google doesn’t necessarily do, but, sometimes searches are a little weird, they’re not exactly what you’d expect to find. And the other thing is it is comparatively a lot slower than Google.

Kevin: Correct, that’s true.

Louis: Something like search when it’s not, you know, I’m just going through this to find the thing that I’m looking for. And a lot of times, and we know this, a lot of people use Google to go to pages they already know exist but they just want to get there, right, and I don’t remember the address.

Patrick: Right.

Kevin: Right. It’s a search box, yeah.

Louis: And when you’re using it that way, speed is the most important thing, right, because it’s faster to look it up on Google than it is to try and remember where it is, right.

Kevin: I think you have a really, really valid point there, and that is that speed is the number one factor when it comes to search because you just want to find what you’re looking for, like you’re saying.

Patrick: Yeah, and I like what Google’s doing in search, and I’m a Google user as most of us are; when I compare it to Bing, I just pulled up Google and I pulled up Bing, and I searched for SitePoint, you know, and when you switch off the personal results, which is the Plus search results, and just compare on that basis, you know, the normal search versus normal search of Bing, realistically all that’s on the SitePoint search, and of course this will vary, if you search for location you get a map, if you search for a math equation it will often tell you the answer, that sort of thing, but if I’m just searching for a company or a website, all I’m getting right now is text listings for sitepoint.com, Learnable, Facebook.com + SitePoint, and so on; Bing has the same basic listings and the same basic format, except for some reason I have automatic Facebook integration, and it tells me that me, someone else, and Kevin Yank all like SitePoint, which is the first link. So, you know, on the basis of just comparing those default results, really it looks pretty similar at this stage.

Louis: Well, there are a couple of other things I’d point out about Bing. First of all, as I mentioned, a bit more clutter at the moment, I find those related searches, the related searches on the left-hand side are completely useless and they’re always sort of random; I can’t imagine if I was looking for one thing and what’s it tell me, oh, you might want to search for, you know, when we search for SitePoint, for example, I get related searches of SitePoint, PTYL, like Proprietary Limited, SitePoint Books, SitePoint CSS, like I know what I’m looking for, you don’t need to tell me that other people — I’d be curious to see if they have user analytics of people actually clicking on those links.

Patrick: Right.

Kevin: Yeah.

Patrick: I searched for Louis Simoneau, I got no related search results, that stinks; I was hoping to see what other people would have typed in with your name, but there’s nothing there.

Louis: I get related searches on — well, see, this is exactly it, right; when I search for Louis Simoneau on Bing the related searches are Megan Simoneau, Joanna Simoneau, Brenda Simoneau, Guy Simoneau, Rachel Simoneau, Monique Simoneau, Simoneau Sports, and Simoneau Vineyards; like how is that at all helpful Bing?

Patrick: I wonder why you get that and I don’t.

Louis: You don’t get that?

Patrick: No, I get no related results on Bing; I get nothing suggested at all.

Louis: Are you signed in to Microsoft or something?

Patrick: No, I’m not, but it is doing some automatic Facebook or something or another, I’m not sure if you get that on your end. Let me see what happens when I sign out of Facebook, because I’m thinking if those are real people you just read off that are connected to you, maybe that’s how they’re getting the data through Facebook, but –

Louis: Those aren’t real people, I’ve never heard of any of them.

Patrick: (Laughs) Okay, they’re all fake people Microsoft made up, you freakin’ liars!

Louis: I’m not saying they’re not real people; if Megan Simoneau is listening to the show I apologize, I’m sure you’re a real person.

Patrick: And we love you.

Louis: What I meant to say was that I don’t know them.

Patrick: Okay.

Kevin: I think the core point of this, the article, was that Google is becoming a little more cluttered than it used to be, it’s not just plain text search results, and that the competitors can key into that and become a little bit different; instead of trying to copy Google they have this area where they can become niche in.

Louis: Yeah, I understand the point I guess, but I’m gonna stick to my original point which is that unless people have a reason to switch away from Google they’re not even going to look at the competitors, and right now there’s no reason to switch away from Google, unless you start not being able to find what you want quickly, and I don’t see that happening. You know there was a problem with some spammy sites for some searches for a little while, but that seems to have improved significantly with a few recent algorithm changes, so yeah, I just don’t see that happening.

Kevin: Yeah, I can’t see it much happening myself just because like when you brought up the Internet Explorer thing, nobody’s bugging you to switch your search engine, they were bugging you to change your browser but not so much the search engine, so people stick with what they know, and I think Google will, as you say, win out.

Louis: Yeah.

Patrick: Yeah, and that ties in really well with what I wanted to talk about, and really what is kind of the catalyst for this discussion from Dave Weiner at Scripting.com is the announcement of the Google+ Your World feature, the Google Search + Your World feature, which was posted on the Google blog on January 10th, and in that post I’ll provide a brief summary of what the feature is. So, essentially there are three new features that are introduced, the first is personal results, I’m gonna quote from the post, “Personal results which enable you to find information just for you such as Google + photos and posts, both your own and those shared specifically with you that only you will be able to see on your results page, second feature, profiles in search, both in auto-complete and results, which enable you to immediately find people you’re close to or that might be interested in following, and, thirdly, people and pages which help you find people’s profiles and Google+ pages related to a specific topic or area of interest and enable you to follow them with just a few clicks, because behind most every query is a community.” So, really it’s Google+, the social network, infiltrated the Google search, and so when you search for something and you’re logged into Google and you have a Google+ account, it will now show you Google+ posts that you wrote, Google+ posts that people you are connected to wrote or shared with you right in the search results. So, when you search for a location if someone you’re connected to wrote about that location it will come up, you’ll see photos from your albums, you’ll see photos from you friends’ albums, and they could be private posts and private photos, just ones that are shared with you. Obviously this is kind of a privacy thing, and that’s part of the reason people are concerned about it, but Google says that security-wise they have SSL and personal results are clearly marked as public limited and only you, and they are offering a public toggle, which you can easily change from the personal results to the regular results, and you can also go in the settings and turn it off so that it’s by default the normal search. So, first of all, guys, have you played around with this at all? Have you seen it impact your Google results? What do you think?

Louis: No.

Patrick: No, you haven’t. So you haven’t seen it or you haven’t used Google?

Louis: I haven’t seen it, I’m pretty sure I’ve used Google since, when was it, it was the 10th.

Patrick: The 10th.

Louis: Yeah, I’m pretty sure I’ve used Google since then, so I haven’t noticed anything.

Kevin: Yeah.

Patrick: Okay.

Louis: I don’t really pay attention to what Gmail account I’m signed into, and because we use Google Apps at work I might be signed into my Flippa account which isn’t linked to a Google+ account, so that might be why I haven’t noticed it.

Patrick: Yeah, that might be. So let me give you an example of what I see when I search for SitePoint right now. So the first link is sitepoint.com, and Kevin Yank shared this, it would be number one anyway. So the second thing that shows up, though, is a Google+ post I wrote about the podcast, the next result is the same thing, farther down images for SitePoint is shows four pictures, the first three are from Louis’ photo albums of I believe some sort of SitePoint social gathering, and the fourth one is from Brad Williams, who used to be a host on the show in our live show, at a conference a year or two ago, and then it goes down from there. So I get a few posts I’ve written and I get then photos from Louis, Kevin?

Kevin: Yeah, I was going to say Google has been talking about this for some time, about integrating the Google+ into most all of their services, so that hint of theirs is coming to fruition and it’s interesting to see how it works because I was doing a search just today and I think I typed my name in on the Google search because I was going to my website, but I accidentally ended up in a search box and it popped up my profile where I could — it said my profile was 70% complete, or something like that, in the search. And I was a little bit confused about that but, you know, I kind of ignored it at the same time just because it wasn’t what I was currently wanting to do which was search.

Patrick: Right.

Kevin: But, yeah, I think it’s an interesting take on search and where it’s going, and I don’t know how I feel about them integrating the Google+ into everything.

Louis: I do like the social integration, and that has been there for some time; if Google has some way of knowing that your –

Kevin: The plus one button, right?

Louis: Well, no, not the plus one button, I mean the, um, either Twitter or Facebook; I don’t exactly know which ones. No, it must be Twitter because I was seeing posts from people I don’t know on Facebook, so it would happen pretty often that I would do a search and I’d see such and such a person has shared this on Twitter, and it was someone I’m connected with on Twitter, and I do find that useful sometimes, if I’m looking for something and I see that some other developer that I respect or that I follow has shared that post then it does give me a little bit more trust in the content.

Patrick: Right.

Louis: So that I actually do find useful, adding Google+ to it is nice. It was more useful to me because it was Twitter, because I follow more people on Twitter than I do on Google+, but I do think the social aspect of search can be relevant in certain contexts.

Patrick: Right. And this feature has caused a bit of a, I guess, hubbub of sorts which Search Engine Land’s Danny Sullivan wrote that, “The change emphasizes Google+ over-relevancy,” which he says should be Google’s primary job, and it introduces anti-trust concerns because it really is just pulling in data from Google+, and Sullivan actually asked the gentleman who wrote the blog post, Amit Singhal, and he said, “Facebook and Twitter and other services, basically their terms of service don’t allow us to crawl them deeply and store things.” Google+ is the only network that provides such a persistent service, of course, going forward. If others were willing to change we’d look at designing things to see how it would work,” and this is especially relevant because Twitter is pretty publicly complaining about this new search feature that Google released, and they essentially said the change makes it so that not enough exposure is given to status updates on Twitter where news is often broken. Of course it’s also worth noting that they decided not to renew their Firehose deal with Google last summer and instead they partnered with Bing, so that might have been powering the feature you referenced, Louis, which I remember as well that tied Twitter or status updates or what had been shared with the search results; I don’t know if I’ve seen that recently or not.

Louis: Right. So if that’s been turned off then I do take issue with this, because I’ll gain a lot more usefulness out of Twitter integration than I would out of Google+ integration.

Patrick: Eric Schmidt said this as well, that Twitter opted out of the deal, if they wanted to talk they’d be happy to discuss it again, but TechCrunch’s Josh Constine said something interesting which was that according to sources familiar with negotiations, and those negotiations, Twitter did so because they were concerned that people would opt for Google search over Twitter search, where Twitter could control the advertising and monetization, so they may have been the reason Twitter decided not to allow Google to continue to have access to that Firehose of data that enabled them to use that feature. I don’t know if that’s — I mean Danny Sullivan was kind of incredulous about that comment saying that robots.txt gives Google essentially the right to index that, but Schmidt pretty openly disagreed with him.

Louis: Yeah, I mean I do think that’s interesting. I don’t think from Twitter’s perspective — I don’t think that a Twitter search is that useful for a lot of these things, right, I mean if I’m looking for a JavaScript framework, for example, right, I’m not going to go to Twitter and necessarily search because I don’t know if people will have used those words necessarily, what I want is a website that uses those words and someone I know to have linked to that website, right, and Google knows what words the website uses, whereas the person on Twitter might’ve just said this is a really cool shortened link, and that’s useless from a search perspective.

Kevin: Yeah, I agree.

Louis: But Google was in that position where they had both the content of the webpage that was being linked to and the social network of me being connected to someone who shared a link to that. So if I searched for JavaScript framework then it will find pages that have that, that people I like like, which is really useful to me.

Patrick: Right. And I’m like you, I like the social features and I like the Google+ integration because I use Google+ and I like the Twitter integration, I do find it useful and it’s easy to turn on and off. Now, I mean are these legitimate antitrust concerns? I read that they’re prepping to some sort of FTC complaint, and Google holds 91.32% of the search market worldwide, according to Statcounter, through December of 2011, now they’re essentially pushing their social network on the results and at the exclusion, some would say, of the other networks. Is this a legitimate problem or is this just a company pushing their solution on their own service?

Louis: Yeah, I’m not a lawyer (laughter), and I’m especially not familiar with U.S. law, but –

Patrick: Does it concern you?

Louis: No.

Patrick: Okay.

Louis: I just don’t see as, like, there’s strong competition in all spaces, I think Google+ is actually probably third in market share of social networks, if not lower than that.

Patrick: Right, I saw a story today that said MySpace was still bigger than Google+, I don’t know, it was just a headline.

Louis: And, you know, I think even Orchid might be bigger than Google+, and the Chinese one as well, so it’s possible that, you know, it’s a pretty minor service, it sucks that they exclude Twitter from their search results, but that’s their call and that information is still out there and it may be space for someone else to be able to build a useful tool that sits on top of your Twitter graph accessible by the API and adds that to your search results via like a browser plugin, which seems like it would be doable.

Patrick: Well, I guess we’ll have to keep an eye on it and see if it becomes a real problem for Google searchers.

Louis: Alright, yeah. Well, my story this week is I guess still breaking, is one way to put it, it starts in a post on ReadWriteWeb, I managed to say it this time, really proud of myself, so it was a post posted on January 16th, which was yesterday. So, the post is about jq.mobi, which bills itself as a mobile optimized HTML rewrite of the jQuery framework, so what that means is that it is a library that does the same things as jQuery, so it has a similar interface, allows you to select items on the page, manipulate the DOM, it also has a set of UI elements which are similar to jQuery mobile, we’ve talked about jQuery mobile on the show before. What differentiates jq.mobi, according to the people who made it, is that it’s specifically targeted for HTML5 on modern WebKit mobile devices, namely IOS and Android, which allows it to be a lot smaller than similar frameworks, so it’s about half the size of zepto.js, which is already a mobile optimized version of jQuery, and it’s about nine times smaller than jQuery. So, pretty considerable, the people who make it also post a video comparing jQuery, yeah, jQuery mobile with the new jq.mobi and with Sencha JS for user interface, and it looks impressive, it looks impressive because if either of you have played with Sensha or jQuery mobile before, especially on Android devices, there’s a general feeling that you get using them that they’ve been designed for IOS, and that if something sort of works on Android that’s good enough for the developers, and they sort of call it a day and go home, whereas jq.mobi seems to have put a much bigger emphasis on making things work exactly the same and with the same degree of performance across both platforms, so very impressive, at least in the video. However, there have been some concerns raised in the community, and the reception is still very skeptical, so I don’t want to come out endorsing this straightaway, I’m going to link in the show notes to an issue on GitHub, it’s the second issue opened against this project, and the issue says simply no unit tests, followed by if you’re honestly suggesting people use this I’d suggest adding some unit tests for everything. And then a lot of people in the community, including Addy Osmani, who I had on the show last week, and Rebecca Murphy who a lot of you probably know, came out and sort of said, look, if you want people to seriously consider this you need to have solid test coverage that makes is comparable and people can have confidence that it does the same things that jQuery does. So, still in development, the developer came back out and said we will have unit test in 1.0, but that remains to be seen, so I guess it’s a wait and see, but it’s something that I think is potentially really interesting if you want to do JavaScript on mobile.

Kevin: It looks really interesting. It’ll be nice to go and play with this and see what it has to offer as opposed to the other systems.

Louis: Yeah, it looks like it has pretty much all of the same things, so if you’ve looked at jQuery mobile, you know, sort of transitions between pages, native looking widgets, and all of that, it’s all there; except that it looks like it works solidly on Android which the other leading mobile JavaScript frameworks don’t really at present.

Kevin: Right.

Louis: However, without tests it’s hard to say, it might be buggy; it’s still in beta and so that’s a fair defense, although it is somewhat concerning the developer didn’t think that automated testing was important enough to bundle into this before, before opening that up and releasing it. Obviously the project is on GitHub, so if anyone wants to try and write some tests for it and contribute to it I’m sure that would be well received by the developer, so it’ll be interesting to see what happens, I’m definitely in wait and see mode on this one, but given how much smaller it is and how much smoother it looks like it works based on the video I think it’s definitely a serious contender in this space. Any other thoughts?

Patrick: Hmm, trying to rack my brain. What’s everything that I know about jQuery?

Louis: (Laughs)

Patrick: Uhhhh, okay, there it is, done! Sorry, Kevin, do you have a thought?

Kevin: I’m just looking through the documentation now, and let me see, because I haven’t really taken an in-depth look at this I can’t comment too much on it, but it looks like the documentation is okay, it’s not jQuery.com.

Louis: Yeah, I mean it definitely has the smell of a very immature project that someone sort of — it looks like a lot of effort went into making it work well, but that’s only, as you point out, part of the way there. Like if you want something to be taken seriously by the community, a strong set of unit tests and a solid documentation effort are going to be just as important as having a library that works well.

Kevin: Yeah, I agree. I mean just by looking at this it doesn’t look like I could just go in and start using it unfortunately; I just don’t know where they would want me to start, to figure out how this thing works.

Louis: Well, it’ll be very interesting, I might give it a play the next time I have to do something mobile, at least sort of dive in and give it a shot and see, I think you’d be able to figure out within an hour or two whether it was doing what you needed it to. There is a — if you go to jqmobi.com/testdrive, that’s j-q-m-o-b-i.com/testdrive, that’s actually a sort of running instance of it which has all the different little functions, so if you go to that on your phone you can see it in action on the phone, and with respect to that it looks like the proof is in the pudding, it looks like it does everything nice and smoothly, it’s got things that are traditionally kind of difficult to do on web pages in mobile devices, including a fixed header and footer and sliding transitions for everything, even on Android, which older versions of Android are pretty buggy as far as that goes, so that’s been difficult for other frameworks to get right. And, again, like I was saying, to me it’s the willingness to not just say, okay, it works beautifully on IOS and it’s a little shaky and flickery and buggy on Android but who cares, which seems to have been the approach of just about every other mobile framework so far, so it’s nice to see someone really going for cross platform compatibility on a serious priority.

Well, so that brings us to the end of today’s show, let’s quickly go around with some spotlights, what do we got this week?

Patrick: So I’ve got a video from Jesse Rosten, I think that’s how you pronounce his name, and it’s on Vimeo, and it’s Fotoshop by Adobé, did you guys see this video?

Louis: Yeah, I saw that.

Patrick: Okay, so this video was awesome! I mean Louis knows.

Louis: It was pretty good. Yeah, it was good. It’s one of those things that suddenly came at me from every direction at once on the day it came out, like I had four people in my Facebook stream, a dozen people on Twitter, everyone was sharing this video around.

Patrick: Right; and it’s got 2.8 million plays, so you may have seen it, but there are a lot more people in the world than 2.8 million, so maybe there are some people listening to this show who haven’t seen it. Moreorless it’s a commercial for Adobe Photoshop that is set up like a cosmetics commercial, so it basically treats Photoshop as a cosmetics product as far as how it improves photos, improves the look of people, and I won’t ruin it too much, but suffice to say the tagline is, “Maybe she’s born with it,” and then the voice changes to, “No, I’m pretty sure it’s Fotoshop,” (laughter). So definitely check it out.

Louis: Yeah, absolutely, it’s a lot of fun.

Kevin: Cool stuff.

Louis: Alright, Kevin?

Kevin: My spotlight for today is visualizing.org, it’s a site where you can check out other people’s designs of data, so what this means is if you’ve ever see like a pie chart or something like that, of course you’ve seen a pie chart, but it’s people’s different techniques of displaying the data, so it’s visualization of data, and if you go to the site it’s just a huge gallery of information on how other people have displayed their things, it’s kind of a creative outlet to go to when you’re having trouble thinking about how to make something that’s not interesting, interesting. So, go check it out and I think you’ll like what you see.

Louis: Yeah, I really like it; it’s a well designed site, easy to navigate, and definitely lots of cool stuff in here. If you go to Visualizations and then sort by most popular you get some really, really cool ones.

Patrick: Yeah, it is really nice. And, like you said, it makes stuff that’s boring interesting, like this podcast, bah-dum-dum.

Louis: Oh, Patrick! I thought you were a fan. That hits home.

Patrick: I love us! I am a fan of us, although that sounds awfully conceited.

Louis: (Laughs)

Kevin: I’m going to block Patrick from my Twitter now.

Louis: Alright.

Patrick: One of your five followers.

Kevin: Ouch!

Louis: (Laughs)

Patrick: I’m kidding.

Louis: A little harsh today. Alright, my spotlight for today is a recently redesigned site which is really, really impressive, makes great use of three-dimensional CSS, so it is acko.net, that’s a-c-k-o.net, the thing only works in WebKit at the moment because WebKit is the only thing that has 3D CSS, so you’d want to see it in either Chrome or Safari or on an iPad, but if you are using one of those browsers go to acko.net and just scroll down the page and watch as everything sort of moves around, and it’s one of the best scrolling effects I’ve seen on the web ever; really, really, gorgeous. And he’s got a blog post about how it was designed and how it works, and the idea apparently is very simple, apparently if you put a div or any kind of DOM element in CSS or apply 3D CSS to it, its perspective remains the same as you scroll down the page, so, in fact, the perspective, sort of the paradox scrolling happens moreorless automatically, I’m sure it’s more complicated than that, but there’s a whole blog post explaining sort of the design process and how the code behind it works, so check it out.

Patrick: Yeah, and this post actually reminded me of something, big, big news that I should’ve led with because it lists the browsers that are compatible, some of them anyway; I finally downloaded Chrome.

Louis: Oh! (Laughter)

Patrick: So I mean that’s like — that should have been the lead story; I buried the lead (laughter). But you know how it happened, I downloaded Chrome, and it’s a long story, but I was installing a program that I like and you know how the Chrome, you can signup and you can install it like in the installer, you know how they get paid for it if you install Chrome or you tick the box to install this toolbar, well, I forgot to uncheck it, so how I got Chrome was through installing something else by clicking next too fast.

Louis: Alright.

Patrick: So, anyway, I’m able to view this page now thanks to that accident, and this is the first time I’ve actually opened Chrome, and you’re right, it is — that is really neat, it reminds me of like a skyscraper or something towering down and then the text presents itself.

Louis: Yeah, I especially like how the post itself is kind of angled off to the side when you’re at the top of the page, but as you scroll down it sort of swings out into full view, and it really fits in just natively with the scrolling, it’s very nice, and if you want to play with it and have fun you look at when you’re at the top of the page and the post is sort of faded off to the side, like the text in it is still selectable, it still behaves exactly like text on a page, it’s just slanted and rotated out to the back.

Patrick: Yeah, yeah, this isn’t something you’d like to see in most websites you visit daily, but, it’s like above the fold — take this! Above the fold.

Louis: Yeah, I’ve been scrolling up and down this page and my laptop feels like it’s about to liftoff in outer space, my fan has kicked up to the highest degree, so probably not something you’d want on your everyday website, but a very cool demonstration of what’s possible with the latest tools in CSS.

Kevin: It’s very engaging.

Louis: Alright, so I guess that’s a wrap for this week, let’s just quickly go around the table.

Kevin: I am Kevin Dees, you can find me at kevindees.cc, and you can see me on Twitter if you’d like @kevindees.

Patrick: I am Patrick O’Keefe for the iFroggy Network; on Twitter @ifroggy, i-f-r-o-g-g-y.

Louis: And you can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict; go to sitepoint.com/podcast, which is the place to go to keep up with the podcast, it’s got all of our past episodes, the RSS subscription link, and you can leave a comment on this show or any previous shows if you want to get in touch. Another way to get in touch with us is by email at podcast@sitepoint.com. So have a great week, I will see you all next week in the interview show, thanks for listening.

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.

Episode 145 of The SitePoint Podcast is now available! This week our regular interview host Louis Simoneau (@rssaddict) interviews Addy Osmani (@addyosmani) about his free online book about the Fundamentals Of Backbone.js and how using javascript frameworks can really help when building a front-end Web app.

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #145: Bachbone.js Fundamentals with Addy Osmani (MP3, 34:16, 32.9MB)

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

Louis chats to Addy Osmani (@addyosmani) about backbone.js.

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/145.

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint Podcast. Today on the show my guest is Addy Osmani who is a JavaScript developer at AOL; he speaks at a number of conferences about JavaScript and about developing larger applications in JavaScript and is the author of a few books. Hi, Addy.

Addy: Hi, it’s nice to be on your show.

Louis: It’s great to have you. So, the reason that prompted me to reach out to you and try and get you to come on the show is you’ve recently put out sort of a free in-progress book about Backbone.js, is that right?

Addy: Yeah, that’s right.

Louis: So, before we dive into talking about the book and what prompted you to do this sort of project, I’d like to maybe give the listeners some background on Backbone. So do you want to explain a little bit about what Backbone.js is and what problem does it try and solve, and why would people want to use it.

Addy: Absolutely. So, the idea behind Backbone Fundamentals is it’s a book that teaches both beginners and advanced developers how to effectively use Backbone to build more structures to applications. Now, what does that all mean? Well, when you start building with App Stack or non-trivial or begin to grow, you learn that unless you have some sort of organization in place you’re going to end up with some problems. What kind of problems? Well, maintaining all of the code through applications, say a file, without using any architectural design patterns can mean that it ends up looking a little bit like spaghetti; it might look good from the outside, it might taste nice, but it’s a mess to clean up. So, when you’re searching for something a little bit more maintainable, a lot of developers find that applying patterns like MVC, which usually stands for Model View Controller, that means something slightly different on the front end and in JavaScript; that can help them keep their code a little bit more organized. Now, Backbone is one of those frameworks that lets you use the flavor of MVC to cleanly separate concern and organize the application. It’s mature, it’s incredibly lightweight given what you get out of it, and it’s great for single page applications and multi-view applications. Now, there are like a ton of other solutions out in the market at the moment which offer, a bit of a variation of what Backbone does. In my opinion it’s one of the more elegant solutions out there right now. Developers that might be looking at it and saying, well, is Backbone good enough to be used in my large enterprise model application? well it’s currently being used by the likes of LinkedIn, Foursquare, Sound Cloud, and a lot of other large companies that build their applications. Now, they’re not small companies and they’re not building small applications, so hopefully if it’s good enough for them it’s hopefully good enough for the rest of us.

Louis: Yeah, absolutely. We’ve recently started using Backbone at Flippa, I haven’t personally played with it a lot, I work more on the backend, but I’ve definitely heard good things from our front end guy about the experience he’s had with it. But maybe I want to step back a little bit, you were talking about MVC as it applies to JavaScript and to front end engineering, and I understand that probably a lot of listeners, or a lot of people out there who’ve done backend web development, you know, MVC makes sense for that, and I think it’s easy for most people to grasp why you’d want to use MVC for something like an application where you’re dealing with interaction with a database, which is your model, and then routing requests, which is your controller, and templating, but for something which is entirely on a front end, or the application code on the front end which is in JavaScript, where does MVC come in and how does it relate to front end development?

Addy: Well, on the front end it translates, in some ways it translates almost identically to the server side version of MVC, and others it differs quite a lot. I think view and models are quite similar on the front end as they are on the backend, but when you get to talking about controllers that’s somewhere where a lot of sort of JavaScript MVC frameworks tend to take a slightly different view of what that should be. Some frameworks, Backbone, for example, doesn’t exactly have a controller, what it has instead of the C part in MVC is it has routers instead which are used for sort of managing navigation; other frameworks consider the view the controller on the front end. And so it’s hard to give a concrete answer to that, but each framework, and each framework author’s template tend to take a slightly different take on how that should be interpreted, but I think that the MVC pattern or MVV, I tend to call MVC on the front end MVV, which means Model View Variation. And I think that that pattern still translates well to the front end and does help keep all of your code relatively well organized, even if you’re just keeping concepts sort of models and views in there and having to graft onto something else inside that pattern; it still tends to work quite well in my opinion.

Louis: Right. Maybe you can make this a little bit more concrete in my mind and the listener’s mind. What’s a simple example of sort of a front end application that could benefit from this kind of framework?

Addy: Anything that I would consider non-trivial. So let’s say we’ve got a simple photo gallery application which would be something that perhaps isn’t using a single app paradigm, you’re going to be having people refresh their page every single time they’re interacting with something. So, if I click on a thumbnail to view a larger version of a picture I might be going to a completely different page, that might mean I’m making more http requests, I’m having to have the user wait even longer for things to load up, and in a single page application paradigm, which is what frameworks like Backbone tend to help people do, it means fewer clicks to get things working, it means how snappy the interface is, but in terms of organizing your code it means that I can cleanly break apart the various components that make up that application. So, it’s clear to me, well, what is the concept of a photo in that application? Well, I can use models to model the data around that and say okay, well, a photo might have a caption, a photo might have an image source, it might have some additional meta data, okay well that’s the concept of the model. The collection, which is something we have in Backbone, probably represents a number of different models, so that means that if I have a gallery I’m going to have multiple models, i.e. multiple photos, in that particular gallery. And my views might essentially mean okay, well, what is that I’m actually rendering to the end user, am I taking them from an index page that might just say what the application does, and taking something that might actually let them traverse and browse through different image collections, for example, routing there is perhaps going to be used for actually taking them from one page to another and giving them URLs, clean URLs if you are using HTML5 PushState for just using the hashtags to actually navigate around the application without having to make them sort of refresh the page at all.

Louis: Right.

Addy: So that’s one example.

Louis: Right. So in that case you’re — sort of your photo model would be substantiated based on sort of, say, if I load a new page I get some JSON back from the server and that contains an object representation of these photos in the gallery, and rather than just sort of haphazardly iterating them over them in inline jQuery I’m cleanly bundling them up into a model object which would then be easier to use in other places in the application.

Addy: Yes.

Louis: And it behaves a bit more like a server side application, or like we’re used to developing in object oriented code.

Addy: Exactly, yes. So we were just taking a look at an example of a gallery application that could be implemented using Backbone and using MVC. Now, the idea behind MVC on the front end is that it still separates applications into sort of three main concerns. You first of all have models which manage the behavior of application data, and it doesn’t differ that much from how data is handled, how models are handled on the server side, it still represents sort of knowledge and data, they still respond to changes of state, but they tend to be a little bit more isolated from using controllers than you might find on the server side. In frameworks like Backbone, models can sometimes group things and collections, so you have the idea of a single model perhaps representing a photograph, but a collection in Backbone actually is representing multiple models or multiple photos. You might have views which are responsible for sort of rendering models into a form that’s suitable for user interaction. In a lot of cases on the front end your views are going to be considered your UI, they typically are rendered to specific user interface elements, so I might have a div on the page that I actually want to render my view to, and it can be called container or something else, and I’ll simply render that whether I’m using a templating library for this or I’m using Backbone’s own internal stuff, I’m just going to be rendering that view for a specific element. And you can have multiple views which is just for single models, so you might have models that represent photos in your applications, and you might have views which perhaps display different aspects of that model. So, if I have a photograph that has meta data saying, you know, well, this photograph was taken say in Italy, for example, this photograph was taken in the year 1990, there were Tom, Dick and Harry around; you could have one view that actually shows you the people that were around when that photograph was taken, you could have another view that represents the location where that photograph was taken and perhaps show you a map, and so on and so forth. You then have sort of controllers on the front end as well. Now, some frameworks don’t necessarily implement controllers when we’re talking about JavaScript, controllers typically sort receive input, can instruct models or views and respond accordingly, so usually sit between models and views they might perform some business logic and data manipulations, but they’re low inside MVC, it quite heavily varies. You’ll find that Backbone considers controllers quite differently; they actually replace it with the idea of a router for handling navigation. Other frameworks might maintain something called a controller, so they’re JavaScript MVC frameworks they have to do something completely different. So there are a lot of similarities between sort of MVC on the server side and on the client side, but it’s usually the controller side of things that’s where things differ from most I would say.

Louis: Right. And just to maybe expand a little bit on the idea of the view, if someone’s not familiar with JavaScript templating and how that works, I know there are probably still a lot of JavaScript developers who’ll either just create DOM nodes inline in their code or load entire chunks of HTML from the server, can you talk a little bit about templating and how that’s used in these frameworks?

Addy: Oh, absolutely. So, templating in general, even outside of JavaScript MVC frameworks it’s something very, very useful for your applications. One way that developers tend to approach this without templating is you might be constructing HTML for your page in memory using scripting catonation, and I’ve seen people do this; ten years ago people were doing this in doctrine right, now if you’re not using the best practices there are still people that are sort of concatenating ten or more lines of code and then injecting that into the page or injecting it every single time a new line is being constructed in memory, and the problem with that is that it’s not just inefficient from a performance perspective, but it’s also difficult to maintain. So, once you start to store multiple long strings that are supposed be representing sort of HTML in your page, and you start building larger applications, it can become difficult to figure out okay, well, what part of my page did I store the script in that contains those lines that need to be updated now. Something that is a little bit better and easier to manage but also more performant is using JavaScript templating. So, with JavaScript templating you take a look at what repeatable output that you have in your application, so rather than me saying okay well I have a JSON feed coming from my backend that contains a number of photographs, what I’m going to do is I’m going to move through every single one of those photographs, and I’m going to concatonate some image tags around that and some nested divs around that, and I’m going to construct myself a pseudo template that appends my page. Instead of doing that you can say okay, well, I’m basically repeating the same pattern multiple times in this loop, why don’t I simply represent the template, have something much smaller, okay, well, I might just have one single entry, the website says okay, well, my template is going to be composed of a few nested divs and an image element. Well, that’s all there is to it, I don’t have to have any performants around that, I don’t have any additional logic in there if I don’t need it, and instead we just apply templating to that feed that’s coming through. In a framework we actually represent that feed is either a model or collection, and we would then template based on that collection to render out those to the screen, which is the DOM, and it just means that I can actually maintain templates in a slightly more readable fashion, it’s a lot easier to read this stuff than going through all the different pluses and minuses that you might have inline, it’s also easier when you get to a point where you might want to sort of manage your template outside of your page. So rather than maintaining an application where you have to have sort of scripting catonation and your different templates stored inline, so in larger in applications you’ll see that there’s actually a lot of benefit to doing this outside of your model and your views. If I wanted to say have a template to represent how I actually output gallery items, I can simply just go to say, you know, item.tntl or item.txt, which might just contain the HTML markup representation for a single element on that page, a single photograph on that page, and then use that with templating to render out how every single other photograph on the page is going to look. It’s something that’s a little tricky to sort of explain without showing people examples, but, again, if you take a look at the new MVC what you’ll find is that there are actually quite a few examples of how templating can be effectively used with MVC frameworks and where it can come in useful. But, yeah, I definitely recommend checking it out.

Louis: Yeah, absolutely. It’s something that we take for granted working on the server side, but that is I guess still not a widespread practice working on the client side possibly because a lot of these frameworks haven’t enjoyed widespread use as of yet, but it’s definitely powerful and it definitely makes the code more maintainable if when you need to change your markup you’re actually changing markup rather than digging through your code to find, oh, I’m concatenating a div in here and I want to make that a span now; suddenly I have to go through and find all the instances of code that does that. Right, that sounds super useful, so, however, I guess one of the issues with Backbone is it’s fairly new, it might seem a little odd to people who aren’t used to working with JavaScript in such an ordered fashion, people are used to just sort of slapping a script like when you click this link whatever opens or just DOM manipulation.

Addy: Hmm-mm.

Louis: So it can have a bit of a learning curve to it, and I guess this is where the idea of doing this book comes in, right?

Addy: Yes, exactly. So I’ve been blogging for I guess four or five years in JavaScript now, and whilst blogs are really useful for beginners to sort of grasp new concepts and gain knowledge, they also come with some caveats which is why I decided to write this book; blogs only have like a limited amount of information you can convey in them, and I figured, well, why just show somebody how to build an application with a framework when there are going to be beginners that ask, well, where I can learn the fundamentals of this framework so that I can use this tutorial. And then you’ve got like advanced users that might say, well, this is a little too basic for me, I’d like to know how I can build something even more complex than what you’re showing me right now. And I think that a book solves this problem quite well because it means that if you’re coming from a completely fresh background and you have very little experience that’s sort of MVC on the front end, or architectural patterns with JavaScript, you can just come in and read the book and start off in the basics section and fairly quickly you’ll pick up all of these concepts. I start fairly slow off, we don’t throw people in the deep end; I think that by the end of the first chapter you do get most of the concept, and one of the things that the book’s going to be trying to do is sort of first of all teach you how to build a very simple application, and then iterate on that application as we go along through the rest of the book, so you’re going to learn to take that application more complex, learn how to integrate it with different backends; there are people that have sort of requested to learn how to integrate Backbone with say Node.js or with Sinatra or with WebSocket frameworks. And the book tries to sort of help the user on their journey, so it gives you sort of a complete look at — or I might need to redo that, but the book gives you a complete bird’s eye view from start to finish of what you need to learn how to properly use Backbone.

Louis: Right. And the other thing obviously that’s really interesting about this book, above and beyond it being a book about Backbone, is that you’ve done it sort of for free online in a sort of collaborative fashion, because it’s all on GitHub, and I assume you’re accepting contributions from different people, and it’s still very much in a development stage, it’s still incomplete, but I had a read through the Basic section, and in terms of getting you up and running it definitely has all the basics, but there’s, I assume, a lot of work to come.

Addy: Yeah, yeah, there’s a lot of work to come. So when I first released the book, I think about two weeks ago, I started a wish list that developers could go into and add requests for topics they’d like covered, so if a developer wants anything written about in the book, or they want me to consider writing a chapter about something, all they have to do is just submit an idea, I’ll talk to some other developers about it and see what they think, and if we think it’s a good idea I’ll write a chapter about it. Just going on some of the items on the wish list right now there are people that want me to sort of address using different test stacks Backbone, you know, people want to know how to unit test Backbone using solutions like Queue Unit, they want to learn how to build mobile applications with it, so there’s a lot of work still left to go, but I’m excited about it, I think we have an excellent opportunity to sort of build something that is very open, will hopefully be very authoritative and will help some people on their journey through Backbone.

Louis: Yeah, absolutely. And this kind of free online book has been maybe not a super common pattern in the industry, but it’s definitely something that’s happened before, and there have been some really great examples; I mean both of Mark Pilgrim’s books on Python and HTML5 are these huge resources that are extremely useful for those topics, and I think help those topics get a lot more interest from the community than they might otherwise have gotten.

Addy: Oh, absolutely. I think one of the reasons I wanted to release this book for free is I believe that educational material should be free and accessible where possible. I think that authors who write are totally within their rights published contents and ask for something back, people need to make a living, but when you open source your content it just means that more people are going to be able to read it, share it, spread the word about it, and, I don’t know, I think it’s a nice way to go about putting educational material out there.

Louis: Yeah, especially for something like Backbone where it’s not very mainstream at the moment, so if you were to publish a book, a conventional book, you wouldn’t expect to sell a lot of them, but having it for free can build a lot of momentum behind this because it makes it easier for people to learn it.

Addy: Certainly. And I guess one of the reasons I decided to go for this open source model is this is actually the second time I’ve released an eBook for free. The first time I got something else out there last year, this book called Essential JavaScript Design Pattern; I think I had something like 250,000 downloads in the first year, and it’s difficult to get people to read things, and I’m just happy that if I can duplicate sort of the same level of success with Backbone Fundamentals that I did with that I’ll be happy, it’ll just mean that I guess I’ve had a way to hopefully influence other developers in a positive way and help them I guess code better.

Louis: Yeah, definitely. And I think there’s probably a lot of room for JavaScript developers to take some hints from server side developers and look at this kind of structure, it’s definitely become a major topic in the last year or two, I guess, that you’ve seen all of these sort of front end frameworks bring up, and really a focus on trying to make JavaScript behave a little bit more like a structured programming language that we’re used to working with.

Addy: Hmm-mm.

Louis: Now, you say you’ve had a look at a number of different JavaScript frameworks that have come up in recent years and that you decided to go with Backbone because it was a natural fit for you. Do you want to maybe talk about some of the differences and where you feel like you like Backbone better and where some of the other ones have interesting features?

Addy: In a lot of cases I think it comes down to style. So, a while back when I was first learning about Backbone, I realized that there were a number of other frameworks that are out there at the moment that tried offering something similar. So we had — I guess a year ago we had SproutCore, we had JavaScript MVC, Spine was coming into the picture as well, and most of those frameworks are still around, SproutCore has become Ember.js, and most of the others are still around, but for developers that are still sort of on the fence and trying to decide on what frameworks to opt for, I created a project called To-Do MVC to try helping with this. What To-Do MVC is, is basically a collection of to-do applications, so everybody sort of knows what a to-do application is, it’s just a list application where you can add little reminders about things you have to do, you can cross items off the list, you can edit them in place. And so the idea with to-do MVC is that you get the same two applications in a number of different frameworks, we’ve got a Backbone.js version, we’ve got Spine.js, JavaScript MVC, Ember.js; and for developers that are still on the fence about which framework they want to commit to it just means that all you have to do is go in, take a look through the source code for any of these applications and see which one best fits the style that you might prefer using. Now, most of these implement some form of MVC, or a variation of MVC, and it’s not to say that simply reviewing the source code is going to be the defacto thing that’s going to make you decide on a framework, you should, of course, go and research a little bit more what the framework offers outside of the implementation to-do MVC offers you. But I think it’s just a way to I guess figure out what you might prefer using without having to spend six or eight months implementing something and then going, well, you know, this probably wasn’t the best decision.

Louis: Yeah, absolutely. And so did you find yourself at any point struggling to implement the same feature set across all of these different frameworks?

Addy: Oh, absolutely. I think it’s very difficult to I guess be a master of all frameworks, it’s extremely difficult because of varying feature sets and the syntax that’s involved, and so the community’s been extremely helpful here. Anytime there was an application which I didn’t feel that I could implement personally I tried reaching out on Twitter and on GitHub, and the community has been great, people have come forth and said, you know, I’m going to spend a weekend building this application and if you can help me with the style just to make sure that it’s implemented properly, I’m fine with pushing this to To-Do MVC, and that’s really helped the project sort of grow. At the moment I’m currently working some contributors to get sort of Dojo MVC’s quote in there and other applications, but it just means that whatever experience other developers have with frameworks that I don’t, we can still lend those to the project and hopefully help somebody else out there pick something that will work well for them.

Louis: Yeah, absolutely. If a JavaScript developer is sort of on the fence, they’re sitting at the point where they’ve been pretty happy doing everything they’ve done so far just using inline DOM stuff and jQuery, they do feel like sometimes they’ll look back at their code and be like, ooh, that’s a little difficult to read or understand or play with, or they’ve come to someone else’s code and had that feeling, but it feels like a big step to start moving maybe existing code over to something like Backbone. What’s a good way to sort of get your feet wet and start playing with it?

Addy: To be completely honest I’m going to give a very silly answer, it’s just looking at the basic view application that comes with Backbone. As I was saying with to-do applications, it’s just something that I’ve actually built into a complete project, it just gives you a nice simple flavor of how you can break down an application into sort of models used, controllers if the framework supports it, or routers and collections, etc. What To-Do MVC actually also had is a version of the to-do application implemented in just jQuery and just plain JavaScript, so you can actually take a look at how you can take something that’s currently in I guess what some people might call spaghetti code, which is like everything in a single file, and then see how that can actually be broken down into the different concerns using different frameworks. So I think To-Do MVC can actually help you with that too, hopefully.

Louis: Right. So that’s pretty interesting. Is it a big difference in terms of the amount of code that’s written compared to either plain JavaScript or jQuery when you’re using these various frameworks?

Addy: I think in terms of the amount of code the developer has to write themselves it’s minimal; it’s minimal, the addition is very minimal. You do of course have to include the framework that you’re opting for, so if I’m using Backbone it’s just going to be a few additional kilobytes to my project, if I’m using Spine it’s going to be the same case. But, yeah, it’s minimal in terms of the developer effort requires to turn that code into something a little more structured.

Louis: Right.

Addy: But for developers who are very new to this and who are still wondering okay, well, how do I take my standard JavaScript application and convert it or break it down into something models use in controllers, well there’s some very simple things that you can do. The first thing I would do is take a look at the data in your other applications, so what unique data is represented in your app. For photo gallery application, again, you’re going to have things like the id of pictures, you’re going to have id’s of galleries which contain multiple pictures, so that’s going to be a group or a collection. You’re then going to need to think about what the user needs to be able to see and do. Now, that comes down to your view, so we just talked about models, models are all about the unique data in your application and how you want to represent them. You even have views which basically are what the user needs to be able to see and do, it gets a little bit more complicated than that, but let’s talk about — let’s take a look at templating, right, so another thing to consider is what repeatable output do you have in your application that you want to shift to JavaScript templating to make things a little bit more performant. And then you have controllers, and the role of controllers vary, actually we’ve already sort of reviewed, and in your application if you’re talking about using perhaps Backbone, let’s say that your controllers are actually routers, and what routers are going to do are they’re going to take care of the navigation of the application. So if I have a single page application and I want to start navigating around the different galleries that might be available, when I click on a specific gallery I want the user to still be able to bookmark the path to that gallery. So even though this isn’t an application which has sort of real paths, and there are no real folders on the server which might represent the file or the view that we’re going to be rendering, we still want to give them a nice clean way to simulate this behavior. And using Backbone you can either use HTML5′s PushState or you can simply use hashbang URLs to simulate these URLs so people can still go in and say okay, well, I’ve navigated to a particular photograph in this application, I know that this isn’t an application which has real folders or which has the proper server side structure, but by copying and pasting this URL using Backbone’s routers I can still navigate the user back to the specific image very, very easily, this is one of the powerful things about these MVC frameworks; if they support routing by default it means that you don’t have to sort of natively go yourself and figure out how do I monitor hash change events, and how do I take care of all this mucky stuff to do with URLs myself.

Louis: Yeah, and does that extend to things like the browser’s history and the back button?

Addy: It does; depending on the framework it can actually have a built-in support for managing back button, but yes it does. It also means that if I navigate multiple depths down inside an application it might have multiple views, I can easily use the back button; if the application has been coded correctly I can use the back button to go back exactly to where I was.

Louis: Yep, right. And do you know under the hood if that’s using HTML’s browser history?

Addy: Again, it really does vary depending on the framework that you’re using.

Louis: Yeah, but just talking about Backbone specifically because you’d probably know a bit more about it.

Addy: So in terms of the specific question you’d probably be talking more about Backbone or HTML5 PushState, and in terms of that, yeah, Backbone does support HTML5 PushState, if you want to turn it on you can use it. And the benefit of using PushState is rather people seeing a — sort of a hash or hash fragment in the URL at all, all they’ll see is very clean, very plain URL; the end user, they won’t know that, without sort of inspecting your code, they won’t know that you’re using a single page application, it’ll look like it’s a completely server based application and that like all these paths are actually naturally existing on the server side, but they’re not, so it’s actually quite a beautiful thing because it means that they don’t need to worry about is this weird looking URL actually going to work in other browsers or anything like that. And the beauty of frameworks that do support HTML pushState, in a lot of cases they gracefully degrade back to using hash bang if pushState isn’t supported. So if I try navigating using a pushState URL which doesn’t contain any hash bang, and my application doesn’t necessarily support that, I can use hash bangs instead and still provide users with the ability to bookmark URLs.

Louis: Right. So that was a bit of a diversion of what you were talking about, which is to say that when you’re looking at breaking your application down and taking an application that you’ve written in an unstructured way and trying to make it structured using this, and you were just getting to the point of saying how do you break down the interactions into routes and that sort of thing.

Addy: Absolutely. There are a lot of applications that people use on a daily basis that are single page applications, and they may not be necessarily using Backbone, they might be using sort of homegrown solutions that were something else, but there are actually single page applications that are either using hash bangs to give people the ability to navigate around them, or they’re using HTML5 pushState. Gmail is a perfect application of this; Gmail is probably my favorite JavaScript based application, and if you take a look at the URL scheme that Gmail uses you’ll see that in some browsers it’s actually using hashbangs to help you navigate around different email. And if you copy those hashbang URLs and you paste them back, you’ll actually be able to get to exactly where you were regardless of whether we’re talking about a specific email or a specific setting that you were looking at, and I think that’s quite beautiful. Being able to cleanly manage state and help people get to exactly where they were in the application and share those locations with people just means that the validity of using JavaScript for these applications is a little bit more strong and a little bit more powerful I think.

Louis: Definitely. Alright, well, I just want to thank you so much for taking the time to come on the show and hash out all these topics, I think it’s really interesting to get your view on all this. Before we go I’d just like to provide everyone with links to the relevant material, so the book is at github.com/addyosmani/backbone-fundamentals, and do you want to give some links to your Twitter and your website for people to look you up online.

Addy: Absolutely. I’m on Twitter @addyosmani, so that’s a-d-d-y-o-s-m-a-n-i; and that’s the exact same for GitHub, so github.com/addyosmani, and if you’d like to read a little bit more about some of the screencast books and articles that I write, they’re all on addyosmani.com.

Louis: Fantastic, that’s all pretty straightforward. So, again, thanks so much for taking the time to come on the show and talk about this, and I really look forward to seeing how this book develops and how people jump in and contribute to it.

Addy: Absolutely, thank you for having me.

Louis: It’s been a pleasure, thanks.

Addy: Great, thank you.

Louis: And thanks for listening to this week’s episode of the SitePoint Podcast. I’d love to hear what you thought about today’s show, so if you have any thoughts or suggestions just go to Sitepoint.com/podcast and you can leave a comment on today’s episode, you can also get any of our previous episodes to download or subscribe to get the show automatically. You can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. The show this week was produced by Karn Broad and I’m Louis Simoneau, thanks for listening and bye for now.

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.

Episode 144 of The SitePoint Podcast is now available! This week the panel is made up of Louis Simoneau (@rssaddict), Kevin Dees (@kevindees), Stephan Segraves (@ssegraves and Patrick O’Keefe (@ifroggy).

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #144: Freemium Schmeemium (MP3, 30:52, 29.6MB)

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 main topics covered in this episode:

• Google To Pay Mozilla Almost $300M/Year in Search Deal.
• Let’s get honest about uptime – (37signals)
• Keeping up with the 2012 U.S. election with Google.com/Elections
• Done with the Freemium Business Model

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/144.

Host Spotlights

• Kevin: 1000 Doors – Public Art Installation
• Patrick: Steven Tyler, Alice Cooper, Weird Al – Come Together
• Stephan: Why Best Buy is Going out of Business…Gradually
• Louis: Domo Arigato, Mr Roboto – Android’s New Font

Interview Transcript

SitePoint Podcast #144

Louis: Hello and welcome to the first SitePoint Podcast of the year 2012. We’re back with a panel show covering some of the news that’s happened while we were on break. With me today on the show are Kevin Dees, hi Kevin.

Kevin: Howdy, howdy.

Louis: Patrick O’Keefe.

Patrick: The podcast is back! (Laughter)

Louis: And Stephan Segraves.

Stephan: Happy New Year guys.

Louis: Happy New Year.

Kevin: Happy New Year.

Louis: It’s good to be back, lots of stuff I guess been going on; you guys all have a good break?

Stephan: I had a good one, it was a good break.

Patrick: Yes, yeah, definitely had a good break. Time with the family, holidays, New Year’s, yeah, it was going good.

Kevin: Busy, busy.

Louis: Awesome. Fantastic. So let’s just kick straight into it, who wants to do the first story.

Patrick: Before I do the first story I just wanted to throw over a congratulations to Kevin who has joined Ryan Carson’s Treehouse as an expert teacher, right Kevin?

Kevin: Yes, that’s correct.

Patrick: That’s what happens when you’re down with the SitePoint Podcast. Look, you’re only one episode in and you’re rocking with Mr. Carsonified (laughter). I mean it’s all due to us.

Kevin: Yes, you know.

Patrick: No, I’m just kidding.

Louis: Congratulations Kevin.

Patrick: Congratulations.

Kevin: Well, thank you, thank you.

Patrick: Cool. So last show we talked about — and last show was December 9th because we took that break, and we talked about the Google and Mozilla Firefox search deal and how it was expiring and how Google had accounted for I believe it was approximately 84% of Mozilla’s 2010 revenue, so that was about 100 million dollars of Mozilla’s revenue was reported to have come from this Google search deal, and it was ending. So there were some competing thoughts there: would Google re-up to maintain that search traffic to be the default search engine in Firefox or would they opt out, save the money with Chrome you know now being the second most popular browser in the world, and the answer came just a couple weeks later during our break where it was reported that they signed a new deal with Mozilla to re-up for three more years and that Microsoft and Yahoo were also interested in making the deal, but Google won out thanks to a bid of at least 300 million dollars per year, according to all things d.com and Cara Swisher who says that according to sources that amount which is 900 million over three years was the “minimum revenue guarantee for delivering search queries garnered from consumers using Firefox. So that is up again from that 100 million to 300 million a year, just shy of — she says, “Just shy over under a billion dollars over three years,” so Google did continue the deal. Is that money well spent do you think, 900 million dollars over three years to be the default search engine in what is now the third most popular web browser?

Louis: From my point of view what really might have driven this is just the fear that if Microsoft were to pony up and get in that spot, you know, that’s 20% of the browser market’s default searches now going to Bing.

Patrick: Right.

Louis: And that might just be sort of the foothold that Bing would need in order to sort of sway a lot of people to become regular users, right? As a Firefox user myself, even if I want to do a search myself and I don’t type it into the little search box I’ll still go to Google because I’m just sort of programmed to think that Google is the search engine, but if new people coming to the Web were to use Firefox and just get into the mindset that Bing was the default, that might really give Bing a leg up and that can mean big traffic losses for Google, so clearly they though it was worth it.

Patrick: Yeah, yeah, very true, and Google has some money to spend, and that search traffic is directly converted into ad revenue through Google AdWords, so when people type something in they get taken to a page with Google ads.

Louis: Yep, absolutely. So I mean it might even be that they did the math and figured that this was actually on the straight up dollar-to-dollar still beneficial to them. Yeah, I mean it’s great news for Mozilla obviously, and like I was talking about on the last panel show, I think it’s really important that we have at least one browser that is not controlled by a private company, and Mozilla has that browser at the moment and it’s good to see that they’ve secured enough funding to keep pushing ahead in the years to come, and that going to show in this case that even if it gets to the point where Chrome takes over even more market share that potentially Microsoft or Yahoo would still be willing to pony up and pay for that placement in Firefox which will ensure the browser has funding going forward.

Patrick: Yeah, and to I guess wrap this story up I thought I’d take a quick look at where the market share headed in December since we’re talking about it, and browser market share for IE was down, according to the global stats from Statcounter from 40.6 to 38.6, whereas Chrome went from 25.6 to 27.2, a gain of about a point and a half.

Louis: So almost all of IE’s loss went directly to Chrome.

Patrick: Yeah, and Firefox maintained about the same gain, a very small margin, so Chrome is gaining on IE, and as far as surge in the market share, Google 91.32%, so still holding firm.

Louis: Right, (laughter) no serious threats to that dominance there. So I had a story that just came out today, it’s a blog post on the 37 Signals blog, so for listeners who might be unfamiliar with 37 Signals, it makes web applications like Basecamp and Campfire, which are sort of collaboration tools for teams to use online, and also the Ruby on Rails platform sort of came out the early work that 37 Signals did on Basecamp. So they did a post entitled Let’s Get Honest About Uptime, which was published on January 2nd, and just sort of a review of what the uptime numbers for their apps were over the past year, and so just sort of talking about the value of tracking your overall uptime, for those of us who run or maintain web applications I though it was really interesting because it’s something that we don’t tend to think about, we think about if you ask me how often — what’s the uptime for flippa.com I’d say it’s pretty good, we don’t have a lot of downtime, but I couldn’t off the top of my head tell you what the number is whether it’s 99.5% or 98% or 99.99%.

Patrick: Yeah, and there are two things that come to mind as I read through the story, the first one is as Scott Windsor references in the article, Twitter is a good example of a site that was down a lot but still grew in popularity, and it kind of underscores the importance and the difference between maybe consumer apps that are targeted toward the general public, and then business apps which are aimed at businesses and enterprises who are using them as part of their operation, so that downtime he mentions Gmail, for example; “If Gmail is down for even five minutes I start getting sweaty palms,” he says. And that’s exactly right because you’re getting your email, it’s part of the business communication with your clients, how you’re making money, and if you can’t get to that it’s a big problem even if it’s only five minutes, so I guess it really varies based on the intended audience for the application.

Louis: Yeah, absolutely.

Patrick: And then you know for the average webmaster and average app developer I guess, what is — and maybe this is a stupid question but, you know, those are the type of questions that I ask, what is the easy way to monitor app uptime? Is there a tool? Is there a recommended service that’s affordable? Is this something that’s in your basic server analytics by default or how do you go about it?

Louis: Yeah, well, it’s a point that he brings up in the actual post he mentions a few different options, so the Amazon Web Services Health Dashboard and the Google Apps Status Dashboard, if you’re using either of those two services to host your apps they only give you sort of a week at a time of uptime, so it doesn’t give you those stats over the course of a year, so you’d have to probably run your own status thing that collects stats over time and lets you look at that.

Kevin: There is an app out there.

Patrick: So I’m sure there’s some open source software.

Kevin: Called Pingdom, and you can check the site out at Pingdom.com, and essentially what this does is it helps you monitor that uptime and it helps you operate at whatever your guarantee is to your customers, whether it’s 100% uptime or — I mean not that you’d ever make 100% uptime, but it makes it viable.

Louis: Yeah, the one we use at Flippa.com is called Wormly, so that’s at Wormly.com, and that’s a very similar service that just sort of pings your website over a period of time, if it doesn’t respond it can send you an SMS or an email and it tracks your uptime, so there’s a number of services that you can use for this if you’re interested in it; obviously anyone running a big web application where people care about being able to access it all the time, like you were saying, Patrick, it can be a very important thing to be paying attention to.

Kevin: Right.

Patrick: Yeah, I went to Wormly and Web 2.0 name alert, Web 2.0 name alert! No, I’m just kidding, (laughter), but I went to the About page of Wormly and right there under customer love is a testimonial of Mark Harbottle of 99designs (laughter), “We monitor everything with Wormly, website down equals lost revenue, it’s pretty simple, really,” end quote, so that from Mark.

Kevin: Right.

Louis: There we go.

Kevin: I mean the last thing you want is downtime there in your peak hours, and that’s when you’re most likely to crash, right, when you have the most amount of traffic in. So, having a service like this to monitor that kind of thing going on, especially if you run ecommerce, it’s critical that you’re up and open.

Louis: Absolutely, and do you think though in this case the 37 Signals guys have gone and posted on all of their websites, if you go to any one of the ones, so Slash Uptime, so Basecamphq.com/uptime, it give you an uptime report for the past 12 months and just breaks it down how much downtime per day across the whole range. Do you think it’s worth doing as a public thing is showing your customers how much uptime you’re pulling?

Kevin: I would think that’s a little meta, to be honest, I couldn’t see — I don’t go to many of my services and say how much uptime do you have, that’s something I do with a webhost, but with the apps that I use I kind of — it’s one of those things where you just trust them to use it and if they don’t service, you know, if their service isn’t available because it’s down then I’d complain or something, and three strikes you’re out kind of deal, I don’t —

Louis: Yeah.

Kevin: I mean it’s nice to have as a guarantee, but.

Louis: The numbers don’t matter so much as if it was down .05% of the time but that was the time that I needed it then I have a negative experience.

Kevin: Right, exactly.

Louis: The number doesn’t mean that much to me as a customer.

Kevin: Right.

Patrick: If you’ve got good uptime it’s a selling point though, (laughter). But it also has to I guess again do with the kind of audience too because 37 Signals, you know, kind of techie audience I would say, it’s fairly safe to say they deal with a lot of web designers, developers and those sorts of people, and it is something that impresses their audience, so I guess there’s a business value there. But if it’s really needed as far as this page with all the green dots on it, I don’t know; it looks good (laughs).

Louis: Very interesting. And one of the other points that he brings up in the blog post is that they definitely include scheduled downtime in their numbers, which I think is a relevant thing to do, I think you can’t sort of get around these or, you know, fake the uptime numbers by excluding downtime when you were warned about it in a day in advance.

Patrick: Yeah. We will be down for the next 24 hours but this doesn’t count (laughter), you know, doesn’t count guys. Yeah, that’s funny.

Louis: Alright, next story.

Kevin: I can do mine.

Patrick: Don’t beat each other up over this one (laughter). I’m just kidding, go ahead Kevin.

Kevin: My story today is covering the Google.com/elections website which just came out, oh, looks like 10:00 a.m. this morning. But basically it’s a portal site where you can keep track of everything going on during the election year, so it’s a pretty cool site; if you go and check it out they have all kinds of statistics based on things.

Louis: Just to specify for our worldwide audience we’re referring to the United States election.

Kevin: Thank you, thank you.

Patrick: What other election would it be? Calm down Louis! No, I’m just kidding.

Kevin: Sometimes I’m forgetful that more than — I’m an average American I guess you would say (laughter). But basically you can go into this site, and I think it’s really interesting to see how Google is helping the average Joe, someone like me, get a better grasp on what’s going on in the elections, who’s trending; they have a section for trending and that kind of thing. So I think it’s a really cool concept and hopefully we can see it across more than just this election but elections to come and other elections outside of the presidency.

Louis: Very interesting. If you go to Google.com/elections you’ll notice it’s got Politics and Elections in the left-hand side, and if you click on the dropdown where it says U.S. Edition there is also an Egypt Edition, so they’ve already done at least one other one.

Patrick: Take that!

Louis: Wow, that’s a lot of political parties, okay; we have it fairly simple in U.S. and Australia.

Kevin: Yeah. I think this is really good.

Patrick: Yeah, we do, for better or worse (laughs).

Louis: But it’s very nice, and I think for being able for people to have one central place to go and find out about all this information, and if they do a good job of aggregating the news and looking at the trends, yeah, absolutely, it’s a great piece of work, I’ll look forward to it if it’s every deployed in a country that I live in.

Kevin: I was going to say kind off-topic a little bit, but it would be interesting to see if it comes into this circle, I haven’t really searched around much, who’s thinking about the SOPA debacle that’s going on right now.

Patrick: Right.

Kevin: SOPA is Stop Online Piracy Act, right, yeah, there you go.

Patrick: One other thing that comes to mind as far as what developers, webmasters and whatnot, is the general reminder that election season if you get a lot of U.S. based traffic is an opportunity to get more traffic, and while Google’s platform, Google’s whatever you want to call this portal, is useful, it’s also beneficial for Google to categorize their content, and obviously Google has more content and more offerings than most people do, but that doesn’t necessarily mean that you can’t as a small blog, or a decent sized publication even, can create a special section and kind of tie your content in. For example, Google has YouTube.com/politics that they have a lot of the hot political videos linked through, and they direct people to that area of YouTube from this elections page, they have a Google Calendar linked that shows relevant political dates that appears to be maintained by PBS. And they have other ties to their products, like Google+ and whatnot, so it’s coming up on that type of season where you can start to put your content and your ducks in a row if you are a general news or a topical sort of publication. That was my effort to make this audience-centric, sorry (laughter).

Louis: No, that was good, it was good.

Stephan: I think something that they’ve done here, looking at this elections thing, is the On the Ground piece, like Trends is cool and all, but the On the Ground piece is where I see something — it being really useful because it’s got all these dots on it, it’s basically news stories from specific areas, so right now everything’s in Iowa because of the Caucus’, and so different parts of Iowa have different numbers of stories, so I think it’s useful because as the election grows and we get closer and closer to the election date you’re going to see stories from all over, and this will give you a visual of where all that’s coming from, and that’s something different, we haven’t seen that before.

Patrick: And, Stephan, you have the last story.

Stephan: Yep, the last story belongs to me, and this is a story about Freemuim, and Tyler Nichols is saying he’s done with the Freemuim business model. And he lays out a couple of reasons for this, one being that free customers are higher maintenance than paying customers, and so he gives kind of some anecdotal evidence of this, having to create an FAQ and answer these questions, but he still gets email questions, and then he talks about how people just use his service and then they complain about it. So is this a reason to get rid of Freemuim? I don’t know; it seems kind of whiney to me, maybe (laughs).

Louis: I mean obviously it’s a bit of a personal manifesto from this one guy about why he won’t use it anymore. I think it’s interesting, obviously a lot of sort of new web applications have adopted the kind of Freemuim model, you know I talked with Jan Lukacs of the PAYMO, which is like an online invoicing tool, and he was saying they definitely embrace Freemuim and they use that, and they’re going to continue to use that even if other players in their marketplace switch to only paid plans. This is interesting because it was sort of a different perspective, it’s something a lot of people are doing, and this was sort of an example saying, look, it’s just not worth it. He was saying that he sent follow-up email thanking people for using the site and there was tons of spam reports from the free customers and non from the premium or the paying customers. It’s another interesting point, people who are paying for something are a bit more conscious of having signed up for the service, so they’re much more likely mark mail as spam I guess.

Kevin: What about Wikipedia, because you see sites like that, that’s a — it’s basically a Freemuim where you donate, obviously there’s donations involved, in fact, Wikipedia just finished getting their first, or their rounds of donations, right, you know the little advertisements at the top of the page.

Patrick: They raised 20 million dollars from one million donors, but Wikipedia was a non-profit obviously.

Kevin: Right.

Patrick: So it’s a little different.

Kevin: Thank you.

Patrick: Yes.

Kevin: So, as Patrick said, they raised 20 million dollars from one million donors, and this goes to show that a service can use a Freemuim model, but I think it also has something to do with the community that’s involved in Wikipedia because it is community driven, whereas this Santa thing is a one-man show in a way.

Louis: It’s also fair to note that Wikipedia isn’t strictly speaking Freemuim, it’s just free, because you get the exact same product whether you pay for it or not.

Kevin: That is true.

Patrick: Right.

Louis: So, it’s just 100% free, you can donate if you want to, and it’s a non-profit. So it may be a bit of a different situation but it is interesting, there are tons of businesses out there that make money, and you know it’s a constant discussion that we’ve talked about on the podcast before, you know, all of the ways you can sort of monetize a web application or a website, be it through advertising, donations, we’ve talked about donations I think towards the end of last year and whether a donate button for contents was reasonable. I think it was Patrick, right, who said you wouldn’t use a donate button because you thought it sounded desperate?

Patrick: Yeah, that was my general perspective because I don’t really like to put up a donate button on websites where I am trying to make money, right.

Louis: Right, yeah.

Patrick: Because I think it looks a little desperate. And me personally, I think some people would question the stability of the operation if you have to ask for donations all the time, if you have a constant donate button, a constant situation where you need donations I think it’s better to find another way.

Louis: Which is obviously different for something that is a non-profit and that isn’t trying to make money –

Patrick: Right, exactly.

Louis: — they just want to keep the thing operating.

Patrick: Yeah. And for context it’s important to say, like Kevin mentioned it briefly, but this was like a letter for Santa site I guess where you could have a free letter from Santa and then the Freemuim part of it was that you could pay for a higher resolution letter, a personalized envelope and a door hanger, and he got over 120,000 unique visitors and nearly a million page views, the site was used to create 50,000 free letters, he doesn’t mention how many people actually paid. But, like you said, I mean it’s definitely a personal thing, and I think what it underscores to me is, I read the post, and I respect what he’s saying, like I respect the perspective, I understand it, I get it, and it’s right for me I think to say this and to have this stance that Freemuim customers they cost me money, they cost me time, they’re less patient than the people who pay, they’re bad for my business; I totally understand and respect it. But, you know, it’s a case-by-case type basis sort of deal, there’s no one way, one size fits all here, for some a Freemuim model makes a ton of sense, and there’s businesses you can point to where Freemuim model has worked awesome, and then for other people like this gentleman it’s not the best way to go for what he is trying to accomplish, so I think that’s kind of the message I take from it.

Stephan: Well, and I think this comes back to the idea that we’re still trying to figure out how to make money on the Internet.

Kevin: Right.

Stephan: Right. So some people want to offer a free service and then charge for an extra feature, in this case a higher resolution version of the letter, and we’re still trying to figure out how to make that mesh together to where you don’t take away the experience for the free customers because you want to draw them in and make them paying customers, and you don’t want to make — you don’t want to wash out the paid experience to where the paid users feel like they’re paying for nothing, right.

Patrick: Right.

Stephan: So it’s a balance.

Patrick: It is a balance. Well, you know, I guess we’re still trying to figure out how to make money online, but we’re always making adjustments and that’s just business. Like gaming is well known for a Freemuim model, there’s tons of mobile apps, mobile games that are free and that you can pay for extras or pay for another version. And one other point I wanted to make with this particular situation is that there are some that would say that he would not have sold many of these letters from Santa, whatever he sold we don’t know, without the Freemuim version to initially hook people in, there are some who would make that point, because this is just kind of a generic letterfromsanta.org, it’s not attached to any larger brand that I’m aware of, so part of the allure at first you have to imagine a great deal of the marketing, so to speak, the word-of-mouth marketing came from ‘here’s a way to get a free letter from Santa’, then when they get there they find out that they can pay for this extra stuff, and then some opt to do so. Now, if that wasn’t a feature, if it was simply paid, you wouldn’t have most likely 3,000 likes on Facebook, and that’s what his page has, so there are some who would make that point.

Kevin: Yeah. I would also say, too, the Freemuim model about offering things for free is the fact that when you go to a brick and mortar store you can physically walk in a store and look at the products and experience them in whatever way you need to, right. Whereas with online all you can do is just look at things, right, so a Freemuim model is kind of a way to create that same type of feeling where somebody can walk into your online store or your online service and experience the product before they purchase it. I think one of the other things to note about what he’s doing here is once a customer’s bought it they’re done, it’s not like they’re gonna buy from him again, maybe the next year, but one purchase a year is not really a very excellent business model. Now, you have a service like say 37 Signals where you can get I believe a 14 day or a 30 day trial to try out the service, that’s slightly Freemuim, it’s not — you don’t maintain your free membership on their site forever, but at least you can try it out, and if you subscribe that’s every month they have cash coming in, so it has a lot to do I think with the product you sell and your customers.

Patrick: It’s all marketing trade-offs.

Louis: Yeah, 37 signals is an interesting one because when they originally launched their products they were Freemuim, they had a free plan for everything, but now a lot of them are still there but they’re kind of hidden. So if you go to bascamphq.com/signup you’ll see that it’s offering three plans which, wow, from the look of it have increased pretty dramatically in prices since the last time I looked. And then at the bottom below those three plans that are all with big buttons there’s this tiny little text that says we also offer a basic plan and a free plan.

Kevin: Right.

Patrick: Right.

Louis: So a lot of places have taken to sort of hiding the free plan, and that’s sort of the current approach to Freemuim for a lot of people is to make a free plan available if someone really wants it, but don’t show it off because then everyone signs up and then they become an annoyance.

Alright, well I guess that wraps up the news stories for this week, maybe we can dive into the spotlights.

Stephan: Sure, I’ll go first. Mine’s kind of a downer or a good article (laughter).

Patrick: Nice setup.

Stephan: Yeah, it’s a Forbes article on why Best Buy is going out of business gradually, and it’s an interesting read and it doesn’t just focus on their fiasco over Christmas but focuses on some other things such as customer experience in the store, and kind of some comments that Best Buy has made out publicly about online retailers such as Amazon. Best Buy thinks of themselves as the place where people come to look and feel before they go buy on Amazon, I mean maybe that’s true, and so this article kind of examines why they’re losing their market share and they’re going out of business.

Patrick: Hmm, it’s interesting. I can say that I’ve never really — I’m trying to think, have I ever bought anything in person at Best Buy. Most of my Best Buy purchases have been through their website without going to the store, and it’s usually music exclusives because sometimes they get exclusives to a certain song or some kind of bonus material, so I’ll buy through them online and have it shipped to me, but I don’t know, I never got hooked onto the whole Best Buy experience.

Stephan: Yeah. I mean we rarely buy anything. We’ve had some pretty bad experiences there, so.

Patrick: You rarely buy anything at all. No, I’m just kidding.

Stephan: Well, no, we rarely buy things at Best Buy, yeah, you understand what I meant.

Patrick: (Laughing) Yeah, I understood, sorry. So I’ll go next since I so rudely accused you of not buying anything. What I found was a video today that is definitely the coolest thing I probably will see all day, but it is from a New Year’s Eve party in Maui Hawaii, it is Steven Tyler of Aerosmith, Alice Cooper and Weird Al Yankovich doing Come Together, Live on New Year’s Eve. And, you know, the combination it’s just, you know, it’s one of those things you don’t expect to see and probably will never see again, but it’s a really awesome clip, so I’d recommend you check it out.

Louis: Will do.

Patrick: That’s Patrick’s off-beat spotlight of the week, ba-dum!

Louis: (Laughs) you always come through, Patrick.

Patrick: Thank you, sir.

Louis: Alright, my spotlight is a little bit of an article on Boing Boing which is about the new system font in Android 4.0, and if anyone sort of followed when the new version of Android was announced and the font was first demoed there was a lot of backlash on the Internet from people who are into design or people who were interested in the font. So there was a lot of backlash, people saying it was kind of uninspired, it was just sort of a hacked together version of features of different fonts including Helvetica, people called it a Franken-font. Anyway, so this particular article on Boing Boing which was published on January 1st is a really interesting breakdown of the typographic features of the font, which is called Roboto, and even if you’re not an Android user or don’t care about Android, don’t care about iOS, if you’re a web designer and you’re interested in fonts but you’re not really too up on all the typography, it’s really interesting to see a breakdown of really all the finer points of detail that go into making a font, and how you try and make something that adapts to the environment and that’s readable on a variety of screen sizes and all that sort of thing. So a really interesting read, have a look at that.

Patrick: People take fonts really seriously.

Louis: They do, they do (laughs).

Patrick: The first comment in this article is “I do not find Roboto more readable, I find it more jarring,” I mean I don’t know, I mean I guess it’s jarring, I don’t know, that’s just not how I would really — I mean unless they threw up Comic Sans on the thing I mean that I might find jarring, but, you know, this font doesn’t really have that effect on me. But, you know, some people do get real attached to certain design elements, certain UI aspects, and I guess that’s what happens here.

Stephan: It’s actually not a bad font. I kind of like it. I’m just looking at –

Patrick: It’s clean.

Stephan: Yeah, it’s very clean. I kind of like it.

Louis: I find it’s a little less — the previous one which was Droid Sans struck me as a little bit too fancy, like it was trying to do too much, and it was very recognizable. This one is sort of very plain, you don’t really notice it, it’s a bit narrower than Helvetica or Arial, but it’s definitely nice and clean, and I like the shape of the numbers.

Stephan: Yeah, they look good, looks good. This’ll be a good read.

Kevin: Alright, so my spotlight for today is not very Web related but it is pretty cool if you’ve ever seen Monsters Inc., the movie, where the monsters have to go through the doors and scare kids, you should check these photos out, it’s of what appears to be a building covered in doors, and there’s a thousand doors on this thing, and each one of them appears to be unique, and it’s just kind of inspirational in a way, a little interesting and intriguing to look at, and it’s just a simple little blog post that there will be links for, you can find it at feeldesain, I’m guessing that’s how you say his name, .com, and then, yeah, I think it’s pretty cool.

Stephan: Interesting.

Patrick: Yeah, it looks cool. It’s a good use of doors.

Kevin: Yes.

Patrick: It’s like these doors lost their homes and this person adopted them and put them on the side of a building.

Stephan: (Laughs)

Louis: Wow, that’s pretty huge, it’s a lot of doors.

Patrick: And it’s like spaces for more doors up at the top if you look real close.

Louis: Yeah, it looks like it’s sort of in-progress so there’s room for more, or maybe those are screen doors up at the top.

Patrick: Yeah, there are some screen doors too (laughs), yeah, you might be right, they look like gaffes or really –

Louis: Because they look like they all have frames, in different colored frames.

Patrick: You know you might be right, good eye, I guess you don’t need to donate your doors to him then.

Louis: Alright, awesome. Alright, well that’s a wrap for this week’s show, the first show of 2012, hopefully looking forward to a good run this year, good luck for all the listeners in whatever projects they have planned for 2012.

Patrick: We need to go around the table.

Louis: Yeah, alright, let’s wrap it up, go around the table.

Kevin: I’m Kevin Dees of kevindees.cc, and you can find me on Twitter as @kevindees.

Patrick: I am Patrick O’Keefe for the iFroggy Network, on Twitter @ifroggy, i-f-r-o-g-g-y.

Stephan: I’m Stephan Segraves; you can find me on Twitter @ssegraves.

Louis: And you can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. You can go to sitepoint.com/podcast for all the information you want about the show, you can see all of our previous episodes, you can subscribe to the RSS, and you can leave comments on this show. You can also email us if you want to get in touch, that’s podcast@sitepoint.com. The show this week was produced by Karn Broad and I’m Louis Simoneau. Thanks for listening and bye for now.

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.

Episode 143 of The SitePoint Podcast is now available! This week our regular interview host Louis Simoneau (@rssaddict) interviews Bruce Lawson who is a member of the Web Standards Project’s Accessibility Task Force, works at the Opera team and contributes to HTML5 Doctor.

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #143: Happy HTML5 Holidays with Bruce Lawson (MP3, 37:44, 36.2MB)

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

Louis sits down with Bruce Lawson to talk about HTML5 semantics, usage, developed, packs, workarounds, polyfills and everything in between.

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/143.

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint podcast. As it happens it’s the last episode of the SitePoint podcast for 2011, and with me on the show today I’ve got a suitably fantastic guest, Bruce Lawson. Bruce is a member of the Web Standards Project’s Accessibility Task Force, he works on the developer relations team at Opera, he’s a legend really in the fields of accessibility and web standards, an expert on HTML5 and a contributor to HTML5doctor.com. Have I forgotten anything? And hi and welcome to the show, Bruce, while I’m at it.

Bruce: Hi Louis, hi everybody, no, you haven’t forgotten anything that summarizes me, although possibly the Wasp Accessibility Task Force, I’m kind of a emeritus member of that, I haven’t done a great deal with that for a while.

Louis: Right. So, yeah, I wanted to have you on the show for a number of reasons, there’s all sorts of stuff going on, obviously HTML5 has been a major topic in the web design and web development world for a little while now, and you’ve certainly got a lot to say on that. In fact, the second edition of your book on HTML5 has just been released if I’m not mistaken.

Bruce: That’s right, yeah, I think it came out, I don’t know if it hit Australasia yet, it came out in the UK about a month ago I think, it’s quite exciting for Remy and me, so lots of typos and bits of utterly oblique language corrected and opened up and a whole new chapter on how you can actually use this stuff now because that’s why everybody came up; at conferences and things people will sidle up and up and say, “Oh, sounds great, but how can we use it now?” And it occurred to us that we’d very cleverly omitted to mention anything useful like that in the first edition, so it’s in there now.

Louis: Yeah, there was certainly a lot of trepidation, I want to come back to this and sort of ask about the new edition because it is, if I’m not mistaken, the first second edition of an HTML5 book, so that’s got to be some kind of landmark for the maturity of the specification of the language.

Bruce: It may not be because my chum, Peter Lubbers, and some colleagues of his from Kaazing wrote Pro HTML5 Programming, which may have come into second edition before ours, it’s certainly out as a second edition, I don’t know who was first but we’re not competing.

Louis: What I was saying is we’ve reached that point where there are now second edition books about the topic, so that does say something about HTML5 and maybe its staying power and that it hasn’t petered away.

Bruce: Well, it may not be indicative of the maturity, it may be indicative of just how much the whole thing is shifting sands and things are being changed from under our noses so we have to go and rewrite stuff, I wouldn’t necessarily say that it’s indicative of maturity, put it that way.

Louis: Hmm. So, talking about the second edition of the book, you said one of the things you focused on was a chapter on putting the stuff into practice, and I know I worked on the HTML5 and CSS3 book for SitePoint, and that was something we had in our minds when we started working on it because your book and Jeremy Keith’s book were already really strong on sort of that, you know, explaining the specs and the process by which they came about and what they really mean, and we wanted to try and maybe just do something a bit different and focus more on the practical aspects. But are there any other things that you’ve had to change, for example, things that have just flipped around on you and you’ve had to actually go in and change?

Bruce: A fair few. I changed my mind on the semantics of using the nav element. Originally I was marking up everything that looked like a link to somewhere else in the website as nav, and I was actually doing a workshop at the BBC and talking to some of their web developers, and they convinced me, or I convinced myself, I don’t recall how it went, but we kind of convinced each other that I was being a bit overzealous and had suffered nav-itis for a year, and so I changed my mind about that. The time element disappeared and then came back (laughs) or it will be in a modified format so it won’t be, as we say, in the book, but it will be in the spec. A lot of new stuff with multimedia, so in the first edition I put together a dirty, dirty hack to do our timed transcripts, timed captions to video, and by the time the second edition was out the spec was pretty much sorted on a new format called Web VTT which is Video Timed Text which will be probably the easiest way for web authors to add subtitles and captions to audio and video, so it was really great from my accessibility background to be able to say goodbye dirty hack is the official way, and point to some pretty damned great polyfills that you can just grab off the shelf and employ now. So if that’s your thing you want to look up Playr, p-l-a-y-r, which is kind of a nice quick and dirty way to do rapid prototyping but it doesn’t work in IE10 yet. There’s also a really great polyfill called mediaelement.js, and this is totally fab, at the moment it relies upon jQuery but I think that dependency will go soon. But what mediaelement.js does is it adds subtitle support, etcetera, as a polyfill, but what it really cleverly does is it fakes all the JavaScript HTML5 API’s for audio video and implements them in Flash, so if you’re using IE6, IE7, IE8, you get a Flash movie instead of native movie but you can still interact with it using all the JavaScript API’s because it fakes it. And because our community is so brilliant and generous all these things are open source and you can just grab ‘em and use ‘em and that’s deeply marvelous.

Louis: Yeah, that’s fantastic, I was unaware of that sort of wrapping of the Flash movie with the API, I can exactly see how that would come in handy, you write your JavaScript once and it just interacts with the movie the same way whether it’s a Flash movie loaded in or not.

Bruce: Exactly.

Louis: You were talking about the new subtitle specification and sort of presenting some polyfills for it; is there any actual browser support on the ground for that yet?

Bruce: I think there’s a Labs release of IE10 supporting it, they said they’re going to support Web VTT, which I said was the easiest mechanism for web developers to subtitle stuff, but it’s not the only mechanism, there’s an existing standard called TTML which is a far more sophisticated XML based subtitling method which a lot of the big, big houses like from the top of my head Netflix and the BBC have already been using, and Microsoft is going to support TTML, but because it’s XML based it’s harder for Mr. or Ms Joe web developer to bung on their sites. Chrome have said they will support Web VTT, and I work for Opera so I can tell you that we are in the process of implementing it, but I don’t have a release date for that yet, whether Safari and Firefox are I couldn’t say, but I would imagine they are.

Louis: Yeah. But, again, if there are good polyfills out there that at least tides us over and we can start using the stuff –

Bruce: Precisely.

Louis: — and wait and see what happens with the browser support. Just talking about the browser landscape, I was looking through your recent tweets in the lead-up to the interview, and I saw you made an announcement about the recent release of Opera 11.6, which I’d missed, did you want to talk a little bit about what’s new in there.

Bruce: There’s a lot of really cool things. The coolest thing, which for a web developer of a certain vintage is insanely cool, and to everybody else it’s entirely yawn-arama, but it’s the HTML5 parser, and I show this to people and deliberately build it up as the coolest demo of HTML5 you’ll ever see, and then I show some markup which is b i, close b, close i, with the mis-nested text, and HTML4 as a spec told browsers what to do with good markup, but it had nothing to say about what to do with markup that wasn’t good, and we did some research in 2008 when we looked at three million randomly generated URL’s for a projected called MAMA, Opera MAMA, and we discovered that 96% of the Web surprisingly was not a valid markup. So the trouble is, is that the browsers didn’t know what to do with invalid markup, but all browsers are very forgiving beasts and don’t want to show you a blank screen so they do their best to render stuff. So what they’ll do with that mis-nested b and i is different things; IE and Safari behave one way, and Firefox and Chrome and Opera behave another way, and nobody’s right and nobody’s wrong because it was undefined. And if you’ve ever written JavaScripts that have to go around a DOM that you can’t predict and do stuff in a web app or a web based word processor, or whatever, you’ll know there’s a world of pain associated with the fact that you don’t know what an individual browser’s going to do with the same markup because of this problem. So HTML5 defines unambiguously and completely what to do with any variation of markup no matter how broken and twisted it is, every browser that implements the HTML5 parsing algorithm will produce the same DOM, and this might not seem glamorous to a newbie web developer, but to those of us who’ve been in it for ages the idea that you’ll get the same DOM across all browsers is a wonderful thing, and this isn’t just a theoretical benefit either, it’s great for consumers because nobody uses just one web browser anymore. My poor Mrs. who has to use IE6 at work will use Safari on her iPhone and then Opera on the home computer, so the idea that one website will work on one or two of those browsers but not the third, it’s mad, you know, and it’s utterly stupid of any business to have a website that won’t work on all browsers across devices, and the HTML5 parser is a step forward in interoperability between the browsers which is a massive win to the consumer who’s never even heard of HTML.

Louis: Yeah, absolutely, I can see the impact of it. Is Opera the first browser to sort of fully implement the parser as its specified?

Bruce: No. I believe it was in Firefox first, although it was an option, then it was in Chrome, so I think Opera is the fourth and then IE10 will have it I believe, although you can’t speak for unreleased versions yet. And, of course, once IE10’s got it this is a giant win for the interoperable web there, and we’re still of course going to have to take care of old browsers because not everybody has the luxury of being able to upgrade, that’s another thing that I feel very strongly about; it’s all very well telling people you appear to be using a crap old browser, please go away and upgrade.

Louis: Yeah, there was sort of a bit of a kerfuffle on Twitter about this a few weeks ago, I don’t know if you caught wind of a brief pitched argument with John Allsopp and few other people about this, the idea of supporting all browsers and older browsers inclusively, and John wrote a really excellent blog post about it.

Bruce: And I’m with John, you know; if you are a web developer it’s easy to forget that there is a world out there using old web browsers with no real end in sight to that. I believe the net apps stats show that 49% of the world is on Windows XP, and for whatever reasons they have Microsoft has decided that you won’t be able to use IE9 on Windows XP, and you certainly won’t be able to use IE10 on XP, so, 49% of the world will stay on XP and we know that most people don’t upgrade or install a different browser, so there’s gonna be if we’re not careful a web of haves and a web of have-nots, and that’s in my personal opinion entirely antithetical to the idea of a worldwide web.

Louis: But of course the people who have made that argument a lot of times this stuff gets inflamed over Twitter, and this is something that constantly comes up, because I like to bring up these sort of arguments and debates between the various factions in the world of web development in my interviews, and what always comes up is that people will say things on Twitter and provoke a debate because they had to compress their point of view into such a small amount of space that they made it much more absolute than it sounded. I did an interview with Jeremy Keith which entirely came about as a result of we had a discussion on a show about something that he had said in a blog post that we, you know, that seemed very absolute because he’d written it in that kind of manner, in a kind of provocative manner, and obviously people do that deliberately, but I don’t think anyone has been disrespectful in any of these debates, and that’s one of the things I really like about this community, and I think we can all agree on that is that people are very respectful even when they disagree.

Now, going on, let’s see, while we’re on the topic of controversial, I got a couple of recent articles that you sort of responded to on your blog, one in more length and one in lesser, so you’re very much a semantics guy and you’re really excited about the idea of semantics and that comes through a lot in your book and in your writing, and you’ve talked a lot about the issues with the time element when it was first dropped, and so there’s a recent article that I read and I thought was very interesting that Divya Manian wrote at Smashing Magazine which was sort of a deconstruction of the idea that — or maybe pointing out that a lot of web designers and developers spend a lot of time paying attention to semantics and maybe that’s not necessarily a good use of our time. And I thought it was really interesting because I saw a lot of different reactions to it, but personally I kind of felt, yeah, I get that, you know, I get that there’s been a lot of fuss about HTML5 in the sense of, oh, should we be using a section or an article or an aside, you know, and in your work and your writing at HTML Doctor you’ve encountered a lot of this when you’ve had to sort of rewrite articles when sort of the opinions about things have changed, and you even mentioned with regards to your book sort of changing your mind about nav.

Bruce: Yep.

Louis: And I thought this was interesting because a lot of people sort of came out and said oh, no, semantics that’s the most important thing or you can’t just do away with it, but I did think that maybe some kind of moderate consideration might be worth pursuing. So I wanted to know what your thoughts were on that because you did sort of respond to it in another article that you wrote for Smashing Magazine, even though it wasn’t a direct response you did sort of present a defense of semantics.

Bruce: Yeah, I mean I didn’t write that article as a response. Vitaly from Smashing Mag had asked me to summarize my Frontiers talk, but that happened to be a defense of semantics. I mean Divya’s right, if you spend an idea, you know, I have endless talks with Dan Cedarholm because he put a cite inside the anchor and I was putting the anchor inside the cite, and who was right and who was wrong, and actually of course if doesn’t much matter, what’s important is it’s consistency, in the same way with the nav element, I’ve always said think about who’s using it at the end; if every link inside the site is nav then the people who actually need the nav element, people with assistive technologies, everything’s a nav and so nothing’s useful to them. So it’s a matter of moderation and balance, and I’m certain that’s what Divya was writing, and I’d agree.

Louis: Yeah, I think some of it might come from, you know, we’ve had the same set of semantic elements which have had very limited semantic value for a very long time just using pretty much divs and spans everywhere with a few little highlights of semantic value here and there, and suddenly we’ve got this smorgasbord of elements with HTML5.

Bruce: Sure.

Louis: And like you said with nav, I think a lot of people might just get a little bit high on the fumes of semantic value and start throwing this stuff all over the place without really stepping back and thinking oh, well, I can use this the same way I’ve always used these little semantic touches like cite and like block quote.

Bruce: So, yeah, we’ve got this smorgasbord of new semantic elements, but we only have I think it’s 105 or thereabouts; if you think how many words we use in English to express ourselves it’s tens of thousands, so a hundred elements in our vocabulary means that there is nowhere near enough to express every nuance of your content because it’s about marking up your meaning and your meaning is the words and the intention, so inevitably there’s grey areas where no particular element seems to fit or two elements seem to be equally applicable, and the answer is, no, don’t sweat it, choose one and use that consistently throughout this site, and if you realize you might not have been perfect don’t sweat it, just do it better next time, it’s not worth getting a semantic knickers in a twist about. If somebody said to me what’s more important, correctly deciding between article and section or making sure that this works on IE6, I would say make sure it works on IE6, you know. Semantics are vital but they’re not the only game in town, and I know that Divya and I totally agree on that.

Louis: Yeah. This kind of leads in nicely, you were talking about the sort of limited vocabulary that we have in HTML, and that sort of leads into I wanted to get your view on what happened with the time element because we’ve sort of talked about it on the show before, but I think you might have a pretty interesting perspective, you wrote about it both when it was initially removed and when it was re-added. So my understanding was the initial idea was Ian Hickson removed the time element because he said, one, it wasn’t being used or it hadn’t gotten a lot of traction and, two, something similar could be accomplished with a more generic data element, sort of thinking, look, time is just one type of machine readable data so why give it a special place over all the other types of machine readable data you could have in your pages.

Bruce: So the history of time’s interesting. It was dreamed up because the micro format’s people were abusing the abbreviation element to markup dates and times, and this wasn’t a semantics knickers in a twist, this was a problem because certain screen readers with verbocity settings readout the totals of abbreviation element, and that in the micro formats world was being turned into an incomprehensible string of numbers and letters that people would hear instead of a human understandable date. So what was happening is that people with assistive technologies were actually not being able to comprehend the content given to them because there we no adequate way to markup dates or times in HTML. So, HTML5 gave the micro formats people this time element, but they crippled it by not allowing you to have a fuzzy date, by which I mean you could markup the 19th of February 1867, but you can’t say February 1867, and you can’t say 1867. And this is a problem for historians or people who run museum websites, and I know this for a fact because some of my friends do this, because of course you don’t necessarily have the absolute date, and also you couldn’t markup dates before the Christian era, so anything — even though you know that Julius Cesar was murdered on the 15th of March 54 BC you couldn’t write that because it’s before the Christian era. And so the micro formats community didn’t use the time element because it was crippled like this right from the inception, and then Hickson saw that nobody was using it and so removed it. And, yes, time is just one form of machine readable data, but it’s a special form of machine readable data, I mean my bugbear, or the bee in my bonnet, is the fact that most things on the Web are related to who, what, when and where, you know, who’s doing something, when are they doing something, where are they doing it. So we have a time element because the when is obviously important, we don’t have a location element, yet, although we might do, and that would have latitude and longitude as mandatory attributes and potentially an altitude attribute.

Louis: But, again, even if you’re — sorry, coming back to that now, just want to get your opinion on this, when you say latitude and longitude as mandatory attributes that, again, sort of precludes you from using a more fuzzy term like, say, Melbourne or Australia when you’re describing a place and you want to be able to mark that up semantically as referring to a place, right?

Bruce: Yes, I’m not saying that it needs — I’m not implying any kind of degree of precision here.

Louis: Right.

Bruce: I mean there’s no reason why you shouldn’t be able to say approximately 54 north or something, I don’t know, but it seems to me that there are certain types of machine readable data which are more prevalent and more common and it’s easier to see use cases or being able to access them through an element. So the trouble is with marking up a date or a time with the data element is that the attribute there’s no way for a machine to know that this attribute is a date or a time because it’s just some random data.

Louis: Right, and then to react to that and enhance it in some way by providing you with a richer set of metadata or interactions, yeah.

Bruce: Precisely. In the same way that why invent a header or a footer, why not just stick with div. Well, these are more specific, more obvious use cases, I’m not suggesting that we have a length of nose tag (laughter) and a circumference of eyes tag, and a distance from forefinger to elbow tag, because there are some use cases that are more important than others, and that’s why we only have 105 words in inverted commas in our vocabulary; HTML has to be a general markup language which means that you can’t cover every use case with it, but it means that it has to be easy to learn, and I’m a great believer in the Web remaining a place where it’s relatively easy to write and publish content, and I often used to worry that XHTML was heading to a place where you needed some kind of special, specialist training if you just wanted to write a blog post. I think we’re getting back to the degree of simplicity now, which is useful, although I acknowledge that most people don’t hand code HTML anymore, they use some kind of CMS.

Louis: Yeah, absolutely. But I mean I do agree with you that the idea of making it simple enough that anyone can write it, and even I would have a much easier time hand coding an HTML5 page than I would’ve had four or five years ago coding an XHTML page where I would’ve had to look up both the doctype and the various meta tags. Now I’m fairly confident that I could do the thing from scratch were I stranded on a desert island with nothing but a stick I could write my SOS in HTML, in valid HTML.

Bruce: Well, you’d need to; if you wrote your SOS in some kind of proprietary format then loads of IOS might not be able to display it, who knows about its SEO, you know, HTML is the lingua franca.

Louis: Absolutely.

Bruce: But I’m a great believe in the fact that the Web is the most democratic medium that we’ve ever had as people. I’m getting all poncy on your now, but I think it has to be easy to consume so you don’t have to have the latest three thousand dollar Macbook Pro just in order to be able to read a website, you don’t have to have a super, super-duper Wi-Fi connection, and neither should you need to have a computer science background to author the Web. There’s billions of people on the planet with stories to tell and pictures of kittens to show, and I want to make sure they can continue to show those things and everybody else can continue to access those things even if they don’t have the latest, greatest Smartphone over an industrialized nation’s Wi-Fi infrastructure.

Louis: (Laughs) and even then not all industrialized nations.

Bruce: I’ve been to Australia.

Louis: (Laughs) ah, yeah, still bitter about that one two years in. So those are great words and fantastic and inspiring stuff.

Bruce: Maybe you could dub in some angels like humming Silent Night behind this (laughs), but yeah, it is a nice outake.

Louis: I did want to briefly touch on the — because you released for the release of Opera 11.6, you posted a YouTube video of yourself playing a guitar and singing a Christmas carol about the new features in Opera 11.6, and I just wanted to specifically give you props for your rhyming of Gabriel with radial (laughter), as in the angel Gabriel with radial gradients, I thought that was fantastic, I listen to a lot of hip hop and that’s still one of the best rhymes I’ve heard all year.

Bruce: Thank you, sir.

Louis: So huge props for that. On to some more serious things, so you briefly mentioned in there that the democratic nature of the Web has a lot to do with the availability of bandwidth. And what I want to get to here is that obviously the big topic in web design over the past year, I think if anyone had to say what the topic in the web design sphere for 2011 was, we’d all agree that responsive web design was the clear winner. But people seem to have come up against one particular thorny issue in attempting to do responsive web design, and I noticed this because, first of all, because 24Ways — if anyone listening is not familiar with 24Ways you still have time, go to 24ways.org, it’s a sort of an advent calendar of great web design articles that comes out each December, it’s been going since 2005, fantastic stuff, and this year I’ve noticed that there have so far, even though we’re not even halfway through the month, there are so far already been two articles about responsive images. And I also noticed that you’ve recently written a short blog post sort of suggesting an alternative way of handling responsive images, and that kind of touched on this idea of bandwidth, right, because you’re doing a responsive design, great, it can fit all content, but if all you’re doing is adapting this one giant image to a number of different screen sizes that’s a huge bandwidth hit for most of your users, and a lot of those might not be seeing that giant image.

Bruce: Yeah.

Louis: So there have been a bunch of different alternatives suggested, and you’ve sort of proposed an interesting, maybe a more fundamental change that could take some cues from the video element.

Bruce: It just seemed to me that HTML5 gives us a video element which because of the debacle with no single codec working everywhere has the ability to pull in different source files using the source child element, and it struck me that if we had some kind of new version of image, and I call it picture but it could be called anything you like, then you could have source elements below it and a media query on those source elements, not in the CSS because it isn’t about layout, it’s about pulling and actually different sources, and then it could be handled declaratively. Because it seemed to me that if you can get something as cool as video and pull in different videos for different media queries, which works now in Opera and IOS, it seemed odd that for something as simple as an image we should have to resort to really clever and brilliant hacks with noscript and spacer gifs or mucking about with HTaccess and PHP and generating things on the fly. And I don’t want people to misunderstand me, I think the brilliant workarounds that people are coming up with are a testament to the excellent lateral thinking of my friends and my peers, but fundamentally we shouldn’t have to be doing those, it should be easy, and as you know I’m not a designer so I can’t do CSS, and I’m no longer a programmer so I’m too thick for JavaScript, so I’m very fond of simple declarative ways of doing obvious and basic web pages. And bringing in an image and making sure that you don’t nuke your mates bandwidth seems to be a basic use case, it should be basic HTML and shouldn’t need limbo-ing under HTaccess’ and shimmying weird deferred scripts, and maybe I’m wrong. And I have a great deal of sympathy with the idea that this should be negotiated between the client and server, so in other words, you say I want this image here and the browser should say to the server, well I’ve got low bandwidth at the moment, and of course that could change in a session, but at the moment I’ve got low bandwidth so send me the smallest in file size version of this image you have and then the server goes and looks to find out which one is its smallest version and sends that. And maybe actually this shouldn’t be something that web developers have to worry about, maybe this is something that machines should do, and this is an idea called content negotiation; my colleague and friend from Montreal, Karl Dubost, is a great believer in this. I think Carl is right, I think it should be done auto-magically, but we know that designers would prefer that fine-grained control rather than trusting auto-magic discussion between the silicon in your phone and the silicon on the server. So, I think we have to give a way for designers to do this, but again, I’ve got every sympathy with people who say okay well make up a new HTML6 picture element, but it’s still ten lines of code to put a responsive image on a page, isn’t that too much, and I think, well, if you think it’s too much let content negotiation deal with it and we’ll have to deal with a mechanism for that, but if you want the finer-grained control then you can do that in a simple declarative way. But, you know, yes! bandwidth matters, and at Opera we know this because we have all kinds of mechanisms for squeezing compression in pages to make things appear faster, but actually most people in territories or nations where bandwidth is either very slow or very expensive, because they’re paying by the megabyte, they’ll just turn images off anyway; every browser has a setting ‘don’t show images’, so you can bust a gut getting responsive images, but a lot of people just turn your images off anyway, and then of course that is back to basic good practice of making sure your web pages are accessible so that if people turn off the images they see the alternate text that tells the user what the image means.

Louis: Yeah.

Bruce: And if the image doesn’t mean anything then it shouldn’t be an image it should be a background image in your CSS. So, you know, it’s the thorny issue de jour, but ultimately it just comes back to basic good practice of semantic HTML with alternate text for images that are part of content or putting the prettiness and all the eye candy in the CSS because ultimately your users want the content, and we see this all the time and I know that loads of designers are now marching upon Birmingham UK to kick my head in (laughter) when I say that CSS is just prettiness, but, you know, in the vast majority of websites it is.

Louis: Yeah.

Bruce: Sorry designers.

Louis: (Laughs) I was just interested to talk about this because looking at your, it’s not really a proposal, but your just sort of quick sketch of how this might look, I thought, oh, that looks pretty good, makes sense, I would use that. And I had already looked at these two articles on 24Ways, and in both cases been kind of like uh-huh, not so much; definitely in the case of the sort of server side handling because I work on large enough websites that having a PHP process run for every request for an image is just not an option for performance reasons. And then the other one, the sort of the mix of comments and no-scripts and hacky JavaScript, I thought yeah, you know, that works, that’s very clever, I could consider using that and some kind of script based image loading. But, yeah, I was impressed by your idea and I hope to see something like that coming in, as you said, perhaps HTML6. But, yeah, as you said, the key, and we see it all the time, a well designed mobile site that when you pull it up on your phone it loads really, really snappily, even on Australian 3G, is a joy, and it’s something that a lot of people do, it just needs a little bit of care and stripping out the excess.

Bruce: Absolutely. And with the putative picture element, whatever it’ll be called, I know that this stuff is starting to be discussed, and when I published that blog post some biggish names in the ‘Responsive Design’ community got in touch with me, and bizarrely I duplicated a proposal they’ve been working on privately between themselves, even calling it the picture element.

Louis: Right.

Bruce: And so I know that they’re going to be putting a proposal to their working group pretty soon, so hopefully it’ll be discussed and acted upon. Again, nobody’s saying it needs to be called a picture element, nobody’s saying it needs to be exactly like I suggested, that was a straw man to say let’s have a simple way of doing this where you don’t have to know JavaScript and PHP and some really quite nasty hacks, because it always seems to me when you’ve got nasty hacks like that there’s something fundamentally lacking in the language.

Louis: Hmm-mm.

Bruce: That degree of complexity says to me that we need another wave of linguistic development to get back to the simplicity again.

Louis: It’s fantastic t to have reached an era when we can look at a hack like that and say what you just said which is, oh, if we need this kind of hack we’re probably doing something wrong, when we were doing this for rounded corners for seven or eight years and nobody said a word. Yeah, yeah, this is fine.

Bruce: Ah, but we weren’t’ doing anything wrong. What it was is that we didn’t have the necessary tools for the job. Jake Archibald’s 24Ways thing with no script and spacer gifs is not doing it wrong, he’s got a brilliant workaround for the fact that we don’t have the necessary tools; I really want to get away from the idea of hacks being something wrong or hacks are –

Louis: Absolutely.

Bruce: — brilliant creative workarounds where there’s an obstacle.

Louis: Yeah. I guess all I was trying to say was that it’s interesting that we now think about it somewhat differently than we used to, we used to see a hack and think, oh, that’s great, that’s all we need, end of story; now we see a hack and say, oh, that’s great, clearly we need to do something with the underlying specifications to make this possible without a hack.

Bruce: I think it’s because we’re seeing movement on the spec again, and we’re actually seeing the fact that — one of the things that HTML5 gave us was the fact that the spec was being written based upon what people actually want to do, and we know they want to do it because they’re doing it, you know, we know that people were using div id = footer, div id = header, so let’s put it in the language, that’s the great thing; the spec was based upon real world needs and problems, and it seems to me that still continues to be the case. But I just wanted to make sure that nobody thought I was dissing Jake because he’s a lot bigger than me and he’s from the Northeast of England and therefore he’s really nasty when he’s had a pint or two.

Louis: (Laughs) Alright, let it be, let the record show that no disrespect was intended. Alright, well I know you’ve got a meeting in just a few minutes, so I’m gonna let you go, but I wanted to obviously thank you very much for taking the time to come on the show and talk about this stuff.

Bruce: Thank you for inviting me.

Louis: It’s been a lot of fun, and it’s a fitting end to my year of interviews; all this stuff is so much fun and I’ve had a great time talking to all these people about the stuff that’s going on, because it’s interesting to be in an industry where nothing was going on for a long time and now lots of stuff is going on.

Bruce: Absolutely (laughs).

Louis: So I think everyone seems to be energized and it’s been great seeing everyone across the industry, regardless of what their opinions are, everyone’s energized and everyone’s excited about this stuff, and I hope our listeners are as well.

Bruce: I hope so too.

Louis: So, thanks again, and have yourself a great break if you’ve got a bit of time off coming up for the holidays.

Bruce: Thanks, Louis, and you too, and to all the listeners have a great 2012.

Louis: Awesome. Thanks very much, Bruce.

Bruce: Take it easy.

Louis: Take care.

Bruce: Bye, mate.

Louis: And thanks for listening to this week’s episode of the SitePoint Podcast. I’d love to hear what you thought about today’s show, so if you have any thoughts or suggestions just go to Sitepoint.com/podcast and you can leave a comment on today’s episode, you can also get any of our previous episodes to download or subscribe to get the show automatically. You can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. The show this week was produced by Karn Broad and I’m Louis Simoneau, thanks for listening and bye for now.

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.

Episode 142 of The SitePoint Podcast is now available! This week the panel is made up of Louis Simoneau (@rssaddict), Stephan Segraves (@ssegraves and Patrick O’Keefe (@ifroggy).

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #142: The Last Panel of 2011 (MP3, 38:18, 36.8MB)

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 main topics covered in this episode:

• Chrome Becomes the World’s Second Favorite Browser
• Is Firefox Doomed?
• inessential.com: The Pummeling Pages
• JQuery Shutters Plugin Site

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/142.

Host Spotlights

• Patrick: SNL Digital Short: Batman
• Stephan: Do You Suffer From Decision Fatigue? – NYTimes.com
• Louis: Knyle Style Sheets — Warpspire

Interview Transcript

Louis:: Hello and welcome to another episode of the SitePoint Podcast, we’ve got a panel show this week, Patrick and Stephan are on the line with me, hi, guys.

Stephan: Hey, Louis:!

Patrick: Hey, Louis:!

Louis:: Our newest member of the panel, Kevin, could not make it this week so there are only three, but we’ve got a lot to talk about so I reckon it will be a good show.

Patrick: Yeah, we didn’t like him so we kicked him off the show, no, (laughter), just kidding, just kidding.

Louis:: That’s not true.

Patrick: No, that’s not true.

Louis:: Kevin’s great and he’ll be back next panel show which I believe will be in the New Year because next week I’ll be doing an interview and then we’ll be taking two weeks off for the holidays.

Patrick: Yes, two weeks vacation that we get every year (laughter).

Louis:: Well deserved, it’s been a great year of podcasting.

Patrick: Excellent, yes. You joined the team, so.

Stephan: It’s hard to believe it’s been a year.

Louis:: I don’t even remember when I came, when I started doing the podcast.

Patrick: I don’t know, we’ll have to look that up, but –

Stephan: We’ll have to look that up, yeah.

Patrick: It was in 2011 I’ll tell you that.

Stephan: (Laughs) Thanks, Patrick.

Louis:: It was #110 on the 1st of May 2011.

Patrick: May 1, 2011, excellent. So a good seven months into the show come January 1st. And of course you had been kind of the interview host in some ways; Kevin had secretly snuck you in.

Louis:: Yeah, I’d done a couple of shows before that.

Patrick: To do some of his work (laughs), and then we brought you on officially, so, excellent!

Louis:: So this makes it the last panel show of the year so the pressure’s on, but we gotta kill it.

Patrick: Yes, absolutely, let’s kill the show.

Louis:: (Laughs) with that in mind I’ll throw it to you, Patrick, for the first story.

Patrick: Cool. So my story is about Firefox, and Firefox is my browser, I still have not yet downloaded Chrome. Actually I said on this show that I was going to finally download it, and to test a bug, but the person emailed me back and said the bug has resolved itself (laughter), so I still didn’t need to. But plenty of other people are downloading Chrome because according to Statcounter.com it became in November the second most popular browser in the world, behind IE, and got ahead of Firefox; it has overall the market share of 25.74%, Firefox, both versions 3.7 and 4.0+ are down to 25.24%, so Chrome is up .5%, half a percent, and Firefox lost a full percent of ground, more than a full percent of ground in just one month with Chrome gaining .69, and I guess, finally, it’s been on a steady ascent, achieving that number two browser mark. And I guess one of the things I’m wondering about Chrome is does it have the metal, I guess you could say, to challenge Internet Explorer. Internet Explorer did see a gain in November as well, it went from 40.18 to 40.63, it say a marked gain in the U.S. going from 46.11 to 50.66, so a 4% gain in the U.S., but then again Chrome hasn’t lost in months and months it seems, it just continues to go up. So, can Chrome challenge Internet Explorer?

Louis:: To me the interesting thing here is I always see the Chrome and Firefox use as sort of being championed by the more techie crowd, and they’ll get all their family and friends to upgrade their browsers and to switch away from IE, and I wonder if that’s going to be slightly less the case with the new IE, right. From IE9 and IE10 we’re seeing great performance, good security, good support for standards, and I’m wondering whether if someone gets a brand new Windows computer tomorrow would you be less likely to try and get them to upgrade or switch their browser than you would have been five years ago when someone got XP with IE6.

Stephan: That’s a good question.

Patrick: That’s a fair question. I don’t know the answer to that question.

Stephan: Well, it’d be really great if we could see the numbers on how it did with the conversion, it’d be awesome; I’m sure Google wishes they knew what the conversion rate was on different things because I notice in certain plugins that Google has, like Google, I think it’s Analytics, they — I’m using it in WordPress, and if I use Safari it pops up and tells me that I’m using and outdated browser, the AdSense, or the Analytics plugin for WordPress. So, I find that interesting, so do you think like people that are publishing websites using WordPress or some kind of plugin that Google makes are getting these popups and going, hey, I’m gonna go download that because it’s from Google or do you think that it’s really family members that are driving this?

Louis:: Yeah, maybe, there’s something to be said, I mean Google did put out a pretty significant marketing push for Chrome, they did some ads, they did some TV ads, and I think the Google name resonates for a lot of people with respect to the Internet, and it gives you an impression, of speed at least, that was considerable I’d say a year or two ago; I think the other browsers have sort of caught up now. Yeah, I’m not sure, I mean personally like you, Patrick, I’m a Firefox user, and I’ve switched to Chrome on my work machine because I have a lot of stuff open and it’s kind of a little slightly underpowered machine, and I find that Chrome does better on limited resources, but on my home machine which is a pretty powerful box I use Firefox because I just prefer the feature set. To me it seems like it was definitely a hugely important thing for the Internet and for us as web developers to have at least one browser that wasn’t put out by a private company with ulterior motives. And I think Firefox is super important on that respect because the Mozilla Foundation’s only goal is trying to make the Internet better and trying to advance standards, so I think it’s super important that they stick around at the very least, so hopefully Chrome won’t put too big a dent in.

Patrick: Yeah, it’ll be interesting to see what exactly I guess the plateau is for Chrome because looking at the chart I mean it’s just been up, up, up, up, up. It has gained year over year about 13%, 12 to 13%, and that’s come directly from Firefox and IE; Firefox has fallen 6% and IE has fallen about 8%, so 8+6, 14, 13% gain, I mean it’s coming right from it, so I don’t know what the plateau will be for Chrome but it’ll be interesting to watch I guess.

Stephan: The gain is about to be the Chrome version number, I mean once they hit 15% gain, you know, we’re on Chrome 15 now, so; every show I bring this up, any show that we talk about Chrome I gotta bring up the version number because they’re like on version 15 and we’re on IE8, you know (laughs).

Patrick: Maybe that’s how they have to dumb it down, that’s how they have to dumb down the marketing. Is IE on version 9, version 10, what is that, those are pitiful numbers, we’re on 30 America, the world; we are double what they are!

Louis:: Chrome doesn’t really advertise its version number at all, like you have to dig a little to even see what version, you go onto the website and you just download Chrome and it updates itself in the background, you don’t even know you’re getting a new version.

Stephan: Exactly.

Patrick: Yeah, that’s a good point, good point.

Stephan: Isn’t that the way Firefox has kind of gone?

Louis:: Firefox is doing that but it’ll still tell you, it’ll still, like it told me recently we’ve recently updated to Firefox 8, you want to restart and it’ll be running. I still think the background way of doing it is probably the best because it allows them to push across updates rapidly and transparently without disrupting users.

Stephan: Yeah.

Patrick: Right, yeah, just to draw a conclusion to the numbers, I mentioned the U.S. numbers, IE’s like 50.66, Firefox is still number two in the U.S., 20.09, and Chrome is third at 17.3, and where Louis: is, Australia, IE has a 40.72, Firefox
23 ½ almost, and Chrome just almost 21, so, Firefox is still number two in the U.S. and in Australia.

Louis:: Where are those gains coming from for Chrome?

Patrick: Well, Chrome is strong in the UK, I know that, I pulled up the numbers for the UK as well, IE is 42.82%, Chrome is number two, 24.82, and Firefox is 20.56, so Chrome has been number two in the UK for a few months, since July; so that’s one country where they are strong. I don’t have an easy way to look at necessarily which countries they’re the strongest in, but the UK is certainly one area that they are leading the way and are just, looks like, 18% below IE. So, yeah, I guess part two of this discussion that I wanted to bring up is an article about — at ReadWriteWeb by John Paul Titlow, the headline was, Is Firefox Doomed? And there are two reasons he asked this question, first, of course, is the market share slip, and then second is that Mozilla’s three year partnership with Google is coming to an end or has come to an end in November. Back in 2008 they signed a three year deal for Google to be the default search engine in Firefox, and Google has contributed about 84% of Firefox’s total revenue during that span. Three years is up, the deal is up, haven’t heard any news about it being renewed, so you have a sizeable chunk of the money that, I guess you could say powers Firefox, may disappear. Now, he says Microsoft might just jump right in line to pick up if Google lets that lax and take that default search engine mark from Google, but right now there’s no news about that. So, is Firefox in trouble or did Firefox accomplish its goal?

Louis:: Like I said before, I think it’s hugely important that there be an independent browser on the market, so I think that for us as web developers and for geeks and people who love the Internet I think it’s a huge benefit to have something that’s not driven by the need to sell advertising or the need to convert customers. I think already even the Chrome new tab pages has changed a little bit and is kind of gradually edging into the direction of trying to get you to install Chrome Apps or to use Google products, and that’s kind of a concerning slip away from just being a tool that you access the Internet indiscriminately with. So for me it’s hugely important, but, so when you said that 80-something percent of the revenue, is that 86% of the revenue coming into Firefox or that Firefox generates or is that of the Mozilla Foundation’s operating revenue in its entirety?

Patrick: So, where that number comes from is ZNet’s Ed Bott, and he mentions in an article that in 2010 84% of Mozilla’s 123 million in revenue came directly from Google, that’s roughly 100 million in funds that will vanish or be drastically cut if the deal is either not renewed or is renegotiated on terms that are less favorable to Mozilla. So, I don’t know how you want to read that necessarily, if it’s 84% of Mozilla’s revenue is what he says, but 84% of Firefox’s money or 84% of Mozilla’s money, either way I guess it’s still a sizeable sum.

Louis:: Yeah, that’s huge. It seems like what you were mentioning that this is an opportunity for another competing search provider to jump in and snap up that partnership. It sounds pretty reasonable, right, I mean as far as I can tell Bing is still somewhat struggling, and this would be a great way to bump up the share. The question is would that be acceptable to Firefox users, you know; if you download Firefox and suddenly you’re on Bing, is that somewhat of a jarring experience if you’re a Google user.

Patrick: Does Firefox signing a search deal with Google, with Microsoft or with whoever, fly in the face of the idea that we need a browser that doesn’t need to sell ads and doesn’t need to sell things if they’re selling the default search engine, or I guess do we understand the need for them to have money, or how does that, I guess, coexist?

Louis:: I don’t know. It feels to me like it’s a pretty minimal item, right, I mean there’s going to be a default search engine one way or the other, right, and it’s pretty much guaranteed that that search engine would be either Bing or Google because those are pretty much the two major offerings, sorry to all the other players in the search space. So, you know, if they can get a deal and get some money out of it I think it’s a win-win. The thing is that’s not influencing any other aspects of the code, and they’re not changing the user interface in response to these pressures, so I still think they have a stronger independent position than the other browsers in the market.

Stephan: As long as they don’t sign a deal with Yahoo I think they’ll be okay (laughter). Sorry, had to insert a little humor there, you know.

Louis:: That’s alright, that’s alright, that would be hilarious. I can imagine loading up Firefox 10 and suddenly Yahoo is the default, what’s going on? (Laughter)

Stephan: Delete, delete!

Louis:: I can’t find anything, where am I?!

Patrick: Whoever will give them the hundred million.

Stephan: I don’t think Yahoo has a hundred million to do it.

Louis:: Is that the amount; is it a hundred million dollars?

Patrick: Well, that’s the estimate if you take 123 and 84% of 123 million is about 100 million dollars, so, and I think that’s the end.

Louis:: Wow. Sorry, I’m just testing Yahoo, wow, that’s awesome. I just searched for SitePoint on Yahoo because I hadn’t done it in forever, and the first result is a sponsored ad for eBay.com.au/guitar, which says bargain SitePoint here, bid and win SitePoint on eBay Australia.

Patrick: SitePoint’s available, finally! And it’s not on Flippa?

Louis:: And it’s ebay.com.au/guitar so I assume, oh no, it’s actually SitePoint items, that is weird. Anyway, just a moment of passing nostalgia for the Yahoo search engine there. Alright, I apologize to all our Yahoo listeners; you got a lot of great products.

Stephan: (Laughs)

Louis:: Oh no, wait, they sold Delicious (laughter).

Stephan: Ha, ha, ha, ha, snap! They still got Flickr.

Patrick: I gotta step in now and say that, you know when I was coming up and developing websites for the first time I loved Yahoo, and I still hold hats and glove for Yahoo because they do have some good products. Now, put Delicious aside, they’ve always been strong in like Yahoo Finance, that’s a strong product, Yahoo Sports is a strong product.

Louis:: Oh, yeah, that’s true. Yeah, that’s a good point.

Patrick: The fantasy sports stuff they do, they have these niche products that are very strong that I’ve always used, and then of course they do so many different things and a lot of things they don’t well, and that’s really the problem I guess, but, you know, Yahoo, I hope Yahoo comes back and these strong products get the shine that they deserve I suppose.

Stephan: Bring back Pipes.

Patrick: (Laughs) bring back Pipes.

Louis:: Is Pipes dead?

Stephan: It’s not dead it’s just not, I don’t know, it’s not up-kept really well.

Louis:: Right. That’s a good — it’s a good product, it’s a great idea.

Stephan: I still use it, it’s just that –

Patrick: It’s still there.

Stephan: They haven’t put a lot of use, they haven’t done a lot to it, like they’ve just given you this — like there’s so much more they could do to it. Anyway, I’m getting off-topic, sorry.

Louis:: I think we’ve been off-topic for a little while here.

Patrick: No, we’re already off-topic, this is the Yahoo segment! (laughter).

Louis:: Alright, maybe time to move on to the next story. I’ll take this one. So this is something that I spotted on Hacker News yesterday, and what has happened is that the jQuery plugin site is offline and has just been shut down by the jQuery team. Now what the comments here on the post on Hacker News, there’s a couple comments by some of the core team at jQuery and mentioning that they’re working on a new plugin site and they’re gonna blog about that in the next few days. But basically what happened is they were concerned with a lot of sort of spam in the plugin site, so this was at plugins.jquery.com, so if you go there now you see just a simple message saying “The plugin site is currently unavailable, we’ve been looking to provide a high quality spam-free experience for some time, and we’ve just decided to temporarily shutter the existing site and will be providing more details on the new site soon.” So basically they’ve just shut the whole thing off and said, look, we’re working on a new one, but basically as we were working on the new one we came to the conclusion that a lot of the content on the current one was so spammy that rather than just try and clean it we’d turn it off, so it’s a pretty drastic move.

Patrick: Yeah, and by the time we do another show a month from now or there around they’ll probably have the new site up, so we’ll probably be talking about that.

Louis:: Yeah, I’m interested to see what’s going to come out of it and how it’s going to differ from the previous one. I have to say I didn’t really use the jQuery plugin site very much, usually a lot of times when you search for a jQuery plugin for something on Google the results you’d find would actually be the developer’s personal site where they posted the plugin rather than on this central location. But there are definitely other examples of this kind of thing done well, if you look at WordPress, WordPress’ plugins and add-on site and Mozilla’s add-on sites are really well done, and they’ve got a good way of floating the quality content at the top and curating it by the community reviews. So it’ll be interesting to see what the jQuery team’s put together, but I just thought it was an interesting move rather than wait until the new one was ready and do a switchover and like, hey guys, we got this new plugin site, they just went, oh, yep, the old plugin site is crap so you can’t use it, and we’ll build a new one eventually but we’re not gonna tell you when.

Patrick: Well, when you put it like that, yeah (laughter). Because in my head is was like, well, you know, we didn’t like what we had so we’re gonna take it down for a few days, it’ll be back soon, and we love you; that’s how I read it, I don’t know.

Louis:: (Laughs) Well, I think there are a couple of different ways to read this, right, and it seems to me like a bit of a blog post rather than suddenly hitting — I don’t think there’s actually even a blog post on the jQuery blog about it, yet; they said there was gonna be a blog post about what happened soon, but basically some developer was just working on this and decided, well, you know what — I mean I know we’ve all had those days, right, when you’re looking at the thing and thinking ‘this is all crap, I just want to tear it down’.

Patrick: The podcast sucks, my life is ruined, shut it all down, it’s garbage.

Louis:: Yeah, right, you have those days, but it looks like someone really carried through on this one.

Patrick: Is that an ultimatum of a dare? I’m just kidding.

Stephan: Wow, I’m just reading through some of these comments, it’s just, you know, it’s funny to see people get really upset, and there’s other people like trying to justify it, and then there’s other people giving the technical reasons; comments are hilarious, I love comments (laughter).

Louis:: I love comments in some places, it’s not always — if you ever find yourself reading the comments on like a major news outlet’s website that will make you hate humanity in record time.

Stephan: We’re gonna get to that. We’re gonna get to that in my story, so don’t jump the gun yet.

Louis:: Okay, I won’t jump the gun, but comments, I mean obviously on Hacker News and Reddit, you know, these sites thrive on the quality of the community, and you get great insight and great trolling as well, even, you know, even when they’re trolling they’re entertaining.

Stephan: Nothing like good trolling. Nothing like good trolling (laughter).

Louis:: Well, on that note, do you want to just jump into your story?

Stephan: Yeah. Yeah, so, Brent Simmons who runs Inessential.com has a blog post up called The Pummeling Pages, and it’s quite a good read just from a perspective of you reading a website and what the Web has become in the past, oh, I don’t know, five years, six years. And he really talks about how his use of Reader, in the Reader button in Safari, and how quickly he’s using it when he goes to different websites. Just from the idea that you know there’s all these ads, there’s comments everywhere, there’s just junk all over what used to be useful pages, and it’s not just run-of-the-mill blogs, it’s news sites that we actually use, and he draws a comparison to the merchants war where this was predicted before; lower class people would be subjected to a ton of advertising while upper class people were being insulated, and I don’t know if that’s actually true, but I know that we’re being hit with a lot more advertising for what amounts to not better content, right. So, it’s a good read about just getting rid of the junk off your page. And I just want to know what you guys think.

Louis:: Well, I think like I was saying before, there’s a distinction here between the way mainstream publications approach this versus the way sort of Internet publications approach this. So, a traditional newspaper site that’s been ported into the Internet definitely tends to suffer from this problem where you’ve got a thousand share buttons and widgets and comments, and it’s like a 1200 word article split onto seven pages that each take about seven seconds to load. I love the first sentence of this essay, by the way, he starts the whole thing off with, “I made the mistake of going to a website today,” period; great way of kicking into it, so I really like this essay. But there are a lot of specialized blogs out there targeting a specific niche or just, you know, that started this Internet publication that are a lot leaner. And do you think maybe it’s just because these traditional publications have leases on offices and have all this staff that they need to support, and as they’re declining revenues from their print publications they’re constantly under pressure to jack-up the amount of money that they can bring in through the sites where a lot of the newer generation of Internet based content providers were sort of lean from the start, and whatever money they make from their ads by providing quality content that differentiates them from the rest isn’t enough to cover what they need to pay.

Stephan: Well, he kind of touches on this, and he talks about he worked for a company that worked with a bunch of publishers, Taplinks is the name of the company, and he said that the number three thing that they had in common, that all of these different publishers had in common, was the unanswering, unswerving faith in supreme value of analytics. So they would look at their numbers and say, well, that article got a lot of hits, let’s write another one like that, right, and that’s the totally wrong way to do it, right. I mean if we’re writing articles just to get hits then we’re doing the wrong thing, we should be writing articles because there’s something to be written, not because we want ad money, so maybe that’s the first step.

Patrick: Well –

Stephan: But you need money, right, Patrick?

Patrick: Awkward laugh. Right, I mean I don’t know — if that’s wrong then I would say a lot of people are doing it wrong right now. And I think it’s — I don’t think it’s all bad to write articles that people want to read, I don’t think. Because that’s another way to read that sentence, that’s another way to say that same thing is that people are writing content that people come for, right?

Stephan: Eh, but I don’t know about that, though, because to me you can make –

Patrick: In some cases.

Stephan: — money without forcing people to look at a bunch of ads for a good article, like why do you have to fill the page with a bunch of junk.

Patrick: So this is a tough discussion because I’m not sensitive to advertising, ads don’t bother me, really, they don’t; ads on the Web don’t bother me at all. The only thing that bothers me is, and it’s only occasionally, is when there’s sound that plays automatically in-ad, that is decidedly rare on most publications that I read.

Louis:: But what about when it affects the load time significantly, and when they artificially –

Patrick: That doesn’t bother me.

Louis:: — try and inflate the pageviews for those advertisers by paginating the article needlessly.

Patrick: Okay, so that, the paginating, great word, is, uh, you know, I’ll confess to being maybe a little bothered by that, slightly perturbed perhaps (laughter), but it just doesn’t bother me that much because, you know, when most people complain about ads on a website I look at that site and I say that’s no big deal, because I look at content and I look at ads in percentages, most pages that I visit don’t have ads in even 30% of the page, and/or even 30, 35, 40%, more than half the page is other stuff, content, logos, navigation, etcetera, and that’s what I try to weigh on my sites, which I would say have less than average volume of advertising versus let’s say similar sites or other websites on the Web, because that’s where websites are, on the Web. So, I almost feel just to — I guess to present the counter to this is that there’s a sense of entitlement that shows its ugly head sometimes because there’s such a subjective thing that goes on with these comments where some people feel these ads are too — or there’s too many, they don’t like the type of advertising, they don’t like what the ads about; these publications have to make money to sustain themselves, and it’s not always one ad a page or a couple ads a page, and it’s not always going to be targeted to the topic. If it isn’t showing nudity, right, or cigarettes or alcohol, and it’s not popping up and it’s not playing noise, then I don’t have a problem with it for the most part, it doesn’t bother me.

Stephan: But that’s kind of the point though, Patrick, I think is that in some of these places they are popping up.

Patrick: But that’s rare though.

Stephan: But these are supposed to be reputable sites some of them.

Patrick: I mean that is so rare though on news sites to have a popup ad these days for the amount of pages that I visit.

Stephan: You’re saying you never get — like I’ll be on my phone and I’ll go to a link that I see on Twitter and it’ll be to some news site, some reputable news site, and instead of me being able to go to the article I get a little popup that keeps me from scrolling through the content, and I gotta wait five seconds.

Patrick: Right, so an overlay or an interstitial, yeah.

Stephan: Yes!

Patrick: I get those ads and honestly they don’t bother me. I can see why they bother some people, but they just don’t bother me all that much. Not so much that it makes me hate the Web or hate the publication or want to find a way to screw them of that revenue by viewing their content in some other means, it just doesn’t push me that far. I understand it pushes some people that far, but, I think that this is a case where this is an issue people complain about, but instead of complaining show me how I can make the same revenue through another method, show me that; if I can’t then we have a problem because people want to make more money, they want to do it more often than not in a way that’s appropriate for their audience, show them a way to do it, and if you can then you’re a genius and you’ll be a millionaire. If not then it’s one of the challenges we have to face today as a publisher online.

Louis:: I think, Stephan, coming back to the original point, it seems like this is a divide that’s maybe always existed in news, right, if you look at traditional newspapers, right, the division between sort of, what, the tabloid approach and a broadsheet approach, is pretty much that, right, I mean the tabloid papers have traditionally gone this same route of analytics, and you know this headline will sell more copies and it doesn’t matter how good the content is we just want a headline that’ll sell more copies, and if that happens to be trashy celebrity gossip then that’s what we’re gonna print. And there’s always been space for both approaches in print media, and I think there will be space for both approaches in online journalism as well, in online content publication of all kinds you’ll have people with the attempt to create good content with an attention to design, and there’ll be other people who are driven by analytics to just cram the whole thing full of ads and headlines that’ll get the most clicks, and paginate out the content and do all these other dodgy tricks to try and get more ad revenue. And maybe the jarringness, though, comes in the sense that some of the businesses that were on one side of the line in the print world have gone over the other side of the line in the digital world, right. So, you know we’ve seen a lot of traditionally, what you said, reputable or respectable news sources that have sort of embraced this more tabloid style approach to their online presence. And like what I was saying earlier, I think that a lot of the newer, the newer generation of dedicated online publications, a lot of them have taken the approach of really just focusing on the design, providing quality content, and a few targeted ads with partners that give them good rates based on conversions instead of just pageview banners from old print advertisers, if that makes sense; that was a bit of a rant.

Stephan: No, I agree. So do you click on ads, though, when you go to new sites?

Louis:: No.

Stephan: I’m interested.

Patrick: He’s gonna say no. He’s gonna say no, no, everyone says no.

Stephan: Do you click on ads, Patrick?

Patrick: No one ever clicks on ads. I will click on an ad if I find it interesting, I mean the funny thing is, and I have this conversation with people who are technical, I’m sure you guys do too sometimes, and no one ever clicks on ads, they don’t look at ads, they don’t know ads, they just don’t see them. And my response to that is always, sure you do; unless you have them blocked through Ad Blocker or something similar, if they allure on the page advertising will have some impact on you, it might be minor, but, advertising isn’t there just to be clicked on either. Let’s not forget there’s other forms of advertising besides cost-per-click, CPM ads and ads that are meant to establish a company or for branding or whatever, and even if you don’t click on ads, ads still have value for the advertiser, for the publisher and possibly for the viewer. And, I mean, yeah, so that’s my thought on that. I have clicked on ads before and I’ll click on ads where they’re interesting, and what I always tell people, though, is to vote with your feet, right?

Louis:: Yeah, I mean I agree with you, I’m not going to say I don’t click on ads ever. I don’t click on ads on these mainstream news sites because most of the time they’re crap.

Patrick: Right.

Louis:: Most of the time they’re ads for cars or new phones or shopping or, you know, just –

Patrick: Nothing that you partake in.

Louis:: — mass market crap. Whereas if you look at design or development sites that I read, if they have ads they’ll be for either books or courses on web design and development or new tools or things like that, that even if I don’t intend to buy it I might want to find out what it is or what it’s about, so I’ve definitely clicked on ads in a niche, it’s just that usually the stuff on the major news outlets are just not stuff that I have any interest in so I tend to ignore it. But as I was saying earlier, I don’t regularly read on those sites either because the experience, as this essay has put it, is so unpleasant that it makes it really not worth the while.

Patrick: Yeah. Just to comment on what I was saying about voting with your feet, what I mean is that if you like someone’s content then visit their website or subscribe to it in the means that they provide. I don’t necessarily believe in the idea, though I know many do, that if I like someone’s content I’ll find some other way to read it outside of ways they allow and do what I want to it. A lot of people do that, a lot of people feel that way, I don’t feel that way; if I don’t like the experience they provide and it bothers me enough then I don’t feel that I’m also entitled to consume their content. That may seem idealistic, I suppose, but that’s just how I view it; if someone does do that to their website where they butcher it so badly or there’s ads I don’t like or the experience is so poor that I can’t enjoy the content then I don’t visit the website and they lose traffic, that’s the approach that I recommend that people take.

Stephan: See I’m not saying people should go out there and start stealing content, I think for me, you know I use Instapaper, I’ve said that before, and so sometimes I will grab an article on a news site because it won’t load fast enough on my phone, I’m just like I can’t wait for this so I just download it to Instapaper and then I’ll read it later. So am I stealing the content, I don’t know, I still read the website when I can get on my computer, you know, like the New York Times, I’ll still read it on my computer, and I’ll still look around the site, so am I stealing the content, I don’t know. What do you think, Patrick, give me your moral opinion on that.

Patrick: (Laughs) Uh, no, I don’t think so. I don’t think you’re stealing the content. We’re at a crossroads, I think, and we’ve been at the crossroads for a while, and I don’t know who’s winning or losing or what the longterm effect is going to be, but you know there are a lot of tools out there that are used to circumvent advertising, and those are concerning just because people want to think that there’s a limitless way to make money online, but there’s not, right, there’s essentially — everything goes back to two main things, either get money from the people who enjoy your content or you get money from the people who want to reach the people who enjoy your content, and from there there’s a lot of division. But, it’s essentially always those two things, so there’s one or two parties you’re getting money from, and it’s definitely challenging and getting harder and more difficult I would say to, in some ways, and less difficult in others, because advertising online the revenue spend the companies are allotting is going up, so that’s a good thing, but there are more companies out there and there are more tools that people are using to circumvent the advertising, whether it be Adblock or something else. So it’s definitely challenging, and what I encourage people to do is just to, you know, if they enjoy someone’s content support them and do what they can to make sure they’ll be here tomorrow.

Stephan: So here’s a question for you guys, just kind of a theoretical question. If you had a donate button on a site for someone whose content you really enjoyed, would you prefer to do that or would you prefer to click on an ad for them, which is more genuine?

Louis:: Oh, the donate is definitely more genuine, it’s definitely a clearer expression of, hey; it’s a tip jar, right? You know, this is great content and here’s two bucks or here’s whatever; clicking on an ad I’m sort of indirectly supporting them by supporting someone else, and maybe it’s disingenuous because I click on the ad and then not buy the thing. If I’m clicking on the ad just to provide them with revenue then that’s needless, right, that’s costing this other company that’s advertising money to make the site look less pretty so that I can give a small fraction of money to the person that I like their content, right, that’s needlessly circuitous, but does it work better than donate, and I guess it depends on how direct and how personal a connection you have with your readers. There are some people whose blog I read that if they asked for donations I would definitely give it to them because they’ve established themselves as a clear personality that’s doing this because they love to do it, and I like their website and I like the content they put out and I know who they are, I’d give those people money, but there are some other organizations that I just don’t have that connection and it might be a bigger leap to click donate, right?

Patrick: I agree with Louis: about clicking ads to click ads, that’s a bad thing, don’t do it, it throws the whole value proposition out of whack for everyone, it inflates numbers for publishers, it inflates numbers for advertisers, it’s just bad. So you don’t wan to click ads just to support a publication, click an ad if you have any interest in it; if that’s why you’re clicking it then it’s genuine and do it. You know and as far as like donate, donate buttons, donate buttons to me I would never add one because they look desperate to me, and maybe this is just a matter of verbiage, right, and a semantical thing I’m saying, but instead of having a donate button play with micro-payments however you can. Now maybe that is subscription, maybe they can subscribe to your content for exclusive content or to see it first or to see it without ads, you know, make that sort of thing available, three dollars a month, five dollars a month, ten dollars a month, depending on the value of what you provide and how much you think you can get; I think it’s good to have that. Now as far as what would I do, you know, right now I don’t subscribe to any publications like that, and I am in a place financially where I don’t necessarily want to do that right now, but when I’m not in that place I would definitely consider it. If given the choice between viewing ads or paying something, I would say I’m more likely to want to just view ads or have ads on the page, and have myself be counted in whatever analytics program is serving the ads, and then I’ll benefit them in that way as well, but if you can you know it’s great to provide options to your readers.

Stephan: So maybe I’ll do a little experiment and say support my writing and have a little donate button and just see what happens on my site.

Patrick: (Laughs) for badice.com?

Stephan: Yeah, yeah, I don’t know, maybe I will.

Patrick: (Laughs)

Stephan: We’ll see. What’s so funny about that?

Patrick: I might just give you money.

Stephan: (Laughs)

Patrick: I don’t know; you got to have regular content.

Stephan: I do have regular content now; I’ve been blogging a lot more, thank you very much.

Patrick: Now? Okay, yeah.

Stephan: Yeah, see; see you don’t even read it so it doesn’t matter.

Patrick: No, no, I’ve subscribed, November 30th, November 29th, November 13th, November 4th, four posts in November.

Stephan: Yeah, that’s pretty good.

Louis:: That’s not bad.

Patrick: (Laughs)

Stephan: It’s quality stuff, man, it’s quality; quality over quantity (laughter).

Patrick: Put up a pay wall!

Louis:: Alright, I think we should wrap this up and go to spotlights because it’s turned into kind of a long discussion.

Patrick: I’ll go first, good discussion, guys. My spotlight is a skit that was on Saturday Night Live on this past Saturday, it is called Batman, it is an SNL digital short, Andy Samberg as Batman, Steve Buscemi as Commissioner Gordon, what else do I need to say (laughter), I think that sets it up perfectly, and if you haven’t seen it yet go check it out. Let’s say Batman is a little too attached to Commissioner Gordon.

Louis:: (Laughs) Ah, that’s terrifying. I will have a look.

Stephan: I can go next. I have an article in the New York Times called Do You Suffer from Decision Fatigue. And it’s just a good read about all the decisions we make everyday and kind of the toll it takes on us mentally, physically, physiologically, just some interesting stuff, and I’d say we all need to read it just so, you know; everyday you’re making tons and tons of decisions, and it does play a part, it does stress you out without you even knowing it, which is interesting.

Louis:: Awesome. I love this kind of stuff; I’ll definitely give it a read. My spotlight this week is surprise, surprise, web development related. One of the designers, I believe, at GitHub, Director of Design at GitHub, sorry, posted this just today which is this Ruby based library that has the purpose of generating documentation for CSS. So it’s a lot like these other documentation generators for programming languages except for CSS, and it can be used either with plain CSS or if you’re using a preprocessor like Sass or LESS, and obviously it’s just been released on GitHub so it’s a brand new project, but I was having a look at it and someone who has a pretty constant inability to organize my CSS in any way, shape or form, it’s just one giant file filled with stuff, and I pretty much use control F to find the thing I want to edit, this looks like a really good way of organizing and providing clear documentation, sort of saying, alright, so this dot star is a button that lets you favorite your content and it looks like this, and in a hover state it’ll look like this, and it generates out some pretty good-looking documentation. So definitely keep an eye on this as it develops.

Patrick: Sweet.

Stephan: What’s this written in?

Louis:: It’s written in Ruby, so he’s written — he wrote a specification for it which is just how to write your documentation, which obviously is just in your CSS as comments at the top of each declaration, and he’s written a Ruby library which takes that and generates sort of an HTML documentation file from it.

Stephan: Yeah, that’s cool, that’s really nice. And in the corporate world documentation rules, so.

Louis:: (Laughs) And looking at the — so he’s got an example screenshot, I don’t know if you saw this, Stephan, of what the sort of the output style guide looks like.

Stephan: Yeah.

Louis:: And it really looks fantastic. I’m like if I came unto a new project and had to write CSS and I had a style guide like this, that would be, you know, a dream.

Stephan: Yeah, I mean that’d be really helpful, and I’m not even really into CSS, but I could see where this is really useful for someone new to a project, it’d be great.

Louis:: Awesome. So that’s a wrap for this week. I think we lived up to our expectations for the last panel show of the year, I think we really killed it, congratulations (laughs).

Patrick: It’s dead.

Stephan: It’s dead.

Patrick: There will be no more.

Louis:: Yeah, so it’s been a great year, guys, thanks for all your warm welcome on the show, I’ve had a lot of fun.

Patrick: Awesome. Thank you, you’ve done a great job.

Louis:: And I’ll be back next week with an interview show, and then we’ll be seeing — we’ll be, I don’t even know how to say this; we’ll be seeing the listeners in the New Year in some way, shape or form.

Patrick: We’ll be coming back with a vengeance, as I told Kevin (laughter). That was my guarantee; you’ll be back with a vengeance in January! Yes, dramatic.

So let’s take it around the table. I am Patrick O’Keefe for the iFroggy Network; I blog at managingcommunities.com, on Twitter @ifroggy, i-f-r-o-g-g-y.

Stephan: I’m Stephan Segraves, you can find me at badice.com, and I’m on Twitter @ssegraves.

Louis:: You can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. If you want to find out more about the Podcast go to sitepoint.com/podcast, that’s where you can find all of our past episodes, leave a comment on this show to let us know what you thought and also subscribe to the feed if you want to get it automatically, and if you want to hit us by email that’s podcast@sitepoint.com. Thanks for listening everybody, and to Patrick and Stephan wishing you both a happy New Year and I’ll talk to you again in January.

Patrick: Happy holidays.

Stephan: Yep, have a good one.

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.

Episode 141 of The SitePoint Podcast is now available! This week our regular interview host Louis Simoneau (@rssaddict) interviews Andy White (@arcwhite) from startup incubator Pollenizer on their social payment startup, Pygg.

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #141: Pygg with Andy White (MP3, 27:00, 25.9MB)

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

Andy and Louis discuss the challenges of getting a social payment system up and running technically, and getting people to take it up and use it.

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/141.

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint Podcast. My guest on the show this week is a web developer from right here in Australia who’s the technical lead on a very cool little web startup called Pygg, that’s p-y-g-g, Andy White. Hi and welcome to the show, Andy.

Andy: Hi, Louis, thank you for having me.

Louis: How you doing?

Andy: Yeah, good, busy as ever. I’m currently migrating the Pygg service to a new Cloud Hosting environment with another local group, Ninefold, so that’s keeping me up until all hours.

Louis: Yeah, were you with EC2 previously?

Andy: We have been sort of, the company I work for, Pygg, is part of a startup incubator called Pollenizer, and we’ve used AWS and also Rackspace for a number of projects, Rackspace is Cloud, and we’re trying to rationalize around Ninefold because we target Australian audiences typically with our startups first, and just getting that latency down is a big win.

Louis: Yeah. So let’s maybe just back peddle a little bit and talk about what Pygg is. So do you want to just give a little bit of background on what this product is and what it does.

Andy: Yeah, sure. So I mean the elevator pitch for Pygg is that we’re trying to disrupt social payments, we’re trying to change the way that people pass money around to one another, and the long term goal is to disrupt the way people interact with their money and interact with their banks.

Louis: Cool. Let’s take it down from the elevator pitch to maybe the first floor pitch.

Andy: Yep.

Louis: Which would be how to use it, what do I do with it.

Andy: So the current implementation is that if you have a Twitter or an email account you can signup with Pygg and you can send money to anyone else who has a twitter or an email account. At the moment it’s only in Australia but we do have long term plans to go global.

Louis: Right. And you say it’s only in Australia because the way you get money out is to an Australian bank account, right?

Andy: That’s right. And dealing with international currency conversion turns out to be quite a complex process when you’re talking about if I as a user pay you one U.S. dollar what does that mean when you receive it and how do we actually present that to the user in terms of the interface and the messaging. We tried an early experiment around that and it got very complicated very quickly, so our strategy has been to work on the Australian market first while we’re proving the idea, and once we’ve really got our legs underneath us then we’ll jump off and look at potentially the U.S. market or somewhere else.

Louis: Right. So the idea here is I send a tweet to Pygg or do I send a tweet out into the open or to the person I’m sending the money to in theory?

Andy: So, we run a Pygg account @pygg, p-y-g-g, and there’s a bit of code that sits there an listens to Twitter on that account, you send a tweet to that account saying who you want to pay the money to and the amount you want to pay, and that little robot will then give you a response to either say it was successful or to invite you to signup or whatever needs to be done, and the person who receives the money just as a result of the way Twitter works gets a notification as well because they’ve been mentioned in the tweet.

Louis: Right. And if they don’t have a Pygg account so that the next step for them is do they get another reply from Pygg telling them, hey, you’ve got some money in an account, that you can sign-in, create an account and get that out?

Andy: Absolutely. Which can be a little disconcerting for some users we’ve found, they tend to think that it’s some sort of spam setup if they haven’t been sort of briefed on what Pygg is.

Louis: Yeah, right.

Andy: But, yeah, we hold onto the money for anyone who doesn’t have an account, and once they signup the funds just appear in their account straightaway.

Louis: Right. In order to send the money I create an account at Pygg and I prepay with PayPal or credit card so that I have money in my account and then I can just send that away by using Twitter.

Andy: Correct.

Louis: Right. Well, I can definitely see a use case for that in splitting dinner bills when everyone has only plastic and no cash.

Andy: That’s what we use it for internally quite frequently. Coffee runs are another big one; we’ve developed a new workflow around coffee runs where someone will basically just walk out of the office and say, “Hey, guys, I’m going for a coffee run,” won’t even stop to take orders, by the time they get down to the local coffee shop the orders have appeared in their Twitter timeline, they’ve got the money for them so they just order the coffees on the spot based on what’s in their Twitter timeline and bring them back.

Louis: Right, perfect.

Andy: No more dodgy Post-it notes.

Louis: (Laughs) Yeah. And no more excuses for getting the order wrong.

Andy: Exactly.

Louis: So, maybe dive a little bit into the technical details a little bit because I’m curious and I assume a lot of our listeners will be curious about the geeky side of the project, but maybe before that how long have you been working on this and how long has it been available to the public?

Andy: So I’ve been working on it since it would’ve been August I think, so we’re about getting close to being sort of six months in, a bit under six months in; I’m a programmer and my math is obviously not that great, right.

Louis: (Laughs) Just iterate a variable until you get to the right amount and then –

Andy: Yeah, exactly, that’s it, fail fast. It’s been available to the public for probably all but I think seven weeks of that, the first seven weeks we had only a very limited open beta, we were up and running very, very quickly.

Louis: That sounds pretty fast.

Andy: Yeah, the Pollenizer model is that we at the very least have something that we can test within two weeks, and typically we only have 12 weeks to get a business up and running and prove that it’s viable which is an extremely tight timeframe as I’m sure you can imagine. So the early iteration has been built extremely quickly on PHP, we’ve been using Zend which is potentially not my framework of choice.

Louis: That sounds terrifying. I don’t mean to offend any of the Zend guys in the audience but go on.

Andy: Zend definitely has its place in the world, a very rapid turnaround startup in my opinion is probably not the place for something like Zend, but on the flip side if that’s what you know and that’s what you’re comfortable working with then maybe that is the safest choice for you.

Louis: Well, yeah, especially if you’ve got two weeks to get something up and running, if you’re starting with a framework you don’t know it’ll take you two weeks to learn it.

Andy: Exactly. So, yeah, at the moment we’re just going through and we’re starting to pull the application apart, we’re rebuilding it with a service oriented architecture, so one of my big missions for the next couple of weeks is to pull most of the business logic out of the web app and into an API layer that will go sort of in between the database and the web server with the long term goal of eventually enabling people to write their own applications that will interact with Pygg.

Louis: Right. So you did mention sort of briefly there that the idea is you’ve got I think you said 12 weeks to prove that it’s a viable business, so what is the business model here, do you charge a fee per transaction or –?

Andy: Yep. So the actually transactions in between people are completely free and probably our hope is always will be, we charge a nominal fee when you put money into the system which I think at the moment is a flat $2.50.

Louis: Right.

Andy: And a part of that just goes to cover our costs in processing the transaction, and our goal at the moment isn’t even to make a profit, there’s sort of long term plans around profitability and how the business will work, but step one is just to make sure that we have something that people will use and that they’re happy to use and the business model can follow on from that.

Louis: Yeah. And how have things been going with users, have you seen a fair amount of interest?

Andy: Yeah, actually, a fairly significant amount of interest. Users tend to fall into one or two camps, they’ll take a look at it once and either because we haven’t explained it properly or because it’s not something they want to use or in some cases because we’re using PayPal will walk away very quickly or they get engaged with it and start using it quite extensively, and there are some really interesting groups of users up here in Sydney where one or two people have gotten involved and just fallen in love with it, gotten really passionate about it and then dragged all their friends along as well. So we’re definitely seeing in some cases the network effect which is quite heartening.

Louis: Yeah, that’s great, and it seems like the kind of thing where if someone demonstrates the usefulness of it and they use it to pay their friends then suddenly that could sort of spread out. I mean you see that happening with things like FourSquare which aren’t even particularly useful, so one would hope if something actually serves a purpose that people would be all over it.

Andy: Yeah, right. I guess the difficulty here is that it’s not always useful until you actually have other people using it, and so our mission for the next couple of weeks, or at least the mission of our customer development team, is to try and get the barrier for entry as low as possible. And long term we’re hoping an iPhone application might make that even easier, but we’ll see how we go on that one.

Louis: Right. So you talked a little bit about the technologies that you’ve been working with, so you built it in PHP and Zend, were there any particular challenges given that you’re dealing with money, you’re dealing with potentially things that people view as important from both a security and privacy point of view and that you have to interact with banks and with PayPal, what were the challenges that you guys faced or the most important things that you had to deal with?

Andy: Yeah, so early on you know we had to make some decisions around whether we were going to be processing credit card transactions ourselves, and you know we identified that as just being way too risky; anytime you’ve got to take credit card details or interact even with a merchant gateway you end up doing something that to get it right is quite complicated. So we’ve mitigated a lot of that by just pushing the responsibility off to other people and other organizations where we can to try and keep things nice and lean and agile, so we don’t actually store any information, I mean we store email addresses but we don’t store anything more sensitive than your bank account number which in some ways can be a little — I mean people feel a bit funny about putting their bank account number out there, but at the same time it’s very hard to misuse it.

Louis: Yeah, right. I think the only thing you can do with someone else’s bank account number is give them money.

Andy: Right. And, sure okay, great, give me more money; you can misuse that all you like. So a lot of — I wouldn’t say there’s been a lot of technical challenges around that, but it’s definitely been a process of thinking things through and trying to minimize risk exposure and stay as agile as possible. But, yeah, in terms of tracking the consistency of transactions, making sure that if I pay you $5.00 that’s what’s reflected in the database, has been quite a big part of my job, you know there’s a lot of testing that goes into a product like this because like you say you are dealing with money, and the second that we get a transaction wrong or money disappears out of someone’s account without an explanation to them that’s obviously going to be really bad for our users, and we definitely don’t want that.

Louis: Yeah. And in the case of things going wrong, you’re also in addition to relying on your payment processors, which are pretty nice and stable, you’re also kind of relying on Twitter; how have you found that in the case of duplicate tweets going through, has that caused any issues or things like that?

Andy: It did early on, one of our developers made an assumption that a tweet would always be, a) delivered in order, and b) never duplicated, and we’ve found that both of those things are not true. Twitter actually says in their API documentation that tweets aren’t delivered in the order that they’re sent, they’re delivered in the order that Twitter servers process them, so you have to be careful to write your code not to assume that they’re in any sequential order. Most of the time there’s enough of a gap between any of the tweets that we’re processing that that’s not a problem, but there are a couple of edge cases where things can actually get kind of hairy. Thankfully we’ve sorted out most of those but there were some late nights.

Louis: Yeah, I can imagine. What was the idea behind going with Twitter from the get-go rather than maybe building your own interface or allowing people to just use a mobile app, for example, to transfer money; why piggyback on Twitter?

Andy: Yeah, the advantage of Twitter is that you instantly get visibility to entire networks of people, it has a really well documented API that’s quite simple to use comparatively, it’s a restful API, it uses nothing but JSON, I think you can get XML out of it as well but I’d rather not.

Louis: (Laughs)

Andy: I’d really rather not. And, you know, just getting that visibility early on was really important to us; if we’d built our own interface then potentially we would have been using email, and one of the assumptions that we went into the business with was that we wanted transactions to be public, we wanted people to be loud about their money, we wanted to challenge that conception that money and payments have to be a private thing, and I think so far that’s worked out pretty well.

Louis: Right. So you launched initially with Twitter and have since added email transactions.

Andy: That’s right. So as of I think about three or four weeks ago we pushed another update to our production environment, and that now lets you pay people via email which is a little bit more private and a little bit more quiet, but I think so far the vast majority of people are still using Twitter to send money around.
Louis: Right. We talked a bit earlier about the sort of obvious use cases of, for example, dividing up a restaurant bill or paying for a coffee run, you know, if you borrow five bucks from someone and you want to pay them back, what are other use cases that you’ve seen that sort of defied your expectations of what people were going to use the system for?

Andy: Melbourne Cup Day was a really interesting one for us.

Louis: Okay, this one we’re going to have to stop a little bit and maybe give some explanation to non-Australian listeners.

Andy: About Melbourne Cup Day, of course.

Louis: Yes, arriving in Australia that was a bit of a culture shock for me. So it’s a national holiday around a horse race.

Andy: Yes, that’s right.

Louis: (Laughs) So everyone has the day off and they all gamble on horse races is pretty much the given.

Andy: Ah, not everyone.

Louis: Not everyone has the day off, right.

Andy: Yeah, only some states in Australia still have that as a public holiday, but it’s very much culturally a bludge date, and that aphorism I’ll explain that one as well, it just means that people have a very lazy afternoon and end up watching the horse races and quite frequently drink copious amounts of alcohol, which is an Australian tradition.

Louis: Alright, now that we’ve got the background so tell us about how Pygg fit into that.

Andy: So we saw a lot of people making bets and challenging each other over Twitter, so there were a couple of groups that were doing — here in the office, for example, we were doing a competition to see who could be the best dressed, and the winner, I think the winner ended up winning some small amount of money, and another amount of money went to charity. So and other groups were getting involved in that as well and actually voting with a dollar.

Louis: Right.

Andy: We’ve seen a few people doing things like that where they’ll just throw someone a dollar and say, hey; I really appreciated that blog article you wrote, you know, here’s money for a coffee or money for a beer, so people were thanking each other.

Louis: Right, sort of a tip economy for online helpfulness.

Andy: Yep, exactly. And we’re actually hoping to see more of that because I think that’s really cool.

Louis: Right, have you seen anyone sort of plug this kind of thing into their website, sort of say if you like this article here’s a Twitter API integration with pay, whatever, a dollar or fifty cents?

Andy: We actually make available. I’d have to dig up the URL, I haven’t got it in front of me at the moment, but our product manager, Michael, put together a Ruby-backed web application that generates an HTML snippet that you can just put onto your web page and it automatically sends a tweet when someone clicks it using Twitters intent for sharing content, so it pops up the nice little JavaScript thing with the message pre-filled @pygg pay, and the owner of the blog’s Twitter handle, $4.00 for this fantastic article.

Louis: Right.

Andy: We haven’t publicized that as well as we possibly could, but there are a few people out there who are using it.

Louis: Awesome. Have you guys encountered other people in doing a similar kind of thing?

Andy: There are a number of companies both here in Australia and especially over in Silicon Valley who are starting to move in sort of Bank 2.0 in the social payments sphere. We’ve seen Square, who I don’t really know how to describe their business model, but they recently released an application that does location based payments, so you pull up the application on your mobile phone and you select the store that you’re in, and the store owner sort of gets a list of people that are currently checked in at their store and they can pick you out via your photo and charge you using Square’s API. So that’s a particularly cool implementation that we’ve seen. And, yeah, there’s quite a few people doing similar things; I haven’t seen anyone else using Twitter in exactly the same way that we’re using it, but it wouldn’t surprise me to see some competition spring up very quickly.

Louis: Yeah. And you also mentioned that you do have eventual plans of moving beyond Australia.

Andy: Yeah. I’m not sure where we’ll move out to first, but there’s a bit more work to do, the application’s not quite at the level where we’d want to expose it to hundreds of millions of users at a time, yet; we’ve got a long way to go, we’ll get there don’t worry.

Louis: (Laughs)

Andy: And once that’s sorted and a business decision has been made then we’ll definitely be looking at international markets, but that’s sort of above my pay grade, that’s something that the founders need to decide on.

Louis: Right. So you mentioned one of the things was you withdraw the money into a bank account via the bank account number, was there any discussion around potentially using PayPal for that, allowing people to get money out into their PayPal account?

Andy: There was early on, from memory it had to do with PayPal’s API and the way that we would have to integrate with them, they had some very stringent business rules around making payments back into PayPal. At the moment our PayPal implementation’s just a PayPal buy it now button.

Louis: Yeah, right.

Andy: It’s very straightforward, easy to implement, very quick to churn out and get up and running, actually integrating with their API in a more structured way, early on at least, was more than we wanted to do. So that’s something we’re looking at over the next probably four months we’re going to be expanding the options for getting your money in and out of the service.

Louis: Right, cool. So you mentioned sort of earlier on that the company you work for is called Pollenizer, and Pygg is one of a few projects that have on the go at any given time.

Andy: Correct. Pollenizer is at the moment I guess startup incubator is the best way of describing it, simply it’s a little bit more complicated than that, but that’s sort of the essence of it; we build minimum viable businesses.

Louis: Right. Is Pygg one of the first projects or is this, you know, or have there been a few in the past from coming out of Pollenizer?

Andy: Pollenizer’s been around; we’re coming up on our fourth birthday on the 29th of February. Pollenizer has built a number of different startups, obviously not all of them successful, it’s sort of guaranteed in this industry that you try a bunch of things and you run with the things that work and try to fail as quickly as possible with the things that don’t, but some past notable names include Dealized and Spreets; Spreets was sold to Yahoo for a sum of money that I’m probably not allowed to mention.

Louis: (Laughs)

Andy: You know; it was a fairly significant exit and a big victory for Pollenizer.

Louis: Right.

Andy: We have been working for a while, fell into the trap early on of doing a lot of client based business, and we’ve recently started developing what we’ve come to call the Pollenizer way which is more focused on sort of the startup industry and building startups in the right way as opposed to as a client contractor, and that’s working out much more successfully for us; Pygg is one of the first businesses to be developed under that model.

Louis: Right. And is this something where they’ll be a team hired to work on a specific new startup sort of under the umbrella of Pollenizer but that team stays with that project or is there a core Pollenizer team that works on a number of different projects and then if those things spinout into successful businesses they have to take on additional staff; how does the organization of staff work in those cases?

Andy: That’s an interesting question especially as someone working internally at Pollenizer. At the moment the model is that there are three or four what we’re calling Pods within Pollenizer which are self-contained teams consisting of a customer development manager, a product manager, an engineer and usually either a front-end or a graphic designer, that one’s still a little bit nebulous, and under the engineer there will be anywhere between one and four junior developers working on a project as well, they may be here in the office or they may be located overseas or it depends on the requirements for a given project. Each of those Pods will work on two businesses at a time, typically two of those four developers or one of those two developers will be working on each of the businesses, and the other four members of the Pod sort of spend half their time between each of the projects. That model is probably going to be refined soon, you know, we’re constantly learning from the things that we’re doing and changing the way the business is structured to make things more efficient and more effective, but I have to get back to you on that one.

Louis: (Laughs) Right.

Andy: And once a business graduates to the point where it needs to leave the Pollenizer fold and go and be its own thing, staff traditionally have had a choice of whether to go out and work on the business or whether to stay within Pollenizer; I don’t know if that’s going to be the case going forward, but I think it’s valuable to Pollenizer to hold onto staff who’ve worked on a variety of projects as long as possible, and it’s valuable to the businesses that they build to hold onto the staff that built them, so there’s an interesting tension there.

Louis: Yeah. You’ve also written a couple of articles for the various SitePoint sites over the past few months, a lot of it’s been focused around mobile app development, so do you sort of split your time between working on backend server side code and, say, IOS and Android dev?

Andy: I am a serial over-committer and workaholic, and my personal time quite often gets used to work on whatever I’m feeling particularly passionate about at any given moment which has often been iPhone development, I’m working in a lot of stuff at home in my own time on that platform. Haven’t done a lot of Android stuff yet, though, I’m starting to get very tempted by some of the new handsets that are coming out, so if anyone wants to donate me an Android handset feel free, Google, ahem.

Louis: (Laughs) I don’t know if we have any listeners at Google.

Andy: Uh, you’d be surprised, maybe.

Louis: Yeah, it’s a big company. Alright, well look, it’s been great talking to you, and thanks for making a bit of time to come on and talk about the stuff you guys are working on, I thought it was just a lot of cool stuff and I was sort of intrigued by the platform and it seems to have come together very quickly. I didn’t have any clear idea of how long it had taken to put together, I just remember sort of vaguely hearing about it and then the next time I went to the website it looked to be fully functional and everything was there, I’m like, oh, what happened there.

Andy: I kind of feel the same way some mornings.

Louis: (Laughs) Yeah, I imagine. Thanks again for coming on the show, it’s been great, wishing you all the best of luck with Pygg and I hope to see more of your work on the sites in the future. If the listeners wanted to find you online or check out Pygg or Pollenizer what are the Twitters and the web addresses that they should be looking up?

Andy: So for Pygg you’ll want to look at Pygg, p-y-g-g.co, that’s pygg.co; the Twitter handle for that one is @pyggau, so p-y-g-g-a-u, for Pygg Australia, and my Twitter handle is @arcwhite, a-r-c-w-h-i-t-e.

Louis: Yep, I think that’s all good.

Andy: Thank you very much for having me on, Louis.

Louis: Thank you, it’s my pleasure.

Andy: Take care.

Louis: Take care. And thanks for listening to this week’s episode of the SitePoint Podcast. I’d love to hear what you thought about today’s show, so if you have any thoughts or suggestions just go to Sitepoint.com/podcast and you can leave a comment on today’s episode, you can also get any of our previous episodes to download or subscribe to get the show automatically. You can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. The show this week was produced by Karn Broad and I’m Louis Simoneau, thanks for listening and bye for now.

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.

Episode 140 of The SitePoint Podcast is now available! This week the panel is made up of Louis Simoneau (@rssaddict), Kevin Dees (@kevindees), Stephan Segraves (@ssegraves and Patrick O’Keefe (@ifroggy).

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #140: Web Page Bloat (MP3, 36:42, 35.3MB)

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 main topics covered in this episode:

• Royal Pingdom: Web pages are getting more bloated.
• jQuery Mobile reaches deployment.
• Foursquare Gets Redesigned
• Youtube Upgrades HTML5 Video Player

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/140.

Host Spotlights

• Kevin: Postmark – Email For Your Web App
• Patrick: The Final Rap Battle!
• Stephan: How To Write Unmaintainable Code
• Louis: Jasmine – BDD For Your Javascript

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint Podcast, another panel show this week covering the news and events in the Web and the world of web design and development over the past few weeks. This is a special panel show because we’re welcoming a new member of the panel, Kevin Dees, hi Kevin.

Kevin: Thank you for having me and hello.

Louis: Absolutely a pleasure. And we’ve also got the two remaining members of our regular panel, Stephan and Patrick.

Stephan: Howdy, howdy.

Patrick: The last men standing (laughter). Hey Louis; welcome to the show Kevin.

Kevin: Thank you, thank you.

Louis: So, Kevin, do you want to maybe just introduce yourself for the listeners and then we can dive straight into the stories.

Kevin: Sure, I can. So, I am Kevin Dees, that’s my name, I run a website called Kevindees.cc where I do interviews and post about just the random thoughts that I have, so that’s where I’m most known. And I also do another podcast called The Web Weekly where I met Patrick and our relationship started and has gone on from there. So that’s kind of me in a nutshell and, yeah, I’m excited to be on the show, I’m excited to be here and just talk about web and web design and all those wonderful things.

Patrick: Kevin was a listener of the SitePoint Podcast on and off, so that’s sort of how we first met, and we’ve hung out at a couple conferences and of course he’s done some interviews on his site, so that’s kind of what led us to invite him to join the show. But also, Kevin, can you tell us a bit about your development background and what makes you a fit for a web development podcast.

Kevin: Sure, great. I have been developing websites for some time now, geez, I don’t even know how many years; I made my first website when I was nine if that tells you anything, and I quit for a little while just because I was a kid, but I’m back and I’ve been doing it for, whew, at least six-plus years now. Basically I’m a WordPress developer, PHP developer, and I also deal with front-end code, so CSS, HTML and JavaScript. I’ve made a few WordPress plugins and I’ve made some plugins also for browsers, for example, I’ve made a plugin that helps IE7 specifically support the pseudo elements before and after, so I’ve done a few things like that and I’ve worked for agencies, I’ve freelanced, I’ve run my own businesses, and so I have a little bit of experience, or at least I’d like to think, in the Web community.

Patrick: Excellent, excellent. Well, welcome aboard.

Kevin: Thank you.

Stephan: Welcome aboard.

Louis: Yeah, welcome. The first thing that’s worth sort of talking about a little bit this week is — and this happened pretty much I think the exact day we recorded the last panel show, so it’s been a little over two weeks now so it’s probably old news to anyone listening, but since we haven’t had a chance to talk about it, Adobe has resigned Mobile Flash as a platform that they’re working on, so I guess go HTML5.

Kevin: Yay, go HTML5, yay.

Stephan: Woo hoo.

Louis: So I guess we won’t dwell on it because like I said it’s an old story, I just wanted to shoot it out there and I guess we can always revel a little bit in the decline of Flash.

Stephan: Now, now.

Kevin: I think it’s an interesting story and news because Flash has been the plugin of choice, right, for not only the desktop but they were hoping to become at least the one for mobile, and so to see them back down from that and to focus their efforts on different areas I think starts this trend for other companies to basically take HTML5 more seriously, or maybe it is that Flash and Adobe are the last tools to really take that approach.

Louis: Yeah, it’s kind of played out interestingly and the way it’s developed in the sense that the iPhone didn’t have Flash and then Android added Flash and it was still kind of in this nebulous space where we didn’t know whether it was going to be a major part of the mobile web or not, and I guess now we know, now we know the answer.

Patrick: Yeah, one more iteration of Mobile Flash for Android is on the way at least, Flash will be available to Android 4.0 users for the end of the year, but that appears to be the fond farewell according to a story by Shamus Bellamy at PC World. But Flash for the desktop is still around much to many of our listeners’ chagrin, so that’s — don’t take this the wrong way, this is just mobile Flash just in case your heart skipped for a second and you didn’t hear the mobile part.

Kevin: I have a story, my first story on the show, yay, jQuery mobile its final release is out and so everyone can start to use this, it’s finally out of beta and release candidates, the supported operating systems if you haven’t heard of it are IOS, Android, Blackberry, Windows Phone, Palm; so those are kind of the core ones. And essentially what this does is it allows your site to have the same feel as a native app on a phone, more leaning towards the iPhone and its experience, so you have transitions and dropdown menus, that kind of thing, that kind of fit with that space. So, you know, I think this is an interesting release in that responsive web design has been — kind of been the trend for a while now, and when these other technologies like jQuery or jQTouch when it was first come out, so it’s now jQMobile, when these platforms first came out there wasn’t responsive web design. And so to see these other platforms continue to move on alongside responsive sites will be interesting to see when people try to use these things, right, because sometimes jQuery Mobile will be the correct solution and other times responsive will be, so, you know and plus it’s kind of — jQuery Mobile’s kind of one of those things you just kind of turn on that works, right.

Louis: Yeah, I mean I’m definitely impressed by the progress that this has made, I remember the original sort of alpha release and it was utterly broken on my phone, at least in the experience that I had with it, and it looks really slick now I have to say, I mean I still have a bit of a, you know, a concern that it includes a bit too much UI and visual stuff, like it has a very clear look to it that comes bundled with it, whereas most of the time if I was looking for a JavaScript framework for mobile I’d really just want, you know, give me some events and get out of my way and I’ll handle the UI, but if you wanted like a jumpstart into developing a mobile web app that felt as native and as slick as possible I think it’s definitely an impressive product. But like you said, it’s interesting to see how that’s going to play against the more responsive approaches where you can build sort of one website for all devices rather than have a specific mobile targeted app.

Kevin: Yeah, it will be interesting because most people that go in, and I know when I go and make websites if I go mobile I normally will use the responsive style of doing things whether it’s a fluid or elastic system or actually using media queries, right, so just something that’s more device agnostic. And so a plugin like this I can see people using or myself using when maybe you’re trying to put this together something quickly, trying to put together something on the fly, maybe an app idea or a presentation, but I think it’s going to circle around that one word which is app, right, it’s not going to be the flavor for the website, it’s going to be web apps I think that’ll use this mostly.

Stephan: That’s the key for me really is that this is an application design tool for me. If I was going to jump into it I think that’s what I would use this for, I don’t think I would use it to turn my homepage into a mobile friendly site, I think I would if I had an app idea this would be where I’d go to start that idea; I don’t think I would go to the iPhone SDK or anything, I think I would come here.

Louis: Yeah. If anyone hasn’t had a look at it, definitely go to jquerymobile.com and have a look because there’s a lot of cool widgets for forms, for all kinds of behaviors in widgets on the website, and the whole thing is there as a demo, you can click around and play with it directly on the website, so worth having a look at if like you said, Stephan, for something where you want a quick launch into building a mobile web app.

Patrick: So what’s the next best story?

Louis: (Laughs) Are we doing these in order of quality, oh shoot, I would’ve gone first (laughter).

Patrick: I don’t know, I’m just saying what’s the next best one.

Stephan: So there’s an article in the Business Insider today about YouTube upgrading the HTML5 player, and it’s kind of the sign of the times as YouTube gets ready to get rid of Flash completely. Some of the things that they’ve done, they’ve enabled annotations and captions, they’ve made 480p and 1080p both options now, and you get native full screen support for Firefox and Chrome, so some cool stuff there all done in HTML5.

Louis: Yeah, the annotations in captions is big because when they first rolled out the HTML5 player a lot of people pointed out that those features were really lacking and as long as it didn’t have all the features of the Flash player it was only sort of a cool thing for web developers to look at and geek out on, but it wouldn’t really be an alternative because it was lacking some of the core features, but it’s good to see that they’re adding that stuff in now.

Stephan: Yep. Oh, I was going to say you can also sign up to kind of test this out if you want, on their page you can go — say you want to use the HTML5 player and that way you can report bugs and things like that, so it’s cool.

Patrick: Yeah, the story by Noah Davis says it ends with “The moves are another blow in Flash’s inevitable defeat.” So he’s quite bearish on Flash’s future, and it makes me think if HTML5 takes away media playing, if it really gets it right and Flash is no longer seen as the standard that it once was when it comes to video and audio playing, does it go back to being a niche kind of design tool as it once was many, many years ago or is this is for Flash, is this kind of the last hurrah, is the last thing that it really does well at this point?

Louis: I don’t know. It’s kind of interesting because I went to the Melbourne Web Developer Meetup last night which was just downstairs in our building at 99Designs, and I was giving a little quick talk on some of the fraud prevention stuff we do at Flippa, and I don’t regularly give talks so I don’t have keynote or PowerPoint installed on my computer so I just really quickly Googled, you know, I tried the Google Documents presentation thing and it was kind of crappy (laughter), so I just quickly Googled like online presentation tool and I found this thing called SlideRocket and threw together something in about a half hour that morning, and it was really, really good, it was a really great tool, you can import images from Flickr directly, it connects with — you can show a live Twitter stream in the presentation and it’s all online, and it’s all built in Flash and it was really good, like it really felt like using a desktop application in the browser, and I don’t feel like there are very many pure HTML apps that have exactly that level of quality, I mean obviously Google Docs is great but I have to say like the experience that I had with this as a Flash app was really, really good. So I think it probably still does have a place for certain, you know, very rich application functionality.

Patrick: Hmm, yeah.

Kevin: I feel like this is probably not the best move for me to go ahead and try to boost Flash just a little bit, but I would like to play devil’s advocate and tread on some dangerous ground here and say that when it comes to Adobe in the Flash side of things, the main part of Flash, right, is that it’s an authoring tool, so as long as Adobe can continue to sell that platform to designers or developers they can continue to make this market right, so I see the biggest benefit for them having Flash on any computer is the sheer marketing power that that offers, right, 99% of computers is kind of the standard number. So when you look at that that’s free advertising for Adobe on every system, and so I feel like they’ll be okay with letting that go because the real profits come from the authoring tools, and as we see with like Adobe Muse and these other tools that do like animations and things, you know, they’re going to move more towards that way. And the other part of this that I’d like to harp on just a little bit is when I make sites with say a JavaScript slide or slideshow I can’t really use HTML5 too much on sites quite yet just because Internet Explorer, right, but when you use these JavaScript frameworks as, you know, a placeholder for what used to be Flash, you run into problems with these transitions on the older browsers, where if you move images around it’s really jittery and those sorts of things. So I think Flash will continue to have its place in video and things like — I mean obviously most folks don’t use it for slideshows anymore, but there is a place for it in that spot because I mean maybe you guys have had the same experience as me, but when you’re making a website and you try to make a jQuery slideshow, if you have large images that are highly detailed every time it has to move it has to redraw that image on the screen, just uses up a lot of bandwidth on your computer.

Louis: Yeah, I guess I mean especially with older browsers JavaScript performance has increased exponentially in the last few releases of at least Chrome and Firefox, but, well, even IE their performance in IE9 and IE10 has been impressive, but if you’re looking to support anything a little bit older than that it can definitely be a bit of a challenge, yeah. This is where a lot of cases where the standards crowd would argue that’s a good case for sort of a responsive and graceful degradation approach, you don’t need a giant front page slider on old browsers, it’s like trying to play a color show on a black and white TV, to borrow a quote from last week’s interview show.

Kevin: Good points.

Louis: Cool. I had a little bit of a short story as well that I wanted to talk about, and it is kind of I guess relevant to that if you’re stretching the limits of what constitutes a segue here, but this has to do with website performance and it is a story on Pingdom.com which is just a blog post that they wrote recently about the fact that over the last year on average web pages have become 25% bigger, so this isn’t the actual pixel size but the download size of websites. So what they did is they went through the http archive website, gathered statistics for the top 1,000 websites in the world and looked at stats over the past year; the average page size a year ago was 626 kilobytes and currently it’s at just around 780 kilobytes, 784, so that’s pretty massive growth in a very, very short span of time don’t you think?

Stephan: Yeah, to say the least (laughter).

Patrick: I wonder at what rate bandwidth adoption is growing like as comparable to this, it would be interesting to see those two numbers side-by-side.

Louis: I think if you include mobile usage bandwidth has actually probably gone down over the past –

Patrick: Okay, drop those mobile — drop the mobile stuff out of it then (laughs).

Louis: Well, you can’t, right, that’s the whole point, you can’t.

Patrick: But this is the home pages right? I mean this is the default desktop designed home pages, not like a mobile version, not a responsive version but the actual just default what you see on your laptop.

Louis: Yeah, I guess that’s an interesting question is, you know, I mean I think it’s fair to say that it’s unlikely that over the past year any of the top thousand websites would have any sort of conditional loading or advanced responsive designs where if you load it in a small window it will only load a subset of resources and then it will go out and get stuff. I mean that’s a pretty cutting edge technique that I don’t think a lot of these top websites will be using, at least not just yet, or maybe people like Google and Facebook will be –

Patrick: Right.

Louis: — to be fair.

Patrick: But many of them probably would direct you to a mobile version if you were using a mobile device.

Louis: Yeah, you might be directed to a mobile version, so that is fair.

Patrick: Right, yeah.

Louis: But in this case if you look they’ve got charts of sort of where the size increase comes from, and a lot of it comes from increases in amount of JavaScript and images, so the actual markup hasn’t grown significantly, CSS has grown a little bit not much, even Flash has grown a little bit, not much, but then the JavaScript has increased nearly 50%. So I don’t know whether that’s due to people increasingly falling back on using JavaScript libraries as opposed to hand coding stuff which can be a bit bigger or maybe using JavaScript techniques to sort of polyfill support for new HTML5 and CSS3 features that they want to try and use, so there are a lot of possible explanations; some of it could be that developers are lazy I guess.

Patrick: (Laughs) Well, no, it’s not that, absolutely not that, we love developers.

Stephan: No we’re not (laughter).

Patrick: But you know it makes sense when you think about where a lot of these redesigns have gone. It seems like more and more it’s the big bold image, and I guess you could say that they could be compressed or things can be done to limit the impact of that, but more and more when I visit websites, news sites and sites with any sort of regularly updating content, it’s a big bold image I’m greeted by, and sometimes this has part of a slider which I guess would speak to the JavaScript, too, where it’s showing these big bold images, three to five of them the most recent content that’s available to try to get your attention, so I guess in that way it kind of makes sense.

Louis: Yeah, but I guess my point is for a lot of those people so you’ve got this big slider on your front page and rotating out images is a pretty short snippet of JavaScript.

Patrick: Right.

Louis: And if that’s all you’re using then you can write, you know, maybe less than a kilobyte of JavaScript and have it do that, but a lot of these people will be using jQuery and then a jQuery plugin that were really built to handle every possible slider combination or situation.

Patrick: So, to sum it up Patrick’s thought is stupid (laughter), next! So, anyway, there are numbers shown to the size increase per content type, and as you mentioned JavaScript up 44.7%, actually CSS was second on a percentage basis although it didn’t really go up much file size-wise from 30 — I guess when you’re going from 24 kilobytes to go to 30 it’s a 25% increase, but dealing with sheer volume of kilobytes it’s clearly far and away images gaining about 80, it looks like exactly 79 kilobytes.

Louis: Hmm.

Patrick: Yeah, so those kilobytes, man.

Kevin: What do you guys think about the fact that websites are simply easier to build now with sites like WordPress.com and Tumblr where anybody can go in, create a site and then download their 16 social media plugins, all these plugins for these things, and that may attribute to some of this, so maybe it’s not just web designers getting lazy but perhaps just the fact that the average Joe can go in and start plugging away and doing things on their site that they wouldn’t normally have the ability to do because of the ease of access.

Louis: I think that might be a valid point. In this particular case because it’s a survey of the top 1,000 sites I don’t think there would necessarily be an impact of amateur developers on these numbers.

Kevin: Right.

Louis: But I think that’s probably if you’re looking at the Internet at large there probably is a lot of poor website performance that’s due to those new tools and that ease of use.

Kevin: So this isn’t factoring in the dot com for wordpress.com?

Louis: Probably not. But although even on the top websites in the past year you mentioned these sorts of social media plugins, and they definitely have proliferated a lot over the past year. I don’t know if you went back and — pick any major news media outlet and go back abut a year and they maybe had share on Facebook and now they’ve got the Facebook Like button, the Tweet button, the Google+ button and who knows how many other options, and that’s a lot of JavaScript that’s being loaded in, so that might definitely be a cause for this.

Patrick: And it’s interesting, Kevin, when you mention that what you brought up in my mind immediately was how WordPress recently touted that, and we talked about this on the show, I think Brad Williams brought it up obviously, they were touting that WordPress according to an in-house survey they determined that they are powering 14.7% of the top billion sites worldwide. And I know that I’ve heard either that or a top x number of sites being powered by WordPress online as the software grows in popularity, and so I say this facetiously that this growth in kilobytes could then be tied to the growth of WordPress infiltrating the top one thousand sites. Obviously I’m joking, but it’s funny that you made that suggestion.

Kevin: I think it would be interesting to see whether or not it included the sub-domains at WordPress, I mean you would hope that they didn’t.

Louis: Yeah, it’d be cool to see; I don’t know if they have a list of which sites were included, a websites tab on the http archive, yeah, okay, so it’s this — so I’m just having a quick look, I think this is a bigger list. If you go to httparchive.org and click on the websites tab you’ll see there are 37,000 total URLs indexed, and I’m just sort of scrolling through them and they don’t look like any of them are sub-domains of wordpress.com, so it looks like they’re all sort of top-level domains.

Patrick: Right.

Louis: Well, not top-level but, you know, they’re all domain names. Yeah, so what I was going to say about this, though, is that it really does highlight the importance for web developers to learn about and to focus on issues relating to front-end performance; there’s so much stuff that can be done to make this better and to make your pages load faster, and the time it takes your web page to load is maybe the number one feature that people are going to be happy about, so, yeah, I think it’s super important, people should spend more time making their websites run faster and less time just adding new stuff to them.

Kevin: So, speaking of site performance, it would be interesting to see how the new Foursquare site holds up because they just recently redesigned their site. I found this out through Sam Brown on his website, he had spoken about them launching the site, and I think an interesting part of this redesign is their focal point which is the signup with Facebook button. So they’ve basically taken the regular signup with email functionality off the screen, so there are no fields on it except for the signup with Facebook button, and so they’re using the signup with Facebook button to basically pull in I would believe the majority of their users, right, so I don’t know if you guys are seeing this trend, and I was interested to see what your thoughts might be on that.

Patrick: Yeah, I mean we’ve talked about open ID and Facebook and all these other login systems, and it’s interesting because I’m always the curmudgeon I think (laughter), that says no, no! I want email, I want a username, I want to have my own unique login and not rely on Facebook, but, more and more people are using it for identification.

Louis: Yeah, I mean I’m definitely among those who prefers to develop my own systems and not sort of rely on Facebook or Twitter or whatever for core aspects of the website, but when talking to the marketing people on our team or even at SitePoint and they love the stuff; when we do the Christmas sale at sitepoint.com for the last few years the sort of comment thread has been just a Facebook comment thread and that has been really, really good for letting people share it easily and you’re just logged in and it’s a seamless experience for most users, and you see it on a lot of news sites now, I don’t know if you guys have noticed this trend where you’ll be on a news web page and you scroll to the bottom and it’s just a Facebook comment thread.

Patrick: Yeah. Yeah, and you know it’s interesting because if you have developer talent and programming talent then obviously you’re able to manipulate those comments and work with Facebook’s API. Just recently a WordPress plugin was released that allowed you to sync comments with Facebook, and so, you know, WordPress bloggers won’t just lose their comments if they shut off Facebook comments. But I definitely think it’s a situation where that sort of thing it’s really dependent on the use; obviously Christmas sale short-term once a year not that big a deal as far as maintaining the content long term, but you’ve got to be careful not to hand over too much of your ecosystem to Facebook, and like I know why people do it, I know why they’re very powerful, how many people use Facebook, it’s immense. And I’m sure they’ve done their testing, I’m sure FourSquare isn’t stupid, I’m sure they’ve done some A/B testing and figured out what converts well and that’s probably what’s driving the decisions is data that’s saying using Facebook sign-in and making it that easy will drive more people to use FourSquare.

Louis: Yeah. I can see how it makes sense, but like you said I’m a little bit skeptical and always a little bit concerned about relying on an external service for any core aspect of the site’s infrastructure. Just speaking about the redesign itself, though, I’ve just logged in, I hadn’t logged in to FourSquare on a desktop forever, I guess it’s just not something that you use on a PC usually, but the new dashboard looks really good, you’ve got this sort of map at the top which shows recent check-ins with avatars on the map and all local things, you’ve got a history of recent activity from your friends, it’s got some suggestions of nearby businesses you might want to check out, it’s a really, really nice interface, I’m impressed.

Patrick: Yeah, I like it as well, it looks really nice, clean, fresh, all those ways that you would describe it, but only thing I notice is as you scroll you get that top bar that stays with the page and looks similar to Twitter I would say, the font off the top of my head looks similar, and the search bar is there, I’m not saying Twitter originated it, I’m sure they didn’t, but it seems like we’re seeing that more and more where there’s this top bar that’s consistent as you scroll on all pages; is that a new convention, are we going to see that proliferate on every website?

Louis: I think for websites where you have sort of account management being a constant thing that you want, especially anything that — see, the thing about Twitter I find is it’s got such a long feed of stuff that having to scroll all the way back to the top to get to change to navigate to your profile or to search, it’s getting in the way of users’ ability to use the site, so for me I think it’s relevant if you have a really, really long page that just sort of scrolls infinitely with an activity wall, for example.

Patrick: Yeah, it does seem like it’s becoming more and more standard with those pages, not only FourSquare now and Twitter, but also Google+ obviously uses it, Facebook does that, and yeah, I mean as these social websites grow I think it is something we’re going to see and also see across different platforms like open source platforms that run forums or social networks to make it easy, as you said, to manage that profile.

Louis: Yeah, well I mean the WordPress admin bar is a great example of — and that was fairly recent, that was only one or two point releases ago that was added.

Patrick: Right.

Louis: And very similar approach. It’ll be interesting to see how this develops, if there are any frameworks out there or plugins, I know I was just saying the plugins are dangerous because they add all this bulk to your page needlessly, but in this case you know it seems like a great opportunity for someone to put together a little package of stuff that gives you this fixed static top bar menu functionality.

Patrick: Who cares about a few kilobytes between friends.

Louis: Well, that’s how it starts (laughter).

Patrick: It’s a slippery slope. You now kilobytes are a gateway drug to slow page loading (laughter). But it’s funny, you know what that makes me think of, I don’t know if you guys have seen this Sprint commercial, but it’s about data and how much data you can use on Sprint and how fast data builds up, and it starts with a counter on kilobytes and the kilobytes go slowly. You know, it starts with a single digit then two then three digits, and it goes up to then a megabyte once it hits a thousand kilobytes, and then the megabytes go faster than the kilobytes did, and it’s like one of those things where if you actually knew anything about this you know that kilobytes would go fast, it would slow down as you got to megabytes; and gigabytes, the gigabytes just fly by but, again, it’s a mainstream commercial and no one really would care all that much, but the geeks among us, the techies among us are like why are the gigabytes going faster than the kilobytes. Anyway.

Stephan: I just want to know what that woman is doing all day, like what is she on her phone constantly (laughter).

Louis: 25% growth of web page size a year, I think that means it’ll double every roughly three and some-odd years, so we could get there, I mean that’ll be exponential in no time and the gigabytes will be flying by.

Stephan: Oh, man.

Patrick: Need those unlimited data plans.

Louis: Actually it would be cool to calculate at 25% a year how long it will take for the New York Times home page to reach a gigabyte (laughter). I’m sure it’s not even outlandish, I’m going to do the math after the show and I’ll post it in the comment thread.

Patrick: Very good, very good.

Louis: Do you want to kick us off with the spotlights, Kevin; given it’s your first show?

Kevin: Sure, I’d love to. So my spotlight for today is Postmark, Postmark is a paid service but what it does is incredible. So if you’ve ever made a website or web app that uses email you know how painful it is to actually get the email in the inbox, you have to make it past the ISP, you have to make it past the spam filter and the client, and you know all the other parts that are in between that. And what Postmark does is it gives you an API to play with, after you verify a few details, to basically skip over those steps yourself, so they’ve gone through all the hard work to help make sure that your email arrives as intended, and there are plenty of plugins and things for this, you can do it with PHP, JavaScript, they even have a plugin for WordPress if you have a WordPress blog. So I would check it out, you get your first thousand emails for free and every thousand after that is just $1.50, so there’s no reason not to use this service, it’s super cheap, I mean even on my own blog email is fairly rare, and I know that WordPress commenting system also uses emails but you can always turn those off.

Louis: Yeah, so this is something unlike — so I’m just now looking over it, but it seems like whereas things like Campaign Monitor or MailChimp are more focused on sort of marketing email lists where you can sort of track subscribers, this seems like it’s more for actually sending email from an application, so sort of account activation or notifications or new messages or that sort of thing from an application, right?

Kevin: Correct. So I mean sites that use this are things like Forest, Readability, Tender, you have all these applications that use those; if you’ve ever made a web app before you’ll know that, like I said, getting email to the actual inbox as you want it to is kind of hard, and so if you run a big website, let’s say if you’re running the Forest forums, if you’ve heard of those, and somebody signs up for your site, right, they have to click that activation link to activate their account, but if they never get the email there’s trouble, right, and you have to deal with the support hours and all that stuff. So if you’re using a service like this, you know, obviously you can get your email delivered for your web apps and it’s done right.

Louis: Yeah, it looks pretty nice and the pricing seems very reasonable as you were saying.

Kevin: Yeah. So I haven’t been using this personally, but I’m fixing to make the transition to use this for all of my stuff, I mean there’s no reason not to use this and it should be used.

Louis: Cool. Well, let us know how that turns out.

Patrick: Yeah, and the website for this is postmarkapp.com for those looking for it.

Kevin: Correct.

Patrick: Alright, I’ll go next. My spotlight is off-topic as usual (laughter), I’m going to throw it back to the –

Louis: Really, what a surprise (laughter).

Patrick: Really; really, really, really. I’m going to throw it back to the Epic Rap Battles of History. They just posted the “Final Battle” between Nice Peter, the person who you see in most rap battles and whose channel it’s on, and Epic Lloyd who you also see in all videos, but it’s them, the individual people battling it out for the “Final Battle,” now, will it be the final battle? I’ll let you decide, but since I first featured the Epic Rap Battles of History series back in April, I believe here on the SitePoint Podcast, they’ve releases such epics as Christopher Columbus vs. Captain Kirk, Mister T vs. Mr. Rodgers, and Dr. Seuss vs. Shakespeare, so if you haven’t been keeping up-to-date this is your chance to get back into it. And you can find it at youttube.com/user/nicepeter or Google it and all roads will lead to Epic Rap Battles of History.

Stephan: And I’ll go third. Mine is a write-up that I find hilarious called How to Write Unmaintainable Code and Ensuring a Job for Life (laughter). And it’s pretty fantastic, there’s like for naming, naming your variables, just use a baby name book, you’ll never be at a loss for variable names (laughter). Be abstract, make heavy use of words like everything data, handle, do, digits, just random digits for your function names, just great stuff, so if you’re worried about your job have a look at this.

Patrick: This is a guide to best practices, is that correct, is that how I should read this? (Laughter).

Stephan: Exactly, the manifesto.

Louis: Wow, this is actually pretty long.

Stephan: Yeah, it’s really long.

Louis: There’s an amazing amount of stuff in here, it’s got guides to like really good obfuscation (laughs).

Stephan: How to hide forbidden globals (laughs).

Louis: Ah, man, yeah, terrifying.

Kevin: I love this one, it’s Mary Poppins = Superman+Starship divided by God (laughter).

Patrick: Oh, gosh.

Stephan: You’re welcome.

Louis: I’m not going to show this to any of my co-workers. Fantastic. Mine for this week is something that someone else talked about last night at the Melbourne Web Developer Meetup, it is a little JavaScript library called Jasmine, you can find it at pivotal.github.com/jasmine. They describe it as a behavior driven development framework for testing JavaScript code, so it is exactly what it sounds like, it’s sort of a unit testing framework for JavaScript, so they sell it as follows, it doesn’t depend on any other JavaScript frameworks, it doesn’t require a DOM and it has a really straightforward syntax, so it’s pretty cool, if you just have a look at the website they’ve got a little example there showing how to set up a simple expectation; if you’re not familiar with behavior driven development I guess there’s a lot of other reading out there, but if you are familiar with test driven development and you’ve been using it in your server side code then it might be interesting to have a look at using it in JavaScript as well, at least I will be next time I write JavaScript.

Patrick: (Singing) You know that I’ve got Jasmine on my mind. That’s a song, sorry (laughter), it’s a song by Black Rob featuring Carl Thomas, anyway, very good. I’m tempted to hand that programming guide to like — I mean wouldn’t it be funny to hand that to someone who was just wanting to get started in programming and then watch them just be terrible, and it excites me, and that would be very mean, but it’s like if that was someone’s first guide, like they just found this and somehow missed the heading and thought this was an actual guide like what would the end result be? I’m curious, quite curious.

Louis: I’ve seen code that looks like it was written as if this had been taken as a literal guide (laughs).

Stephan: Good job, Stephan.

Kevin: Wasn’t that called Geocities back in the day?

Patrick: Oh, ho, ho, wasn’t that called Geocities back in the day, Kevin said, yeah (laughter).

Louis: I never saw their implementation code; I’m probably saner as a result of it. Yeah, awesome, I guess we can wrap it up then.

Kevin: I’m Kevin Dees and you can find me at kevindees.cc and also on Twitter as @KevinDees.

Patrick: I am Patrick O’Keefe for the iFroggy Network. I blog at managingcommunities.com; on Twitter @ifroggy, i-f-r-o-g-g-y.

Stephan: I’m Stephan Segraves; you can find me at badice.com and on Twitter @ssegraves.

Louis: And you can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. If you want to leave a comment on this show or find any of our previous shows just go to sitepoint.com/podcast, we’d love to hear what you think; you can also email us at podcast@sitepoint.com. Thanks for listening!

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.

Episode 139 of The SitePoint Podcast is now available! This week our regular interview host Louis Simoneau (@rssaddict) interviews Lea Verou (@leaverou) the speaker and web developer who helps us all with her cool CSS3 tools on her site lea.verou.me.

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #139: Experimenting With CSS3 with Lea Verou (MP3, 44:56, 43.1MB)

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

Louis and Lea discuss the tool out there for using CSS3, her contribution to those and what the current topics are on the conference circuit.

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/139.

Interview Transcript

Louis: Hello and welcome to another episode of the SitePoint Podcast. My guest on the show today is a Web designer and developer who I’ve wanted to have on the show for some time now, it’s finally sort of aligned, you’ve been very busy with conferences, Lea Verou, hi Lea.

Lea: Hi Louis, thanks for having me here.

Louis: It’s absolutely a pleasure. I’ve been sort of following your work on your website and on Twitter for some time, it’s just sort of all of a sudden I think a couple of months ago just about everyone I followed suddenly started re-Tweeting your stuff and with reason, you’ve done a lot of really cool stuff, so I wanted to have you on the show and talk about that a little bit.

Lea: Thank you so much. It’s funny; I keep hearing the same thing from many people that you suddenly started being popular even though I was working on this stuff for like years.

Louis: Yeah, I guess it’s just the whimsy of the Internet and social media that all of a sudden if a few people who have a lot of followers who are well known catch on to your work and it explodes all of a sudden. Just an example of that, I think you’re still — you’re a finalist in the .net Magazine Awards in the category of Brilliant Newcomer, am I right?

Lea: Yeah, I’m in the three finalists and the results come out in like nine days, so I’m kind of looking forward to what they’ll be.

Louis: Yeah, well, congratulations on the nomination and on making it through to the final round.

Lea: Thank you.

Louis: You’ve been really busy of late, it’s one of the reasons it’s taken a little while to get you on the show is you’ve been traveling a lot and giving talks at conferences.

Lea: Well, October and November are usually really busy months conference-wise, there are many, many conferences these months; I’m not sure exactly why. And especially October has been crazy for me, I had like four conferences in a row flying from one country to the other, it was so exhausting, but really it felt good but it was really exhausting.

Louis: Yeah, I can imagine. I saw the video of one of your talks.

Lea: Which one?

Louis: The CSS3 Secrets, I think it was from Fronteers is the one that was — that I saw a video of.

Lea: Oh, good. I think that was one of my best.

Louis: (Laughs) Well, that’s good. So I’ll talk about that a little bit later, but first, since you’ve been traveling to all these conferences what’s the report from the front-lines, what are the big themes that everyone’s talking about, what’s your take on the vibe at these conferences?

Lea: Most talks, well, it seems like the hot topics in our industry right now are CSS3, of course, so a big bunch of talks are about CSS3 or server side JavaScript. I’ve listened to many talks about Node.js or also ECMAScript 6 Harmony that’s coming now and it’s quite hot in the JavaScript industry. Also we have many people coming over from the Flash world and they are educating us about their experiences with animations, they’re much better with this stuff and we have loads to learn from them like, for example, Aral Balkan, he gave a really interesting talk at Fronteers, or also Seb Lee-Delisle, I’m not sure if I’m pronouncing his name right, he also gave an amazing talk at Fronteers, and he used to be a Flash developer; we have loads to learn from these people.

Louis: Yeah, that’s really interesting, it’s something you don’t tend to think about but I imagine there are probably a lot of people who’ve been working in the Flash world for years who are very familiar with all these concepts of doing keyframe animation and doing somewhat more dynamic interactions on the Web, and now that we have these tools available in the browser directly I guess it makes sense for a lot of these people to have a lot to teach us.

Lea: Exactly. We can learn the technology ourselves, we can learn how to write the keyframe animations and the animation property, but they know, they actually know the physics, they’ve worked for it for years and they know how to create realistic animations that we don’t have the experience to create yet, so they can teach us a lot about that. I mean even personally I know a lot about the animation spec and I know the technical aspect of it, I really have issues with trying to make animations look realistic because it takes far more than knowing the syntax, you need to know the physics behind how things move around.

Louis: Yeah, absolutely. I imagine there are a ton of ways that you could create sort of a bouncy animation that it would just look not like a bouncing object, and if you’ve had these tools available to you for a long time you’d be a bit more experienced.

Lea: Exactly.

Louis: Right. So that actually kind of leads on because one of the tools you put out, or a couple of the tools you put out recently have to do with CSS animations and they’re these really cool tool, so anyone who doesn’t — who hasn’t seen your tools should definitely go to your website, it’s at lea.verou.me/css3-tools, and there’s a ton of really cool little things in there. If you haven’t had a chance to play with CSS3 animations or any of these things and just get a feel for what’s possible. So the most recent one is a sort of a gallery of animations that came out I think very recently, right, you only posted this –

Lea: Yeah, I was creating my slides for a talk I was giving in Sweden earlier this month, so in one slide I wanted to show how many possibilities we have when we animate a specific property, and I wanted to show the audience that every property that accepts animatable values can be animated, even properties that we don’t usually think of as animatable, for example, text-indent or line-height or letter spacing; who thinks about animating those. So I wanted to show that all these properties that are animatable and in some cases can create really interesting effects because I see that people keep animating the same properties over and over again like transforms, for example, or colors and that’s about it. In every website I see about those kinds of effects, either colors animated or transforms animated, but we can do many more things than just that, and I wanted to show this in my presentation. So it started off as a slide and then I thought, hey, many people could benefit from this, not just the audience of my presentation, so maybe I should make into a separate site and embed it in my slideshow as an iFrame, so that’s what I did.

Louis: Yeah. So as you mentioned, some of the weird ones that you don’t think of animatable, like letter spacing, some of our listeners remember, I don’t know if you would be familiar with this, but on Sesame Street they used to have this bit where there were these two monsters with two parts of a word and they were teaching how to pronounce the word by sliding them together, and when I look at your letter spacing demo that’s exactly what they reminds me of.

Lea: (Laughs)

Louis: But there’s a lot of ones in here that show you how to do things that you don’t see. I like, um, I don’t know if you know them by number because I’ve got them here.

Lea: Oh, no, the number changes.

Louis: Right.

Lea: The number changes every time and a new one is added.

Louis: Right. There’s one where you use text shadows to sort of create a rainbow array of the text sort of scaled out.

Lea: Oh, I remember that.

Louis: Which is really impressive and it sort of breaks what the expectation is, right, when you think of text shadow you think of sort of just a drop shadow on text, but the fact is if you do it without a blur it creates sort of a duplicate of the text and because you can control the color and control its position you can do some really cool things, so absolutely the listeners should check this out. And there’s another one, sort of a box shadow where the box sort of explodes and goes away.

Lea: Yeah.

Louis: Sort of a fadeout effect.

Lea: Yeah, those two ones weren’t created by me, they were user submitted ones which is another thing that maybe you should mention, that this gallery is editable and everybody can fork it on GitHub and add something, adding new animation, and send me a pull request; not all pull requests are accepted, but I think about half of them are. If you click on each animation you can see who created it, the Twitter username of the creator.

Louis: Alright.

Lea: And actually on text shadow you mentioned, and I think there’s another interesting thing about it, that one shadow can be animated to multiple shadows, you wouldn’t normally expect that, you would expect the browser to fail interpolating these two values, but all the browsers I tested do just fine. No, I just wanted to say it’s not very usual that you see browsers exceeding expectations.

Louis: (Laughs) Well, sometimes they exceed expectations in unpredictable ways which I think is the problem we often have.

Lea: Yeah.

Louis: And another one of these tools that you put up recently was a sort of a tool to play with cubic bezier functions which are used to control the easing of these animations, and it’s a pretty straightforward way of just sort of dragging the line around and creating the function because the syntax for that can be scary especially for people who are familiar with CSS but have never worked in Flash, never worked in animation.

Lea: Oh, yeah. That was actually also created for a presentation. When I first gave the CSS Secrets presentation I was just showing how bouncing transitions work by editing the code directly, but I thought this doesn’t exactly show people how cubic bezier works and they will just memorize the numbers which is not good, they should understand what they’re doing. So after a certain point I started including images of how the cubic bezier function works and I was explaining them how it works but by showing them things over the image, but it was a static image and I thought it didn’t exactly show them how the function works. So I wanted to actually show them and actually like drag the handles and everything, and there were some tools already that allowed you to do this thing, but none of them supported cubic bezier values out of range because it’s a fairly new thing for the spec. When the spec was firstly written that wasn’t allowed, the values, all four values, had to be between zero and one, and then Opera I think, yeah, I’m pretty sure it was Opera, they thought why shouldn’t we be able to have y values out of range, I mean of course we can’t extend the transition beyond the time limits imposed, but we can certainly extend the property value below or after the start and end values, so, and that would create quite interesting bouncing effects, so they suggested that to the CSS Working Group and it was accepted and you can find it in the editor’s draft. But at least until a while ago it wasn’t published in working draft yet, so most people authoring tools about cubic bezier were just — I guess they were reading the working draft and they constrained these values to that range, the zero one range. So I wasn’t able to show my audience exactly what I wanted in these tools, so I guess the only reasonable thing to do was to make my own, and that’s how that mini-site was created.

Louis: Right. And this was something so when you’re talking about values out of range the support has since gone into other browsers or is it still sort of in development?

Lea: Oh, totally! Firefox also supports it, I’m not even sure if there’s a version of Firefox that supports transitions and doesn’t support that; IE recently started supporting transitions in IE10, and it supports that of course since they implemented the very latest version of the spec, and the only problem used to be WebKit which didn’t support it, but recently they fixed that in the nightlies and I’m not sure if it propagated with stable release yet, but even if it hasn’t it will very soon, and everyone interested can test it in the nightlies.

Louis: Right.

Lea: The good thing is that usually WebKit users tend to upgrade quickly, so essentially the only problem with WebKit is mobile.

Louis: Yeah, yeah, so Android is always the lagging platform for WebKit which is stuck with a very, very old version.

Lea: Exactly. Although I heard recently they updated it.

Louis: Oh, yeah.

Lea: That’s what I heard. I haven’t tested it myself because I don’t have an Android phone, but that’s what I heard.

Louis: Right. Well, that’s — yeah, and the other issue obviously is that a lot of the older phones don’t get releases from the makers and from the carriers as often as you do with iPhone.

Lea: Yeah.

Louis: Speaking a little bit about browser bugs and browser development, we actually talked on the show a few weeks ago about an article that you wrote for Smashing Magazine, sort of a beginner’s guide to reporting browser bugs.

Lea: Oh, right.

Louis: Yeah, I thought it was a great primer for people, a lot of people are working on these things and especially now that there’s so much let’s say cutting edge CSS being done and a lot of people are playing with this stuff, you run into browser bugs a lot more often than you used to.

Lea: You do.

Louis: Because a lot of this stuff is on the edge.

Lea: I mean even though I’m encouraging developers to report browser bugs in that article, I have to admit that sometimes I discover bugs and I don’t find time to report them always because if I reported every single bug I find it would be a full-time job, seriously, I’m not exaggerating it.

Louis: (Laughs)

Lea: It would be a full-time job because it’s not just one browser it’s Opera, WebKit, Firefox, and I find bugs with them like every day, and if I reported them in the level of detail that I describe in that article it would really take a very long time, but I try to report most of them and even if I don’t have the time to create a proper test case or whatever I say I’m describing in that article, it’s still better to report the bug than leave it for later and end up never reporting it.

Louis: Yeah, absolutely. And obviously the more people who are playing with these cutting edge things, and the more people who are prodding the limits of browser functionality the more likely these bugs are to be discovered, and then it’s just a matter of educating people on what the process is for reporting them.

Lea: Yeah, of course. I think in the past it’s not that we had less browser bugs but the standards weren’t evolving, so we had a specific set of browser bugs that most developers already knew and it was quite hard to discover new ones, but right now we have a huge set of features and the combination between those features generates a very large amount of bugs.

Louis: Yeah, and especially that a lot of this stuff is things that even the browser makers don’t have a lot of experience working with, right, I mean animation is going to be entirely new to everyone who’s implementing it, so there’s a lot of room for error.

Lea: Yeah, especially animations because the spec is a bit unclear, and sometimes implementers have to guess what they should do, and when they have to guess of course one browser guesses one thing and the other browser guesses the other thing, and then we’re stuck wondering what’s a browser bug and what’s actually correct.

Louis: Yeah, absolutely, and I mean even things that aren’t bugs there are varying implementations; I think I’ve been watching this bug report on Firefox about something about the multi-column display, and there’s one of them, I think column span, that it doesn’t implement — that isn’t implemented in Firefox so that it wasn’t.

Lea: Yeah.

Louis: And I’ve just been watching the thread for this thing for nearly a year now and it’s just — it’s always a bit weird to watch people going back and forth, you know, it’s not a bug we just haven’t done it or –

Lea: Yeah, many people haven’t realized that browser vendors use bug trackers not just for bug reporting but also for tracking the progress of implementing new features, especially Firefox does that a lot; Opera does that too but its bug tracker is internal, and WebKit kind of does that but sometimes it gets moved to an internal Apple bug tracker and the public doesn’t get to see it. But, yeah, they have like a bug report for every feature they haven’t implemented, and people keep going in those bug reports and nag them why haven’t you implemented this yet, and I’m guessing this must be really annoying for browser vendors because of course they can’t implement everything at once, it takes time.

Louis: Yeah. I guess it’s just — the good news is it does become a bit more of an open discussion about what the users want to see and what developers want to see, you know, something generates a lot of noise it might get a bit more attention than something where two or three people have asked for it.

Lea: And it’s also what’s easy to implement and what’s hard to implement.

Louis: Yeah. What about IE, you mentioned just about every other browser there; what’s their process for dealing with bug reports and has it improved?

Lea: Oh, it’s horrible.

Louis: (Laughs)

Lea: It’s absolutely horrible. It has improved a lot since the past, at least now they have a public bug tracker, but it’s really the most frustrating experience I’ve ever gone through while reporting a bug; it takes me like half an hour to find how to report the bug every single time, it’s like completely hard to use and also sometimes you get a response that they’re working on the bug which is good but you don’t get any feedback about the process, what’s going on, just that they’re working on it. And also sometimes they might tell you that it’s by design even though it actually violates the spec. For example, Paul Irish reported this bug about IE not supporting the second argument in the get computed style function, and he got the reply that it was by design, and that’s actually a spec violation, how can it be by design; you actually design your browser to violate specifications? It doesn’t make any sense.

Louis: Well, as Web developers I think we’re all used to the world of Internet Explorer not making any sense.

Lea: Yeah, but they’re trying to convince us they’re making progress, they’re trying to convince us that these dark ages are behind us, so how can they say something like that is by design, I don’t get it.

Louis: Yeah, no doubt that they’ve made progress but I guess there’s still a long way to go for Microsoft to convince Web developers that they’re on the right side of this now.

Lea: I guess; it seems like it.

Louis: (Laughs) So just to switch gears a little bit, we were talking a little bit earlier about the talk you gave at a conference which is a talk called CSS3 Secrets, and you sort of mentioned in your answers to previous questions that you have Web pages and demonstrations sort of embedded in your slides.

Lea: Yeah.

Louis: All these slides are available on your website and they’re all built in HTML so that it’s easy to sort of play around and watch the things live, and this is a sort of a mini-framework for slides that you built yourself?

Lea: Yeah, it’s called CSS-S which is an acronym for CSS Based Slideshow System and they can find it on GitHub, it has lots of plugins that are also written for it like to boost CSS regions or code highlighting; in the beginning it used to be very heavily CSS based, hence the name, but right now many things that were CSS based under the first version are now done with JavaScript because CSS is a bit restrictive sometimes, for example, the number of each slide that was displayed used to be done with CSS counters, but the latest versions it’s done with JavaScript because CSS counters don’t increment when you hide something with display: none, and in the latest versions I hide all the slides except the current, previous and next one with display: none so they don’t — for performance reasons so that the browser doesn’t have to render everything at the same time, and CSS counters broke when I did that so I had to implement them with JavaScript.

Louis: Right. So the presentation itself is really cool. So it includes a couple of the things we’ve mentioned, sort of a description of how cubic beziers work and some demos to do with that, but it’s really just a kind of a list of little sort of tips and tricks in CSS3 for even properties that people might know about but little sort of hacks that people might not have played with to do with properties that they might use. So what are a few of your favorites from this presentation?

Lea: It’s a bit hard to tell, most people like the section about gradients, even though I’ve given many talks about gradients on their own like I used to give a talk about CSS gradients and the whole talk was bout CSS gradients and it was published, and I’ve written a lot about CSS gradients on the Web, still people get impressed that you can make patterns with CSS gradients, even the last time I gave that talk people came to me and they were like, “I can’t believe you can do these things with CSS gradients,” and every time people mention that. But I guess my favorite is the background origin trick that you can use to position a background image and have it follow the padding if you give the value content box to the background origin property. Also I like bouncing transitions a lot.

Louis: So maybe just explain a bit what you mean by the background origin, I maybe didn’t quite exactly follow there, and I’m looking at the slide and it’s not entirely clear to me.

Lea: Oh, yeah, that’s the problem with editable HTML slides that when you put them online people can’t really understand what you’re talking about unless they see the video because every slide is like a starting point that I added on stage to show them what I want, so when I put the slide online people just see the starting point and they don’t get what I’m going to show in that slide. So, to explain it further, CSS3 expands the definition of the background position property, so if you want to position something from, for example, 10 pixels from the right and 20 pixels from the bottom, in CSS2 you couldn’t really do that, you had to approximate it with percentages or do something like that, and the only way you had to position something on the bottom right corner was to position it exactly at the bottom right corner with zero offsets; if you did background position bottom right, right?

Louis: Yeah.

Lea: So, in CSS3 you could just write background-position: bottom 10 px, right 20 px, for example, and you could have these offsets from the bottom right corner even though in CSS2 you could only have offsets from the top left corner, is that understandable?

Louis: Oh, right, yeah, so you can — it’s a little bit better control.

Lea: Yeah.

Louis: And that’s currently supported in a few browsers but not all of them.

Lea: Exactly, that’s only supported by Opera and IE 9. So the thing is we have a better way to do that because even if it was supported by every browser, in the most common use case that we want to do that is to have the background image follow the padding, so we have like 40 pixels padding and we want the background image to be on the bottom right corner and have an offset of 40 pixels from there because our padding is 40 pixels; almost every time I’ve needed to use something like that it was to follow the padding. So even if the extended definition was supported by every browser it’s still not ideal because you would have to duplicate the value of the padding three times, one time for the padding and two times in the background position definition. But, there’s an even better way to do that if you use background origin. Background origin is a new CSS3 property that controls where the background starts from, I mean in the CSS box model there are three boxes, the border box, the padding box and the content box. The border box is if you have a border it’s the box that starts from the outer edge of the border, the padding box starts from the outer edge of the padding, and the content box is where your content is and it starts from the inner edge of the padding. So essentially what you want to do in our use case is position the background image according — where the inner edge of the padding is, right?

Louis: Right.

Lea: So, if you give background origin the value content box and the background position of bottom right, it is placed on the bottom right but which box is bottom right? The border box is bottom right, no, the padding box is bottom right, no, that’s the default but since we specified content box it’s the content box is bottom right, so that’s where it starts from and it follows the padding because it’s placed to the bottom right of the inner padding edge.

Louis: Right.

Lea: Does it make sense?

Louis: Yeah, absolutely. So if the listeners have been hearing tapping as you’ve been explaining this it’s because I’ve been playing around with the slide and entering these values in as you were describing them to see how it works. And these properties, however, are supported pretty much across modern browsers.

Lea: Yeah. Essentially the only problem right now is IE8, every other browser currently in use supports them, I mean really old versions of Opera or Firefox or WebKit don’t support it, but these really old versions aren’t in use anymore.

Louis: Right, whereas IE8 would still be in use because it’s the highest version available on Windows XP which is still very widely in use.

Lea: Yeah. And essentially in almost every CSS3 feature that’s popular today in most of them it’s only IE8 and below that’s actually a problem because users of other browsers upgrade fast and users of IE don’t, and it’s not just Windows XP, I’ve met many people that are on Windows Vista or I think maybe on Windows 7 that were still in IE8, and one of them told me ‘I didn’t really see a reason to update, why should I update?’ They don’t understand that there are differences.

Louis: Hmm.

Lea: The only differences they notice are the UI, that’s what they know, they don’t understand that the rendering engine changes, and they don’t understand how that would make their browsing experience better.

Louis: Yeah, it’s interesting to see, maybe it’s a failing of marketing on Microsoft’s behalf, but it might be in their interest to start pushing updates like what Firefox and Chrome are doing.

Lea: I think that would be amazing.

Louis: (Laughs) You don’t think it’s terribly likely?

Lea: Yeah, because a big portion of Microsoft’s clients are enterprises, and for some reason, well, not for some reason, it’s obvious which reason, these enterprises don’t want to upgrade because they have applications that only work in this version of IE, and they don’t know if it will work in a higher version, and it will cost a lot of money to upgrade these applications and have the developers work on them to make them compatible with later versions of IE, and that’s why we’ve been stuck with IE6 for so many years too.

Louis: Hmm.

Lea: Because many companies had intranet applications that only work there. I really don’t get why they can’t have automatic updates and a setting to turn them off, and these enterprises could just turn them off.

Louis: Yeah, that obviously makes perfect sense but as we’ve mentioned before, making perfect sense does not necessarily jive with Microsoft’s behavior.

Lea: (Laughs) Yeah.

Louis: So this kind of leads into something else I just wanted to touch on briefly because it’s the other thing that your name has come up on the show was a sort of a little bit of I don’t want to say an argument, but it was a discussion on Twitter a few weeks ago that you may remember, it was I think Aral Balkan started it with a Tweet, let me find it so that I can get the text. Do you remember what I’m talking about?

Lea: You’re talking about the one version discussion.

Louis: Yeah, here we are, there we go I’ve got it. So, Aral Balkan Tweeted with hashtag one version, hashtag manifesto, “my websites will only support the latest versions of browsers, it’s the browser makers duty to get users to upgrade.” So this kind of ties in to what we were just talking about in that we’d all be much happier if Microsoft could encourage its users more aggressively to update their browsers, and this was pretty widely re-Tweeted, including by you, and it drew a little bit of disagreement from other quarters of the Web. So I think I remember seeing John Allsopp disagreeing with it, which is totally out of character for him because he’s usually such a non-controversial person, and also Remy Sharpe I think had words to say about it.

Lea: I think most disagreements are rooted that people don’t understand each other’s opinions very well, and this is a perfect example of that. Support is not black and white, it’s not even black, white and gray, support is many, many different levels. There is this one edge that’s like I use IE8 to enter this site and it’s completely broken and I can’t even read the content, and there’s the other edge of the spectrum that’s I enter this site with IE8 and it’s pixel-perfect, it’s exactly the same as it is with the newest Chrome, and I think both edges are wrong and that’s why I re-Tweeted that; I think people spend way more time than they should trying to make things — even though they have understood that they don’t need to be exactly pixel-perfect in older versions of IE, I still think they spend way more time than needed in these versions. I think what’s necessary for these versions is that you get the content and it doesn’t look like crap, and I think that’s sufficient for like IE6 or IE7 or even IE8 in some cases.

Louis: Yeah, absolutely. I mean Andy Clark had an idea a few years ago about a sort of generic IE style sheet that would just be basic typography with no layout.

Lea: Exactly. I think most people just disagree because they have different ideas of what that level should be for its old browser. Some people think that in IE8, for example, it should be pixel-perfect, and they think that graceful degradation is fine for IE7 and IE6, but in IE8 it should look pixel-perfect. Some other people think that even in IE8 it’s enough if it just looks decent and you can get to the content, and some other people have the same opinion about even IE9, they think if it doesn’t support something it’s fine and you just need to get the content, and that’s essentially what people disagree on. And John Allsopp, for example, in this debate he wrote his blog post about universality and how this manifesto is against universality because I think that’s the idea he got, that’s the idea many people got from this discussion that we don’t support older browsers at all, the content is inaccessible, which is not the case; it’s not really hard to make the content barely accessible, it doesn’t take much time. What takes much time is struggling over and trying to find the polyfill that does CSS animations in IE6, for example, and why doesn’t this polyfill work, why is it broken, this should be perfect; and people spend too much time on that. When color TV’s came out, people with black and white TV’s didn’t start shouting that we expect to see color TV shows in our black and white TV’s, they just accepted that they had an old TV and that’s — it’s the same case with browsers.

Louis: (Laughs) That’s a great analogy, I like that, I’m definitely going to use that the next time somebody asks me that.

Lea: It’s not my analogy, it’s Paul Irish’s I think.

Louis: Alright, credit where credit is due. So, again, as with just about every argument on Twitter, everyone agrees, they just can’t explain why they agree in 140 characters so they fight about it.

Lea: Yeah.

Louis: I gotta say I love Twitter for that.

Lea: Ah, sometimes I love it and sometimes I hate it; sometimes you just need more than 140 characters. That’s why I made this little application called TweetPlus, it was my entry to the 10K contest, and it allows you to post a longer Tweet, it’s like services like TwitLonger, for example, or similar services, but the new thing about it is that it’s completely client side except downloading the application, of course, everything is done with JavaScript, there’s absolutely no server side component, there’s no database storing the longer tweets, and everything is done through the URL, tweet is encoded in the URL, and when you post it on Twitter the URL is shortened by Twitters short URL service. So essentially you have a short URL pointing to the huge URL that contains everything.

Louis: Oh, so you’re just kind of exploiting Twitter’s URL shortner to contain the extra data; that’s a very clever hack.

Lea: Well, thanks, I’m not sure if it’s –

Louis: When you don’t have a database, use someone else’s database.

Lea: (Laughs) Well, I think the good thing about that is that when you services like TwitLonger, for example, you depend on TwitLonger being around for your tweets to be readable; if TwitLonger decides that their business model is failing, for example, and shuts down like many services do, then you lose your long tweets and you won’t be able to do anything about them. With TwitPlus everything is in the URL, they will always be there, and even if TwitPlus goes down at some point, which I don’t see any reason why it should, but even if it happens it’s pretty trivial to recover the tweets since you have the URL, and it would even work locally, if you take the hash and you put it on the URL of your local TwitPlus installation it will still work fine, you’ll be able to read the tweet.

Louis: It kind of reminds me a little bit of Tantek Celik’s idea about a URL shortner where you could sort of algorithmically reverse it and come up with the original URL without depending on a database to do the mapping.

Lea: Yeah, it’s called — it’s part of the own your data movement and I’m pretty much a fan of it; I don’t like my data to depend on whether multiple companies business model is going to be successful or not. Of course in some cases you just can’t do otherwise, like, for example, I do use Twitter to post my tweets, but I think tweets are temporary anyway for the most part, and I use Disqus for my blog’s comments, but in general I try to avoid depending too much on third party services for my data.

Louis: Yeah, that’s something that’s come up on the show before, and I make that argument and then people call me paranoid. But, yeah, absolutely, and with respect to things even like Twitter I’ve often considered just coming up with a way of posting them through my blog and then having them syndicated out to Twitter, it’s just always been on the bottom of the to-do list.

Lea: Yeah, well, doing something like Tantek it’s admirable what he did, but for me it would be a bit too far.

Louis: Yeah.

Lea: I kind of trust Twitter, it’s too big to easily go away.

Louis: Yep, too big to fail.

Lea: Yeah, I guess.

Louis: We’ve already mentioned your website which is at lea.verou.me, you’ve also developed this little JavaScript library called Prefix Free, do you want to talk a little bit about that?

Lea: I really like this script and it allows you to write CSS without any vendor prefixes, completely valid CSS3, and the vendor prefixes are added on runtime and they’re not predefined lists about which feature needs which prefix, everything is done through feature detection so it’s very future proof.

Louis: Alright, so it’ll actually — it’ll try a vendor prefix and see if that exists and then if it does it’ll add it.

Lea: It does many feature detection tests when it starts, and then it keeps in the results in some arrays and it processes every CSS code on the page and it adds the prefixes only when they’re needed, only when prefix-free version is not supported and the feature is only supported with a prefix. So, for example, you want to do animations you write a keyframes rule without any prefix, and when Opera starts supporting CSS animations they will start working without you needing to do anything, not even upgrade, not even using a newer version of Prefix Free, just leave it there and it will work.

Louis: Yeah, that’s fantastic, and it’s a fairly small library, I’m seeing it’s about 2 kilobytes of JavaScript, so not a big hit, and it’ll probably save you 2 kilobytes worth of vendor prefixes.

Lea: Oh, yeah, totally. And the style sheets are so much easier to read and it saves you so much time. I didn’t want to use CSS pre-processors, but I didn’t want to depend on such proprietary syntax that CSS pre-processors require because each one of them has their own syntax, and you kind of become dependent on them. So, I always added my prefixes by hand and I had — every time I wanted to change something I had to change it like five times and I just got too sick of it. I had developed this script for my presentations because if you noticed on stage I always write prefix-less code. I had this script behind the scenes adding the necessary prefix, and then I thought why not use the same script on Web pages, so I adopted this to be used on Web pages, I actually did that during a conference in the airport in October (laughter), and actually I’m thinking of separating this into two components, if you actually see the code it’s already separated but they’re on the same file; one component is serving as a framework for many kinds of CSS polyfills, and the other part is Prefix Free, you know the part doing the detection and adding the prefixes and everything, because I think the base will be useful for many different kinds of polyfills, for example, I wanted to write a polyfill for the vm, vh and vw units, there’s these new CSS3 units that are only supported by IE and they’re about the viewport size, and at some point I needed to use them. So I wanted to write a polyfill for them, and I used the same base from the Prefix Free code, and it was just a few lines of code to add them, and if I didn’t use that it would be much, much bigger, and most CSS polyfills of this kind are just — just repeat the same things; they need to XHR the style sheet because there’s no way to access the link style sheet and get the unsupported features; if you access it through the CSS object model unsupported features are dropped, so every CSS polyfill needs to send XML http request so you get the style sheet and then do some kind of processing and convert it to a style element, and then you need to convert the URLs because they’re relative to a new root, right now they’re relative to the document and in the CSS file they’re relative to the CSS file, and stuff like that which is about the same in every CSS polyfill, and why write these things over and over again. It would be good if we had a framework for that.

Louis: Yeah, that’s a great idea; I look forward to seeing what comes out of that. I guess one of the issues you’d have run into with something like this is dealing with cases where the syntax in one prefix version is different from the syntax in other prefix versions, so, for example, the older WebKit gradient syntax.

Lea: The older WebKit gradient syntax is not a problem because you can just use the WebKit gradient syntax along with an un-prefixed linear gradient decoration because it’s not the same thing. But you actually made a very good point, what happens when the same feature works differently across different prefixes? You can work around this but by using a prefix version as well as the un-prefixed version, for example, you want to specify a different value for WebKit box shadow and a different value for box shadow, you can use the two values together, the only caveat to that is that you have to include the prefixed version after the un-prefixed version because the un-prefixed version might get a prefix on runtime if it’s only supported with a prefix, if it’s like — if we’re on an older version of WebKit. But another way to get around this is that Prefix Free also adds a class to the root element with the current prefix, so you can actually write different rules if that’s convenient in some cases. I’m hoping that won’t be abused for doing separate things for separate browsers, but it’s there just in case somebody needs something like that.

Louis: Right. Well, I mean it’s always useful to be able to know the context you’re in, and taking a cue from Modernizr for that kind of thing.

Lea: Yeah, exactly.

Louis: Most of the time it’s fine to degrade and not worry too much about making things work exactly pixel-perfect, but sometimes you do run into an issue and it’s good to be able to have that finer control.

Lea: Yeah. I just hope they exercise restraint with it.

Louis: (Laughs) Well, you can always hope but, uh, I guess when you put a tool out there you can never really know what’s going to be done with it and we’ll just wait and see. So I’ll look forward to seeing people play around with this and what can be done.

Lea: Yeah, well, people are already using it and so far the feedback is quite positive. There are some people that have a few arguments against it; I mentioned the one that I think holds more truth, the one about different implementations. The other ones can be answered quite easily and I’m already — I’m answering them in the project’s page, like, for example, you’re depending on JavaScript; no, you’re not depending on JavaScript, you’re only depending on JavaScript for a few CSS3 extensions, and if you design your page with progressive enhancement then it should be fine without JavaScript, people who disable JavaScript are not expecting a perfect experience anyway, and if you’re not designing it with progressive enhancement in mind you have much more serious problems like IE8, for example.

Louis: Right, exactly. Thanks so much for taking the time to come on the show, and I’m glad we managed to work around all the scheduling issues and finally get it done, and the cool thing is a number of things I hadn’t seen your presentation when I initially contacted you about doing the interview and this animatable tool wasn’t out either, so just by virtue of delaying the interview we’ve had a lot more stuff to talk about.

Lea: Yeah, that’s true.

Louis: I’ll ask you the same question I asked Chris Coyier which is where does the time come from because when I see people like you and like Chris who come up with all of this work pretty much on a weekly basis I’m always is there some kind of secret day of the week that the rest of us don’t know about?

Lea: Uh, is that off-the-record (laughter)?

Louis: Alright, we’ll keep it a secret.

Lea: Yeah, I guess those are results of me procrastinating a lot, and also my daily job is about a company I co-founded, and it’s around a Greek website that’s kind of popular in Greece and the revenue comes from advertising, so even if I don’t do anything for a while we still have revenue so I can devote some time on these experiments.

Louis: Well, I think we all, the Web at large and developers out there, win as a result of this because we get the chance to use all these cool tools in our work and see all these fun experiments.

Lea: I hope so.

Louis: (Laughs) If your procrastination helps the rest of us then everybody wins.

Lea: Except me (laughter).

Louis: Alright, well, Lea thanks again so much for taking the time to come on the show, it’s been a pleasure. We got delayed a little bit by a washing machine (laughter) but, uh –

Lea: I guess that must have been the most weird delay you ever had for this podcast.

Louis: It’s pretty good, yeah, usually it’s just time zone issues, but, so a backstory for the listeners, we were supposed to record this an hour ago but you’re in a hotel room and the cleaner turned on the washing machine and it’s really loud apparently so we had to wait to record until the cycle was done.

Lea: Yeah.

Louis: Thanks for sticking around despite the delay.

Lea: Thank you for waiting.

Louis: And for taking the time to talk with me. No, it was good, I took the time to deploy a bug into production and then you came back on just before I could investigate or fix it, so perfect timing.

Lea: Cool, I’m glad you weren’t just waiting for the dishwasher to finish.

Louis: No, I had plenty of work to do. So if the listeners want to find you we’ve already mentioned your website which is at lea.verou.me, but on Twitter what else should people look you up on?

Lea: I’m @LeaVerou on Twitter and essentially I’m LeaVerou almost anywhere, you can find me on LinkedIn, on Facebook, on Zerb.ly, on Last.fm and most social networks, and I always use the same username. And actually on my blog there’s a list of some of the social networks I take part in on the sidebar, so they can find my work there, but I post almost everything on my blog, and for somebody interested in my work I guess the most relevant ones are Dribble and GitHub.

Louis: Yeah, absolutely. Again, there’s tons of fantastic stuff up there, just a great sort of playground, for CSS3 goodies that are fun to just mess around with on the browser and see how well your browser supports it and see some of the more interesting things that can be done with background or patterns, with animations, and maybe give you some ideas and inspiration for the next website, so definitely recommend it.

Lea: Thank you for listening to me babbling for an hour.

Louis: (Laughs) It’s always great to hear what people who are out there doing kind of fun work have to say, yeah, like I said, it was my pleasure. So best of luck in all your travels, do you have a bit of time off from conferences coming up?

Lea: Oh, yeah, my next talk is going to be in February, and I don’t have anything scheduled until then so I’m resting a bit.

Louis: That’s fantastic.

Lea: Taking some time off the conference frenzy.

Louis: Alright. If any of our listeners happen to be available for the conference you’re speaking at in February, where is it and what is it?

Lea: It’s a conference in Finland, it’s called D-Day, it’s the first time they’re doing it but it sounds quite interesting, it has some good speakers, and I’m not talking about myself, I’m talking about like Vitaly Freidman from Smashing Magazine, and the website is dday.fi, and I’m kind of looking forward to it, the only thing I’m not looking forward to is the cold; even if you go to the website you’ll see people sitting in snow and even snow falling on their heads, it kind of scares me.

Louis: (Laughs) Yeah, February in Finland is probably going to be a little colder than you’re used to in Greece and California.

Lea: Yeah.

Louis: Alright, well, if anyone happens to be in Finland, we don’t have a lot of listeners in Finland, but if you’re one of our Finnish listeners and you happen to be around for this conference, check it out because you’ll be able to see Lea give a talk there.

Lea: Yeah, I’ll be glad to see them there.

Louis: Absolutely. Alright, well, thanks again, and as I said before enjoy your time off and look forward to seeing what other new things come out of your brain in your procrastination time.

Lea: Thank you so much.

Louis: Alright, thanks very much, Lea.

Lea: Have a good day.

Louis: You too.

And thanks for listening to this week’s episode of the SitePoint Podcast. I’d love to hear what you thought about today’s show, so if you have any thoughts or suggestions just go to Sitepoint.com/podcast and you can leave a comment on today’s episode, you can also get any of our previous episodes to download or subscribe to get the show automatically. You can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. The show this week was produced by Karn Broad and I’m Louis Simoneau, thanks for listening and bye for now.

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.

Episode 138 of The SitePoint Podcast is now available! This week the panel is made up of Louis Simoneau (@rssaddict), Brad Williams (@williamsba), Stephan Segraves (@ssegraves and Patrick O’Keefe (@ifroggy).

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #138: What’s The Alternative To Google? (MP3, 50:14, 48.2MB)

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 main topics covered in this episode:

• HTML5 date Time element scrapped.
• HTML5 date Time element Rienstated.
• Dodgy Coder: StackOverflow’s Programming Language Bias
• Official Google Blog: Google+ Pages: connect with all the things you care about
• Google warns that rate limits, overage fees are coming to Maps API
• Google Maps in WebGL

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/138.

Host Spotlights

• Brad: Google Gravity
• Patrick: SitePoint Podcast #1: The Economy
• Louis: A Brief Rant on the Future of Interaction Design
• Stephan: Made by Hand

Interview Transcript

Louis: Hello and welcome to yet another episode of the SitePoint Podcast. We’re here this week with a full panel to discuss the past few weeks’ events in the world of the Web, so hi guys.

Stephan: Howdy, howdy.

Patrick: Hello.

Brad: Hey-oh!

Louis: So this time is a bit special for a couple reasons, but first up, Brad and Patrick happen to be in the same room as we’re recording this.

Patrick: That’s right.

Brad: Sadly.

Louis: (Laughs)

Patrick: Brad is kind enough to have me as a guest in his home.

Louis: That’s terrifying (laughter).

Patrick: Yes.

Brad: Just a bit.

Louis: So there’s another reason why today’s show is a bit special, and I guess Brad can fill us in on why that is.

Brad: Yeah, so sadly this will actually be my last SitePoint Podcast that I’ll be doing, so I’ll be stepping away from the show.

Louis: Noooooooo!

Brad: I know.

Louis: I was just trying to add some drama, obviously we were aware before the show, but I want to — you know.

Stephan: I had no idea; what are you guys talking about? (Laughter)

Brad: Surprise! Yes, it’s true. Actually the day after, I’m sorry, the day the show is released will be three years and one day since our first episode, so if you can believe it or not we’ve been doing this for over three years, and I think the time’s come for me to kind of move on and try some different things, and I’ve certainly had a great time and I definitely hope you guys will have me back on, on occasion, if you need to someone to fill a seat or just want to hear my sexy voice I’ll be more than happy to come back on the show.

Patrick: Yeah, well, Kevin said the same thing and you see how many times we’ve had him back on (laughter). You know I told Brad he’s going to need to get the tissue box for me here in case I get a little emotional, but –

Brad: We can hug it out.

Patrick: Yeah, I mean I always want to give a little history lesson for people like Brad was really the person who took the initiative to start the SitePoint Podcast, we have a forum post up in front of us here in the SitePoint Forums in the staff section from June 27, 2007 Brad just basically pushed the idea out there, he says, “I just wanted to get everyone’s thoughts on a SitePoint Podcast. It would take quite a bit of work to get it rolling, but with the knowledge just of the forums staff I’m sure we could make a very interesting show.” And so from that thread spawned months of discussions, and eventually Stephan and myself saying, hey, we’ll speak on this, we’ll participate, we won’t maybe do much more than that, but we’ll be glad to show up and speak and participate. And, yeah, we did a pilot together, us three, thereafter I believe, and then Kevin jumped on board, I don’t know, maybe the office needed some oversight or something, the SitePoint office, so Kevin was like yeah, okay, you guys finally got it to the finish line so let’s get it started and I’ll be a part of it, and you know we’ve won the .net Magazine Award, Podcast of the Year, like a year and a half ago, and, yeah, it’s been three years, 100-and however many episodes it’s been, and it’s been a great run and I’m going to miss having Brad’s perspective on the show and thankful for the opportunity to have got to know him better through the show.

Brad: Yeah, it’s funny because a lot of people when I explain how the show started and most people don’t realize that it was over a year from the time of when we initially talked about it, and literally a year of forum threads back and forth just playing the show, and we did some test runs and we did some pilots and all that, so a year leading up just to that first episode, so there was a lot of work behind it. And it wasn’t just us, there was a lot of other people on the SitePoint Forums’ staff and the editors and getting people to help with articles, so there was a lot of people involved to make this show a reality, so it was extremely exciting to get that first episode out and just to look back and know that we’ve had three years of just a really successful show is something that I know we’re all very proud of. So I’ll certainly miss it and I’ll miss hanging out with you guys all the time, but like you said, we’ve all become pretty good friends from the show, even moreso than we were, so I know I’ll certainly see you guys around.

Louis: Yeah, absolutely. I mean obviously from my perspective I’ve only been doing the show with you for a short while, but it’s been fantastic and it’s sad to see you go, but hopefully good things in the future for you, so, you know, all the best.

Stephan: We’ll miss you, Brad.

Patrick: I was gonna say, Stephan, speak up, say something (laughter).

Stephan: But we’ll really miss your Google Chrome comments, so, you know, I’m going to have to listen to Patrick tell me how great IE 8 is for the next however long (laughter).

Patrick: Yay!

Brad: I’m going to wait until he’s asleep tonight and install Chrome on his computer (laughter).

Stephan: But it’s been fun, it’s been a good three years.

Patrick: Yeah, and on that note we were just at WordCamp Philly, that’s what brought me to Philadelphia, Brad is one of the co-organizers of WordCamp Philly; WordCamps are conferences focused on WordPress if you’re not familiar, and we met two, not just one but two SitePoint Podcast listeners at the event which is a good size event but it’s not thousands of people, it’s a few hundred, a very large WordCamp, and we had not just one but two listeners and that was pretty cool as well. And I think with that we can get right into the, uh, with the stories.

Brad: Let’s do it.

Louis: Right. So I’ll kick it off this week, my first story it’s a Google related story which seems to happen a lot, and I know we’ll probably have some more Google stories on the show today. This was an announcement by Google about two weeks ago now, but it was definitely after we did the last panel show, Google will be introducing rate limits and overage fees to the Google Maps API which is something I know a lot of web developers and designers use in their sites and in client sites, so that could definitely have an impact. So what they said is that, bum, bum, bum, as of the new year I think, so in January 2012, there will be a limit placed on the use of the maps API to 25,000 map loads per day, and with a fee of $4.00 per thousand loads in excess of that limit.

Brad: Yeah, my initial reaction is this is going to make Google quite a bit of money because I know a lot of sites that use Google maps that I’m sure blow away that limit, 25,000 is not that many map loads per day.

Louis: Yeah, it’s pretty significant. I mean so there’s been obviously a pretty vocal reaction in blogs and on Twitter to this announcement, but at the same time to me at least it doesn’t seem totally unreasonable, we’re talking about a couple of dollars a day maybe if you’re exceeding that limit, and a lot of small, you know, the smaller sites that are sort of like if you’re a site for a restaurant or for a local business and you just have a map in your page to point people to your location that’s not going to affect you. So, I don’t know, it doesn’t seem like that huge a deal to me at least, and it certainly seems fair if they’ve got a service that’s good enough that everyone will keep using it even though it’s paid, and I think that will be the case; it doesn’t strike me as unreasonable for them to try and recoup some money on it.

Brad: It’s funny because with Google Maps the API version 3 they actually removed the API key requirement which seems odd now that they’re looking to go back and charge where they probably will need some type of API key to validate that the person has an actual account and is in good standing with their bill.

Louis: Yeah, that’s interesting actually; I hadn’t looked at the version 3 of the API so I wasn’t aware that they’d removed the API key.

Brad: Yeah, yeah, so I don’t know if they’re bringing that back or if they have some other method of paying it, but you’re right, I mean with the smaller sites, the local mom and pops sites finding their store or even smaller retail stores, even if they’re a small chain they have find the local or the closest dealer near you, or whatever it may be; they probably won’t hit the limit but, again, 25,000 that’s not that many views if it’s a significant feature on your site, so it’s definitely something people are going to have to be aware of. I mean how long have maps been around, for a long time now, so I’m sure a lot of people are going to get struck that don’t realize this is coming and all of a sudden their map stops working halfway through the day and they don’t know why, and then they’re going to find out and be very shocked that to keep their maps running on a daily basis that might cost them a few hundred dollars.

Stephan: And I’m wondering, too, like when you look at this, when you look at Google Maps, they have the ads on maps.google.com, they have the ads, the feature places, or whatever they call it, so was that not enough you think then to subsidize this or do they just see this as another revenue stream like on top of that? I wonder what the thinking was because, like you said, it’s going to be kind of a shock for people who maybe don’t follow all the Google news, it’s going to be one day their maps aren’t going to work and be like “What the heck is going on?!”

Louis: Yeah, it is interesting, because as you say there is already sort of a revenue stream involved in Google Maps, and you’d think that getting maps out in front of the most people possible is only going to increase that ad revenue regardless of any other money they could make on it, but maybe somebody sat back, looked at the numbers and said you know, look, this is costing us more than it’s bringing in because a lot of people are using it for other purposes that don’t really tie into advertising, that aren’t based on search, that are really just, you know, I can’t even come up with any examples, but, you know, tying into different applications that you really can’t monetize, and maybe said, look, if we lose a couple users it won’t be a big deal because we would make a little bit of extra money to cover costs and be able to keep growing the capacity. Speaking of which, though, what are the alternatives if someone was using Google Maps and putting through, you know, let’s say tens of thousands of requests a day and doesn’t want to spend this extra? So we’re talking let’s say you go over the cap by let’s say you do 30,000 a day, that’s an extra 5,000, so that’s $20.00 a day so that’s not insignificant, that’s $600.00 a month.

Brad: I don’t know of any other map platform that’s even close to same level, obviously there are sites like MapQuest which at one point was the standard, and Google Maps pretty much flew by them and I think now they’re playing catch up. They do have an API but, again, I don’t think it’s been seen as a real alternative, however, like you said now with the charging that certainly could be. Going back to what you said about utilizing Google Maps where you’re not getting those ads and things, you know we’ve set up a lot of sites where we use reverse geolocation to get longitude and latitude for addresses, and you can actually do that through the API where you simply send Google Maps an address and it will send back a longitude and latitude coordinates; prior to that I didn’t know of any free service that did that, everything we could find was a paid service and Google was the first one that I knew of that did it for free which was great for us, but I expected at some point they were probably going to start charging for stuff like that because it’s a pretty valuable tool to have.

Louis: Yeah. I’m having a look at the Bing maps at the moment, I’m just sort of scrolling around a map of Melbourne on Bing, and, ah (laughs), let’s just say it’s okay, it’s not great, I’m not seeing some of the stuff I’d like to see, it feels a little sluggish, can’t click on a train station and get the train times which you can in Google Maps. I’m not seeing traffic information available, it seems a bit limited, so yeah, maybe there’s an opportunity for some other player in the market to step up and try and wrest a bit of control away from Google.

Stephan: Which I guess kind of we can tie in to what I’m going to talk about. Did anyone else notice that they changed Google Maps as well? Now you have the option to do the new vector stuff if you’re in Chrome, and I’ve noticed it to be nothing but a problem lately, it is really, really slow, and in their press release they said oh this is going to make it so much faster, maps are gonna load, and yeah it looks like it loads faster because the tiles don’t all have to load, but you still got to wait until all the vector stuff to fill your browser, it just drags and drags and drags.

Louis: So I noticed this a while back because they rolled out the vector version of Google Maps to Android probably almost a year ago at this point, and I remember on Android working on a 3G connection it was a massive improvement over the tiles because if you were in a sort of spotty reception zone on 3G trying to get these tiles to load it was horrendous, but getting the vector maps was great. I don’t think I actually — oh, wait, does it want to try something new, is that what this button is?

Stephan: Yeah, yeah.

Louis: Alright, I bet that’s what it is (laughs), I hadn’t even noticed that.

Stephan: That’s the one (laughs).

Louis: Let’s click on this and see what happens. Alright, it looks superficially the same and if I do a bit of zooming –

Patrick: Is this only in Chrome?

Stephan: I believe so, yeah. Actually I think it’s any browser that can support the vector images.

Louis: So is this all done in WebGL or something like that?

Stephan: Yeah. Let me see if I can find the press release real quick.

Louis: It does seem — like I was just playing around with the tiled version a bit before, I think zooming in and out seems like it’s a little maybe slower, but when you scroll onto a new region of the map, like if you just pan the map –

Stephan: Oh, yeah, that part’s great.

Louis: And then everything is there, it just sort of gradually fills out the smaller side streets and adds the names gradually, so panning is a little bit better. Yeah, I think — I don’t think it’s necessarily better if you’re on broadband, I don’t think that would be the goal for them is to make it better for broadband users, I think it’s mostly going to save them bandwidth.

Stephan: Because they can preload the vector stuff.

Louis: Well, I just think it’s a lot less data, I think sending vector information about how to draw the streets and what they’re called is a much smaller package than sending a bitmap of all these different resolutions of the map, right.

Stephan: Yeah.

Louis: So it probably saved some bandwidth and it’s also, you know, from experience I can say I had a better experience with it on a mobile broadband connection, but for a real — sorry, not a real (laughs) — for a ‘real’ Internet connection, no, but I mean if you’re plugged in in your house on a fast connection it probably won’t make a huge difference, and as you said it might be a little bit buggy still; they have the advantage in Android of being able to code it natively in the app whereas here they have to work within the browser so it might be a little trickier to work with.

Stephan: That explains it. Yeah, we can talk about the changes and get it out of the way, I mean if that’s cool with y’all. I mean so much for the rant, I was just gonna — (laughter). No, so we talked about the maps a little bit but there are some other big changes that have taken place over the last week, week and a half. The first is they’ve now introduced the new Google Mail interface, and they’ve also introduced the new Google Reader interface and its integration into Google+ which we can touch on more later I’m guessing, Patrick, because I think you have a story about that.

Patrick: Yes, sir.

Stephan: I think from what I’ve — because I’ve played with it a lot, I’m usually in Gmail almost all day because it’s the way I keep in touch with some people around the world, and I usually don’t check my email on it and I’m usually just using it for the chat, but I’ve been using it the last week, the full week, and it’s been terribly slow, and I’m using Chrome, but it is astoundingly more responsive in Chrome than it is in Firefox, so in Firefox it’s almost unusable. So I was just wondering if you guys had the same experience if you’ve gotten the new look, because it’s optional, and what you think of it if you have, and then we’ll talk about Google Reader a little bit because it’s changed as well.

Brad: You know what’s weird is I have multiple Gmail accounts, one for work, one for personal, one for other things, and I have it on one of them but not the other ones which I thought was strange. You’d almost think if they know you have shared accounts or multiple accounts that you log into you’d think once they opened it up they would just kind of open it up to all of your accounts.

Stephan: Your accounts are linked, right?

Brad: No, they’re not linked, they’re individual accounts, but I’m basically on a daily basis flipping back and forth between the new and old design which makes it almost even more confusing because I’m almost rather be stuck on the new one or go back to the old one. Like you said, I guess I could turn it off but I did want to play with it. It’s like anything else, when a new design comes out I’m always usually very critical at first, and I’ve been trying to get better at that over the years to where I give it a couple weeks, you know, give it two to four weeks before I start complaining about it just because I’ve noticed that it generally grows on me, so I’ve learned like just to kind of keep my mouth shut, use it for a while, and then if two to four weeks go by and I still don’t like it and there’s still some big problems with it then I’ll start getting kind of vocal, but it is definitely different and it’s certainly when you first see it, it blows you back a little bit. It’s clean; I don’t know if I noticed it being any slower for me necessarily.

Stephan: And don’t get me wrong, it looks good, like it’s a nice looking design, but the biggest problem I’m having is with the chat window, the JavaScript effects that they’re using and stuff, it seems like they’re just — you go over to the left-hand side and an example is you have your different flags, you know, whatever they call them, tags for your email, and underneath it you have your chat window. Well, whenever you scroll over your tags it expands it, so if you have more than say 10 it shows you all of them, and if you do that enough it just seems like it just drags down the browser, like they have a real issue with something in there. And so I’ve — I don’t know, I mean it looks good but little things like this really they nag me because it’s stuff that should’ve been caught in my opinion.

Louis: Yeah, there’s definitely — I have actually run into some actual bugs in the implementation. I was trying to do something yesterday and I’m going to try and see if I can recreate it. When you do a search for like email sent to a certain address and then you try and do the thing where you create a filter from this search, and once you create it I think it accidentally — it sort of pre-fills one of the text fields with undefined by accident.

Stephan: Which makes you wonder what else is going on (laughter).

Louis: Yeah, any filter that you create from a search because this word, ‘undefined’, gets added into the text field search the search basically doesn’t work as a filter because it’s looking for email that contains the word undefined, so I couldn’t find a way of actually working around that and getting a search based filter to work. So, yeah, it seems like it was rolled out a little faster than maybe it should’ve been, like the design, I agree with you it’s really slick but maybe a bit more time on quality assurance would’ve been nice.

Stephan: Yeah. It’s a good looking change.

Louis: Here’s another thing, right, does everyone have it, has this been rolled out across the board or is it just to, like, us (laughs) as people that Google have identified as sort of early adopter types?

Stephan: I think that when I was reading the press release they said that they rolled it out so that it’s an option if you want to enable it on your account, and like Brad said it hasn’t hit his account yet so I don’t know, you know, maybe they’re doing it in phased releases but they said that everybody was going to have the ability to test it, to try it out.

Brad: Yeah, it hasn’t hit my main account but I’m anxious for it to because that’s the account I use 90% of the day, so that’s the one I’m really going to notice the little things that you’re mentioning. The other accounts I check them once maybe twice a day tops, so it’s not my main account so I’m anxious for that to happen. Overall it looks nice, but you’re right, I think there are some rough edges on it.

Stephan: Well, so they’ve taken these changes too, the look, the general overall feel with these nice little CSS drop shadows on their buttons and stuff and moved it over to Google Reader as well and kind of really cleaned up that interface, and I actually don’t know if I like the Google Reader interface as much as I like the Gmail interface. The Reader interface is almost too white for me, I can’t tell where things begin and end, it’s very jumbled, so I was wondering if you guys used it. I don’t know; do you guys use Google Reader?

Louis: Yeah, absolutely. I like the way it looks, so in terms of the new design I’m a fan, I like the way the new buttons look, I like the way everything’s a little bit more consistent. You know Google interface design in the past different applications would have different icons to mean the same thing or buttons would be in different places, now everything seems really consistent across the application so I like that. What I don’t like about Reader, though, is the plus integration; before when you clicked on share on a story in Google Reader that sort of went to a public stream or page that you had of your shared items, and there was an RSS feed for that so you could pipe in your Google Reader shared items into your blog or whatever from this public RSS feed, and now the only option is plus-one something on Google+ which I think sort of takes away from some of the social features of Google Reader that it had as an independent application trying to tie it into plus which I haven’t really gotten on board with yet, I don’t know.

Stephan: No, I’m completely with you because my wife and I use Google Reader to kind of share things that we like or things that we think are interesting, like I’ll share — I’ll come across a lot of math stuff in my line of work so I’ll share it with her, and so it was an easy way because she didn’t have to — she just subscribed to my feed, my RSS that I had, right, that’s all she had to do, and now neither of us really want to use Google+ if we don’t have to. I’m not sold on Google+, yes I know they have an iPhone app, I don’t really — I don’t get it yet, I don’t find it to be useful in my day-to-day, and so what I’m trying to do now is put — you know you can do send to Delicious, so I’m creating an RSS feed for my Delicious account and then that’s how I’m going to share with her.

Louis: Right. The other thing I didn’t get is so let’s say I wanted to forgo this or to try and use Google+ to actually do the same thing, when someone plus-one’s something public like that does that go into their stream like visibly or is it only when you actually post it? And there doesn’t seem to be a link to actually post it, like is just the plus-one enough to share it to everyone; I don’t even know how this thing works.

Stephan: See I don’t either. I plus-one’d something but it wanted me to put in like comments about it. Well, I didn’t want to put in a comment about it; I just want to put it up there if I’m going to put it up there, right. That was the whole thing with share, like if I wanted to add a note about oh this is cool right here, look at this paragraph, I could. With this the implementation needs to be tweaked I think; Patrick, maybe you know, like the Plus-one how does that work?

Patrick: Well, if it works like the normal Plus-one button does on websites, what I have found is that it’ll only go into your stream if you add the comment, and if you don’t add the comment it’ll go to the plus-one’s section on your profile, so if you navigate to your Google+ profile page at the top there’s that gray bar that says post about photos, videos, if you have those enabled, and then plus-one’s, and that’s where it might appear. Now I don’t know if it factors into the front page in some other way, but I just tested it myself in Google Reader and did a plus-one with a comment and without a comment, and when you try to type the comment in you’ll notice that it adds your circles to the bottom of that comment where you can say public or you can add more people, so I do believe that is how it works.

Louis: Yeah, so I just saw a testing here shared from Plus-one public, and the testing is the one with the comment?

Patrick: Yes, sir.

Louis: Right. See that annoys me. There’s no way like you just plus-one it without a comment I’d like to see those, and I’m not going to go to everybody’s individual profile to go and see what they’ve plus — anyway, I don’t like this thing.

Patrick: No, not at all. And Plus-one is going to factor into the search results I guess on Google.com, I guess like if I plus-one something and you search for that topic then it might be more likely to come up, but right now I don’t see that it’s relevant beyond that sort of thing so it kind of defeats, like you said, the purpose of sharing something through your stream.

Stephan: Okay, so I can kind of understand them trying to integrate all their products, right, and trying to really bring out Google+ and make it some big feature thing that they love, but I don’t understand fixing a problem that doesn’t exist, right, why not leave share, why get rid of it completely? I don’t — it completely broke my workflow. And then there’s apps on my iPhone, so I use Reader, I don’t know if you guys are familiar, but it’s an RSS reader on the iPhone, so I download all my feeds before I get on an airplane, or whatever, and I read them on the plane and then it syncs back up when I land. And now this functionality is just gone, so since it was a folder all my shared items that were shared with me are just gone off my phone because when it syncs it says, hey, that folder no longer exists and it’s gone, which that’s ridiculous. Or am I just crazy?

Louis: Yeah, I have to say not a fan either of the changes in functionality, like I said, I’m totally okay with the design change, like I said, I think it’s prettier, it’s cleaner, probably easier to use, but you know actually moving a functionality that people use then it was, you know, judging from comments I’ve seen it seemed to be a pretty popular feature of Google Reader because a lot of people complained about this.

Stephan: Yeah, if you read my Twitter stream it’s probably — if you guys read my Twitter stream when that came out it was kind of an eyeful (laughter).

Louis: So, again, what are the alternatives? I mean it seems like this is the ‘what are the alternatives to Google show’.

Stephan: Can we restart Bloglines, can that happen?

Louis: Oh, boy.

Patrick: Yeah, I used to use Bloglines too.

Louis: I used to use Bloglines for sure, yeah.

Brad: Dead pool.

Patrick: I think we need to go in business (laughter), buy the brand, buy the trademark from I guess it was Ask, who owned Ask, um, gosh, I don’t even know, anyway, yeah.

Stephan: RIP Bloglines.

Patrick: Okay, cool, so before we go ahead and move on from all this Google stuff I did want to briefly mention that Google+ just launched pages on the social networking platforms. Now if you’re an organization, a business, a website, a celebrity, whatever, just like you might have a Facebook page you can now have a Google+ page. Previously Google discouraged businesses and organizations from creating a Google+ profile because it was meant for in their eyes individuals; now that is gone and you can create your own page right now at +.google.com/pages/create, so you can actually now promote your business on Google+ so get on that.

Louis: So when does this become genuinely important for social media strategy? I know that Google+ is still kind of a fringe thing, it’s something that’s used by some nerds but not by the general public, so if you were advising a local business on their social media strategy, for example, you’d probably tell them you definitely want a Facebook page, you might tell them they want a Twitter page; do they want a Google+ page right away?

Patrick: Well, I would say beyond having the ability to update it I would say just go ahead and have one so that you can start building connections on that platform because I do believe that if you’re not already on there in some capacity as an individual or a business you should just go ahead and do it if you are in the business of engaging with your customers. So I do think it’s important to go ahead and be represented on the platform, I read an article on The Next Web by Drew Olanoff, and basically his overriding point was that Google+ pages are important because of Google’s overall product lineup and how they can or already have tied in to Google+ pages, for instance, they have Google Analytics so it’s not a far reach to say that they will offer better analytics. We talked about on a previous episode recently Twitter’s finally pushing out some analytics, I don’t think it’s available for everyone just yet, so Google has that capacity already in its arsenal and you could see that being rolled out, and then they have tools that could help with the CRM solution, so if people complain on Twitter it’s not something that you can just use Twitter to solve necessarily on a large scale, you need to use third party tools. But Google already has Google apps and they have Google Voice, and they can probably tie it in with another solution, so I guess the overriding theme there is that Google is so powerful and has so many complementary products already that it might represent a better experience for customer or brand interaction than you would receive otherwise on Twitter or Facebook, so I do think it’s a good idea to get on there and get started.

Louis: So are you using some kind of tool to cross post to Facebook and Google+? I notice that a lot of your posts seem to –

Brad: I asked him the same thing (laughter).

Patrick: Right now I’m not. I’m using TweetDeck for Twitter but for Facebook I’m posting manually right now, posting manually on my pages that I manage and on my profile, and the same for Google+ I’m posting manually on Google+ right now and I think it’s a good idea to do that at the moment with Facebook just because we have seen some drops in views for people using some of these automatic posting tools, and it’s maybe not 100% clear what the full cause of that is, I’ve heard that maybe it’s due to people blocking certain apps, but I know in my case I use Network Blogs Facebook app and that’s pretty popular and saw a drop in views and just shut it off and started posting manually and noticed an increase, so it may not be feasible for some enterprise people who work with a lot of different brands and pages, but if you’re just running a blog or you’re a small business or you just have a couple pages to manage, I would just say to go ahead and post directly at this time.

Louis: Oh, man, I am so sticking to code.

Patrick: Get out there, Louis, build that brand.

Louis: (Laughs) oh, no, man, there’s no — I mean you know.

Patrick: You know how long it took me to say your name correctly.

Louis: (Laughs)

Patrick: Now if you’re already a household name like you should be I would’ve already had that down.

Louis: Look, yep, I guess that’s just the cost of not being willing to update more than one social network at a time. I’ll just sit back and wait for there to be a clear winner and then –

Brad: And then someone else will come up.

Louis: Uh, yeah, I guess there’s no win; Microsoft took them up with the social network, next. When is Bing+ coming out?

Stephan: Hey, I’m still waiting for Orkut to take off.

Patrick: It depends on what country you’re from.

Louis: Yeah, it’s huge in Brazil, right, is that the one that everyone in Brazil uses?

Stephan: I think so, yeah.

Patrick: I think that sounds correct, yeah. I wouldn’t know Brazil particularly well.

Louis: (Laughs) I don’t know why I found that funny, sorry; to all the listeners who are confused there’s no inside joke, it’s just (laughs) –

Patrick: Just random laughter.

Louis: Yep.

Brad: So my story there’s a really interesting post written by a guy by the name of Dodgy Coder, sorry Mr. Dodgy I could not find your real name, I looked all over your site, we’ll call him Mr. Coder for now, but he wrote a post about Stack Overflow which I thought was pretty interesting. So he basically had the impression that Stack Overflow was a little bit biased towards csharp.net developers because those are — C Sharp is the most tagged entry on Stack Overflow, so he decided to compare the rankings of the tag popularity on Stack Overflow with the leading language popularity indexed which he used the TIOBE Language Index. Any of you guys familiar with the TIOBE Index?

Louis: No.

Brad: So I wasn’t really either (laughter) so I looked it up, and basically it’s an indicator of the activity of a programming language. Now a lot of people think it’s the indicator of a programming language’s popularity, it’s not, it’s the activity across things like search engines, you know, how often is the word PHP mentioned. So it may signal that it is a popular language, it may signal that it’s a language that a lot of people are looking for help with, it may signal a lot of different things so that’s why there is some controversy around this language index.

Louis: So if a language is obscure but incredibly complicated it will generate a disproportionate amount of searches and therefore increase its TIOBE ranking?

Brad: It could. You could do that, yes, so it’s certainly not a scientific survey by any means, but it gives you kind of a guide to at least compare some other stats too. Now, whether it means anything who knows, but I thought this chart and these numbers were kind of interesting. So basically what he came up with is called the Stack Overflow Representation, and he gets these numbers by taking the — it represents ratio of the Stack Overflow tag count for each language as a percentage of the total questions divided by the TIOBE language Index percentage. So basically what this means is an overrepresentation of a particular language, so anything greater than 100% might mean there’s a greater number of questions on Stack Exchange than we would expect, and an underrepresentation of anything under 100% would mean there’s not as many questions as we would expect. So the thing that really strikes you when you look at this chart in this diagram is that the number one overrepresented programming language out there — and I’ll pause so our listeners can think about what their answer would be.

Louis: A bit of a dramatic; can we fill in with some dramatic piano cues here?

Brad: Because we’re looking at this so we obviously know what it is.

Stephan: Dun, dun, dun!

Louis: Thanks, Stephan.

Brad: The number one overrepresented language is JavaScript. So the big question is why is that? So on TIOBE JavaScript comes in at 2.19%.

Louis: I have a theory.

Brad: Stack Overflow percentage comes in at 6.3% which is an overrepresentation of — or a total representation of 293%.

Louis: I have a theory for that.

Brad: I would love to hear it, what’s your theory, Louis?

Louis: Alright. Stack Overflow is a thing question and answer, anyone who’s not familiar with it go check it out because it’s a great place to find answers; there’s so many times when I find myself Googling a programming problem and the first result is a Stack Overflow of someone having exactly that problem, and it’s a voted question and answer for the response so it’s really good. Now, all these other programming languages are used by programmers, JavaScript being a front end language is going to be used by a lot of front end web designers who aren’t programmers and so probably might — or who are novices just getting into web design and want to do some basic JavaScript effects, and so who will be stumped more often by some, you know, maybe some basic programming concepts that anyone working with any one of these other languages would probably already have their head around, so that’s gonna be my theory.

Brad: Yeah, I think you’re probably dead on it. Between that and the fact that even if you are familiar with JavaScript, in my opinion it’s a harder language to work with.

Louis: It’s also, yeah, it’s kind of a crap language (laughs).

Brad: I’m sure some of our listeners are not going to agree with that.

Louis: We’re going to get a bunch of angry emails about that, but alright, I’ll take it on, I’ll debate you.

Brad: I’ve definitely banged my head on the desk on some serious JavaScript issues over the years, so I’m not saying it’s the hardest but it’s definitely not the easiest.

Louis: There’s another point there, like you just mentioned banging your head against JavaScript issues, JavaScript is the only one of these where you’ll have different platforms for it to run on, right, JavaScript runs in a variety of browsers which have different implementations of the interpreter which isn’t the case for any one of these other languages; some of them have multiple interpreters available but they’re pretty consistent in their behavior so it’s probably less of an issue.

Brad: Yeah, and I was reading through some of the comments, there were some good points, some things to take into consideration are the age of the language, so the longer a language has been around the more resources are going to be available, books, resources online, blogs, whatever, forums, versus a new language where there’s not as much so there’s going to be a lot more searching for those languages, so those would probably be represented a little bit higher and especially a lot more questions asked. I thought it was interesting too that PHP was almost dead on, it’s 104%; Stack Overflow representation is almost exact to the TIOBE Language Index.

Louis: Yeah, that’s interesting, and Ruby and Python are also very close to even. But an interesting fact there is that PHP, Ruby and Python are exactly the kinds of language you would think Stack Overflow would be helpful for, right, I mean a lot of people who do computer science or software engineering in school are going to learn C++ or Java, so they learned it in school and they’ve got their textbooks and they know how to do it, whereas PHP, Ruby and Python are largely web programming languages and a lot of the people using them are self-taught so that’s where those kind of resources really come into play.

Stephan: See I think there’s a slightly — I have a slight theory on all this, right. So India, right, which is a very large outsourcing area, the focus of languages there are Java and .net, and a lot of those folks are self-taught, even though they know theory they still teach themselves syntax and different functionality things, and so I think that plays into it a lot. And PHP after you’ve learned C++ or even .net for that matter, I think you could PHP or Ruby fairly easily in my opinion minus the syntax, so I think that plays into it a little bit, right, on the — what’s it called, the TIOBE reference, I don’t know, maybe I’m crazy.

Brad: Yeah, I think you kind of have to take these stats with a grain of salt, but it is kind of interesting to talk about and kind of look at how some of the different languages stack up, and like I said, it’s not necessarily based on the popularity in the TIOBE Index, it’s based on the activity. So there obviously could be a lot of debate around why a particular language is being discussed more than another one, but it’s interesting so we’ll have the links in the show notes so you can check out some of these graphs that they have.

Louis: Yeah, absolutely. Cool. I had one last story for this week and it was sort of a brief, I don’t know how to describe it, a storm in a teacup I think, at the WHAT WorkingGroup concerning some new elements in HTML5. I don’t know if any of you caught wind of this furor on Twitter?

Stephan: Whoo-ooh-ooh.

Patrick: I felt a stiff cold breeze last night.

Stephan: There was another Hitler video on YouTube.

Louis: Oh, was there?

Stephan: No, I don’t know; furor, you said furor.

Louis: Almost certainly. Oh, I meant like –

Patrick: Ahhhh! Boy.

Louis: Now I’ve got to find out if there was a Hitler video for this.

Patrick: Terrible. Let’s go searching for the Hitler video.

Louis: See how easy it is to sidetrack us.

Patrick: That’s how we prepare for every SitePoint Podcast, look for the new Hitler videos.

Louis: It does not appear that there was any of that downfall remix about Hitler finding out that the time element had been briefly removed from HTML5. So there’s a couple of great articles about this posted exactly a week apart on .net Magazine, so I’ll post links in the show notes, the first one is on October 31st HTML5 Scraps the Semantic Time Element. So if anyone was unaware, in the HTML5 spec there was this idea that you would have this time element, and the purpose of it would be to markup any kind of date or time, so if you’ve got a post you could put the, you know, October 31, 2011 inside a time element and then you have an attribute on the time element that allows you to put in a standardized representation of the UTC time in a machine readable format so that way a spider crawling your page could be able to read the time and not have to parse the actual language, it would just be able to look at the time element and say, oh, this was published on such and such a date. So it was an element that had garnered some usage already even though it wasn’t the final version of the spec, it was already being used by GitHub, it had been — it was in I think released versions of WordPress and Drupal was in the process of implementing or making use of the time element in their default themes. And then Ian Hickson who was the editor of the HTML5 spec at the WHAT Working Group decided to ditch it basically arguing that styling dates and times was not something that people did and its use wasn’t widespread enough so it just dropped it. A bunch of developers got up in arms about this so for the day it happened, I guess I don’t follow the same people on Twitter as you guys do because the day this happened my Twitter stream was full of everyone complaining about this decision, so all sorts of blogs came out against it so this blog post by Bruce Lawson, by Jeremy Keith; Jeremy Keith even went so far as to say look it doesn’t matter what the spec says it’s useful and the implementations are out there so just keep using it. And then a week later the decision was reverted so that change was rolled back, so it’s back, we’ve got time again in HTML5, so basically the outcome of this story is that nothing happened.

Patrick: That’s almost one of those stories that we could just say it doesn’t need to be mentioned, I don’t know, no, I’m just kidding, but it’s funny you mentioned the Twitter thing because I mean if it doesn’t get mentioned by like airlines, zombies or Diddy, you know, the three of us would normally have paid too much attention to it.

Louis: (Laughs)

Patrick: So, yeah, I guess we do follow different people. Diddy did not bring up the HTML5 time element; oddly enough I guess it’s just not mainstream enough to go into that sort of press.

Louis: Yeah, get it out in the mainstream press.

Patrick: But, yeah, is this how quickly they get rid of it and how quickly they can restore it? I mean I’m looking at the time, the dates on these articles, I guess it’s not that quick, October 31st and November 7th.

Brad: That’s a week.

Patrick: I mean did they not have any discussion about removing it before they just came out and said, bam, it’s gone?

Louis: Yeah, so here’s the thing with HTML5 and the WHAT Working Group, right, you guys will probably remember there was a very, very long period of time in the history of web development when the W3C was theoretically working on XHTML2 and they were often fantasy land working on this thing that no browser would ever implement because we couldn’t deliver it with the right mime type anyway.

Patrick: Right.

Louis: And it had just completely stalled and nothing was being added to HTML and people were either using XHTML1.0 or HTML 4.01, and this was the state for many, many years and then some people at the W3C kind of got dissatisfied with that and formed this splinter group called the WHAT Working Group, the Web Hypertext Application Technology Working Group, something like that, and came up with the HTML5 spec very, very rapidly, and the reason for that is rather than this sort of consensus based approach, the committee sort of driven approach used by the W3C, they had sort of one editor who wrote the spec who was Ian Hickson and that allowed them to move a lot faster. So we saw the advantages of that workflow in the fact that it got us HTML5 a lot faster than we would have gotten it if it had been up to the W3C, but then last week we kind of saw the flip side of that is if Ian Hickson decides he doesn’t want something even if a bunch of people are using it and disagree with him he can just go ahead and drop it. In this case it so happened that the outroar was widespread enough that the decision was made to revert it. But even then looking through the mailing group, the mailing list, when the decision to revert it was made — and the initial argument was made on a technicality, it was made on sort of well the spec is already past the point when we shouldn’t be reverting features, not an argument from its value which is an argument that it’s too late to be removing elements.

Brad: I think Ben Ward said it best when he Tweeted, “We may as well just consider replacing all HTML tags with derp!” (laughter).

Louis: Pretty much like that because the original argument I think from Ian Hickson was that we just wanted to use a data element, a generic data element that you would just put the machine readable version inside the tag and then have that do its thing, but the argument for time is that this is a one specific format, it’s really, really commonly used on the Web, it was easy to use, everyone understood it, you just, you know, put the element in there and it gives you a lot of extra flexibility. So it’s good to see that it’s back and it’s good to see that the developer community at large definitely has an influence on this, so people should definitely pay attention to what’s going on in these specs because if there’s something you disagree with you can get out there and convince a lot of people that it is a bad idea then it has an impact on what eventually goes into the spec.

Stephan: Keep calm and carry on.

Louis: (Laughs) so I guess that’s the end of that story.

Brad: My spotlight is a fun little site by Mr. Doob called Google Gravity. It basically is a fun site that loads up what looks like to be the Google website homepage and then the page basically kind of all collapses down to the bottom of the screen and you can actually grab the various elements that have fallen and drag them around and slam them into other elements, and the search box is actually fully functional so you can search something, hit enter and the results will also fall down on the screen and fall into your pile of various elements. It’s kind of hard to describe but it’s one of those really fun sites to play with and waste a little bit of time on, so we’ll definitely have a link, that’s called Google Gravity.

Louis: So do you know what the deal is with the tech here, is this all JavaScript, are these the actual elements moving around?

Brad: You know I was looking into the backend and I didn’t get far enough to figure that out, it looks like it might very well be.

Louis: It definitely looks like it, it looks like it’s not Flash, it’s definitely just all this stuff moving around which is pretty impressive.

Brad: Yeah, it’s certainly not Flash, it looks to be all JavaScript based, I was actually hoping it would be HTML5.

Patrick: I guess you guys all saw the dual barrel roll thing; I don’t think you could have missed it.

Louis: Yeah, yeah.

Patrick: It’s not possible to miss it.

Brad: It was an obvious spotlight, I avoided that one.

Patrick: Right. And there was the one that led me to the one for more Google tricks.

Brad: Easter eggs?

Patrick: Yeah, Easter eggs. And there was one, recursion, I don’t know if you saw that one, it’s a little subtle because recursion, according to Wikipedia, is the process of repeating items in a self-similar way so if you enter recursion into Google it asks ‘did you mean recursion’ and will always ask that.

Louis: So, yeah, you click on did you mean and it just brings it back to the same page.

Patrick: Yeah.

Brad: So that’s funny, I didn’t realize my spotlight was Google based, but I guess that fit right in.

Louis: That one’s definitely geekier than do a barrel roll. Stephan?

Stephan: So my spotlight is a series called Made by Hand, and it’s a bunch of videos and they’re kind of coming out in different pieces, and it’s basically documentaries, little mini documentaries about different things that are made by hand. The first one is about the distillery, it’s about a distillery, and then the second one’s about a knife maker and they’re just kind of interesting little videos and I’m into things that aren’t television that I can watch, so it’s cool.

Louis: Very cool, I’ll check this out, these knives are just sort of I assume totally handmade.

Stephan: Totally handmade and when you listen to the guy’s story you would never think that he was going to become a knife maker.

Louis: Well, you wouldn’t think that anyone would become a knife maker, right, it’s one of those professions that you think the last knife maker died in 1867 (laughter).

Stephan: Well, what’s funny, and I’ll have to find the video, is that this isn’t the first video I’ve seen about a knife maker.

Louis: (Laughs)

Stephan: There’s another one and it was actually really well done as well, and he talks — this guy makes like $5,000 knives, so interesting stuff.

Patrick: But where is the video for the guy who you wouldn’t think would have became a murderer with knives but then went ahead and did it (laughs), where’s his bio?

Stephan: That’s on MSNBC at night, you know; To Catch a Predator.

Patrick: Very good, very good. No, no, I was just commenting on Brad’s but I can see how you would say that.

Brad: You were trying to sneak half a spotlight in there.

Louis: So my spotlight this week it was a hard pick, there was actually a couple of things I wanted to spotlight on, but the other one hopefully it will come up in the interview show next week, that’s all the spoiler I’m going to give for that so we’ll see what happens there. So the one I found was this post on worrydream.com which is the personal website of an interaction designer called Brett Victor. And it’s sort of this really — it’s just a rant in response to a YouTube video, I don’t know if you guys saw this video but it was sort of — it’s called Productivity Future Vision, it did the rounds on Twitter a couple of weeks ago and it’s sort of animation video of a bunch of futuristic user interfaces, people with all these kinds of crazy digital magazines in their hotel room. It’s this business woman showing up for a meeting and doing all her preparation in her office, in her hotel room with all these kind of fancy interfaces that don’t exist yet and that have been cleverly animated, so it’s a pretty impressive video, it’s worth having a look at. But what I was really interested in is all the points raised by Brett in response to it, sort of saying these are all sort of unimaginative interfaces, right, because they’re all sort of this sort of pictures behind glass on a screen where all you can do is swipe, basically it’s the one thing that we do, and he has this really nicely illustrated rant which is super well designed, so it’s not really just a blog post because he’s got illustrations and pictures and it’s really its own website covering all his points about how we can do better in terms of interface design and build things that are really tactile. So I thought it was a really interesting read so that’s my spotlight.

Patrick: Cool, very cool, yeah, that’s a handmade blog post right there.

Louis: Yeah, that’s one of the things that impressed me was you know there’s been so much care put into making the thing pretty, so it goes beyond a blog post, it’s like a, you know, a full-on sort of magazine article with layout and pictures and all that.

Patrick: Cool. So if Brad wasn’t leaving today my spotlight probably would have been Heavy D related because Heavy D the rapper just passed away today, RIP Heavy D. Go check out the You Can’t See What I Can See music video. But since Brad is leaving I have to give it to something else, see what I did right there, no. So my spotlight is the first episode of the SitePoint Podcast, SitePoint Podcast #1, The Economy. And I think Brad was like you shouldn’t put that out there, that might not be our greatest moment, but, it’s important to know where you have been so, yeah, I would definitely encourage all listeners to take a look at the first episode of the SitePoint Podcast released on November 10, 2008, and I think as Brad said this show is going to be coming out on November 11, 2011, so three years and one day later and, yeah, you can see what it was like at the very beginning when we just got started, pushed on by Brad but with us along for the ride as well.

Louis: Alright, well that’s it for this week’s episode, and that’s it for Brad’s tenure on the show. So, again, Brad it’s going to be sad to see you go.

Stephan: We’ll miss you, buddy.

Louis: But all the best.

Patrick: Yeah, we’ll miss you.

Louis: And we’ll definitely have you back on. Unlike Kevin you’ve got to come back for real, not like Kevin.

Brad: Yeah, thanks guys, I’ll certainly miss it (laughter). Hey, send me the invite, I’ll be here.

Louis: Awesome.

Patrick: Very good. Well, I guess lead us off on around the table for the last time.

Brad: So I’m Brad Williams with WebdevStudios.com and you can find me on Twitter @williamsba.

Patrick: I am Patrick O’Keefe for the iFroggy Network, I blog at managingcommunities.com, on Twitter @ifroggy, i-f-r-o-g-g-y.

Stephan: I’m Stephan Segraves blogging at badice.com; you can find me on Twitter @ssegraves.

Louis: And you can find SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m. You can find everything related to the SitePoint Podcast from the first episode on up at sitepoint.com/podcast, and you can email us at podcast@sitepoint.com, you can find me on Twitter @rssaddict. Thanks for listening.

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.

Episode 137 of The SitePoint Podcast is now available! This week our regular interview host Louis Simoneau (@rssaddict) interviews Jan Lukacs (@jan_lukacs) the General Mananger of Paymo.

Listen in Your Browser

Play this episode directly in your browser — just click the orange “play” button below:

Download this Episode

You can download this episode as a standalone MP3 file. Here’s the link:

• SitePoint Podcast #137: Paymo with Jan Lukacs (MP3, 24:58, 24.0MB)

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

Louis and Jank discuss how the whole project came about, the pitfalls and experiences of changing from a client project based business to a cloud app service and how you can think about approaching the same move.

Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/137.

Interview Transcript

Louis: Hello and welcome to the SitePoint Podcast. This week on the show I’m glad to have with me for an interview Jan Lukacs who is the general manager of a company called Paymo which is sort of an online time tracking and invoicing service. Hi, Jan.

Jan: Hi Louis.

Louis: How are you going?

Jan: Thanks for having me. I’m great thank you.

Louis: Good, it’s great to have you on. You were recommended to us by Joel Falconer who’s been doing some blogging for the various SitePoint sites, thought it’d be cool to have you on and talk a bit about your product and your experiences freelancing and working with a lot of freelancers with Paymo.

Jan: Yeah, I’ll be happy to share any things I’ve learned from our experience.

Louis: That’s great. So, before we dive into any of that do you want to talk a bit about your website, about your product, which is called Paymo and it’s at paymo.biz, is that right?

Jan: Yeah, paymo.biz, yeah.

Louis: Do you want to just tell us a bit about it and tell us what gave you the idea to start it and how it’s been going.

Jan: Sure. So, basically Paymo is a time tracking service, an online app, that allows you to manage your team’s time and your own time, it’s also for freelancers with businesses too. At the core it’s a time tracking service but we built a bunch of tools around it like project management and invoicing, so it really helps you manage your business online, especially if you’re working on projects where you need to know how long a task takes and things like this.

Louis: Right. So how long have you been running this site?

Jan: We started in 2008 and for a year we kept the service for free, so we didn’t have any commercial product so to speak, and in 2009 we redesigned the whole app after we got a lot of feedback from our users, basically that’s the point where it was a product that we started to sell.

Louis: Right. So right now is there still a free option on the service, though?

Jan: Yeah, of course. From the beginning this was our philosophy. In our careers a lot of tools that we used were open source or free and they helped us a lot, so when we decided to create a premium version of the product we knew that we had to give away for free the core services of the app, so we will always have a free version of our service.

Louis: Right. So you mentioned when you were working previous to this before doing Paymo you were just a standard sort of work-for-hire web shop, right?

Jan: Yeah. We were a web development agency working on projects for other companies and individuals.

Louis: And so is Paymo something you built for use internally and then realized that you had a product that you could sell, or was it something where you knew at the end of the day it was going to be a product that you would try and mass market?

Jan: No, we built it for ourselves because at that point we looked at the solutions that were available and none of them fit our needs, so we started working in our free time in creating it and then we saw that actually other people might use it too, and in 2008 we created a website and just gave away the service for free, and really it was something totally new to us, we hadn’t had any experience in creating products or services, so the feedback was great and we decided to change our model and focus on the product.

Louis: Right, so at present are you not doing anymore client work?

Jan: We separated our company so we created a new company for Paymo, the old team is right now focusing only on Paymo, and part of the old team is focusing on the web development agency, so they are totally separate at the moment.

Louis: Right. You were mentioning earlier that you said when you were thinking about starting, or thinking about building a product for time tracking, you mentioned that none of the products out there suited your needs. What’s interesting to me in this case is that it’s not a totally new market, like a lot of times you hear about these agencies that go out and branch out in product and they’re making something that doesn’t exist, but in this case there were definitely a few other time tracking and invoicing and project management solutions on the Internet. What was it that made you feel that you needed a different product or a new product?

Jan: The main thing was that we used a couple of services and none of the people on the team were actually using it, and the main reason behind this was that they ran in the browser and inputting time into the system was time consuming and you had to look at all these tables, it was very complicated. So then we figured that if we want to make some money from this business we really need to know how much we’re spending on projects, so this was always a problem for us, we were always getting paid less than we actually worked for, and the solution was to create a desktop widget, an app that would run on your desktop that interacted with the online system. So this is something that at the moment we started working on Paymo didn’t exist.

Louis: Right.

Jan: This was one of the main reasons that we created Paymo. We wanted to make it much more easier to add time into the system.

Louis: Yeah. When you say a desktop widget, did you build this cross platform from the get-go?

Jan: Yeah. We had people using Macs and PCs on the team, so this was also a huge problem because there were solutions out there that we could use but none of them worked cross platform.

Louis: Right.

Jan: This was again a thing that we needed and we built it.

Louis: Right. Right now so you have desktop widgets for Mac and Windows?

Jan: Yeah, exactly.

Louis: And Linux or not?

Jan: It’s not very straightforward but you can run it on Linux too.

Louis: Right. Did you guys have in-house the kind of expertise to work in desktop platforms or were you all web guys and had to go out and learn these new technologies?

Jan: One of our colleagues was really an expert on desktop so it wasn’t a big deal for us, that helped, certainly helped a lot, and we also had experience building large websites so this came in handy because a system like this really requires all kinds of skills that you usually don’t get when working on smaller projects, so these things certainly helped us.

Louis: Right. Just to geek out for a second here, what kind of technologies did you use for the desktop widgets and for the website itself, the backend?

Jan: For the backend we use PHP and MySQL, and for the desktop we use C++ or Visual C++ in the case of Windows. And on the Mac, but here is the cool thing, the core widget is actually just a web page but it’s wrapped by a desktop app, so this makes it easy for us to maintain it and run it also on the Mac or on Windows and on Linux too.

Louis: Yeah, that’s cool. So, one of the things that’s interesting for me, and I imagine that it’s going to be interesting for a lot of listeners as well, is that transition from a company that was primarily focused on servicing client projects to a company that was focused on delivering a pay-to-play product to the wider Internet. I’ve spoken with people before who say that’s something you should be careful when you’re thinking about doing because it’s hard to do two things at once in the same team. So how did you guys approach it and what were the challenges that you faced in that migration from dealing with clients to working on building this product?

Jan: Yeah, well, the transition is pretty hard because they are totally separate businesses, and things that apply in one type of business don’t apply at all in the other one, so we really made a bunch of mistakes that we weren’t even aware of at the moment when we started building a product, and everything took way longer than it should have been if you look at it from this point of view. But it also allowed us to — having a primary business allowed us to create this product without going to investors, without taking out loans.

Louis: Yeah, right.

Jan: So the money the web agency made we used that money to create the product. However, in the first years we didn’t focus as much on the product as we should have been, and this really made the business develop much slower and more organically than you could do if you would have sort of a business advisor from the start and a lot of money to spend on marketing and things like this. But in the end for us it worked out pretty well.

Louis: Right. If anyone listening or is involved with or is running a web agency and sort of has an idea for a product that they think they could develop and sell but they don’t necessarily think they have time to do it alongside their client work, what’s the top piece of advice you’d give to someone in that position?

Jan: Top advice, that’s hard (laughter). I think they should really, really analyze the market and see what the opportunities are, and try really to go into as much detail as they can about the new business that they are trying to start because it’s really, really hard, there’s tons of competition in every niche, so going after a niche is no longer good advice because every small niche is filled with tons of competitors, and you really need to see if you have the skills and the money to create a new business.

Louis: Right.

Jan: Because otherwise it will be at least one or two years of work down the drain, that’s got to hurt if you don’t make it.

Louis: What’s interesting, though, is your case sort of almost serves to disprove that because I can hardly think of a niche of sort of online service based product for web designers and web developers that there’s more competition in than sort of these time tracking product management apps, and I think the reason for that is that web designers and developers want to build apps that they would use.

Jan: Yeah, absolutely.

Louis: And that’s the main kind of online tool that you’d want to use as a web designer, developer. But despite this you guys managed to come into the market fairly late and still build up a fairly successful business.

Jan: Actually when we came out it wasn’t that late, so at the moment we came out with the free app, the first version, there were only a couple of other online time tracking tools in 2008 that were pretty good. But in that year when I said we made a lot of mistakes, from 2008 to 2009 if we would have really, really focused on the product we would probably have gotten a lot of market share in that period, and at the same time a lot of our competitors sprang up because they also saw the opportunity in this market.

Louis: Yeah.

Jan: So my advice right now if you would start another time tracking app –

Louis: Is don’t! (Laughs) Don’t do it.

Jan: Don’t do it. And I’m not saying that’s to avoid other people getting into this but it’s really crowded at the moment.

Louis: Yeah.

Jan: So I would be looking at services or niches that have two, three, four competitors but not 20 or 40 or 50 or whatever, because it makes really, really hard to start a business like that unless you do something totally, totally awesome then (laughter).

Louis: I guess there’s always a way of differentiating. So how did you guys go about marketing your app in the beginning, was it just sort of organic, you talked to your friends and they talked to their friends and you weren’t really focusing on marketing or did you guys put in some effort to try and get the app in front of people?

Jan: In the first couple of months I had no idea how to market something like this because I was coming from services and for me it was totally new. So right when we started the app when the free version came out we didn’t really have any marketing dollars, so it was a lot of effort to try to get the product seen by people who are interested in this sort of thing, so we contacted a lot of bloggers, followed Tweets that were talking about time tracking and that sort of thing, and we really tried to get an opinion from people after using our system, so getting feedback from our initial users was crucial, and we listened to that.

Louis: Sorry, I’m just going to interrupt you for a second. In that initial phase how many users did you have on the system if you don’t mind me asking?

Jan: Probably a couple of thousand in the first year. Yeah, it’s really, really hard to get people to use your system when you’re absolutely new on the market, and I really appreciate the trust the initial users gave our system, and as a piece of advice if you’re trying to start a web app or a service it’s very important to try to find people that fit the early adopter profile, so to speak, because they are willing to accept bogs, downtime, stuff like that, just to try the service because they like it. So it’s very important to go and try to find these people and get them to use your service by any means you can do it.

Louis: Yeah. And it must have been particularly interesting; a lot of these kinds of services and startups are based in either the U.S. or Australia or Canada. Where are you guys based out of?

Jan: We’re based in Romania in Europe so that makes it a bit harder for us, but we’re doing the best we can.

Louis: Yeah. So when it came time to design your app and you’re developing an app in English for an English speaking audience, what was your strategy going about getting the copywriting and getting all the interface done in a way that was clear and understandable for an English speaking audience?

Jan: We really did all the work ourselves. I assume that having worked for a number of years with companies based in the U.S. and also in Australia made us understand that market quite well and we didn’t have any major problems in this regard.

Louis: That’s really impressive because I mean I’m looking at the interface and the copywriting is really good and sort of speaks really clearly to me, and so I have to say a big congratulations to whoever is doing the copywriting because for someone who doesn’t have English as a first language I’m really impressed.

Jan: Thank you, thank you.

Louis: Right. So I wanted to come back a little bit, you guys had been working as a freelance web development and design team for some time, and you said you were working with international clients as well?

Jan: Yes.

Louis: How long had you been working as a freelance business or as a project based business before you decided to start Paymo?

Jan: We’ve worked for approximately five years.

Louis: Right. You’re obviously successful in that business; was there a moment when you were starting Paymo where you thought we might be spending time and money on something that might now work out when we already have a successful business?

Jan: It was a decision that we had to make. After we saw the attraction for the free app that we launched it was really a point where we have to decide what we’ll do next, do we focus on the product or on the web development agency, it wasn’t an easy decision. Of course the app at that moment wasn’t making any money so it was a risk, but we really wanted to try something new and the context allowed us to continue our old business without getting too involved in it, and I had the pleasure of working with a couple of guys that were able to pick up the business and focus on that, and we managed to separate the company into two companies and it worked out quite well, at least until now.

Louis: (Laughs) no, that’s a great success story. Speaking of which until now, do you want to throw out some stats, like you guys have been doing pretty well, I see some stats here on the home page, but have things been going well for you?

Jan: Yeah, we’ve been growing the business and the vast majority of our clients are happy with the service and continue to be subscribed to it so that makes us very happy, and it allows us to build new stuff and expand, and we really want to create something that people actually don’t fear to use because, let’s face it, time tracking is something that people don’t like (laughter), but we’re trying to make it as pleasant as possible and in the end it really pays more, this is what Paymo is about; it gets you paid more because once you have a clear view of how you spend your time or your team spends their time you’re able to make decisions based on that and you will get more profitable. And this is not something — I’m saying this is what we hear daily from our users.

Louis: Yeah, absolutely, I imagine. And for a lot of people just getting into doing client work it’s easy to sort of — the small request, right, the little 15 minute sort of, “oh, can you just go and update this file,” –

Jan: That kills you.

Louis: — you do one of those a day and all of a sudden you’re actually working for less than you’d be making at Burger King.

Jan: Yeah, we’ve made that mistake. In the first three years when we started our business we had a lot of clients that were just like that, and I’m sure every freelancer, small company, knows this. And at a point you have to decide and you have to fire some of your clients, there’s no other way around it otherwise they’ll keep you dragging down forever and it’s not good for you and maybe not good for them either in the end.

Louis: So in your case there’s a couple of things I want to mention, one is you said you’re working on new stuff, can you give us any hints of what we can look forward to, if anyone’s using Paymo the new features coming out they can look forward to or are you thinking about new products?

Jan: Yeah, we want to make some pretty radical changes in our next version. At the moment I cannot really talk about them, but I assure you that they will be something pretty cool.

Louis: That’s what they all say, man, every time I ask that question.

Jan: Yeah (laughs).

Louis: I’m going to keep trying; one day someone is going to be like, yes, as a matter of fact I can tell you that the next version will include this feature and this feature.

Jan: When we’ll be closer to our vision I’m sure I’ll be able to talk about it, but I’ll be really honest here, a lot of stuff that we did was copied very fast by others, and honestly in this business everyone is copying everyone, so this is the truth about it, but there are a couple of key features that differentiate the product and that’s where you sometimes have to keep a secret.

Louis: Yeah. One of the things I find interesting, so we were mentioning you guys have a free plan and you said you plan on keeping that an option.

Jan: Yeah, forever, yeah.

Louis: See, this is really interesting to me because I remember — so what happened is I first looked into this about three years ago when I was doing some freelance work, and I hadn’t looked into any of the time tracking or project management web apps for quite some time, so I let it slide for two or three years. And then recently just last week my girlfriend was going to start doing some freelance administration work and she asked me, “Oh, what do you use for invoicing?” And I said, “Oh, just go use this thing,” and she looked it up and was like, “It’s $20.00 a month,” and I’m like “Oh, no, no, there’s a free plan,” and she’s like, “No, there isn’t.” And a lot of these services have sort of discontinued their free plans as the market has become more mature.

Jan: Yeah.

Louis: But you’re willing to make a commitment that that’s never going to happen with Paymo.

Jan: Yeah, absolutely. Everyone is — if you look at the bigger players, not only in this niche but in online services, everyone says hide your free plan somewhere, whatever you need to calculate your conversions, the free plan will set you off-balance; I really don’t believe in this and we want to give the core services for free to our users because we know they aren’t making a lot of money and some of them can’t afford it. So, the concept here is really simple, we give you the free stuff and we hope that it will help you enough to become a customer, that’s basically it.

Louis: That’s a great attitude and I have a lot of respect for that, so I’m cheering for you guys, I hope this works out because this is something that I like to see when I come to a site and still see that free plan and say, look, if I just want to try it out, if I’m just starting a business absolutely I agree, I’m not going to shell out twenty bucks for a service, I’ll just put it in Excel really is what’s going to happen, or I’ll put it in a Google document.

Jan: And there’s also another advantage that even if you from the start you want the premium plan we really make it easy for you to decide, you can use the free plan and it’s only limited to the number of users you can use, so if you’re a company with 50 users and you want time tracking system you can sign up for an account with us and use the limited free version for a month or two, see if it works out, see what the people in the company think about it, because this is crucial with these types of apps, and once everyone agrees that they like it you can just upgrade your account.

Louis: Really good. Was there anything else you wanted to mention before we go?

Jan: Well, I would be very happy if your listeners would check out our service, and I also do customer service so if anyone has any kind of questions about Paymo I’d be more than happy to help them out and answer their questions. And if anyone out there is thinking of starting their business my advice is that, yeah, do it but please make sure you analyze the market and think about that decision because it can be life changing.

Louis: Yeah, absolutely. And in your case I’m happy to see that it’s been life changing for the better and that you’re in a better place where you’re working on something that you enjoy now.

Jan: Yeah.

Louis: It’s great to see these kind of success stories and, again, I said like I really like the look of the app, I hadn’t heard of it before Joel brought it up, but it’s definitely something I would recommend because I do like the design and there’s a free plan, right, so it’s easy to recommend to people if they want to check it out. So the website is paymo.biz, that’s p-a-y-m-o dot b-i-z and if anyone wants to follow you on Twitter do they follow you at the Paymo or do they follow you on your account?

Jan: Yeah, both. If they follow our main Twitter account they’ll get all the updates and latest news and promotions that we’re running, and if someone wants to follow me I talk about a lot of things on Twitter if you’re curious.

Louis: What’s your account?

Jan: Jan, j-a-n underscore Lukacs (@jan_lukacs), but if you look at our website on our team page you can follow me directly from there.

Louis: Absolutely. And I’ll put a link in the show notes as well.

Jan: Okay, thank you.

Louis: Thanks so much for coming on the show and talking with me about this stuff, Jan; it’s been an absolute pleasure.

Jan: Thanks, Louis.

Louis: Especially given the listeners won’t know this but we’re recording sort of on a whim, we were trying to sort out a time because it’s a little difficult to match time zones in Europe and Australia, and I was just coming home from a day off and happened to see your email and like, oh, I’m in the office now let’s do this.

Jan: Yeah, it’s awesome that we managed to do it now.

Louis: Great timing. Alright, thanks again, Jan, and all the best in the future, look forward to seeing what’s in the future for Paymo and maybe have you back some time.

Jan: Of course, thank you.

Louis: Alright, thank you.

Jan: And thanks for having me, bye, bye.

Louis: Have a good day, bye. And thanks for listening to this week’s episode of the SitePoint Podcast. I’d love to hear what you thought about today’s show, so if you have any thoughts or suggestions just go to Sitepoint.com/podcast and you can leave a comment on today’s episode, you can also get any of our previous episodes to download or subscribe to get the show automatically. You can follow SitePoint on Twitter @sitepointdotcom, that’s sitepoint d-o-t-c-o-m, and you can follow me on Twitter @rssaddict. The show this week was produced by Karn Broad and I’m Louis Simoneau, thanks for listening and bye for now.

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.