So far in our content strategy, we’ve covered everything from information architecture to mind reading. And now we’re going to use the top-level information architecture we developed for our client, and we’re going to dramatically expand it. And we’ll do it in six sections, one for each major part of the site: homepage, portfolio (this is the showcase for their work), process (this is the process they go through with each client), a page for their team, and of course the contact page. And then we’ll go back to the homepage again.
Homepage, first time, let’s look at our user story, and again, we want to show great design. So, front and center, we want great design. On its own, a photo of a great interior design isn’t always clear; on its own, it’s just a photo, so we also want to say what they do. We make homes look beautiful. We can adjust the language later if we want, but that’s a good start. That’s our first top-level heading, an H1, the most important heading on the page. And let’s get more specific so we can reinforce and build trust and authority. Since 2009 our interior design firm, we’re saying what they are, has worked with over 150 homeowners on projects in the San Francisco Bay Area. So, in the first heading and the subheading, we’re saying in clear terms what they do, how long they’ve been doing it, what they are, how much experience they have, who they work with, and where they work with them. Again, the goal of the site is to get clients to reach out. So on the homepage right under the major heading and the subheading, let’s include a button to get in touch, schedule a consultation, reach out to our team maybe, get in touch, or even, let’s chat. Any of these can work. That’s going to get them, the main button will take them to the contact page. The goal of the site is to get clients to reach out, and we’ve done that right here. But if we have an image of great design, we describe this stuff, and we have a button that basically says “commit to us.” Sometimes that may be too direct too early in the game. That’s okay. We can use what John calls an escape hatch, a second button.
Let’s go back to our user story. The user wants to pick the design firm with confidence, but to do that, they need to see great, beautiful work. And for our escape hatch, we want to add a second button, especially if they’re not ready to reach out yet. Explore our portfolio, or even see our work. Now, this could be enough for the homepage, but because we’re thinking about our client’s client, the people visiting this site on the web, we want to use mind reading. Remember if we anticipate questions and concerns we can preemptively address them. Let’s do that here by adding another part to the homepage, testimonials. One idea would be to have a list, one quote after another. But, interior design is often communicated best through imagery, so what if we combine the two? We can show a handful of client projects that Hayes Valley Interior Design has worked on and combine that, we can combine the images of these projects with quotes from the homeowners about each project. So, the homepage, is that it? For now, yes. We might come back to this, in fact a lot of people recommend doing the homepage last so it more accurately represents the entirety, the scope of the whole site.
Let’s talk portfolio, their body of work. Let’s do a major heading, we can always change this later, but for now, let's do explore our work or explore our design work. And we can add a subheading, take a look at some of the recent interior design projects we’ve completed in the San Francisco Bay Area and then we can list out the projects. We could put this all on one page, but Rebecca is sending us a ton of examples. She’s sending us nine different client projects they worked on and there’s a lot there. So what if on the portfolio page, we link out to separate pages for each client project? On the portfolio page we can add a photo from the project, the name of the project, and a blurb underneath, but then we link out to nine different pages, one for each link on the portfolio page. This might sound like a lot. But, our CMS is going to do all the heavy lifting for us. And on the project pages, the pages that talk about each project they’ve worked on, we’ll add a big image of that work, a heading, an H1 for the name of the project, any notes or details Rebecca and her team have about the project, and some really important details we can show on each page. Location of the project, the date the work was completed, maybe even the team members involved. And this is a lot of info, but we’re going to go through each step of this because this information adds a ton of value. This is what they’re paying us for, and we’re considering all the details now and keeping it extremely organized so the design process is straightforward. Finally, on the project page, we can show that testimonial, that quote from each of the clients. And then other images, photos of the interiors they worked on, and that’s a ton of really valuable content. And we’re not going to invent all of it ourselves. Most of this information we can get from Rebecca, so we’ll be communicating with her via email to get this all organized. So, portfolio, a top-level page that links out to each of the projects they want to feature. And each of those projects has its own page. Each of those pages has details about the project and beautiful images of each renovation or new home build they worked on.
Let’s move on to our process, and this one kind of solves itself. Our H1, our main heading, can introduce what the page is all about. The subheading can expand on that a bit. And we’ll do four simple sections on this page, one for each of the four steps Rebecca described. Each of these steps has a heading, and a paragraph describing each step. Okay, that’s process.
Next up is team members. Rebecca wants us to feature six of them, and we’re going to follow a similar structure to the portfolio page. We can have our H1, and we can have a subheading, but we’re going to feature each team member with a picture of their face, their name, and their job title. If they’re a designer, or a project manager, or the president of the design firm. And each of those is going to link out to a bio page, a unique page for each team member. On each of those pages, we’ll have the following: the image of their face because why not, their name is going to be the major heading, the H1, their title, and their biography. This can be written in paragraphs and provided to us by Rebecca and her team, but here’s where our information architecture becomes magical, because here’s what we can do. Under the biography, each team member can have automatically listed the projects they’ve worked on. So right from the bio pages we can link to the specific project page that this specific designer worked on, but that’s not all. Let’s go even further. Imagine you're visiting the site and you're reading different bios. If you’ve ever been on a page like this, you know how frustrating it can be to repeatedly hit the back button. Instead, let’s also list out their colleagues. But that’s it for team members. We have the main team members page, and that links out to specific pages for each team member.
Okay, next, we have the contact page. A heading, a subheading, and we want a contact form, and we want to ask for details: name, email, phone number, an optional message, a submit button. And we want to give people another way to get in touch, this can be address, phone number, and here’s a big one, hours of operation. When do they open? When do they close? But let's go back to the subheading here. This is another one of those lightbulb moments, or at least it was for us when we were in pre production on this course. John was talking about visitor anticipation, or mind control, and he brought up this point. So many forms out there are willing to ask us for this information, but very few of them tell you what they're going to do with this information, what happens next. So if you’re interested in talking to us about a potential design project, please reach out below. We aim to respond within one business day, and just like that you’re setting client expectations. Remember, we talked about this much earlier in the course, but that was in the context of our clients. We can use that same idea here for Hayes Valley Interior Design’s clients too. We want to set expectations. Now, one more note about that contact form. We might want to use it a lot. So on every page, including the homepage, let’s add the contact form at the bottom. Again, our user story works best if we can give the user a quick and direct way to contact us. So let’s make that as obvious and convenient as possible. Finally, let’s go back to the homepage.
And now that we’ve fleshed out each of the other pages, let’s talk about what we can do on the homepage to make this experience even more impactful. We’ve covered portfolio because we show great work at the top, and link to it in one of the main buttons, then link out further with our sample projects. But let’s add a section that teases or previews the next item, the process. We can have a heading and a brief paragraph for that, plus a button that takes them to the process page to learn more. Same thing for the design team, meet our team, plus a brief paragraph there too and a button for linking to the full team page. As for contact, well a few moments ago we decided to add that to each page, but look at that, our homepage now has representation for each top-level section, each top-level idea in our information hierarchy. Now, how else can we represent this? We can use a navigation bar, a navbar, to show the company logo and to really surface the information architecture, represent it in a really clear way. And we can add a footer, a map, contact info, site navigation, logo, and we can put both of these, the navbar and the footer, on every single page. But, that’s it. We have each of our top-level pages for the site. We’re addressing the user story in a big way. We have separate pages for all top-level pieces of our information hierarchy. And we have breakout pages, individual pages for each project, and for each team member.
Now, is this the only way to do it? Of course not. There are an infinite number of ways to develop a content strategy. Outlines, diagrams, flashcards, word clouds, you have to pick the process that works best for you. At the end of the day, the best way to do this is the way that takes into account the needs of your client’s business and balances those with providing a clear, defined structure that makes it easy for users to parse, to digest, and understand what you’re saying. Something that sentence failed at spectacularly. But that’s it. That’s an overview of our content strategy that we’ll continue to develop and use throughout this project.
