Rebuilding From The Ground Up

Transcription

1 Rebuilding From The Ground Up Garrett Coakley Head of Online Whale and Dolphin Conservation Hello This is the story of what we ve been doing at the WDCS for the past 2 1/2 years, namely completely rebuilding our web presence. What led us to that decision, how we approached it, and Drupal s role in it

2 Hello World We re an international organisation located in 6 countries. Head office in Chippenham, Dolphin centre in Spey Bay, scientists in the US, Argentina, and campaign staff in Germany

3 The user is going to have an experience on your site, whether it's good or not is up to you So, what were the issues? 7 years old Custom CMS, fragmentation, sprawl

4 Multiple designs Multiple designs Duplicate content Wide *and* deep structure.

5 Multiple designs

6 Multiple sites Separate sites for other languages. Left behind on design.

7 Multiple sites This can cause a second class experience

8 Multiple sites External blogs Silo d from the main site and each other.

9 Multiple sites Duplicate content (German team translating Charlie s posts) No overview of activities

10 Multiple sites Species guide, incredibly highly trafficked part of the site. Stuck in 970x480 fixed dimension div. Overflow: scroll Broken on small screens.

11 The user is going to have an experience on your site, whether it's good or not is up to you What to do about the mess? Knew we had a custom CMS with no ongoing development Tried to do a content audit, gave up. Not a good use of my time. We made the decision to raze it to the ground, save the historical content (blogs/news), trash everything else. Where to start?

12 Staff workshops 13 workshops over 9 weeks. Trips to Scotland and Germany. Question: Imagine the most amazing WDCS website you can Post-up and Affinity map exercises Gamestorming

13 Results It was apparent early on that many departments had aligned needs but it took someone with an outside view to see the common threads

14 Results This is from the combined notes of all the workshops. A common theme expressed by all participants was that it was too difficult to find resources in the current site, even for those members of staff that had been using it for a while. Useful content was frequently lost or misplaced. It was also failing to communicate our core principles and mission. Another theme was the lack of editorial control teams had over their content and the difficulty in keeping things up to date, not due to human factors, but instead the lack of tools and workflows. So that was the staff, what about the general public?

15 "Who are you to your customers? What do you do for them? How can you embody that digitally and provide that service or information wherever they might need it?" Josh Clark An important question, who are they? Animal lovers, Enthusiastic amateurs, Conservationists, Students, Science professionals, Policy makers, Other organisations How to appeal to everyone? Is it even possible?

16 Who are our supporters? We decided to phase development: Phase 1, existing supporters. If we get it right for them there s a good chance will get it right for the wider audience. Later phases will address other audience facets.

17 Research I had a rough idea in my head of what the new site had to do, I think it s important to have a vision. We set up card sorts in Optimal Sort and also ran some user surveys to see if my ideas were sound. While it s important to have a vision it s also important to be willing to be proved wrong.

18 Results The results showed a tendency towards a very narrow but deep picture of the organisation with a number of common clusters, namely: The work of the WDCS, About the WDCS, How people can get involved The responses from the feedback form identified similar issues to the ones from the staff workshops; that the site was difficult to navigate, too busy, it was also failing to communicate our core principles and mission. Why people should support us. Where organisation needs align with supporter needs that's a good thing, but where they're different the supporters win (GDS design principle number 1 - Start with needs. User needs not government needs)

19 Great content meets users needs and supports key business objectives. It engages and informs. It s well-written and intuitively organized. It keeps people coming back for more. Kristina Halvorson (@halvorson) Content Strategy for the Web For us the content revolves around the core narrative of the site. Issues, Our Work, Get involved. It s not just about money, although that s a big part of it, it s about creating ambassadors, informed participants. We need to structure our content. This is a mobile first, content out strategy.

20 Structured content What do we mean by structured content. Distinct, reusable elements. Canonical pieces, address the redundancy issue. Know that if you change something in one place, it will update everywhere. We should build networks of content, not of pages. Design is now the relationship between individual components, not rigid pages. - Ethan Marcotte Enter Drupal

21 Structured content A content type is made of fields, some fields are common, some are unique to a content type. control what goes into those fields. I set strict limits on the contents of fields. Synopsis has no formatting. If it isn t clear without bold or italics, rewrite it.

22 Structured content Synopsis: wrap up the issue in a paragraph Talking points: The elevator pitch. limited to 5 items From those two sections you should have enough info to decide if you want to help, or have a discussion in the pub, or around a dinner table with your friends. Deeper into the page supporting content So now we have confidence in the content, how do we package it? Going back to Josh Clark s quote, how can you provide your service or information where ever people need it.

23 Think of your core content as a fluid thing that gets poured into a huge number of containers. Get your content ready to go anywhere because it s going to go everywhere. Brad Frost (@brad_frost) Over 200 unique screen sizes and resolutions, and more to come. Progressive Enhancement, responsive design

24 Responsive design Why responsive design? It s not a fad. It s a legitimate attempt to address the massive challenge of delivering great experiences to this explosion of devices and browsers - Brad Frost It s not a silver bullet either, it s early days, but you should understand the techniques, have this in your toolkit. Responsive Web Design by Ethan Marcotte, Adaptive Web Design by Aaron Gustafson - buy them.

25 Responsive design I hadn t tested for this, but it worked. there s some flakyness with the logo, but nothing major, it just works.

26 Responsive design This is in a pub. You can do some great guerrilla testing in a pub.

27 Responsive design Don t think of linearising your content. Start with the small-screen/mobile context and then expand on that. "The abscence of support queries is in fact the query" - Bryan Rieger

28 In short, we should strive to create and present content in ways that respect the fact that even when they re using the web, people need to pee. Erin Kissane The Elements of Content Strategy What Erin is referring to here is that we re all still primates, biological entities, we have to make allowances for the hundreds of disabilities and interruptions that plague our lives. Don t think mobile vs desktop. Think more about context, what do people want to do. I use my iphone more sitting on the couch than I do when I m out and about.

29 Questions? Questions?