InspirationNews

Report: DIBI 2011

Our round-up of the talks at yesterday's 'Design it Build it' conference

The web came to Newcastle for the day
The web came to Newcastle for the day

The second annual DIBI web conference went ahead in Newcastle/Gateshead yesterday providing attendees with tons of food for thought and practical advice on how to shape the web of the future.

Kicking off proceedings on the Design It track with her talk about The Mechanical Revolution, Inayaili de Len encouraged designers, and CSS authors specfically, to embrace and explore automated production. Unlike developers, designers often shy away from shortcuts and apologise for the use of frameworks or grid systems, she argued.

Simplifying design

However, we need to accept that CSS is moving towards simplification tools such as Nicole Sullivan's Object-oriented CSS, CSS pre-processors such as Sass and LESS as well as frameworks like the 960 Grid System and Blueprint. If we don't want to become obsolete, we need to expand our skillset and at least consider these tools for our projects, rethink our processes and adapt automation to our needs. Doing the same thing twice, after all, is not the best approach.

Mike Kus, meanwhile, lamented the fact that there's a lot of replicated style on the web, as shown by the similarity of www.vodafone.com and www.coca-cola.com. "Visual design is important and key in communicating the personality of a company," he argued. "Don't sideline design as decoration. Think about it from the beginning."

Meaningful design, using colour, imagery and typography, can convey brand attributes such as 'edgy' and 'environmentally conscious'. Kus illustrated his points with a realignment of the Innocent website.

Design for tomorrow

Continuing on the Design It track, Faruk Ates explained that in order to design for tomorrow's web we need to understand its history, know today's emerging technologies and free our minds. A great understanding of HTML, CSS and even JavaScript to a degree is necessary, while we should at least know what all the new technologies such as Web GL and WebSockets do, and explore and play around with them.

"'It has to work in IE7' is the new 'Make the logo bigger'," Ates claimed, and suggested we need to get our minds off browsers and browser versions. We need to think about the content - an overriding theme of the conference - as it's impossible to know, use and test with all the devices available today. It highlights how futile the browser is. We need to step back now and reassess what we're doing.

Web fonts

Over on the Build It track, Jake Archibald of theTeam examined the minefield of difficulties involved in implementing web fonts across all browsers, devices and operating systems. "Welcome to the human centipede," he said. "And we are not at the fun end." Having detailed the countless problems, however, he went on to make practical suggestions for making your fonts render quickly and accurately on users' pages.

Next up, Brad Wright, a web developer at social betting startup Smarkets.com discussed the different ways of achieving real-time interactions with your app - important for the likes of social networks, collaboration sites such as Google Docs, online gaming and live chat. He guided the audience through old-style browser hacks, from JSONP polling through to Flash sockets, as well as modern solutions such as WebSockets and server-side approaches. He also examined ways to make real-time interactions accessible, such as using ARIA live regions to control update speed.

Database with a difference

Dribbble's Rich Thornett gave an insightful talk explaining how the designer's network had experimented with using MongoDB, a document-oriented NoSQL database, for some tasks. Its offering is very different to that of a relational database, he explained (for instance, it doesn't use joins), yet it can be a powerful complement to one in areas such as logging, analytics and caching. "If you think data structure flexibility will help your app, then MongoDB may be worth investigating," he said.

After lunch, Corey Donohoe revealed the metrics driven approach that Github uses to analyse its performance and growth. He rattled through a menagerie of tools Github is using to generate metrics and how it combines them to respond quickly to changes. The audience also heard about the philosophy of Github and how it's helping to bring developers together and encourage faster and more creative collaboration.

Getting git

Continuing the git theme, PHP consultant Lorna Mitchell followed Donohoe by comparing a distributed approach to source control to more traditional centralised approaches. Mitchell walked the audience through the latest tools, and also looked at the influence of collaboration sites on development projects.

Finally, Blane Cook, previously lead developer for Twitter, explored the explosion in social networks and the effect this has had on the internet and society as a whole. He then went on to examine the developers have to play in helping to enrich people’s lives by enabling them communicate and share their life experiences, in ways that respects privacy and encourages creativity.

Into the unknown

Meanwhile on the Design track, Jeremy Keith examined how the explosion in smartphones and tablets now mean we are designing for what Donald Rumsfield called "unknown unknowns" - and why this is a good thing. It’s always been impossible to ensure your pages look the same on every device and browser, he said, but the rise of mobile devices has thrown this into sharp relief. Now we simply cannot know the network speed, capability or screen size of the device our users are consuming our content on and we need to design for flexibility rather than trying to impose control.

Responsive design means much more than just using media queries: it's a whole philosophy of approach. Luke Wroblewski's idea of "mobile first" is a good one, he said, but it could be equally useful to think about "print style sheets first" - "Fundamentally, it's about content first." Where websites fail to follow this, such as in overcomplex newspaper sites, others have stepped in with alternatives such as Instapaper and Readability. But while it's difficult to achieve responsive design, it is possible. "We can do this," he concluded. "We can keep having one web."

Be intuitive

Usability guru Jared Spool hit the stage next, to explain how you can make your designs intuitive. An intuitive design means the user is focused on their objective and so the design itself is invisible to them. (He conceded that this makes it difficult to put together a portfoilo!)

It's of key importance to consider the gap between the user's knowledge and the knowledge needed to complete tasks on the site, Spool argued. When a site is first launched, that gap is usually quite small, as the site will be be simple, efficient and focused. Later, though, new features usually get added, making the knowledge gap wider and the site less intuitive.

The next stage in the cycle is to pare down features and concentrate more on user experience. Some site owners, however, will never reach this stage, and leave their product open to competition from a newer, more intuitive rival, such as when the cluttered AltaVista homepage was challenged by the minimalist upstart Google.

Finally, Spool emphasised the need for testing. He recommended using field testing, usability tests, paper prototypes and the "five second test", where you show people a page for five seconds and then ask them to write down what they remember about it.

Figuring it out

"We're in such a new industry, we haven't standardised anything yet," said standards guru Jeffrey Zeldman, the final speaker of the day. "We're still figuring it out. And that's probably a good thing." The upshot is that we have to learn new skills and open ourselves up to new possibilities. A few years ago, if you went to a web conference, you'd hear about graphic design or CSS, and that would be it. Now we're discussing things like content strategy and UX, and expanding our horizons of what a web designer is: "A certain type of holistic thinking is taking root in our community."

Zeldman also courted controversy by suggesting that "Real web designers write code. Always have, always will. Semantic markup is a fundamental job skill." He later clarified this by adding that people who work, for instance, as UX designers don't necessarily need to learn advanced coding; they should, however, understand the basic concepts of markup and what it does "so you don't mess up the CMS". The best way for a beginner to do that would be to find a book that looks like a fun read, such as Jeremy Keith's HTML5 for Web Designers.

Like the other speakers, he was enthusiastic about the potential of responsive web design, which he called the "next generation of progressive design". The proliferation of devices had breathed new life into web design, he argued. "I think mobile is going to save us," he concluded, "by making us focus once again on what the user wants to do".

Subscription offer

Log in with your Creative Bloq account

site stat collection