Planning Your Web Build - The Blueprint for Digital Performance
•Als PPTX, PDF herunterladen•
2 gefällt mir•398 views
By building a planning stage into your web design project, you can integrate keyword research, information architecture, wireframes and a proper, nailed-down brief. It's an investment, but one that provides tangible returns and improved digital performance post-build.
Empfohlen
Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (19)
Andere mochten auch
Andere mochten auch (8)
Ähnlich wie Planning Your Web Build - The Blueprint for Digital Performance
Ähnlich wie Planning Your Web Build - The Blueprint for Digital Performance (20)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
Planning Your Web Build - The Blueprint for Digital Performance
- 1. Creating a Blueprint for Digital Performance ™
- 2. PLANNING: THE WHAT AND THE WHY What is your market saying? Who exactly is your market? What do you want users to do on your website? What functionality do you need to achieve your goals? PLANNING A WEB BUILD
- 3. PLANNING: THE WHAT AND THE WHY Keyword Research User Personas Information Architecture & Wireframes Scope of Work PLANNING A WEB BUILD
- 4. INVESTMENT VS REWARD • Planning = 20% – 25% of web project budget • Sounds like a difficult sell? • Reasoning - What does success look like? - Agree on goals with client - Build structures for users & search engines - Build structures that convert - Avoid scope creep - Give the client confidence
- 5. Client feedback “I really liked the importance placed on the keyword and user research to lay the foundations – makes me confident that the subsequent design and build is going to be well considered and thought through.”
- 6. TOOLS YOU WILL NEED • SEMRush • KeywordTool.io • Google Keyword Planner • Pen & Paper • PowerPoint • Sketch • Marvel App • Your client’s knowledge - Market Research - Conversations - Access to clients
- 7. KEYWORD RESEARCH: I LOVE EXCEL, BUT… • Most clients don’t. • Data should tell a story • Data is not the solution • Don’t over-engineer keyword research - at least, don’t over-engineer to your client - this is a strategic phase, not a tactical one • YOU interpret the data • YOU tell the story • Keyword Research has to mean something to your client • Excel is bad.
- 8. KEYWORD RESEARCH: FIRST STEPS
- 9. KEYWORD RESEARCH - METHODOLOGY
- 10. KEYWORD RESEARCH - METHODOLOGY
- 11. KEYWORD RESEARCH - COMPETITION
- 15. KEYWORD RESEARCH: MINING FOR DATA LOG CABIN(s) Buy Rent Scandinavian Norwegian Wooden Swedish Finnish Luxury Bespoke Buildings Chalets Homes For sale For rent Small Garden Corner Large Homes Kits Plans Garden UK Prices
- 16. KEYWORD RESEARCH: REMEMBER • Don’t over-engineer it • The data is for YOU to interpret, not the client • Listen. Take the brief, mine the data accordingly. • Find more data sources - SEMRush - Keywoordtool.io - Wikipedia page -> SEMRush - Competitors -> SEMRush - AnswerThePublic - Google Keyword Planner • Tell the story • Take it forward…
- 17. INFORMATION ARCHITECTURE – INTENT Log Cabins Type Usage Process • Large • Small • Corner • Norwegian • Finnish • 4-bedroom • Garden • Granny Annex • Home gym • Office • Commercial • Transportable • Building • Buying • Selling • Planning • Caravan Act • Materials Supporting user queries Insulation, How is it built, High maintenance… ?
- 18. INFORMATION ARCHITECTURE - NEEDS WHAT YOU WANT WHAT VISITORS WANT Visit our showroom Call the office Plans Case studies Galleries A log cabin Planning information Lifestyle change Not my idea: http://alistapart.com/article/the-core-model-designing-inside-out-for-better-results
- 20. USER PERSONAS Job Role Typically… Frustrations Motivations A. Person ?
- 21. USER PERSONAS Job Role • Marketing Director or • Head of Marketing • Senior Marketing Manager Typically… • Male, 40 • Using a photo from 5 years ago where he’s less grey • Fussy about grammar Frustrations • Data inaccuracies • Too many software solutions for one problem Motivations • Wants to grow the business • Pleasing clients • A quiet life. Thanks. Gareth When marketing to Gareth, we should focus on accuracy of data and the full solution set, with a focus on business growth. We should never make grammatical errors or we will lose his confidence. And you should know when to leave him alone, so don’t spam his inbox.
- 22. WIREFRAMES Wireframes can be tackled in many different ways but the objectives are the same; to establish the layout of key templates and plan the user journey. TIPS FOR SUCCESSFUL WIREFRAMING: • Wireframe for mobile and desktop • Keep the first iteration lo fi • Build the second iteration in Sketch, using text styles and symbols • Export it to Marvel App to build in the interactions
- 26. SCOPE OF WORK (SOW) • Explain the purpose of the document • List the team members involved • List the project stages • List the services • Outline the standard deliverables • Outline the bespoke deliverables • Specify the timescales and dependencies • Costs and payment schedule • Signature
- 27. SOW STANDARD DELIVERABLES • Integrated with version control for deployment workflows • Device responsive for different screen sizes • Online forms with required fields • CMS training • Post launch support and bug fixing • Browser support* *We will not intentionally support any devices, browsers or operating systems that make up less than 2% of your total visits. Functional in the last two versions of Internet Explorer, Google Chrome (desktop and mobile), Mozilla Firefox, Opera and Apple Safari (desktop and mobile).
- 28. SOW timescales and dependencies
- 29. SOW BESPOKE DELIVERABLES Explain every step and don’t leave anything open to interpretation. A newsletter sign up form: • Is it linked with an API or are the details just emailed to the client? A vacancies area: • What happens if there are no jobs to advertise? • Can users upload a CV? • Is there a form to apply for the job? • If so, does it need to pull through the job reference number?
- 30. SOW Comms strategy It’s important to outline how you’ll be communicating and who will be involved in the communications from both sides. We like to use Basecamp and ensure we have at least a weekly call or Skype.
- 31. SOW cost and hours estimate Include fixed costs and annual costs separately.
- 32. AN INVESTMENT WITH A RETURN Website is aligned with market & keyword research, speaking customer language Website journeys and goals are defined for specific user personas, helping them to find the right content and you to convert them Architecture is future-proof, built around customer journeys and keyword research, resulting in better rankings & engagement Functionality is defined, costs are fixed (not ballpark), and everyone has confidence in design & development stage PLANNING A WEB BUILD
- 33. INVEST UP-FRONT, HAPPIER CLIENTS Improved traffic …because you targeted the right keywords Improved UX ...because you took time to understand users Improved engagement …because you built the architecture around people Happier client …because they have confidence you will deliver PLANNING A WEB BUILD
- 34. A BLUEPRINT FOR DIGITAL PERFORMANCE Got any questions?
Hinweis der Redaktion
- Creating a blueprint for digital performance What we call a planning stage – the fruits of a lot of hard work, banging heads together, but based on a desire to avoid the avoidable errors and build a really solid foundation for our clients. You can’t just launch into building a website without asking yourself some fundamental questions, without drilling into the absolute essentials behind why you’re doing it, what your client wants… It’s an investment, sure, and it’s not what most clients are expecting… but it’s what clients actually need in order for design & development to proceed with confidence, and for the site to succeed in the long term.
- So, those questions. Some fundamental ones… you can’t build a website unless you can answer these.
- These are not the answers, btw. These are the strategies that help you provide the answers. The difficulty, and where many agencies have failed, is that they believe the strategies are the answer. Look, they say, we’ve provided keyword research. Here’s an excel file. We’ve developed some user personas. Can we build yet? We’ve done a wireframe, can we build now? These strategies have to MEAN SOMETHING to the client. If they don’t the client loses confidence. If they don’t, the site won’t succeed.
- Define what success looks like first - Agree on it with the client - Build a structure that works for users & search engines - Build a structure that is future-proof (no bloating) - Build a structure that meets client objectives - Avoid ‘scope creep’ - Enter design & development with confidence that your foundations are evidence-led and data-based Difficult sell? Well yes, if other agencies are pitching web builds at £3k. You have to establish the value. The value here is the confidence & understanding. And you know what, you can do the planning stage and let the client go out to tender with this blueprint. They’ll have KWR, IA, wireframes, a full scope of work… feel free to have it built elsewhere. It’s all about confidence & understanding.
- An email from one of our clients, sent this morning.
- You will need some tools for the keyword research stage. Let’s keep it simple.
- And if we’re keeping it simple… I love excel but clients don’t love excel data dumps Not everyone understands data Not everyone cares Data has to tell a story The biggest problem that we, as agencies, face, is that we don’t let our data tell stories We over engineer what is actually a very strategic phase. We look at data and competition metrics too much, we need to interpret more and make decisions. You can go off and understand keyword competition metrics and get as granular as you like. That’s your job. The data has to mean something to clients – giving them an excel dump of keywords is a mistake
- Talk… And above all, listen. Market research… ask for it. If they don’t have it, demand it. Talk to your client’s customers… or listen to them. E.g. Animas – carried out a lot of consumer research, defined users & interviewed 50 – watched them navigate & their choice of keywords – saw what they wanted to achieve. This insight led to decisions in KWR, architecture, wireframes, even the language we used in the content.
- A few tactics – but not the whole story. We could speak for days on how to deep-dive. Remember, we’re not over-engineering. We’re trying to understand & build a picture. So start at the top & work down. And yes, we use SEMRush & we trust the data more than we trust Google’s data. So we start by looking at the assumptions – let’s say “Log Homes” is what we’ve assumed is our keyword. SEMRush tells us, actually, we’re not right. Log Cabins is by far and away the more popular keyword. And yes, we know from talking to our market that log cabins is also used for holidays.
- Where it gets really powerful is when you can turn to a client and say “you know that competitor, well I know what he ranks for” “I know how much traffic he’s getting” “I also know when these keywords are trending…”
- And I know where you sit in comparison to this competitor – and others… This is where it gets really interesting for clients. You’re putting it into a real-world context – everyone has a competitor. Everyone has goals – and very often, those goals are to outrank someone else. Remember – no sign of excel, no data dumps, just stories. Led by data.
- Diversify your data sets – get different angles Google’s drop-down is visible to everyone Use keywordtool.io or alternatives to find out what the suggestions are - IMPORTANT: remember what is important to the client, not what Google says is important… log cabin breaks is NOT what this client wants. Log Cabins for sale, however…
- Diversify your data sets. Answer The Public gives you questions that people are actually asking. Think blog posts – think Quora – think FAQs – think “low volume, high conversion” keywords that might not register volumes in Google Adwords
- A lot of these questions are rubbish But there are some gems – e.g. what wood for log cabin, are log cabin homes expensive? How much are log cabin modular homes – obviously, price is a driver But when you come to build your editorial calendar with the client, this is a great starting point.
- The process of making this data MEAN SOMETHING to a client… You need pen & paper for this Process, process, process… Build from the trophy outward & look for alternatives Segment intent Build further. Look at Wikipedia’s rankings. Look at competitors. Talk to you client. Talk to their customers. Look at market research. You hold the data. You interpret it. They understand the story.
- Keyword Clouds are easier to interpret for clients They tell the story, and the data is there to back it up It gives you direction & a focus Big keyword down to little keyword Short-tail down to long-tail Product page down to supporting blog post / user guide / campaign content item
- Think about intent. Start to segment your keywords up. Take log homes as an example: You have log homes, small log homes, large log homes – buyer intent is unclear, but they want a log home You have garden rooms, annexes, gyms, offices – buyer intent is different, they know what the log home is for So you have a direction for your architecture
- Not just navigation – but structure of site People don’t come to NAVIGATE through your site, they come to GET SOMETHING DONE (alistapart) Think Intent Think Client Objectives e.g. Animas, go back to your market research, your conversations with customers – WHAT DO THEY WANT TO GET DONE? Keywords are one thing, real-life examples are better Use the keyword research to educate structure of the site Use your knowledge of the customer’s customers to educate structure of the page
- 3 users: those who are new to insulin pumps – switching from injections, those who are out of warranty / coming up to warranty expiry, those who have been living with t1d for many years Architecture designed to influence & support the journey through the site Define the goals – design the architecture to help people get where they want to go & where you want them to go Result: Bounce rate down 30%, time on site up 100%, enquiries up 50%, pages per visit up 100%
- This is important: who are your users? You may want to hold this stage back until you’re doing the IA – once you have the KWR on board. What do you expect them to do on the site? What’s most important to them? Their frustrations? Their needs? What type of content do they want to ‘consume’? If you have market research, if you’ve talked to your client, if you’ve talked to these customers, you can start to fill this in… (and you will have multiple)
- Who are your users? What do you expect them to do on the site? What’s most important to them? Their frustrations? Their needs? What type of content do they want to ‘consume’?
- I’m presuming that everyone knows what a wireframe is, what I want to talk about is how we use them as part of our planning stage. It allows clients to look at the contents of the page without getting hung up on fonts, colours and imagery. It means they have to focus on what’s important, the content and the functionality and where necessary the user journey. Some clients do find this hard, they can take some convincing that their not going to get black and white website. Most have enough imagination though and do value the process.
- Pen & paper - helps keep things fluid and means the designers don’t get caught up in the detail. Specifically we use Dot pads and 0.5 fine liners. The Dot pads are great, it’s like graph paper but just with dots. Straight lines have never been easier. It helps keep things fluid and means the designers don’t get caught up in the detail. it’s up to you whether you share this with the client, we don’t always. Sometimes this is just an internal exercise. If you can’t draw it doesn’t matter, you don’t need to be Da vinci, you will get better the more you do it.
- We’ve learnt that wireframes for desktop are not enough, there is no point in working out the template layouts for desktop without considering the way it adapts for other devices. Even if it is in rough desktop alone is not enough. For this iteration we personally prefer to use SKETCH from Bohemian coding, if you haven’t started using this yet then you definitely need to check it out. When you’ve sussed the symbols and type styles you can make site wide changes really easily. No more multiple photoshop files. Because of the rapid uptake of sketch Adobe are bringing out a competitor next year called Project Comet. If you guys are interested we can hold a separate webinar on sketch best practice. Prototype in Marvel to assess user flow and demonstrate navigation.
- Knowing the user personas and the information architecture means the wireframes become less subjective. This is useful when designing and invaluable when providing a rationale for the client. When you are happy with the wireframes, get them into Marvel App. Marvel App is another game changer, it allows clients to click through designs in a browser and see rollover effects and even transitions. Making prototypes has never been easier.
- Explain the purpose of the document Why do we need a Scope of Work? We know from experience that projects can evolve as they go on. If you’ve done the foundations, you know exactly what the client wants, the client knows exactly what they want, and you can both agree on it. Define the functionality required, list the services & the project stages, define what is deliverable – what is bespoke – and when it can be delivered. THIS is the brief, but YOU have written it with the client’s help. Now everyone has confidence. List the team members involved List the project stages List the services Outline the standard deliverables Outline the bespoke deliverables Specify the timescales and dependencies Costs and payment schedule Signature
- There is a standard level of deliverable that applies to (almost) everyone Make sure the client knows this.
- Use gantt charts to help the client see when things are happening, when things are deliverable, and what’s next This gives them confidence in your ability to deliver on time (that is key btw)
- The more detail the better, written explanations go a long way and can save a lot of time in the long run.
- It’s important to make the client aware of the comms strategy. Who’s the project manager from both sides and who else should be in copy? We’ve used lots of different project management solutions but we can’t fault Basecamp. We’ve settled on it combined with Harvest for time tracking. Which is also amazing. Keeping everything on basecamp means that email threads can be easily followed by all team members. Skype is our preference over phone calls, being able to see someone as your talking to them is priceless. and you can share the files you’re talking about, share screenshots, share screens even…
- The tightest brief possible… Once everything is signed off, you can move on with confidence. The SOW establishes all the functionality you need to meet your objectives The keywords you are targeting The site architecture The layout (wireframes) The people you are targeting The functionality you require to deliver the project The final, nailed-down cost This is all about nailing down the cost & the resources required. Ballparks are useless – if you have defined the scope, you can define an absolute price and avoid scope creep and avoid having to go back and ask your client for extra budget because you didn’t establish the foundations in the first place.