I was at the first event run by the amiable Keir and Glenn under the banner of Workshops for Web People in Leicester last week, featuring Andy Clarke‘s follow-on presentation for his Transcending CSS book. A well done to both the lads and Andy for putting on a great day and keeping everyone entertained and full of food and drink.
Andy spent some time looking at CSS3 and where certain aspects of it can be used right now. One feature is that of media queries. These are a series of features such as width, height, aspect-ratio and resolution with min- or max- prefixes, which enable the serving of css tailored to specific devices. Andy showed and example where a media query could be used to serve up a separate layout for mobile devices - specifically his iPhone.
Inspired by this demo I decided to reproduce that on this site. My aim was for anyone viewing on a supporting browser to be served up an additional set of styles if their browser-window’s size would normally have given them scrollbars. In practice this meant adding the following code to my main css file where I import my other files:
@import "/assets/reset.css";
@import "/assets/screen.css";
@media all and (max-width: 800px){
...additional styles…
}
This translates as “when the device supports media all and is no wider than 800px, use these rules”. You can try this with Safari (I’ve tested on Safari 3) and Opera (tested on 9.24) , though not Firefox, by resizing you browser to under 800px and hitting refresh. The refresh is required to activate the stylesheets, so it is not as robust a solution as one of the javascript options for this particular use, but it does provide an insight into how powerful CSS3 could be if we could get it out of the gate. The obvious applications are for mobile devices - especially those which don’t identify themselves as handheld, so by-pass the normal for-mobile styles.
Note that trying to add this rule in a <link.. /> tag doesn’t seem to work as it gets applied by Firefox even when not matching the rules, it seems in that state the browser ignores the bit of the rule it doesn’t understand, proceeding to implement the bits it does.
Posted: Sun 18 Nov 2007 ~ filed under Standards ;Talks ;
I came away from FOWD with mixed feelings. One the one hand it was pretty different from what I had envisaged as a practical “design” focussed event (grids, typography etc), being more a mix of case studies of marketing/web firms projects (games and fashion sites), broad strokes of how to engage with your users and some more specific design threads about language and workflow.
Overall, whilst very enjoyable it came across as a bit confused as to its aim, probably not helped by my internal assumptions tying to it last year’s Carson Summit. Despite that, all the presentations were engaging and well delivered and as always the organisation was flawless, so congrats to all involved. Even the sponsors contributions were more than the normal out-of-sight variety - Microsoft’s crash-out zone with bean-bags, XBox360s and live feed from the stage and Adobe’s provision of the after-event drinks.
For me the highlights were:
Lots to think about. More photos on Flickr
Posted: Mon 23 Apr 2007 ~ filed under Talks ;
By far the most interesting aspect of the recent Future of Web Design conference was the last thing to be said. The final panel was opened up to the floor and a question was put forward regarding the future of education in web design in face of the amazing pace of new developments in the field. Andy Clarke‘s reply was that if educational institutions cannot keep pace with developments then “perhaps we should see the death of institutionalised education” in web design.
The spontaneous applause which this got from the floor indicates the understanding of how far behind schools, colleges and even some universities are when compared to best industry practice. I can’t help but agree, but I know it will never happen.
As long as there are people wanting to learn web design there will be educators trying to deliver it, especially with changes to funding models in the UK making every place on a course important. The problem I can see is one of hard-pressed teachers trying to fit a technical and pretty abstract subject into a small slot in the timetable. Of course the easiest thing is to go for the easy win and get the kids using a tool like Dreamweaver or FrontPage to knock something up quickly with no thought of the code behind the scenes. At least that way they have something to stick in a portfolio at the end of the day. And lets not forget that most web design courses come under the auspices of the IT department, when to get the results we aspire to it should be a joint venture between IT, Art and even Humanities.
Teachers who commonly get landed with delivering a web design course typically are ill-equipped to do so at a level which will give their students an insight into the real work going on in the industry. Maybe this is where the industry should step in to help. We could produce lesson plans with accompanying teacher notes suitable for different lengths of course, just as they are available for other subjects. These could be updated with new technologies and changes to standards as unlike most subjects our industry is a fast-paced one which even full-time professionals sometimes have a hard time keeping up with, let alone hard-pressed teaching staff. We could produce some outstanding sample sites which could be broken down into their component parts complete with notes for use as teaching aids. We could even come up with a network of web design firms who would be open to have student placements or come into class for a guest speaker session. I’m sure that with a little effort the firms which put a bit of effort in could end up with an endless supply of new talent from these sources.
Of course it can’t be all one-way. We need the teachers to let us in. Just as we recognise their abilities when it comes to communicating an idea to young minds, they need to see that accepting help from us is not a threat to their teaching skills. It needs to be a partnership else we risk continuing on our current insane course where teachers are delivering outmoded classes to students who won’t know any different until they’re in the industry - if they ever make it that far.
Posted: Mon 23 Apr 2007 ~ filed under Standards ;Talks ;
Thursday (5th April) was the first (hopefully annual) Highland Fling. It is really good to see an event in the top half of the country - even if it did mean a 5am start to get up there in time! Fortunately I was on the train with fellow Highland Fling-ers Gareth and Mark who prevented me from falling asleep and missing my stop. A short walk to the Symposium Hall in the Royal College of Surgeons gave us a quick glimpse of Edinburgh before the conference started.
Alan had managed to gather an impressive group of speakers for the inaugrual Fling, with Jeremy Keith kicking off events with an introduction to the concepts of progressive enhancement (via chair design and the zx81). All the speakers managed to pitch their slots at the right level, with not too much in the way of coding tutorials but lots of useful debate and theoreticals. Andy Budd in particular gave a great presentation on CSS3 and why it is taking so long for the next recommendation (CSS2.1) to get out of the draft phase.
Mark Norman Francis covered how Yahoo uses graded browser support, despite suffering from a cold; Christian Heilmann and James Edwards covered Javascript and Ajax from 2 slightly opposing viewpoints - both compelling arguments; Drew McLellan ran through microformats and the potential use as an API; and Andy Clarke finished off with a talk about the future including a reveal of the new Stuff and Nonsense design.
Whislt lunch wasn’t provided, the location of the conference meant there were plenty of places to grab some good food - I can now recommend Black Medicine Coffee Co. which had great smoothies and free wifi. Coffee and biscuits were put on in both breaks and Alan even managed to provide some excellent swag! As usual all the speakers excelled and both they and Alan should be congratulated on a great day out which was fantastic value for money. More photos on Flickr
Here’s to next year!
Posted: Sat 7 Apr 2007 ~ filed under Talks ;
Ryan Carson must be one of the busiest guys on the web. In addition to currently selling off DropSend , launching Hey Amigo and running Vitamin and Carson Workshops, he has taken the Future of Web Apps conference from London into the States. Now he’s expanding his events portfolio to include the recently announced Future of Web Design. How I wish he’d launched that before I’d spent my conference budget for the year!
From the looks of it, the new event will cater for the more UI-centred aspect of web development of typography, layouts and branding (I think I can guess a few of the speakers already), as opposed to the more wide-ranging Apps conference. This is great as the design-type sessions at atmedia this year were heavily attended and showed that there is definitely a demand for this.
We’ve gone from having no large web conferences in the UK to having atmedia, dconstruct and the Future of ... in the space of a couple of years. It’s going to get to the point where I either can’t make them all or have to self-fund my way around. It’s a nice problem to have.
Anyway, if you think you can make it to London in April, go and sign up, registration fr FoWD opens 18th January. If it is anything like last year’s FoWA or if the line-up is a strong as the upcoming one it should be a cracking day.
UPDATE: Unfortunately I’ll be missing this year’s FoWA conference as I’ll be out the country, but I definitely be looking forward to FoWD.
Posted: Tue 19 Dec 2006 ~ filed under Talks ;
I think Patrick has put himself in a bit of a tight spot. Looking at my bookshelf I can see at least 6 books authored by people who presented this year. Making next year's conference as good as this year's is going to be a real challenge.
It was really great to see some familiar faces among the crowd and get to meet a bunch of new ones. The conference was split along two tracks which caused a good few people to wish they could split themselves in half and it meant some really tough decisions - how do you decide between Andy Clarke and Tantek?
Anyway here are my best bits:
The WCAG panel encouraging people to actually read the 2.0 draft before making their mind up (and finding out about the quick references they've just put out); though most people agreed having Joe Clark there would have made it more of a debate.
Jeff Veen's 'Next Generation of Web Apps' presentation was the highlight of the whole conference and a great way to finish off day 1. I've always wanted to see Jeff speak as it was his book which gave me a huge leg-up in web design and he didn't disappoint, giving an inspiring look at the state of the industry, how far we've come and where we might be going next.
The social calendar sprang back into action with Patrick managing to convince the bar to open up for football and after a win and a few drinks it was down to the Texas Embassy for food with Gareth and Olly.
Dan Cederholm kicked of day 2 with a look into making sites bulletproof with examples from his Cork'd site and re-energised everyone after the excesses of the night before.
Cameron Moll told us how to look towards providing content to mobile devices and gave everyone some really useful tips to go away with. Yahoo!'s Nate Koechley's look at how they implemented standards into 3 of their upcoming products shows us how far the community has come in the past couple of years. Chatting to him afterwards about microformats and social tagging, he came across as a really nice guy.
Speaking of microformats, Tantek Celik enthused the whole lot of us with a run-down of what they are and the potential of them - along with examples of them out in the wild.
The final session was a great light-hearted 'hot topics' panel most ably hosted by Jeremy Keith - a great way to round of the day, followed by beer in the pub (CJ - are you going to start importing UK beer to Canada?).
What I noticed this year was a move towards more strategic thinking rather than nuts and bolts stuff. Also the presentations were without an exception amazing - from the crafted slides to the practiced speakers - coupled with a great venue this was a top class event. Congrats to Patrick and here's to @media 2007.
Posted: Mon 19 Jun 2006 ~ filed under Standards ;Talks ;
Molly Holzschlag and Andy Clarke gave a talk last night at the North East Usability and Accessibility Group at Northumbria University, entitled “Standards and the Design of Usable Sites”. Congrats to Tom and the University team for putting on a good event - with wine and nibbles too!
Molly opened the show with a run-down of the history of standards on the web. It’s amazing how far the web has come in such a short time and having hand-coded many a table-based page in the early days, I don’t think I could ever go back to coding that way - in fact I think it would take me quite a while to remember all the tricks we used to have to employ to get the pages to work in the browsers of the day. She did a great overview of modern web standards and the Layer Cake way of coding - structure, content, presentation, behaviour - though every time she used the term, the film kept jumping into my head.
An interesting thing to which Molly alluded was that even if the IE team got the browser up to spec. with all standards/recommendations, then they still have to ensure it plays nicely with Windows Vista and this requirement would overrule any standards in the case of conflict. Personally this is not something I’d even thought about having an impact on the development of IE. I could understand (to an extent) them not wanting to break all their big client’s sites, but this adds another dimension. I can’t imagine all the pressure the IE team are getting from all sides in the run-up to the launch of IE7.
Molly also mentioned the use of microformats and their potential for the future of the web. After hearing them talked about at the Carson Summit they are something I’ll be taking more notice of.
Andy’s talk focussed on the extent of user experience on the web. He illustrated the old way of doing things when trying to provide accessible content to as many people as possible - Betsie on the BBC and http://www.amazon.com/access. His point was that these methods may provide the main content of the full version but provide none of the user experience which is available on the ‘full’ version.
He then ran through the design of elements of Karova store and how they employed ‘Tesco testing’ to get some eye-opening usability data - in this case the difference in how men and women process on-scren layouts.
Molly and Andy are great public speakers and a big thanks to them for making the effort to come to Newcastle.
Posted: Thu 16 Feb 2006 ~ filed under Talks ;
After the Carson Summit I had a spare day before ClearLeft/Jeremy Keith’s Ajax workshop. This meant I had time do give my brain some downtime before ramming it full of more web knowledge again.
Jeremy and the ClearLeft crew did a great job putting the event on, from greeting the attendees in the hotel lobby to providing an ad hoc wireless network.
The morning was pimarily taken up with a review of Javascript syntax and an overview of DOM scipting and the Ajax proper started after lunch. The morning’s tutoring was definitely worth it though as Ajax relies on this to perform. Jeremy is a great speaker and managed to explain the ins and outs of Ajax in a way which cause a lightbulb to go on in my head at least a couple of times. As anyone who has seen him speak before or has read his book will know, he is a great advocate of unobtrusive scripting, using hooks in the code to tie in your javascript. He applies the same sort of graceful degredation to his Ajax coding.
His approach is to code the application so it works as a traditional page with the page refreshes that entails. Then add in the Ajax to ‘Hijax’ the page, diverting the call to the Ajax code if the client browser supports it. This relies on the server-side architecture being coded in a modular way. What this means is that you can target the server-side code for a particular module within a page. This may require some change of coding methodology, but it will mean you only have to code it once for both standard calls and Ajax calls.
Posted: Tue 14 Feb 2006 ~ filed under Talks ;
Greater Expectations - Reality-Checking the AJAX Web Application Architecture
Steffen spends quite a bit of time beating up the javascript syntax and web programming in general. However he does come down on the side of Ajax (despite its name) in that it removes the requirement for a server-side session state for transient sessions.
He cheers up a little towards the end saying javascript has been compared to Lisp with C syntax. I get the distinct impression that he was speaking from a hardcore programmer's point of view, but unfortunately this made a lot of what he was saying difficult to understand for many of the mere web programmers out there.
I'd love to see that 1-to-1 virtual reality model of the entire world.
Posted: Mon 13 Feb 2006 ~ filed under Talks ;
How to Build an Enterprise Web App on a Budget
This was a great talk and made my top spot on the feedback. No-one ever talks about this kind of detail in the frank was that Ryan did.
You don't have to be big anymore. Web applications are much more acceptable to people than they were a few years ago. Combine this with the plummeting cost of hardware and availability of Open Source software and OS.
Ryan defines enterprise as mass market or 1,000+ users.
He says that the minimum cost for an enterprise web app is £30,000. you should make sure that the idea is financially viable ie that it is worth paying for. use your common sense - would you pay for it? be cautious about your projections - get a pessimistic guess and then cut by 45%. Are you still in business? Then go ahead, oh, and make sure you plann for profit from the start.
DropSend is a hardware intensive application so some of the following figures would need adjusting for other apps.
| Item | Cost |
|---|---|
| Branding and UI design | Ryan Shelton Mutado.com £5,000 |
| Development | Plum Digital Media £8,500 + equity |
| Desktop Apps | £2,750 |
| XHTML/CSS | £1,600 |
| Hardware | Old Linux box for dev testing £500 |
| Hosting and maintenance | 5 Servers from BitPusher £800 pcm |
| Legal | £2,630 |
| Accounting | £500 |
| Linux Specialist | £500 |
| Misc | £1,950 |
| Trademark | £250 |
| Merchant Account | Halifax £200 |
| Payment Processor | Secure Trading £500 |
| Total | £25,680 |
And that only includes one month of hosting.
To help with raising this capital Ryan ran a side business - Carson Workshops - but it still took a year to raise the necessary.
Go for quiet talent rather than rock-stars. Big names cost and are generally busy busy.
Offer a percentage of product equity (2-5%) which becomes bankable if the product is aquired.
Ask for recommendations - getting the wrong person can be disasterous. or you can always outsource - Ryan tried India but it didn't work out for him, largely due to the distances involved.
Buy just enough hardware to launch, but build your app so it easily scales - can you easily plug in disk space? Don't get tempted by lots of shiny new servers.
Plan for scalability but don't obsess about it.
You will go 10% over budget and 3 months over schedule. Plan for it at the outset and put it in the cash flow. Are you still in business?
Make use of those free 1 hour consultations!
Company terms of service will cost £1,000; contracts for freelancers £800; privacy policy (from Clickdocs) £15.
DropSend was developed primarily with cheap/free software from start to finish.
Don't spend money! Use blogs and word of mouth. Look for viral delivery tools - make your app tell other people about your app (eg DropSend sends email notifications and includes info on itself). Write about your app for the trade magazine of your target audience - they will generally be happy to accept it.
You need a seriously good reason to give away some of your company to v.c.
Posted: Mon 13 Feb 2006 ~ filed under Talks ;
10 Reasons Why You Need to Build an API
Shaun gives us his list of goodness you get from APIs
APIs obscure the storage format and the retreival process.
Posted: Mon 13 Feb 2006 ~ filed under Talks ;
Happy Programming and Sustainable Productivity with Ruby on Rails
Having had a cursory look at Rails I can see where this talk is heading from the outset. It is centred around 'convention over configuration' and the basic premise seems to be that most of the work done by web programmers is mundane and is repeated again and again - 'You are not a snowflake'. Shouldn't you then concentrate on what makes you unique in coding terms and let the framework do all the heavy lifting?
To demonstrate this he shows us some code in Rails and proceeds to remove everything which confers some sort of pattern, from naming fields in tables to setting defaults. This leaves a much slimmed down code example. If we make the configuration the exception rather than the norm we can write slimmer, more beautiful code.
Flexibility is overrated - it leads to more complex systems which are harder to modify; constraints are liberating and lead to consistent systems and happier teams.
He then moves into Rails proper and demonstrates how it encourages good practice, for example by incorporating test pages into the cycle; "You do know testing is good, don't you?" Compare this to PHP (David developed in PHP for 5 years) where the devil on the other shoulder tends to get heard: "You can test it at the end", "No-one else needs to know how this algorithm works - it makes you a more valuable employee!".
Posted: Mon 13 Feb 2006 ~ filed under Talks ;
Designing Web 2.0-native Products for Fun and Profit
Tom looks at some guidelines for building web apps in the spirit of Web 2.0 and it was all good stuff. His main thrust was that the web has the opportunity to move from isolated sites to a model based on interconnected services.
Every service can be built upon existing services and this makes them all the more powerful. This all incorporates the use of APIs of course which has the effect of embedding your service within the community. An interesting point was that the combination of GoogleMaps and GoogleAds could enable everyone's favourite search engine to target their advertising geographically. This ties into Tim o'Reilly's assertion that the race is one to 'own' certain types of data - eg location, identity, calendaring of public events. It is these services which will form the basis of the web as a platform.
He then went on to identify the 'Architectural Principles' of Web 2.0, citing Matt Biddulph's 'The Application of Weblike Design to Data'
Posted: Mon 13 Feb 2006 ~ filed under Talks ;
Building Flickr
Cal looks at 10 things which he sees as being instrumental to Web 2.0 from the point of view of Flickr.
Posted: Mon 13 Feb 2006 ~ filed under Talks ;
Things we've learned.
The first talk of the day was a great one and set the tone for the rest of the day. Joshua gave us 45 minutes chock-full of useful information on how to get the most out your servers (from using a proxy to throttle performance, to server caching); building an API (the main point being make it easy for people to get in and out of it by using a simple solution such as XML and not requiring an API key); and URL-rewriting.
URL beautification became a common theme throughout the day as several of the talks urged for simple URLs. Joshua's reasoning was that they are the main marketing push for your site as they are copied and pasted everywhere.
Other points
Tagging was one of the most useful things Joshua discussed as it is something I'm looking at for a couple of projects. Interestingly del.icio.us was built out of a txt file based system Joshua had for bookmarking websites, which eventually distilled his descriptions down into one-word meaningful 'tags'. He urged people not to be tempted to auto-add tags for users as this removes the attention required to give meaningful tags - the transaction cost of having to add tags each time makes the tag system stronger (although don't overdo this cost). I'm glad he spoke against a forced vocab list for tags. His reasoning was that a tag will mean different things to different people and there is no way you can add a 'description' to each tag.
He said make sure you measure useage of features over a period of time - if they are still using the feature long after it launched then it is a success. When testing for usability, don't give people tasks or goals as it makes them act totally different to how they would normally - they start reading everything on the screen.
For marketing he said they didn't really do any - most of it was evangalising users and he points out that del.icio.us isn't a community site, the community exists outside on AIM and email and other communication methods. Del.icio.us doesn't own the community (along with all the pitfalls of hosting such a community).
Posted: Mon 13 Feb 2006 ~ filed under Talks ;
You're reading my personal blog.
A web developer living and working in County Durham.