Industry sign banking maryland business letter template mobile
- All right. So if you're joining our webinars
series for the first time, this Maryland Rebooted series is a part of the University
of Maryland's efforts to help aid the recovery of small and medium sized
businesses in Maryland who have been affected by COVID. So we've been so far having
really successful series on the topics of strategy and accounting, as well as some really
excellent panel discussions. And today we'll be starting
our three-part series on the topic of marketing. And today I'm really happy to introduce Professor Mary Harms, who will be leading this
three-part series on marketing. So to give you some sense of who Mary is, Mary Harms has been
teaching digital marketing consecutively since 1998. Her class was one of the first undergraduate digital marketing
classes offered in the U.S. Mary came to the Smith School in 2001, coming from Iowa State University, where she was teaching and also
served the business school's first marketing and alumni director. Her focus and teaching
besides digital marketing is strategy and design in business. She's also the co-founder of the Strategic Design Fellows Program, a select program for design
and marketing students within Smith School of Business. She's also an entrepreneur,
was, for 25 years. And has been an SBDC Consultant. So I'm really happy to have
Mary here with us today. And I'm sure we'll learn a lot. My name is Nicole Kim
and I'm a Coordinator for the Maryland Business
Recruited Program. I'll today help moderate any questions that you may have for Mary today. So we ask you to say muted
throughout the lecture, but we welcome any questions
that you might have. So please use either the Q and
A section or the chat section to submit your questions at any time. And I'll be happy to deliver
your questions to Mary. All right, so without further ado, I'll hand over the floor to Mary. - Okay, thank you Nicole. Yes, as Nicole said I was a
entrepreneur and for 25 years. And so I really empathize with all of you. And that's one of the reasons
why I enthusiastically agreed to present this webinar. During my time as an entrepreneur, I survived a recession or two. I survived a flood that wiped
out our tourism business for a season. And I unfortunately lost my
business partner to cancer. Who was also my husband
and my children's father. So I understand what you're
going through right now. And I applaud you for
attending this presentation. And all the others from Maryland
Business, Rebooted, okay? So I hope you've got your cup of coffee. You do? Okay, great, let's get started. So we're going to start today
by looking at grocery stores. And you're saying, well, gee, I thought this was
about digital marketing. Well, it is. But I think there's a
lot that we can learn by our experiences
going to grocery stores. Think about, well, let's
look at the next slide maybe this might help you. When you go to the grocery store, you've got a list oftentimes. But you have a definite
reason for going there. And you want to get in and you want to get out quickly, right? Because you've got other things to do. You oftentimes find that
experience might not be quite as pleasant as you had hoped for. Here you see the gentlemen
finding what he needs. He reads information. But here you see a
crowded aisle, et cetera. And so I want you to think of
visitors coming to your site, as if they were coming to
the grocery store, okay? And are you making it easy for them to find what they're looking for? Are you giving them the
information that they need? Are you making it a pleasant experience? So I tried this out with my husband who is a independent business person. And I showed him the
slide and he goes, no way, grocery stores don't guide
us through the store. I just go wherever I want. And I said, wait a minute,
you don't realize it. But yes, grocery stores do
guide you through that store. When you think of all the
merchandise that's there and the aisles that
you need to go through, they want to make sure that
you see the entire store, do they not? So what they do is, they've
created a ring of perishables. So when you walk in, typically what you see
is the produce, right? And they know that produce
is often the product category that you use to decide which
grocery store you go to. So that's what you see first. And then you wander back here. And you've got your meat and your eggs. And then over here, your dairy, okay? And they've gotten you
through the entire store. This is the ring of perishables. And because the fact
that they're perishable, you're going to be coming
back to the store often, Okay. The webmaster does the same thing. Through navigation,
through active white space. The graphics that we use, the
images that we use, the text, we're all guiding our
visitors through our site. And what about the checkout experience? Right? Okay. Now I have a tendency to be in this line more than this line. But I think you can see right here, this gentleman is looking at his watch. And so are the visitors to your site. And in fact, I'm going to
say this over and over again. When people come to a website, they don't necessarily come to read. They come to skim. They skim, they find
what they're looking for and they leave, okay? So what we want to do is create the most positive customer experience
for our site visitors. And that's accomplished through UX/UI. User experience and user interface. Now I'm just going to
show you an illustration. This site being the user experience and UI. But understand that we're
going to be looking at just about all of these today. I love this quote by Steve
Jobs, founder of Apple. "People think design is veneer. "That the designers are
handed this box and told, "make it look good. "That's not what we think design is. "It's not just what it
looks like and feels like. "Design is how it works." And so today I I'm going
to focus on design. Because I want you to understand how it affects your visitors
experience to your site, okay? Now really, none of us
wants our site visitors to feel like this when
they're using our site. And yet I can be honest, there have been some sites I've been to, that I felt exactly like this. In fact, 95% of users indicate that
a positive user experience is the most important factor
when they visit a website. Now, why has the user
experience gotten to be such a major determinant
of our site satisfaction? And that's because now just
about every business has a site. And so if you're not pleased
with what you're seeing or how you're using the site,
you can go to a competitor. You don't have to get in your
car, drive to the competitor. All you do is make one or
two clicks and you're there. So that's why we really need
to look at user experience. Now, companies have made
it really quite easy for us to create our own websites, have they not? And hopefully many of you
have created your own sites, by using here, just some of the platforms. Squarespace. Wix. Weebly. GoDaddy and WordPress. They basically taken the work out. They have created the
cascading style sheets and the wireframes and site maps. All you need to do is find
your images and your content. And you can do some
customization to these. The only problem is that
sometimes by using these themes and templates that they've created, your site starts to become homogenized. And so that's what I'm
going to talk about today. How you can really infuse
your brand personality into your website. Okay, so let's get started. We're going to look at
website versus social media. Who's coming to your site and why. The must haves for your home page. Branding through design. And then branding through content and SEO. So just to preface today, we're going to look at
five different sites. And these sites I've found
by doing a Google search for restaurants and hair salons and Builders in Denver, Colorado, okay? Never been to any of these sites. Or to the actual businesses. But I feel like after I've looked at these particular websites, I really do understand their brand, okay? So first of all, I hear often, do I really need a website anymore? I've got social media. I've got my Facebook page. It's just too much. I really encourage you to think instead of either or to think and. And that's why today we're
going to look at websites as we will in two weeks. And then the last webinar
is about social media. You should really think
of them in tandem, okay? So with that, you want some consistency. And I do see that here. We'll come back to La Loma
in just a few moments. But next of all, I'd like us to think about,
who's coming to my site, okay? So I'm going back to
the fact that my husband has his own business. And I was showing him
some of these slides. And he's in the process
of revising his website. And so I sat down with
them and we went through, who's coming to my site
in the next few slides. Guess what he did? He totally revised his site. Because he realized he hadn't
really spent enough time taking into consideration
who was coming to a site. So, look at your analytics
if you already have a site. And that will help you better understand who's coming to your site. You also may want to do some
market research on your own. And it doesn't have to be
expensive market research, okay? But you want to understand
your target audiences. And remember, you'll have first time visitors
and returning visitors. And they have different needs and wants. And so you need to build
the website for both. So, once you've done some market research, looked at your analytics,
if they're available, you've got an idea of
who's coming to your site. So then you can create personas. Personas are often used in marketing. What you do, is you create personas of individuals using real characteristics. But what you've got is a
composite of an individual. So there's no real Mark's age 22 that looks like that walking around, okay? But his demographics, as you see here, and his behavioral identifiers, will definitely describe a particular target market
coming to your site. As will Justin, 31. And Maggie who's 52, okay? So what we see here is typically once you build these personas,
you put a face on them. You give them a name. And then you refer to them
as you build your site. Like, well I wonder what
Justin wants in our site. Have we covered everything
that Mark's looking for when he's coming to our site? So personas can be very helpful. They encourage you to be empathetic. To think about your customer
base when you build your site. There's another approach to personas. And that would be an empathy map. Now, once again, think about that individuals coming to your site. Think about the tasks that
they're trying to complete. And what questions do they have that really need to be answered. Once again, look at their feelings. How are they feeling
about this experience? Are they enjoying it or is
it just torture for them? What really does matter to them? Price? Quality? Selection? Uniqueness? What are the pain points
that they might be feeling, that they're expecting your
business, your products, your services, to help them either reduce or totally eliminate? What is their ultimate goal? And what are they trying to achieve? And last of all, influences. Now, when I talk about B2B in a couple of weeks, those of you are involved in B2B, know that typically the
decisions are made by committee. Or by a couple of individuals. That's not necessarily the
case in personal purchasing, consumer purchasing. You may have some influences. We all know there are
social influencers out there that can be as influential if not more, than parents or siblings or friends. So once again, understand who
might be influencing them. - Mary. - Yes. - So we do have a question from Teresa and I think it's really interesting. So in your previous slide, you talked about how feeling
can be really relevant. And so the question is, how do you know how a person is feeling when they visit your website? - Good question. I think some of that is difficult. I do think one way of measuring how they're feeling about the experience is by how long they spend on each page. And if they come back to your site. So that gives you an idea of how invested they are in the experience, okay? We've talked about personas and we've talked about empathy maps. And once again, market
research can help you better understand those feelings, okay? About the consumer decision process. The customer journey
map has gotten a lot of, it's very popular right now in marketing. And what it allows you to do
is to follow your customers. And once again, you could go back to several
different target audiences. Because each customer journey map is going to be a little bit different. And what you want to do
is to outline the stages that they take in the
consumer decision process. From awareness to consideration
of the alternatives. To a decision. To delivery and use. And then afterwards the
post-purchase, okay? And during that time, think about the time you made a purchase, especially a high
involvement purchase that maybe had a lot of alternatives
that was expensive. You really went through various stages. And with those stages, there were different
activities as you see here. And that's what you want to do with your customer journey map. Outline, what are their activities? What are their goals? Now, maybe at the beginning, when they're in the awareness stage, they don't really have any goals. But those goals will mature and change as they go through the process. The touch points. I'm sure probably all of us
have found out about a brand on social media, okay? Wasn't even thinking about
if we needed that product or that brand. But once we did, that was a touch point, okay? Or maybe it was a friend who
happened to mention a brand that she had recently purchased, okay? From there, we look at the experience. How would you rate the experience that you are offering your customer now? Look at your website, okay? Look at the other brand touch points. And how is that experience changing? Okay? You can go on to Google. And you can do Starbucks
customer journey map. And it's fascinating to see how they have carefully figured out what individuals are thinking and feeling as they go through the
process of buying their pumpkin spice latte. So once again, here we
have your business goal. Yes, you need to figure out what you need to do as a goal. The KPI, Key Performance Index. How are you going to measure it? And then your organizational activities and who's responsible, okay? So you would do that for each one of these stages. And then that will, once again, help you create a website that delivers on what your individuals want. So remember, your research does
not have to be large scale. Just get out there and talk to your
potential customers, okay? - Oh, Mary. - Yes. - Before moving on, I just wanna deliver
those questions by Hassan. And I think he's asking about, I'm thinking about the persona that you were mentioning
your customers are targeting. Whether you should base your persona more on like a wider industry level? Or should you more go a little bit deeper and target different individuals? - I think you need to look at why they're coming to your site, okay? For instance, going back
to my husband's business, like I said, he's a consultant. So sometimes companies will go to his website. Because they want to learn more
about him to hire him, okay? There are others who are purchasing, I'm sorry, who are looking for information
for their clients, okay? And so basically we were looking at three different target audiences. And a lot of it deals, especially when you're looking at B2B, why they're coming to that site, okay? Does that help? Okay. And I think once again, if it's B2C, you can look at different age
groups, different ethnicities, different genders. If it's a restaurant you can look at, is it someone who's
coming on a routine basis? Or is it someone that's totally new and just moved to that particular area? Is it a tourist? Okay. Is it someone who really is
coming to your restaurant because they want to make
it a very special occasion? Does that help? Hope so. Okay, so we're going to
look at the home page. Now, I want you to think of the home page as the store window. And you're strolling along. You're looking at a store window. You're looking at the merchandise inside. Maybe you're actually
looking into the store. Is it crowded? Are those the price
points that I want to pay? Is it the merchandise
selection what I really want? And if it is, it encourages
you to go into that store, does it not? Well, that's what the
home page should be about. It should encourage you to
have a basic understanding of what they have to
offer and go in, okay? So with that, let's look at why I chose
this particular home page. This is for a builder in Denver. Once again, I've never met them. Why do I like this site? First of all, they've
used a photograph, okay? And they've used, I believe toned it down with a gray. So it's darker, you
can still see it, okay? Very clear resolution. But by being darker, then they can put text over it. And that text just pops, does it not? It's very easy to read. And look at their logo. That orange. And then they include the home page link, also in orange, okay? So you really, you see that logo. You see their brand
promise, "Think Long-Term." You see their value proposition. What they can offer their customers. That they create a positive lasting impact on the lives of the people we work with. And the places we build. Now, builders are services, right? And services are intangible. It's not like going to a
store and trying on a coat. It's intangible. So when we are thinking
of purchasing services, we look for evidence. As I tell my students, you
wanna manage the evidence. So what they've done here
is, I know for a builder, I'd like to know that I can trust them. And in fact, your whole home page should
be really conveying trust in your brand. So what we see here is a
crest of two associations that they belong to. Their navigation is very clean. They have seven tabs
that you can choose from. No more. Studies have shown, as far as consumer behavior is concerned, we can handle seven. Think of phone numbers. It's got the area code and seven digits. If you look at your automobile plates, seven digits or letters, okay? So keep it seven or under. Something else I really like here is the fact that they've
included their phone number and their physical address. It's up there, it's easy to find. It's not intrusive at all
in their overall design. Now also want to mention that
they used a sans-serif font. I'm not assuming that you
all know what that is. And I will show you examples of it later. But we see that it's used
most often on the web because it's so easy to read. Now, putting text on top of a photo or a dark background, with white text, we refer
to that as reverse text. And you really wanna make sure that your text is large enough. And maybe even bolded so
that it can easily be read. Okay, one more term before we leave. - Mary. - Yes. - Sorry if I might interrupt. So we do have a question, a
little bit more practical. And I think your website here
is a really great example. But Steve is asking, if you were to take all this designing your website yourself, what differences would you say there are between the different
website creating tools or the websites that you
outlined a few slides before? Would you suggest one is
better than the other? And also if you weren't doing it yourself and using an external source, is there a particular way
that you would recommend which person to go to or where to look at? - I knew somebody was
going to ask me that. And so personally, I have used Wix a lot. WordPress has been around
for a long, long time. As has GoDaddy. Squarespace is probably one of the newest. Now I teach this course. Another faculty member
teaches at the other semester. He always uses Weebly, okay? To be quite honest, once you learn one, then the others are pretty
easy to learn, okay? So what I suggest to my students, because every semester I
have 120 to 150 students create personal websites
that I grade, okay? And so I typically encourage
them to look at several. And then look at how easy they appear. Look at the tutorials that they offer. I think that can be a
really good way to see. Look at the templates and
the themes that they offer. But really what's happened is because so many of us are
trying to build our own website that each one of them has
become more sophisticated and easier to use, okay? So once again, I tend to use Wix. I think over the years, they have definitely
kept up with the trends. But so have the others. If you decide that you're
going to use someone else, couple of things I would do. I would talk to my friends. I would talk to other business owners. Find out who they've used. And then I would go on to those sites. And I would look at their portfolios. Because I think that will give you a really good understanding of what they perhaps specialize in. Yeah, I really do think
portfolios, testimonials. But once again, I think it's a combination of talking to other
business people, friends. And then looking on their own site, okay? Okay, one other term I'm going
to throw out at you, and I'm not sure how many of you have ever heard this term, it's called false bottom. That's right, false bottom. Now this side does not have a
false bottom, this home page. And what do I mean by that? Well, the early websites were actually web pages. And a website was just one page and you would scroll for ever. And then we came to realize
that, you know what? Having these, the navigation that you can click on and go to other pages,
really was quite nice. What's happened in the last few years, is because of the fact that so many of us are accessing the internet
on our smart phones, okay? Is that, we've come to see more
scrolling home pages. Now with that, this is
a scrolling home page. And what they've done is you
can see just a little text and just a little of an image. And that's saying to me,
you need to keep scrolling. There's more information down here, okay? So that's really, really important. When you look at your home page, there's another term I want
you to really be familiar with. And that is, above the fold. So, that comes from the journalism field. And editors will spend a lot of time figuring out what stories and
what photos go above the fold. Because that's what sells newspapers. The magazine. Sometimes magazines,
they'll test different, magazine covers. Same content inside. But two different magazine covers to see which one sells better than others, okay? That would be their
version of above the fold. Here, you need to see what's above the fold. What you really want your visitors to see and remember about your company, needs to be above the fold of your home page, okay? So sometimes you see home
pages where you've got a hero image. This is a hero image. But you've got a hero image as a banner. It comes all the way down
here and then they start. This happens all the
time with my students. And I go, no, no, no, no, no, no. You're making them scroll too
much to find the information that they're looking for, okay? So once again, that goes
back to the fact that we're all busy or think we're busy. And we want to skim. So this next page, a slide I think will show it even better. Your home page should communicate these important factors in 30 seconds. That's basically all the
time they wanna give to you. A home page is not a page where there should be a lot of texts. They're not going to read it. It's a navigational page. So once again, this is what
you want to communicate. What site the users have arrived at. Got the logo there, they know it. What benefits the
organization offers them. The value proposition
and or the brand promise. Something about the company. It's products or new
developments, right here. And then their users' choices and how to get to the
most relevant section. And that's up here, okay? So this came from
"Prioritizing Web Usability" by Jakob Nielsen. Who was one of the pioneers
of website usability. He's written several books about it. So I really encourage you to
maybe look at picking it up. So, we're going to look at branding through design. And I think I mentioned this before. But, 48% of people consider a website's design to be the most telling factor about the credibility of a business. And 94% of visitors leave a
website and stop trusting it because of a degraded or poor web design. So, yes. Content is very critical,
but so is design. What we're going to do now, is look at three different home pages and websites. So, we all get our haircut, don't we? Or at least we did up
until maybe six months ago. We will again. So what I did was I typed in hair salons. And in Denver, Colorado. And these came up. They were, basically I
think the top five or 10. But what I liked about them
is they were so different. And they really, each have
their own brand personality. So, we're gonna start with
Bad Kittie Salon, okay? Now, every web page needs a focal point, especially that home page, okay? And Bad kittie Salon's
home page is this photo, the photo of the outside. And it really does help, give you an idea of what you might expect. Wouldn't did you agree? It also gives you the
location and the hours. So, really good for individuals who are wanting to make an appointment. And speaking of making an appointment, they make it really easy right here. And I love how they have tied in the color of their banner background. That hot pink with one
of the buttons here. You also see here, their
links to social media. And that would be Facebook. Oh and Instagram, right. That, we refer to as social proof. So if you're looking at the website, but maybe you want a feedback from someone else, you would look at their social media and see what other people are saying. It's amazing how much we rely on the
wisdom of crowds, right? Individuals we've never met. Remember that false bottom. Well here they have, "Our customers continually trust us "as one of the best hair salons in Denver. "Read through some of
our Yelp reviews below." I'll be honest. I looked at this website so many times and didn't see that until much later. So I think that it's really important for you to think about how you can
encourage them to scroll. Now, one other point I want to make about this particular website is that we have, as you can see here, this is a static design. And this, you still see. But there's really a wasted space here. So it encourages you to scroll. Let's look at the interior pages. And I wanted to point this out. FAQ pages. Yes. They're really customer
service for your website. And this particular site does
not have a search function. And so they rely on FAQs. And even sites that
have a search function, use FAQs. So here, what I want you
to see is that you can, like here, here's the question. I click on the question and
the answer comes right up. Perfect, okay? The only thing is just
because it's FAQ doesn't mean that it has to be written as a question. What you might want to do is use phrases. It makes it much easier to skim, okay? Once again, here's their salon
services and their stylists. And just by looking at how she's dressed and how it's written, once again, you get an idea of
their brand personality. Okay, the next one we're going
to look at, is Clementine's. Clementine's Salon. Beautiful photograph, wouldn't you say? Once again, a hero image. They don't have a false bottom. You can see here mission, who we are. So that encourages you to scroll. I'll come back to this in just a moment. Their brand promise is good. But, it's hard to read. Remember I talked about that reverse text. They've used sans-serif. That's good. But this is a little too small. And it should be bold in order to read it. As is their navigation, okay? Their logo, a really nice looking logo. But unfortunately it blends
in with the background. And that's really critical. Typically, your logo should be on the
upper left hand corner. And it should appear on all of your pages. And it should actually be a link. A hyperlink to your home page. So you can go to any of these pages. And on that page, you will see the logo. And you can just click on it and now it's going to take you
back to the home page, okay? - Mary. - Yes. - Yeah, so we have some
questions regarding some of the jargon that you use. - Okay. - We can go over some of those. But we're asking things
like, so for example, what is a hero image? What is a false bottom? Things like that. - Okay. So a hero image is a large image or photo, that takes up nearly
all of the page, okay? Good question. A false bottom. Would be, if all I could see when
I went onto the home page ended right here. I would assume that there's no reason to scroll. Here's their mission statement, okay? And if the home page ended right here and I couldn't see what was down here, when I first clicked on
it, on the home page, I would totally miss this information. And this it's really
become critical because when you go to Wix or
Weebly or any of those, they often show a scrolling home page. Because we scroll when we're
on our smartphones, okay? So, here, when I went onto Clementine's home page, I could see that there was
something more down here I wanted to look at. And I could see these. This says, match with a stylist, button. There's another button. I think it's for booking. Yeah, book now. And then their contact information, okay? And look at the contact information. You can either email them, or phone them. And notice that it's in
a color that stands out. So, while I think this is a
beautiful site, this home page, the match with a stylist is amazing. Okay, let's go see. But before we do that, I want to show you when you scroll down, just so you have a better idea. This is the other bottom half of the home page. There's their mission statement, which is sometimes used instead
of their value proposition. But once again, we see
what their mission is. "To foster and maintain genuine "and lasting relationships
with our clients. "Enduring satisfaction with each visit." Okay? They've also included a photo
of the inside of their salon. And you know what? I really liked that because
when I get my hair done, that's where I spend my time. Is inside the salon. So I really liked being
able to see the ambience. So once again, I think their home page would
have stopped right about here. So you could see this, okay? So, the match with a stylist is probably for the first time visitor. And let me show you this
page more thoroughly. Okay. Have you ever moved somewhere and you had to find a new stylist? Now that ranks up there,
sometimes with a new doctor, a new dentist, your hairstylist, okay? And I can remember vividly,
this happened so many years ago. I'm not going to tell you. But, I had just moved to Madison, Wisconsin. And daily would drive
by this little salon. And I thought. I went and I looked in. When I went and got my groceries,
I looked into the salon. I go, wow, I think this
is where I want to go. I think they can help me. So I went to the salon
on a Saturday afternoon. And unfortunately, I got a
stylist who had just graduated from hairstyling school. And I have very fine thin hair. I know that, I've known that forever. But about halfway through my
experience, my stylist said, you have really difficult hair. Yeah, I know. She goes, I don't know what to do with it. Okay. And I walked out about 45 minutes later with a bad haircut and style. Feeling super bad about myself and even worse about the salon. And for two more years, I
drove by that salon every day, never went back. Why? Because I hadn't had the right stylist. So when I call a hairstyling salon now, the first thing I say is, give me a stylist who understands
thin and fine hair, okay? So, look at here and think about, how could this be
applied to your business. If you're in the service business, okay? And you have some service providers, maybe you can incorporate some
of this into your website. So, let's find your perfect stylist. Boy, does that make me feel comfortable. Start here. And as you can see, what services would you like to receive? Your hair type is best described as? How would you describe
your personal style? When you're at the salon,
what do you care about? And it goes on, how do
you spend your free time? et cetera, et cetera. And then at the end, you click. And then they will give you
who your stylist will be, okay? Now, here, then you can
go to the stylist photos. And there were many, there was a gallery. I just clicked on this one. And as you can see here is her bio. And you can see, where she's
from, where she studied. Some of her philosophy,
what her prices are. So I have a pretty good understanding that when I walk in
there for the first time, I feel much more comfortable with who I'm getting as a stylist, okay? So I told you, I think the
site has a lot to offer. Once again, we've got the logo. I think it needs to be larger. The lines need to be a little bit thicker so that you can easily find it. And it really is promoting your brand. But it's there, which is good. Now remember the FAQs with
the first salon, okay? And you had to read all the questions. From here, what they've
done for most of them is use a phrase, cancellation policy. Okay, easy. Dermaplane, weddings. So it's easy to skim and
find what you're looking for than with the answer, okay? Now, this page. It's smaller here. But it is a page full of text. And we all have them, okay? So what do you do to
make them easy to read? You don't want to build
a wall of text, okay? Instead, and here's another
term I'm going to throw at you, but I think it's a fun term to say. So, I say it often. You want to chunk the text. And my students always remember it. I think because they think it's fun too, to say, chunk the text. And what I mean by that is, when you have a lot of text on a page, you need to make sure that
the lines of text are short. And really they should be
only three to five inches. Now this is really max, maybe a little more on this page. What they do have is it
looks like double spacing or letting extra space in here, which makes it easier to read, okay? But let me say once again, your lines of text should be three to five inches and no longer. Well, why is that? Well, think about we've grown up, reading lines of texts in books. And magazines. Newspapers. Three inches at the most five, okay? Beyond that, if you go
from one end to the other, by the time you come back to
the second line or third line and definitely the fourth
line, let's see now, which one was it? Okay, it takes too much time. So chunk the text. Your paragraph should be
no more than eight to 10 lines. And they can even be shorter. In fact, on the internet, a paragraph can be one sentence, okay? And notice two, how they
have these subheadings using bold text, very easy to skim. And once again, their chat. So they really have put their
customer front and center, for just about this entire site. Okay, let's move to site number three. Totally different feeling, is it not? That black and white makes
it edgy and sophisticated. Now the reason why I included
this home page is because this is an example of
a path-based home page. Path-based home page that
you might want to use if you have multiple locations, okay? So what they've done is,
this is the umbrella. And then there are three different tabs that you can click
on that would take you to either the Broadway, the Rhino or the Denver Technical Center. So I clicked on Broadway. And this is where I came to. Now, once again, I like the fact that they're
showing you the interior, okay? And it really, doesn't it? It's so consistent with the
overall look of their site. Make it very easy. Book appointment, reopen guidelines. Okay, the location. You've got their logo
up here, that's good. Their mission statement, that's very good. I guess I'm surprised that this mission statement
wasn't on the home page, the path-based home page. I think that would have
been nice to read that. Because I would assume that
it was the same for each one. And you can also see just a little bit of the stylists. So you know to scroll. Which I did. And I saw these individuals
and then I clicked on one. And this is what pops up, okay? So this would be the bio. So once again, I just really wanted you to look at these three different sites. And hopefully you see three very different brand personalities, that were conveyed through the design. I'd like to talk just a
little bit about color, okay? Now I think probably for some of you that hot pink, on the first one was, maybe
a little jarring, okay? I definitely liked it. But understand that
color can evoke reactions that are very different
from one person to the next. And a lot of that has
to do with our culture. Our prior association with that color. Just our personal preferences. It's amazing. My daughter has triplets. One loves green, one loves
blue and the other yellow. And it matches their personalities, okay? Research reveals that all human beings make an unconscious judgment
about a person and environment or an item within 90
seconds of initial viewing. And that between 62% and 90% of that is based on color alone, okay? So, choose your color schemes carefully. In order to help you with that, what I've done here is
included some word maps that really address the
emotional qualities of colors. And you can find more
at this particular site. Red. Red is an aggressive color. It can overwhelm, it can take up the room. It's very powerful. But it can also be very sensual. So think about how you want
to use it on your site, okay? Blue, well. Blue is the universally most liked color, globally. It also instills trust. And so typically, if
you look at a bank logo, insurance logo, law firm, it's typically blue with maybe an addition
of another color, okay? Then we see green and green
has gained a lot in popularity in the last several years. And it's just restful. We look at the environment. It can signal progress,
being vegetarian, okay? So once again, there are many more at this
particular page or website. What I do want you to understand
is you should use no more than four different
colors on your website. Four different colors, okay? You can use shades. And I'm sorry, I've got this little fly, flying around me, okay. So, you've got shades and tones
that you might want to use. Intense, make it lighter or darker. But only three or four colors, okay? And you also want to make
sure that there's a contrast between your text and your background. And don't forget, eight to
10% of males are colorblind. And half of 1% of women are colorblind. So that's important. Some of these principles
that I'm telling you today are critical for ADA, okay? So American Disabilities Act. You want to make sure, especially if you are designing a site or if your customer base is the government, that you are following ADA standards. And you can go to their website and they will list them all, okay? Green type colorblindness
is the most common. So, when you have a link
embedded in your text, it's typically blue, right? Because blue colorblindness is very rare. If it were green, understand that probably eight to 10% of males viewing your site, may totally miss that link, okay? Okay, I promised I'd talk
about typeface and here we go. So I mentioned that in Clementine's Salon in MM, in the Builder, they all used a sans-serif. What do I mean by that? Well, we grew up, you and I, probably reading a text that was serif. Newspapers still use it,
magazines still use it. Serifs are these right here, okay. But another characteristic
of serif typefaces is that as you can see here,
this is thick, this is thin. This is thick, this is thin. This is thick. And so when you're putting serif typefaces over a dark background, some of that will start to disappear and make it very hard to read. Nonetheless, we still see serif typefaces, used on websites. Once again, more traditional businesses. Once again, law firms, banks,
oftentimes use serif, okay? And as long as you have a dark typeface or text on a white background, it's going to be easier to read. But if you're going to
do that reverse text that I showed you earlier,
if you are a tech firm, if you want to look really contemporary, you might want to look at sans-serif. So once again, think about
your brand's personality. And here I listed, these are some of the most
commonly used fonts on the web. These would be your sans-serifs. And these would be your serifs. And these are spelled
out in the actual font. So you can get an idea
of what they look like. Okay. Remember that Mexican restaurant early on? Okay. So I went to their, Our
Story, right up here. And I came to this page. Sorry. I nearly cried. Why? Because I could barely read it. They used a serif typeface. It's, too small. And it's white on black. And white over a photograph of the founder or the grandmother, okay? So, if she was that important, let's move her over here, okay? And either change the font or if we've got her over here, let's put a white box here with black type. And tell your story. Okay? And don't forget that images are really better at communicating. And especially with mobile use and apps. And the fact that they
are universally accepted. Sometimes, maybe all you need
is an image rather than text. And so I've just included here some sources for photos. And understand, we're all guilty of this. We go onto Google, we
click images, we type in. And there is a plethora of images, right? But many of those, and oftentimes some of the best ones are copyright protected. So one, I encourage you to
get your smartphone out there and take photos. Our smartphones now are really exceptional as far as quality. But second of all, Creative
Commons and Unsplash, I encourage you to go
to both of these sites. And you will have photos that you can use. You can alter them. There are some, like with Creative Commons, you do have to attribute them, attribute the sources. It really is a great way to see some ideas and maybe take your own photos
after you've seen these. So we're gonna talk just a
little bit more about images. Boy, she's spending a lot of time on that. And that is because as
you will hear later, our eyes are just drawn to those images. So here, as you can see, use
crisp, descriptive photos. Yes, we have our smartphones. And I know that many of you have had professional portraits taken. And you get so frustrated because they keep taking more
and more and more photos, why? Because they want just
that perfect one, right? Well, now what we can do is
take a photo with our smartphone and if it's not quite perfect, we can almost make it
perfect by cropping it, by changing the lighting. So I really do encourage before you just start putting
photos up on your website, take a few moments and
make them look really good. Because that reflects on
your brand personality. And you'll save them, okay? As a file. And that file name should be descriptive. So that the search engine has an idea of what the subject
matter is for that image. You may also want to specify
the width and the height of your images. And especially if you're doing social media, which we'll be talking about in, I think, four weeks from today, but they each have
specific dimensions, okay? That they will allow you to use. But if you specify the width
and the height of images, then the web page can
continue to download. And when that image is ready, it is dropped into that space
that was saved for it, okay? Again, think above the fold. So if it's something that
you really want them to see, make sure it is above the fold. And understand that search
engines can not read the text that you put on top of the image. So if you have some really important text on top of an image, you
might want to make sure that it's in your HTML code, that it's somewhere
else on that page, okay? So we're going to look at alt tags Now, I'm sure some of you
have never heard of alt tags and that's perfectly okay. But the reason why I'm including them
in this presentation is because if you want your
images to show up in Google, then you need to write
an alt tag for it, okay? It has become increasingly more important to optimize your photos. And that goes for not only your website, but also when you're going online in mobile, okay? So basically what you
want to think about is how you could describe that
photo to someone over the phone. And they could picture it in their mind. Now, you might just say,
a stack of pancakes. Really? It could be a stack of pancakes with fresh blueberries on top. And powdered sugar with maple syrup cascading over the sides. That helps me much more understand what that photo is. And if, maybe, it's on a page for a pancake mix company, you might want to insert the
brand name into your alt tag. Now, understand that not
everyone has perfect vision. And there are some
people that have to rely on electronic readers to
know what's on that page. And if you don't have an alt tag that reader reads the text, comes to the image and
there's nothing there. And then goes on to the text, okay? One other aspect. There are parts of our country and definitely parts of the world, where the bandwidth is not
what we have here in Maryland. And with that, with the slower bandwidth, they may not even see the images. And so what you want to do is include that text to
make it easier, okay? All right. So I wanted to show,
you here is an alt tag for Doritos tortilla chips, okay? And this is in their HTML coding. Dorito tortilla chips, nacho cheese, 1.75 ounce, large, single serve bags, pack of 64, okay? So once again, every single photo on your
website should have an alt tag. And Weebly, Wix, they all
make it very easy to do that. Oftentimes when you insert
the image, that box pops up. And they say, what's your alt tag? Write your alt tag, okay? So it's never been easier. All right. Once again, just quickly understand that because so many of us are
accessing the internet on our mobiles, that you
really need to think about if you've got at least a
majority, if not more than that, accessing your website
on their smartphones, you may, one, either want to
create a dedicated mobile site. Or two, use responsive design, which I will show you
in the next slide, okay? But I highly recommend
that you think about what do you want them to see when they go onto your site on their phone? What aspects are most important? And this also serves for SEO, which I'll talk about later. Search Engine Optimization. In that Google expects your site to be mobile friendly. Okay, so this is what
responsive design is all about. It's been around since 2012, 2013, when we started accessing the
internet on our mobile sites, on iPads or other tablets. And so basically it's
on a fluid grid system that uses percentages. And so as you access the site on
these various devices, it will alter the site, okay? And so some aspects of
that page will fall away and maybe come down further on the page. Google has said that a site that takes longer than three seconds to load on a mobile site
will rank higher, okay? So you really want to
look at responsive design. And your Weebly, your Wix, they will all handle that for you. That's great, isn't it? Okay, so very quickly I'm summarizing website
design conventions. I think I've said all of these. Oh, a couple of things, I didn't. Use lists. Look at that paragraph and go, does it need to be a paragraph? Could I change it into a list? 55% of users look at
lists without bullets. And 70% look at lists with bullets, okay? I think I've talked about
everything else on this page. The grid format, yes. We typically, and once
again, this is where Weebly, Wix, Squarespace, they all have created these
grid formats to help you. So that it looks very neat and organized. I've mentioned everything else
except justifying the text. Now, this text is left justified. And that is the easiest to read, especially when you have text blocks. I see this all the time. But try and avoid centering your text if it's considerable text on the internet. That's great for wedding
announcements and baby showers. But it's not for the web. So be sure that you justify
on the left hand side. And the titles and the headings
should be flush left too. Don't center them over the
text, flush left, okay? All right, you're saying, oh,
okay, this is enough design. Let's talk a little bit about content. And that's what we're going to talk about in the remaining minutes
of this presentation. How you can convey your brand
personality through content. Now, you want to use your brand voice. What is your brand voice? Okay? And once again, it would depend on the type
of business that you are. I'm first going to look at
content, looking at it visually. And once again, you're saying, oh, she's spending so much
time looking at images. Well, that's because as our
attention spans have decreased, we find that photos, graphics have the power to stand out on our screens
and capture our focus, faster and more efficiently than text. So once something captures our attention, these visual forms of content
can convey more information and emotion than text. Yeah, a picture is
really worth 1000 words. And we tend to remember photos more than text, it's been proven, okay? And yes, I know. How mean am I showing you
this beautiful picture of food at this point in time? Also want to show you some
other photos from La Loma that Mexican restaurant,
where we first started out. When you have a restaurant, a coffee shop, highly recommend that
you show the interior. And I highly recommend
that you show people in it. The last thing people wanna see is a restaurant that's empty. Because I look at this
and I can say, oh yeah, I'd fit in there. Yeah, I'd like to spend time there, okay? So you're telling them quite a bit about your customer base. You're also showing them your food. And this beautiful photo of the outside of the restaurant at night. This is another photo on their website. And why am I showing it to you? 'Cause I think it really tells a story. I've never been to this
Mexican restaurant, but you know what, when my son picks me up at the airport, whenever that will be, I want to go here. Look, it's cloudy. It's great, they've got jackets on. It's not really a nice day out. And look, they're waiting
in line to get in. Yeah, does that tell you
something about the restaurant? Combine that with pictures
of the food, I'm set to go. Okay, we're going to
look at a few other forms of visual content,
before and after photos. For those of you in the building trade, this would be wonderful. A hair salon, this would be wonderful. Cosmetics, you name it. What I liked here, we're back
to our Sunnyside Builders. They have a portfolio and they have all. And then they broken it down in commercial, government and residential. Once again, just make it easier to skim. How to videos. It's never been easier
to make a video, okay? Demonstrations, infographics,
portfolios of past projects. You may not have before photos, but this summer I was
looking for a landscaper and I poured over portfolios of projects. I didn't really care what
it looked like before. I just wanted to make sure
that when they were done, it was going to be what I wanted. So here are some other
(clears throat) pages on the Builders site. I mentioned infographics. And there are several websites, Canva, C-A-N-V-A. Easy to build infographics
using that site. But they took the value proposition and turned it into an infographic. It's really easy to just, it pops out on the page. Their About Us page, which
I'll talk about later. Their services page. And then this page, Buildertrend Login. So what they've done is if you are using them to build a house, a office building, whatever, they will give you access to videos. So that you can see on a daily basis, the progress that they're making. Talk about, thinking of the customer, perfect. So going to use some more jargon. But I feel that it's important for you to understand
information architecture. So what you want to do is think about what is the
most important information. And put it on the first
page, the home page. And then think about the next areas of your website. What should go on the first page. What should go below the fold. Or do to another click. So that's a hierarchy. Now, one way that you
might want to guarantee that you're really understanding
your target audience is go back to those personas
or that customer journey map and say, gee, have I included all the information for each one of those personas? Or have I included all the information that the individual would want as they move through the
customer journey map? Now what you might wanna do, and you can do this digitally, or you can do it just on index cards. Good old index cards. Is divide up your information
into little packets. Put them on your index cards. And then give them to people. Your family, your friends, et cetera. And say, would you mind sorting these into five or six piles for me? Put those that are similar in a pile. And then at the end you say,
would you mind writing a title? Labeling each one of those. Use one word at the most two. And what that does is that gives you your
navigational buttons. So that makes the navigation of your information intuitive. Okay? So they know. So when they come, they have
a good understanding that when they click on that button, it's going to give them the
information that they want. All right, yes. Nicole, did you have a question? - Yeah, sorry to interrupt you. I just want to let you know that we have around four minutes
left, just to let you know. - Okay. - And also we have a couple of questions if you think we have time for those. - Can I just quickly run through? - I'll ask later then. - Okay. Here are some other examples
of written and audio content. On our About Us page, you
really want to focus on that. Sometimes we as small business people, we don't want to brag. Well, don't think of your
About Us page as bragging. Think about what you
can tell the customer. With them in mind. This is an ideal place
to show your personality, to differentiate yourself, okay? And once again, when you have
time go to Sunnyside Builders and read this About Us. And you will want to use
them as a builder, for sure. Okay, when writing for
the web use one third, fewer words than if writing for print. And use an inverted pyramid. So the inverted pyramid comes
from journalism, once again. And the first time we think it was used was when President Lincoln was shot. And they started out
the press release with "President Lincoln has been assassinated." That was the most important information. And then from there, important details in your background information. Quickly use conversational tone. No jargon or acronyms. Sell your benefits, not your features. If you are creating a website
for the general public, write for an eighth grade level. And there are websites that
will help you judge your writing to see if you've done that. Remember that when they
come in to your website, they are scanning. They're reading about
500 words at the most. They spend the remainder of
their time looking at photos and scanning the bulleted lists and links to your other pages. What you want to do is
create evergreen content. And that's content that doesn't have to be revised all the time. That you can put it on and maybe it can be on
your site for years. So I've given you some examples of that. How to guides, progress reports. People love lists. So think about how you can, top 10 here, top 10 there. Why you want to produce
the evergreen content is because it can help you with your search engine optimization, which I'll show you on the next page. Evergreen content is less work because you do it once and
you don't have to do it again for some time. And you can actually cut it
up into bite-size portions and use it for your social media. And this tells you how
to go about producing it. And I just like to end
by talking a little bit about organic SEO. I don't have time to
talk about it in full. But understand what the keywords are that people are coming to your site. What are they typing
into the search engine? And then, use those relevant keywords
in your text, okay? More than 90% of the online experience start with search engines. And so you don't have to pay for it. You just have to design your site well. And include fresh,
quality, in-depth content. And then this is the
organic search results. These are the ads, this
is the local SEO Pack. But this is your organic search results. So this is what you want to
provide as far as content. Letting them know who you are,
what you do, why you do it, show them how you do it. And what others think of
you, how you're doing. These are some books that I
have used over and over again as far as creating content. This book is iconic. It was written in 2005. It was rewritten in 2015. Just about every webmaster has it. I reviewed it again yesterday. And it's amazing how it
has stood the test of time. So in summary, build a customer-centric site
and encourage stickiness. And that means you want
them to come to your site, stay for a long time and come back again. Once again, thank you. And questions? - Great, thank you so much Mary. Thanks for going through
a little bit quickly. But we did have two questions
a little bit quickly. So Hassan was asking about, going back to the persona piece. If you're targeting to
several different people, how would you suggest these websites do their copy and messaging? - Okay, understand that your home page is for all of your personas. Your individual pages will appeal to just maybe one or two
of your personas, okay? Understand that you will probably find that there are some common
threads between your personas that will give you guidance as to how you would write, your text. Okay? - Yeah. Okay, so Hassan, hopefully
that answered your question. We did have another question. So I want to get to that. But you did mention a customer journey map in the very, very
beginning of your slides. - Right. - Would You just expand a little bit more about how you might get that
for your target audience. - Right. You can think about yourself. You can talk to your friends, family. What were they feeling when they first discovered your
product or your brand, okay? And what triggered them to consider? Maybe it was a social media post. What triggered them to think
about making that purchase? Excuse me. Then what were some questions that started going through their mind? All right. What risks were they feeling? And then they thought, well,
gee, I liked that brand, but I'm gonna see what else is out there. So they started doing more research, okay? And so they go on websites. And so then, they have more questions. And they need to answer those, okay? So you write those questions down. They're evaluating the alternatives. Think about the questions they
might be asking themselves. And how might you get your brand in front of them during that time? That would be referred to
as a brand touch point. And the experience with your brand. If they're evaluating the
alternatives, what's it like? And then they're purchasing your product. How are they feeling about your
brand at that point in time? Is it all warm and fuzzy or are cozy? I'm sorry. Or are you making them
search for that information? Is it confusing? We refer to a lot of friction trying to find what's on your site, okay? So put yourself in your customer's mind. You want to build a
customer-centric website. And that's what personas, empathy maps, customer journeys do. Go onto Google and google
customer journey maps. There are excellent examples, hundreds. I just showed you one,
there are tons of them. And they will show you, there are some businesses
that make them very brief. There are others, like
the one I showed you that, as you can see down
below, which showed you, who should be responsible
for each stage, okay? So once again, do your research. Talk to people. And you know what? People really do wanna talk to you. People really do wanna give
you their opinion, okay? So find some individuals who are likely customers for your business. And just, maybe over a cup
of coffee or over Zoom, talk to them. You'll be surprised how much
they'll be willing to tell you. What are those pain points that they felt the last time they bought
a product or service like what you're selling? - Yeah, thank you Mary. I think one last bit is, I distributed the handout
that you have for everyone. And so if you'd like to just
discuss a little bit about how our participants could use that, in addition to today's lecture
that'd be really great. - Okay, sure. So on this particular handout, I have created and used a lot over time. And in fact, you're going to find that
there's actually more information on the handout than what
I was able to cover today. So it gives you an idea of different design,
conventions or patterns. It shows you what a site
map would look like, what a wireframe would look like. It also talks a little bit
about cascading style sheets. Now, once again, those are actually created for
you through Weebly and Wix. But I gave you the HTML
code just so you could see what you were dealing with. I also included some sources for fonts. If you want to look at some more interesting fonts than
just the typical ones. So you've got some sources there. And I also spent some time talking about designing for global users. Because I know some of your
sites, you may have global users and you need to take into
consideration some of their needs. And you will see I've
given you some sources that you can go to as far as learning more
about user experience and user interface. And writing for the internet. So, I think that's it. - All right, great. So thank you so much, Mary for this really wonderful first session of your three-part series. So as everyone can see
here throughout October, we'll continue with Mary
in her next two webinars, in this three-part series on marketing. So each on the 14th and the
28th, we will join us again. And if you're really
interested in learning a more deeper understanding
of these specific topics, please also check out Maryland's MicroMasters program series, which do offer longer and
more in-depth sessions. Okay, so thank you everyone for attending. We'll see you again in the
next webinar on October 14th. All right, thank you. - Thank you, bye. - Bye.
