Tip:
Highlight text to annotate it
X
Hey everybody, Mike Linville here founder of Black Dog Education and the
developer of the DIY Creator Series, want to thank you for coming back to this video
now this is the first video in our six part awareness campaign called, "Does Your Website
Suck? If you took a look at the last video and I hope you did cause we kind of talk about
the sweepstakes that's running along with this campaign but if you took a look at the
last video you're gonna realize that were not creating this campaign in order to make
anybody feel bad. The whole idea isn't that we want to point fingers or even specifically
tell you if your site is bad or not. What we really want to here is to be able is raised
awareness for small business owners in terms of how productive or actually what level of
performance they're getting out their website. So what we do is we want to bring a little
bit of perspective to the process and that's all we're really trying to do. So in this
video the one thing that I want to be able to talk before really getting out of the meat
of it is if you the developer of the site you know if you actually are the guy who created
the website for your business or if you were director responsible for hiring or working
with these people the one thing I want to ask you to do is I wanna ask you to just take
a couple of seconds and when you're going through these video series and don't take
it personally but I understand when you really close to a project sometimes it's easy to
take things personally and it's hard get a little bit distant and little bit of perspective
that happens to me all the time. I'll come up with these campaigns and I'm like man this
stuff is genius and it tanks it happens all the time. But that's how you learn, you fail
and you learn. So what I want to do is if you're going through this especially if you're
one of people that created the websites or you are one of the people that were responsible
for that aspect of it I want to make sure that you just take a step back. Take your
developer or your designer hat off and really kind of step into the shoes of your customer
right because if we take a look at what your website is really all about your website is
just a marketing tool right not something that you can use to tell people I like this
color I like this your website going to be a marketing tools it's going to help you communicate
with your customers when you're not there that's it okay so again if you're really close
to the design step back and try to take a look at it from a fresh perspective about
how your customers gonna be seeing your site and for those of you watching this video series
with out a website don't think that just because you don't have a website this is going to
be meaningless information so basically what's going to end up happening is we're going to
go through each one of these six different areas of improvement and we're going to talk
about some common problems that people typically see but we're not going to say, here's a problem,
here's a problem, here's a problem good luck Charlie were going to talk about the typical
problems that we see but we're also going to talk about the solutions to those problems
and those solutions aren't necessarily that's what we think those solutions are going to
be based on best practices okay. So again I really appreciate you sticking with us now
in this first video we're going to start talking about design so let's go ahead and get into
shall we? I don't want this to be a 45 minute video where we talk about the subtle nuances
of design and usability you know, we're going to consider design and usability in the same
thing, because realistically at this level what are we talking about right? If you've
got poor design choices that you're are making that can negatively affect the usability so
we don't need to nitpicking and nickel and dime. I mean look design is going to be for
the purposes of this is going to be design. The second thing we need to talk about is
we're talking about design for the Web. Now design for the web and design for print those
are two very different strategies, two very different skill set now I love print designers
I have crazy amounts of respect for them because they do stuff that I would never be able to
do in terms of laying colors and doing all that other stuff. But if you've got print
designers that are developing your website I would just say be careful you know because
again when you're developing on the web there are a lot of additional technological issues
we've got to deal with the about page load time we've got web safe fonts we've got all
kinds of things browser issues different compatibility issues along with that so there's all kinds
of things that are going on. And you know those subtle nuances aren't necessarily going
to be picked up by a print designer. And the last thing I want to talk about is what we're
talking about here is generalizations we're talking about principles and were talking
about best practices okay this isn't going to work 100% of the time for everybody. Some
of the things we are going to talk about may absolutely not work for you if that's okay
that's okay you know it is what it is but you know understanding the theory behind it
that's going to be the most important thing okay. So let's go ahead and get started shall
we? Now the three things that we're going to talk about in terms of design or the three
elements of design are going to be typography, color, and layout. Ok so let's go ahead and
talk about typography. So before you start it don't worry about the word typography basically
it's just a way of saying the fonts that are being used like an Arial, or Times New Roman.
It's just kind of the style of the letters that we're using. Now back in the late 60s
there was a gentleman by the name of Albert Mehrabian and Albert if you're out there and
mispronouncing your name I sincerely apologize, not my intention. But he put together these
studies and basically the jist of the studies was it was it was all about communication,
and what Albert found out was through face-to-face communication 7% of the information that gets
communicated back and forth actually has to do with the words that we use 38% of the communication
has to do with the tonality in our voices and a full 55% had to do with body language.
So I know what you're thinking right off the bat. You're like man if 93% is tone and body
language and we're on the web we're screwed there's no way that we're going to be able
to help out. Well that's not necessarily true you know when Albert but this study together
it was the late 60s didn't know about the web by them but also he was specifically talking
about face-to-face communication. But I think even though that information may not be 100
accurate for the web it's important for us to know because that's really what we're trying
to mimic. That's what we're trying to do or try to get to the point where people feel
comfortable enough with our websites as if they were having a face-to-face conversation
so you know that's one of those things were gonna wanna keep in mind some of the common
problems we see, or we have seen over the last 13 years in terms of typography are people
using too many or too few different font types and you see them websites that either look
very boring or websites have 40 different types of fonts and you don't know what to
do. Another common problem is people using too many colors. You don't need to change
every other word a different color really probably don't need more than two colors at
the most. And then the third thing is bizarre font paring you know what we're going to talk
about in the solutions is we really want you to try to choose two different fonts but you
want to use two that kind of work well together you know, you don't want one that is really
big and fat and chunky and then one that is very dainty, those are kind of an odd pairing.
When you're looking for fonts for your website choose two, that's it. You don't need to worry
about seven or nine are doing this or doing that, print designers do that stuff. On the
web choose two fonts. We're going to use one for primarily headlines. We want those to
be nice and clean and clear and easy-to-read so what we're going to do is choose what is
called a sans serif font. It's like an Arial or Verdana. For the body type what we're going
to do is for that one we're going to choose what is called a serif font. The difference
between serif and sans serif is if you've ever seen the written newspaper or typically
in books and things of that nature anything in print really, you see those little squiggly
lines down to the bottom of Ms or As, it kind of goes out a little bit, that's a serif.
So when we talk about serif fonts we're talking about fonts with those little squiggly lines
on them. When we're talking about sans serifed fonts we're talking about more round fonts,
fonts don't have those little squiggly line. So number two what we want to be able to do
is we want to be able to assign roles for fonts and we want those to be consistent throughout.
The way that the human brain works is we like to be ordered we like to have things in a
certain way and we like them to be that way all the time. It kind of makes people at ease.
So what we want to be able to do is we want to be able to say okay this is a font we used
for headline were to use size 14 Ariel what ever the number is it doesn't really matter
but what we want to do is everyplace we have a header if it's multiple headers on one page
headers on different pages of the site wherever it's going to be we want to be only used the
same font okay. And be consistent across the site with it. The best way to do that is actually
through the use what are called cascading style sheets or CSS. Now before you freak
out and think that this is going to be some sort of like monster web design you know class
if not what's important is again I talk about this campaign being part by the awareness
campaign but there's also a sweepstakes that runs next to it so everybody that signs up
for this sweepstakes it going to get an ebook that has all of this information as well as
a quick start guide in terms of the action items what do you need to do to start taking
your business or your website to the next level so don't worry about it don't watch
about a bunch of notes were going to go ahead and send those things out, so make sure that
you sign up for the sweepstakes. So the next thing that we are going to talk about typography
is we wanna make sure that we re contrasting not only the sizes but the widths. So when
we talk about size we're talking about a 12 point versus an 18 point it's just slightly
larger but we also want to deal with kind of bolds and non-bold or italics the combination
of different sizes, different weights, and two different fonts styles is going be plenty
to differentiate your site and all the content that's on there. By differentiating your content
using fonts what that does is that let's the eye easily go to the things that are important
like your headlines, right you can easily scan the page and figure what the headlines
are instead of read through the same thing so again, the next thing we are going to talk
about is color.}