It’s wonderful to have someone with Steve’s knowledge and experience talking at Webstock. We asked local web performance advocate, John Clegg, to interview Steve for us.
John:What is Web Performance Optimisation (WPO) all about?
Steve: I break “performance” into two parts: efficiency and speed. Efficiency is most critical when struggling with scalability issues and thus is more focused on backend operations. Speed has to do with the user’s perception of how fast a website is and how that affects their experience. Early in my career I focused on the performance issues of running large scale websites, but for the last six years or so I’ve been almost solely focused on the user’s perception of website speed.
John:Isn’t WPO “systems” stuff? Don’t we have to turn on some setting on the webserver and it’ll make my site fast? Why is WPO important to developers?
Steve: Luckily, there ARE many WPO improvements that are simple to implement, such as compression and caching. But not everything is that simple. The #1 challenge for building fast websites today is JavaScript, and there’s no silver bullet solution. Website owners should generate a todo list of performance improvements, and prioritize those based on the costs and benefits involved. The low hanging fruit should be tackled first, but pretty quickly the performance improvements will involve changing the way a website is built, and that’s where developers need to step in.
John:You’re giving a workshop at Webstock called “The Long Tent in the Performance Pole”. What’s it about? Who’s it pitched at? And what will we learn?
Steve: The benefits of faster websites is well documented: more traffic, happier users, increased revenue, and reduced operating costs. The entire organization is on board with WPO. Now what we need to do is figure out exactly what needs to be done to make our websites faster. We don’t want to mess this up – there’s nothing more frustrating than picking the wrong items to “fix” and seeing no improvement. This workshop shows which tools to use to analyze website performance and how to spot the most important performance problems to fix.
John:How has the focus of WPO changed in the past couple of years?
Steve: Sometimes it can be hard to get buy-in across the organization to work on optimization. You’re basically arguing to spend resources working on something that doesn’t change the way the website looks and doesn’t add any new features. That’s a tough sell! The main change in WPO over the last two years is the overwhelming number of case studies volunteered by industry leaders showing the impact WPO has on the business metrics – revenue, users, traffic, etc. The phase we’re in now is using technology to reduce the hurdles for adopting WPO. Using technology to simplify technology – it’s a fun and challenging problem.
John:How does the growth of mobile and tablets over the past couple of years change WPO?
Steve: WPO and web development in general haven’t kept pace with the adoption of mobile devices. We’re in catch up mode. I’ll be showing some mobile tools in my workshop, but there’s a real need for greater visibility into how these mobile clients perform.
John:In New Zealand, we have a lot of small to medium websites and only a few really big websites. Most of the sites are built and maintained by services companies. What advice would you give the service companies in pitching WPO to their clients?
Steve: Two things: Most of the case studies showing the bottomline benefits of WPO have been done by large websites (Google, Yahoo, etc.). That’s because it’s a lot of work to run these experiments and gather the data in a scientific way. That’s why Alistair Croll and Strangeloop Networks ran a similar case study on how performance affects typical (not huge) retail sites.
So the first thing I would do to pitch WPO would be to share these case studies, especially the ones that address websites outside of the top 100.
The second thing I would do is use WebPagetest to record a video of a fast website and a slow website running side-by-side. Even better, make it a video of the potential client and their faster competitor. Once someone sees how their slow site compares to a faster one they’ll become a WPO advocate.
Thanks Steve and John!
Steve’s workshop, The long tent in the performance pole, is on 16th February. You’ll go away with practical techniques to make your website faster – meaning a better user experience, more users, increased revenue, and reduced costs. What’s not to love!
Nicole Sullivan is right at the cutting edge of best CSS practice. She started the Object-Oriented CSS open source project, has consulted with Facebook and the W3C and blogs at http://stubbornella.org.
We are very pleased to welcome Nicole to Webstock and asked Russ Weakley, frequent Webstock speaker and all-round good guy, to interview her.
Russ:What is this Object Orientated CSS all about, in a nutshell?
Nicole: OOCSS is the radical idea that we can build robust, scalable, maintainable interfaces that adhere to engineering best practices.
Russ:Initially, there seemed to be a backlash against the use of the name “object orientated”. Do you thing the term is accurate, do you wish you had called it something else – like “Nicole’s much more efficient method of CSS (NMMEMOCSS)”?
Nicole: The name was meant to draw a parallel, not be literal. I don’t really mind the backlash. I think the name initially got a few more people (beyond the usual CSS crowd) to start thinking about how to write truly great CSS.
Russ:You have often talked about two key principles of OOCSS being: “Separate structure from skin” and “Separate content from container”. Could you explain what you mean by these two concepts?
Nicole: These principles suggest ways to create layers of abstractions in your CSS objects. You want to have each object solve only one problem, and solve it very very well. In that way, this simple object becomes predictable, testable, and flexible. You can use it to achieve designs that haven’t even been imagined yet.
To keep the objects from becoming overly complex, you want to decide on their boundaries. For example a rounded corner box shouldn’t specify how a heading inside it is rendered. A heading is a separate object. In this way, you keep container and content separate, so flexible.
Russ:For those that have been used to building using location based styling, OOCSS is a major mind shift. Are there techniques people can use to gradually shift to OOCSS?
Nicole: I recommend starting with the tiniest content objects like headings, links, text treatments, and lists. When you can draw on a toolbox of content objects you will find creating new features is much simpler. In my workshop at Webstock, participants will also get to try creating pages from a site that was created completely in OOCSS. There is nothing like creating new HTML pages from an existing object library to cause an “ah ha” moments where you suddenly understand.
Russ:Finally, you have stated that you are opposed to Conditional Comments. What are your objections, and how do you address browsers such as the wondrous IE6/7 browsers?
Nicole: I don’t like conditional comments because they require additional HTTP requests in browsers that are already struggling to keep up. I also like to keep all the code for any one object in a single file. IE dev tools are really inferior, it can be hard to tell that an IE-specific rule is causing what looks like a bug.
Instead, I choose to use * and _ hacks to target specific versions of IE. As a side benefit, these hacks look really gross, which is great because people hesitate to over-use them!
When creating objects like rounded corner boxes, you might notice that each type of box has a lot of code in common. Different boxes may have only tiny variations, like border color and width. When you create an abstract “box” object the code for each of the specific subclasses (skins) becomes really simple and predictable.
Thanks to both Nicole and Russ for this interview!
Nicole will be conducting the workshop CSS of the future – building with Object Oriented CSS at Webstock on the 14th February. She’ll be covering best-practice CSS and you’ll leave armed with practical changes that will make your code lean, efficient, and flexible.
Webstock’s silver sponsor and longtime supporter Microsoft have taken a different approach to their presence at Webstock this year. They have chosen to take on the role of observer and broadcaster. Their efforts have culminated around a single piece of collateral – a backstage pass and a website – to create a lasting memory of Webstock for attendees and those not lucky enough to participate in the event. We caught up with Microsoft New Zealand Web Evangelist Nigel Parker and talked about their contribution to Webstock this year.
1. Tell us a little bit about the workit.co.nz website and the idea of the backstage pass.
I have been lucky enough to be involved with Webstock since its inception in 2006. I have got to know the team and previous speakers that have been involved with the event and each year that Webstock takes place I’m fascinated in the excitement and love that gets generated. Previously we have engaged the audience in activities like our Valentine’s Day Flickr photo booth. This year I really wanted to bottle that excitement and take it to a wider audience and other communities.
2. How did you go about generating the content?
Every year leading up to Webstock a small gathering of fascinating people takes place at Mahurangi College in Warkworth. The event is known as Kiwi Foo Camp and is organised by Nat Torkington and Jenine Abarbanel, with assistance from Russell Brown. This year at Foo I pulled aside Webstock speakers Ben Cerveny and Eric Ries to talk on camera about themselves and the Webstock event.
With incredible support from Webstock personality and Senior VP Natasha Lampard I was able to attend and share Adam Greenfield’s mind blowing Wellington Walkshop and talk on camera with Jeff Atwood.
2. On the site you have interviews with companies and people attending Webstock, what are you trying to achieve with this?
I have been actively part of the New Zealand web community for many years. I am continually inspired by the innovation that comes from kiwis on the web. What I wanted to do with the site was showcase some of the Microsoft Gold Partners that I think are doing cool work. Among them, Intergen has been a resident sponsor of Webstock since the beginning and I caught up with their team at the event and in their office to talk about an exciting new kiosk project that they have been working on.
Also anyone that follows me on twitter knows that I’m a huge cricket fan so it was great to be able to interview another Microsoft Gold Partner NV Interactive about their latest exciting project launched this week for New Zealand cricket.
3. You mentioned Microsoft Gold Partner, what does this mean?
Microsoft is a platform company that coalesces with a strong partner community to achieve scale. The Microsoft Gold partners are highly visible in New Zealand but sometimes that can be intimidating for smaller web companies starting out. This year we have rolled out a new programme called WebsiteSpark. The programme is designed to give smaller web companies the tools to build web solution using the latest Microsoft web and design software with no upfront cost. Peter at Swizzle has done a great job of supporting this initiative with a local hosting offer.
Eighty three NZ web design companies have already signed up to WebsiteSpark. Having worked personally with some of the companies like Mcgovern, WebsiteSpark is already showing its potential to be a great program for innovative New Zealanders working on the web.
4. Webstock is an advocate of freedom and web standards. The backstage pass site leverages both Silverlight and Flash – what are your feeling around using plugins and standards based web technologies.
I find technologies like Silverlight and Flash work as a “ready now†cross platform solution to create immersive user experiences. I see standard technologies like HTML5 as “ready soon†technologies that will achieve much of what Silverlight and Flash can do today. I am excited about the prospect of HTML5 and will definitely start using it when browsers, frameworks and tools evolve.
If you take the workit.co.nz backstage pass site as an example. I chose to publish the videos on YouTube for greatest reach and discoverability, this lead to a dependency on Flash that means you needed the plugin installed to watch the videos. The site is fully functional if you don’t have Silverlight installed but if you do have Silverlight it lights up with slicker navigation and an amazing immersive photo mosaic of shots from the Webstock conference connected to the Flickr photo service.
As more web companies support a programmer’s interface to their services the opportunity to enhance experiences on the web continues to develop. It is this future that I glimpse at during the two days of attending Webstock and plan to take back to future projects that I participate in.
Thanks for your time Nigel. We really appreciate the support that you’ve provided Webstock.
We recently caught up with Bron Thomson, founder of Springload.
1) Tell us about Springload. How long have you been around, how did you start, what sort of work do you do?
It’s hard to say when Springload truly started to be honest. I started working on websites waaaay back when the Internet was just a wee young thing in New Zealand, around 1994. Over the years I’ve gathered more and more cool people around me, including my business partner Carl. Springload is the result, with a current team of 20 people dedicated to designing and building websites that have a strong focus on user centred design.
2) If you had to boil down the essence of Spingload’s philosophy or methodology to a few sentences, what would you say?
Love the web! It’s our Springload vision and the philosophy that we work by. We love the web and everything about it – the technology, the design, the interaction. And we want others to love it too. We also love the people that we work with – our team, and our clients, and the extended Springload family.
It is our team that make coming to work each day a joy, and it is our clients that inspire us on each project we work on. So to us, Love the web really sums up pretty much everything about what we do.
3) We noticed there were a number of Springload entries for the ONYAs. What’s been your impression of the ONYAs to date? Are they good for the industry?
Well, it’s a brand new gig, but we’re really very excited about the ONYAs. There aren’t that many awards that recognise and honour websites from a fully rounded perspective; not just the visual design, but also interaction, content, architecture and functionality as well. Web awards should be about the whole package! And we think the ONYA’s are going to be just that.
4) What speakers at Webstock are you personally most looking forward to seeing and why?
Woah, that’s a hard one, am I allowed to say them all? 😉 We’re thrilled to be sponsoring Daniel Burka, and I’m particularly interested in hearing about his Creative Director role at Digg. Others that I’m looking forward to are Scott Thomas and his focus on design and content to capture an audience; Esther Derby to get some management tips; Amy Hoy for some inspiration on avoiding same-same design; and Sebastian Chan for keeping content fresh by analysing users on the fly. Lots to learn!
5) What do you most love about working in the web?
I’ve got one of those strange brains that likes both the logical and the creative as much as each other (I did a maths degree and a music degree). This seems to me to be what the web is all about – the merging of form and function. You can’t have one without the other, and I love the challenge of meshing the two and creating an experience that is so good you almost don’t even know it’s there.
Peter McLennan (@dubdotdash on Twitter) will be providing the sounds at Webstock and we’re really stoked. Webstock’s Ben Lampard caught up with him using the power of the internets and this is what happened.
Well Peter we’re very excited to have you providing the sounds at Webstock this year. Tell us a bit about yourself.
I like chocolate.
Oh, you want more? I discovered Len Lye and punk rock roughly at the same time, as a teenager. I later figured out a lot of Len Lye’s attitudes to art were very punk. I started playing guitar at high school in a band called the Worst. The name was apt. I ended up going to art school and working with film and video, while playing in a band called Hallelujah Picassos, who released two albums, a handful of singles, and played around the country scarring young minds as often as we could. Our approach to playing live was best described as “search and destroy”.
I went on to direct a few music videos for the Picassos too, which led me to work in TV for a while. I’ve also had other gigs as a music journalist, magazine designer, radio DJ, office cleaner, music video shoot runner (I got to drive Shayne Carter round once for a Bike video, we talked about Sly and the Family Stone) and more.
I like chocolate too. You were a member of the Hallelujah Picassos, easily one of the best live bands of the time. For instance, the gig you played in 1994 at the Otago University Student Union still ranks as perhaps the best live performance I’ve ever seen anywhere. Tell us a bit about the band.
We labelled ourselves as the four-headed beast. We all wrote, we all sang, and we all played at 100 miles an hour intensity onstage. We mashed up genres way before it became cool (see Sublime, Rancid) and had a great time playing to folks around the country. Our sound generally got labelled with a barrage of hyphens…. ska-reggae-hiphop-funk-punk. See? I’m proud to say that all my former band mates in the Picassos are still my friends.
What keeps you busy these days?
Currently I DJ on BaseFM and KiwiFM, write a music blog and make music as Dub Asylum.
I’m also writing a book.
Holy cow, and you found time to do this interview. What are some of your current influences and how would you describe your sound for those who haven’t heard you recently?
Oh crap. Seriously? I hate this question. It sucks harder than a vacuum cleaner. Current influences… Rhythm and sound, Lee Scratch Perry, Onra, Public Image Limited, Hypnotic Brass Ensemble, Ragga Twins, Julien Dyne, Carl Craig and ZILLION more… My sound is a mix of reggae, funk and hiphop. That’s the type of music I make as Dub Asylum, and also what I play when I’m DJing. Cept when I’m DJing there is usually some steel drums in there.
Yeah, sorry about that question, I thought it was mandatory when interviewing musician types. Too much Rip It Up as a kid. What 5 songs/albums/artists would you recommend to our readers?
Music by Iggy and the Stooges, Mulatu Astatke, Eric B and Rakim, Kraftwerk and the entire back catalogue of the On-U-Sound record label. Or the entire back catalogue of Daptone Records, home to Ms Sharon Jones and the Dapkings, The Budos Band, The Daktaris, Naomi Shelton and more. This could go on for days….
And it will go on for days at Webstock ladies and gentlemen. Thanks Peter, we look forward to meeting you and hearing some of this stuff next week.
