WordCamp US 2019 – Room 220 – Friday 2


>>Good morning! Let’s try that again. Good
morning! That’s better. My name is Jen Swisher. And I’m
the local lead organizer. On behalf of the organizing team, I
would like to welcome you to St. Louis and WordCamp US. Whether
you are a designer, a developer, or a content creator, whether
you have been working with WordPress for five days or 15 years, there is
something at WordCamp US for you. Raise your hand if this is your
first ever WordCamp US? Wow. That’s awesome. Raise your hand if this is your
first ever WordCamp? Equally impressive. Let’s give those
folks a round of applause. [ Applause ]
As us long timers know, the WordPress community is first and
foremost a community that supports each other. If you are
someone who is sitting next to someone who just raised their
hand, take a couple seconds and introduce yourself. Speaking of community, we are so excited that we have an entire
dedicated track to the WordPress community this year. We have
sessions on growing your meetup, having a contributor day,
working with youth and embracing diversity. Speaking of
divorcety, we have a broad spectrum of presenters because
diversity make this is community stronger. We have pronouns on our badges
because pronouns are important. No matter who you are, where you
come from, or what your life
experience is, you belong here and we want you here. Now, for some practical
information. Lunch for all three days will be on the first floor.
From the main entrance, down the right hallway past the sponsors
hall and it will be in the next hall on your left. Today we will be featuring a
jazz band throughout lunch. This year’s attendee social event, formerly the after party is now
called Wordfest. It is at the City Museum from 7 p.m. to 11:30
p.m. Lots of things to do, see, and, well, eat. The City Museum is a fully hands
and feet on kind of place. If you would like to climb
around or ride the slides or run around, it is recommended to
wear closed-toed shoes and long pants. the City Museum is half a mile
away and you can park there for $10. And for our younger attendees
without a badge, they need to enter with their parent or
guardian. Please remember to respect our code of conduct
during WordCamp. We want this event to be open, inclusive and
welcoming to all people. If you have any questions or you feel
you need to speak to someone, please find someone wearing an
organizer lanyard. They’re black and say organizer just like that
one. Or find a volunteer in a red
T-shirt that looks just like that one. And we will be able to
help you. Unacceptable behavior will not
be tolerated whether by other attendees, organizers, venue
staff, sponsors or other patrons of WordCamp US
Venn use. If you have an issue, we would like to know about it
so that we can help. If you have any burning WordPress questions,
please visit our support desk on the first floor in the sponsors
hall on the right when you walk in. There will be people there
to help you all weekend. All of our tracks this year are on the
second floor. If you end up turned around, find a volunteer
or an organizer and we can help you find your way. We are always
happy to help. There will be coffee, water and snacks in the
back left corner of the sponsors hall if you need a drink or a
bite to hold you over. The WordCamp US swag table is also
in the back of the sponsor hall except it’s on the right. And it
will open today at 9:30. And it will — and also
tomorrow. And you will be able to pick up your swag at your
convenience today or tomorrow. And last, but most certainly not
least, we would like to thank our amazing sponsors, speakers,
volunteers and my fellow organizers for their immense
contributions to this event. Without your support and
contributions, we would not be able to have that amazing
gathering here in St. Louis. From the bottom of my heart,
thank you for all you do. And, folks, that’s really all I have.
Have an amazing day! [ Applause ] Creating an Environment of
Innovation Tina Peterson SPEAKER:Ing he low, everybody!
Welcome to WordCamp US 2019! We’re very excited to be in St.
Louis this year. My name is Travis, and I’m gonna
be your host up until noon today in this room. Before we start,
let’s go over a few things. Silence all your devices. I know
you all have been to conferences before. And this will be the one
that it’s you if you don’t turn it off. Anybody who is all the way on
the aisles, move. I see nobody move who is
standing on that aisle. I’m not kidding. I will wait. If anybody
has any accessibility needs or additional we questions, find
a volunteer or organizer. Volunteers have red shirts,
organizers have black lanyards that say organizer on them. There will be Q&A after each
full length session. That is this one. Please save
your questions for the end. And for the online streaming and
videos, we’re gonna make sure that you’re using a microphone.
If at any point you think of a question, feel free to get up
and go over to the microphone over here
to your left left. And let’s see. If you want to talk to Tina a
little bit more after the session, we’ll will around
today, at least until lunch. You can grab her in the hallway
after the session so we can make sure we stay on time today.
Also, make sure you come to the contributor day tomorrow. I’m
sorry, that’s not tomorrow. Today is Friday, not Saturday.
That is Sunday, contributor day. To learn how to get involved.
And check out the get involved table in the sponsor hall. Reminder, Wordfest is tonight at
the City Museum. You need your badge to get in. And if you’re a kid, be with an
adult. Our first speaker today is Tina Peterson. Session is
creating an environment of innovation. Tina Peterson is the
founder and manager at the Sprint
Accelerator in Kansas City, Missouri. And responsible for
outreach, programs focusing on entrepreneurship and corporate
innovation, regionally and nationally. And works with
corporate leaders on support programs and collaboration
efforts. Tina has been an organizer and facilitator with startup weekend
and worked on a similar format for
corporate use. Tina helped to start Athena League. Was on the
founding board of Kansas City Women in Tech, interfaces
with many KC KC organizations and
regularly mentors entrepreneurs. Welcome, Tina Peterson.
[ Applause ] TINA: Good morning, everybody. And thank you for being up here
so early. I know just the morning after a
holiday. So, hopefully you’ve all recovered from all your
sugar eating. So, he gave a great intro.
That’s sort of if you look me up online, it probably says most of
that stuff. But I thought I would tell you a little bit more
about me as long as we’re kind of talking about community
today. So, I am a mixed case Korean
American. I was born in the south. I say I was — I grew up in the
Midwest. And I became an adult on the East Coast. And now I
reside in Kansas City. So, I’m back to being a Midwest
erner. I’m certified. I have two degrees, a bachelor’s of science
and a master’s of science. I’ve never really used those
degrees directly. But I am a lifelong learner. And, that’s sort of how those
both came about. And I do leverage a lot of that knowledge. I’ve used that knowledge in more
than 20 years of work experience kind of all over technology.
Mostly telecom. And then also working with young startup founders is the work
that I do now. So, the reason that I’m giving
you some of that background is, again,
because we’re here as a large community. I myself consider
myself an introvert. So, now that you know a little bit
something about me, when you see me roaming the halls not talking
to anybody, you can feel comfortable coming up and saying
hello to me. And starting a conversation. So, years ago I actually saw
another talk. And I don’t know if it was a WordCamp talk or
not. And I’m not gonna remember the speaker’s name,
unfortunately. But I will give her credit for this because it
has stuck with me for a very long time. And what she said
was, when you’re giving talks, remember to take credit and give
gifts. And so, part of what you do when
you’re giving a talk is sharing your knowledge, right? But also
we need to take credit. And so, that’s part of what I
want to do today is share with you that
I am the founder of the Sprint Accelerator. And so, this
journey that I’m gonna share with you today is kind of
what we went through as a team, but also what I went through
individually as I started pitching and building out what
happened at the Sprint Accelerator. Excuse me. So, rather than just
give you a straight pitch on what the
Sprint Accelerator does, I’m gonna take you a little bit
behind the scenes and tell you what that story was. So, it really started, gosh, in
2008 is really where that story starts. And so, it’s a long one. But I’ll try and keep it short
for this. So, in 2008, I think, I was
really just dipping my toe into the water of the Kansas City
community as far as what did the tech community look like at the
time and what does — what did the
entrepreneurial community look like? Kansas City’s timeline of
entrepreneurship and entrepreneurial community is measured by a pre
and post-Google Fiber world when Google came to Kansas City in
2012. I was a little bit on the pre-Google Fiber side. It was a
much smaller community at that point. We had what is now the Kansas
City tech council that was working under a different brand
at the time. We had the startup weekend
events and KC Source Link and Pipeline and a few other sort of
our larger organizations that still exist today. But
other than that, there weren’t a ton of organizations. So, when I got started, I was
really a grassroots organizer in our community. I still had a full-time job. And
I was doing this sort of on my off-hours. Bringing people
together. In 2011, roughly, is when I
started pitching internal to the sprint organization which was
where I was working full-time. And this idea that Sprint should
be more involved with our community, not less involved.
And as Kansas City was growing, we needed to be a part of that. And so, that turned into a
volunteer team. And we got our first executive sponsor in 2012. 2013 — sorry. Excuse me. 2013, — by then it was really
my full-time job. This is what I did was try and figure out what
the Sprint Accelerator would become, what it would look like.
We actually branded it in 2013. It got full buy-in from our then
CEO and his executive leadership team. So, we were fully funded
by then. And in 2014, that’s when we really went public. So, in January, we opened the
doors and everybody could come into our physical location and
we launched our first 90-day program with Text Stars.
That’s where you see most of the news about the Sprint
Accelerator is starting in 2014. But obviously we were working
hard on programs and connecting with the community and getting
involved way prior to that. What you — when we launched our
physical location and our brand, for me, it was really about how quickly
can we actually become part of the ecosystem that is Kansas
City and the national brand? And so, I think it was in July
of that year, part of what we did was a lot of give back to our community with
physical space. Because we had it for our own programming. And
as a grassroots organizer, I know how sometimes it can be
really hard to find a physical location to hold
a workshop, to give a talk, to help your community out. And we also know that our
grassroots organizers usually are doing this for no pay. So,
how could we help? And that was one of the easy things we could
do. And I remember somebody coming
into our space, I believe it was July. So, we’re talking about
maybe 7 months from the time that we opened the doors. And
what they said to me really was the thing that I was like, I know
we’re a success now with our community. And that phrase was:
You know what? I can’t really remember a time that I wasn’t coming to things although
the Sprint Accelerator. things at the Sprint
Accelerator. That was a win, that’s when I knew we’re part of
Kansas City, we’re part of this community. We’re part of how
entrepreneurship and innovation happens here in Kansas City. So, that was the biggest win
that we kind of got in the early days. We’ve since had a lot of
different wince. Mostly we’re known for our 90-day
accelerator program that we work with several companies and we pattern
with both Sprint and dairy farmers of
America. We run their accelerators as
well. Accelerators are short-form,
3-4 months and end in a demo day. We’ve now worked with 54
founders along with our corporations. Those founders
have gone on to raise millions of dollars. Many of them are
still in business. We have a pretty high success rate. And
they are still working with our corporations. And so, that’s
the biggest thing that we want to get from our 90-day program is to create long-lasting
business partnerships. We’ve sort of looked under this umbrella, our vision is how do
we accelerate business partnerships? Not just so much
about a 90-day program for founders. And so, we’re looking for those
unique growth opportunities of how not only young companies can scale and
grow with large corporations. And how we unlock our corporate
resources into our environment. But also, how do our large
corporations get solutions for the innovations that they want
very, very quickly? And how can we source those ideas back into
large organizations? So, that’s what we work on every day. We do
that through more than just the 90-day program. But that is our
flagship program. We have a mentor at work. We work with
multiple corporations. We also focus on internal innovation and
bringing our corporate innovation leaders together to
share best practices in that space of all of the things that
we do under our umbrella. We’ve worked with a little over
40 corporations and I think over 200 founders at this point. So,
we stay pretty busy. And we’re a really small team of people. We’re only three full-time
people. But the way we get it done,
again, it all circles back around to our community. And as you guys know, being part
of WordPress, it’s not just a Kansas City community or a national
community, but a global community of people that help us
get where we are. So, we certainly can’t do it all
ourselves. Obviously, our corporate partners help us quite
a bit with content and expertise. But we also rely on the larger ecosystem to bring in knowledge,
past founders who come back and talk.
Founders that haven’t worked with us, but are still working
and still want to give back to their communities. And so, we convene a lot of
different people to share their ideas and
help grow companies, push innovation
to the next level, and keep things
Mooing along moving along. So, I think that I’m skipping over a
couple things. But I know that I promised that
I would give — give you the sort of the formula for innovation before I closed
out my talk today. So, I’m gonna make sure that I do that. And I
did not write this formula. But I do think that it — it
speaks well to how we work and what we deliver on. So, it was James Dyson who
actually said this. And everybody’s looking for that
magic formula. So, here it is: Creativity plus
iterative development equals innovation. And so, innovation
tends to be a buzzword. But what does it mean? And that’s really
a definition that you have to come to yourself. And there’s
lots of ways to get to a finished product. But we all get
there through multiple changes, changes over time, help
with community members that help us
challenge our thinking and try new things. So, hopefully we can
do a little bit of that over the next few days as you guys share and learn and get to know
each other. I’m gonna leave it there. But I think there’s gonna
be some QA if anybody has any questions for
me. SPEAKER: Does anybody have any
questions? Come right over here to the — whoa. Right over here.
To the side of the stage. I want to personally say thank you,
Tina. Because in Kansas City I’m one
of the organizers of the WordCamp in Kansas City. And for
the first few years I was involved on the team, the Sprint
Accelerator donated space for us to host part of our WordCamp.
So, thank you very much for that, Tina. Does anybody have any questions? I can bring a mic to you if
you’re just lazy. All right. Well, everybody, say thank you
to Tina. And if you — oh! Oh, wait, we got one! We got one! AUDIENCE: My name is Hodge from
Detroit, Michigan. I have a question. If someone is looking for an an
accelerator, what would determine the criteria that they would
have? TINA: That’s a great question. There are hundreds of
accelerators throughout the world and lots of different
formats. With the DFA and Sprint Accelerator, we’re looking for
strategic alignment. We’re pretty specific on what we’re
looking for. I think founders should be just as specific to
what they’re looking for. You’re going to be giving a lot
of time to an accelerator program. Even 90 days — like, 90 days
dedicated to any type of program in
accelerators are pretty intense. You should know what you want to
get out of an accelerator before you go into it. And you should really spend some
time understanding what the program is that you’re applying
for. There’s a match out there for
any business and for sort of anything that you’re looking for as far as an
outcome goes. And ask questions. Don’t just accept
that they’re gonna make it right for you. But ask questions and
know what you want to get out of it.
AUDIENCE: Hi. Since we’re streaming online. I have an
online question. The person that submitted the question wanted to
know what challenges did you face in developing the Sprint
Accelerator. TINA: So many. I think we could do a whole
nother talk probably on that. So, the biggest challenge is
really trying to get a large organization like Sprint or Dairy Farmers of
America, or name a big company in your city,
really, to understand this ideal of what is an accelerator. It’s becoming more well known
now. But when we were pitching it in 2012, there weren’t a lot
of corporations that were really doing this type of thing and so,
our biggest hurdle was trying to explain that. And once we were able it able to explain what the format
was and why it was a good idea, then it
was a lot easier. But it definitely takes some time as
far as the education piece goes. For sure.
AUDIENCE: I was curious about the part, I think you mentioned,
you know, mostly you work with founders and startups. But you
also mentioned that you work with over 40 corporations,
right? Like existing corporations. So, I was curious — I guess
this might be like a two-part question. I
don’t know if that’s allowed. If not, that’s cool. But I was
curious on like working with both founders at a startup level
and then existing corporations, was
there a lot of overlap in between on
what you actually did with them, I guess? And what you would look at to
create innovation with them? Like, were they similar or
different in certain ways? And also, I was curious on like
the corporate level for existing corporations, how do you — how
would you bring innovation to them that, you know, might be entrenched in —
or like an industry for a long time or been around for a long
time? TINA: Great questions. I’ll try
and remember them both as I start to answer. So, there’s a lot of
similarityies between corporations and the
startup founders. The biggest difference is size. Really. I mean, they’re both in business
. So, what they’re trying to achieve as far as business growth,
acquiring customers, sales channels,
marketing, development, new products. Those things align pretty well. And, again, what you’re dealing
with is size and capacity when you’re talking about a
corporation. When you say “Entrenched,” when
you think of large corporations, I think they’re all sort of
entrenched, right? That’s how they got so big. It’s
always a challenge. So, changing a company culture
is a big challenge. Part of what we do, again, with
the 90-day program is, how do you
find external innovations that you need inside of a large
organization to help you grow and bring them in? We’re also looking at
programming for internal ideas and how do you get those
commercialized out when they’re sort of on the edge of the large
corporation? That’s a tricky piece. Because I P and ownership and
risk to a large corporation. But then the other piece is
leadership development. And that’s been a key focus for one
of our team members over the last couple years. And that is integral in sort of
how both of those innovation pieces
come together, right? So, it takes a different type of
leadership to drive these ideas forward. Whether they’re external to a
large organization or internal to a large organization. So, how do we support those
leaders as they grow and continue to sort
of fight the status quo, so to speak? And so, that’s what we look at.
We have three main areas. And we kind of cut across all three of
those. I wouldn’t say — we have lots of areas that we still need
to grow in and improve on. And iterate to the innovation formula. But,
you know, we keep working at it every day just like our founders
and leaders do. SPEAKER: Thank you very much,
Tina! TINA: Thank you, everybody.
[ Applause ] SPEAKER: And your next session
in this room is at 10 a.m. Open source, open process, open
web. See you back here soon. Open Source, Open Process, Open
Web Helen Hou-Sandi SPEAKER: Hello, everybody! Welcome to WordCamp US 2019! How was your first session of
the day? Got some thumbs up, claps, my
name is Travis, I will be the host until lunch. I’m sure you
have heard everything, silence your cell phones and devices.
You have been to conferences before, if you haven’t been that person,
don’t let it happen today. The far back corner, leave seats
by the aisle so people don’t disturb others. Let’s see, if
you have accessibility needs or questions of any sort,
find anybody in a volunteer shirt or
black lanyard. The organizers. The red shirts are volunteers.
There is a Q&A after this session. We’ve set up microphones in the
front corners. Any time you have a question, get in line over
there. We need all questions to go through the microphone for
the live streaming. And if you would like to speak with our presenters in length, wait until
the session is over. So, keep your questions short
and concise. Unless there aren’t a lot of questions, we can go a
little more in-depth in that case. Everyone, please come to
the contributor day on Sunday. If you have never been to a
contributor day and want to know what it’s about, visit the get
involved table in the sponsor hall. Contributor day is about
how to get involved with the WordPress program in your
community. Or online. Let’s see. Reminder, WordPress party is
tonight at the City Museum at 7:00. You do need your badge. If
you’re a kid, you have to come with an adult. Don’t just ditch
your parents and come. So, welcome to our 10 a.m.
session, open source, open process, open web with Helen
Hou-Sandi. Helen is the directer of open source initiatives at 10 up and a
WordPress lead developer. She shapes products, UX and
engineering within the realm of open source and open
communities. Welcome, Helen. [ Applause ]
HELEN: All right. This is an intimidatedly large room. It
looks empty. Relying on people to nod and make me feel like I’m
doing good here. All right. So, he introduced me. So, yes, I’m
Helen. I am here from San Jose, Costa
Rica, which is where I live. I’m otherwise a New Yorker-Virginian
which is why I sound the way that I do. So, what I want to
talk to you about today, there was a talk right before this,
actually, I think over in room 230, about WordPress and the
open web. And it being a platform for building on and for
the open web. So, we’re gonna build on that type of topic a
little bit and talk about the history of open source, what
does open source even mean? What does it mean to have an
open process? Right? Why is — is open source good enough, or do we need to have an an open process on top of that
and is that in support of an open web? Get right into it.
I’m not a history lecturer. I apologize if I say something
that is not completely accurate. And I think also there are a lot
of different definitions and takes on what is open source in
the first place. I will talk about a couple of those in this
talk. But we may disagree, and that’s
also completely fine. You just probably don’t need to berate me
about it on mic here. But we can definitely disagree and talk
about it. So, what is open source? I think that if you’re
here at WordCamp and you’re here at this talk, as opposed to a
couple of other ones, you probably have somewhat more
knowledge of what these things are. But as I said, you know,
there are different view points on this. So, I want us to at least get on
the same page for the purpose of
this talk. This is the open source initiative’s definition
of open source. Open source doesn’t just mean
access to the source code. And that the license must not
discriminate against any person or group of persons or restrict
anyone from making use of the program in a specific field of
endeavor. I don’t know how to make that clearer. But it’s basically — it’s
accessible to everyone. This is the Free Software
Foundation’s definition of free software. And I’ll talk about
that in a second. You might have seen this before. This is on the WordPress credits
screen. While there’s an about page, a credits screen and the
freedoms screen. So, these are the four freedoms and they are
numbers from zero on purpose. So, you’ll hear about people
talking about freedom zero, freedom one.
And so,er in numbered specifically this way. So, zero
is the freedom to run program as you wish for any purpose. So,
that reflects what we just saw from the OSI. Freedom one is
the freedom to study how program works and change it. And that
covers a lot of what we do in working on WordPress itself,
right? Is that anybody can come in and think, you know? I think
that this would be a meaningful change for WordPress and can
give it back and should give it back. Freedom two is the freedom
to redistribute copies so you can
help your neighbor. Freedom three, the freedom to distribute
copies of your modified versions to other. And a thing we frequently hear
is that we’re talking about free as in speech, not as in beer.
And so, this is a terminology and language issue where “Free”
can mean mull multiple things. There’s
free where it doesn’t have a price, that is true for
WordPress and a lot of things surrounding WordPress. But when
we’re talking about free software, we’re talking about
free as in freedom. That you are free to do X thing, that you are
free to do Y thing. And so, when we think about
these four freedoms and we think about free software, the free software
movement focuses on not just giving you
these freedoms, but protecting these freedoms. And so, when we
talk about the WordPress license and the GPL,
that is a format, you know, a formal
formalization of protecting these freedoms. Saying that it
isn’t just that you are free to redistribute these copies when
you’ve modified them, but that you are required to so that everybody
else can continue to learn from them. Look, everybody. I’m
meaning. This is my first-ever funny
slide I think in a talk. I just never put them. So, this is, I
think, something that’s really important to talk about when we
talk about free versus open source software. They actually are two separate
concepts and they come from different backgrounds, different
people, interesting people in the
history of open source. But free software is itself a political
movement. And so, we hear sometimes when
we’re working on software, why do you have to make everything
political? This should not be political. But it is by
definition, politics. There is the practical aspect of
actually working on a project as large as WordPress. Which is
that you are working on an open community public good in public.
Right? So Is that not what politicians
do? But more fundamentally, the free
software movement about politics. It is about taking the
power from corporations right at that point in history where they
were. I’m not sure they foresaw
Microsoft being on GitHub with a bunch of repos. But at that
point in time, the intention was to take the power that had
really consolidated with a few corporations. Something I think
we’re see again today, and bring that back to the user. And I
think that some of that also gets lost, especially when we
talk about it in the framework of WordPress. Because of, again,
different definitions for the same word, right? A user, when we talk about users
in WordPress land, we’re frequently referring to end
users. The people who are sitting at the computer using
whatever interaction device to use WordPress itself. And that’s what we think about
when we think about users in the WordPress context. But in the
software context, we talk about user freedoms, about bringing
power back to the users, the user is anybody who is
interacting with your software in any way. Whether that’s
downloading it, whether that’s modifying it, developing with it
or for it. Those are all different types of users. But when we talk about free
software, they don’t distinguish between different groups, right?
Everybody in those groups is a user. That’s what we mean when
we talk about user freedoms, it is for everybody, right? So,
when we think about licensing, when we think about the GPL and
why does WordPress love it so much? And why do we have
policies like at WordCamps around making sure that we are
upholding not just the law of the GPL, the letter of the GPL,
but also the spirit of it? And it’s important because it
protects the users. Right? And we’re not talking about, again, we’re not just talking about
people who are directly interacting with the WordPress
UI. We’re talking about anybody who might want to change
something about WordPress, right? And for the rest of us
who are also working on WordPress. We don’t want them to
take their changes that could be improvements and keep them to
themselves and to profit off of them and to take that
power and take it away from us as a community and put it back
in the hands of a large business or a corporation or somebody
else, right? We want all of that knowledge and all of that
power to continue to be shared in the community. And that’s
what is to important about something like the GPL. Whether
you like it as a license or not, right? That’s okay. We can
disagree about that, again. But that is what is so fundamentally
important about the GPL and WordPress and that relationship.
And it is also codified in the law of the license in that if
you make something that derives from WordPress directly, you
know, we could challenge what does it mean to derive
meaningfully and directly? But if you do, you must inherent
the license so that it continues into the future and we can all
continue to spread our knowledge. So, WordPress, the WordPress
project. What we’re all here about. WordPress is more than
just an open source project. Right? It is a project with an
open process. So, it is extremely possible for
a project to be open source, to
have its source code available, to be allowed to remix it, to do
things with it, but not to have the development of the process
be open. And I think that’s something that is really amazing
about WordPress. I went to my first WordCamp
almost 107 10 years ago. And it was, to me, at least, it
was an expression of that open process. Right? Where it wasn’t just a bunch of
people who made WordPress behind the scenes, but instead they
were coming together at a conference with hundreds or
sometimes even thousands of people and talking about to the
just what they’re doing with WordPress, but what Nair
doing they’re doing to make WordPress better in the future.
And that was super cool and something I wanted to be a part
of. Here I am. I have been at 10up for 8 years. Which is a very long time to be
at any company, especially in the tech
space. I don’t want to get too deep
into it, there are a lot of talks, right now one of my coworkers is talking about
contributing to WordPress as a — as was mentioned, there is a
Contributor Day on Sunday. Which is great to go to. Even if
you feel like I don’t know how to code, there are lots of
different ways to give back to a project. Documentation, trans
translations, all of that. That is all part of having an open
process where anybody can participate. And I think it’s an important
goal to have to keep that process open and to continue
making it more open, right? To find different avenues for
different people to participate. More than just is my software
accessible? But also is the process of making my software
accessible to many? This was something I saw recently that is
very pointed in the way that it’s phrased. But I thought that it was a good
way to think about it. And this is” Stop streeting open
source like a product you purchased, and start treating it like a team you
belong to] this goes back, again, to the
underpinnings of free software. Where we have taken the
ownership of this product somewhat away from companies.
And we have sponsorships and that sort of thing. But really
the ownership of it is community-based, right if and
therefore, it is a team that we all belong to. We may not actively participate
in that team. We may not want to be a part of
that team. But once you’re participating, once you’re using
open source software, you are a part of that team, right?
Testers are part of that team. And if you’re using WordPress,
you’re testing it. Because you’re probably finding
bug bugs or things that could be
better about WordPress. I have to plug this. We have
been putting together a set of open source best practices at
10up. I’m a director there. And so, this is a lot about the
process. So, some about the philosophy behind it, but a lot
about how we actually execute on that process. And I think that
that’s something that I would like to see more of
across not just the WordPress space, but across tech in
general is like how do we approach open source? How do we
think about having an open process as an important part of
having open source, right? Is we have a lot of large
companies. And we could do this at 10up
too, right? We could just have these things where you could
have the code and you could do stuff with it. But we don’t
actually welcome people into participating in our projects.
And that’s not what we want. We want to be very deliberate about including people and saying,
this is how you can participate. These are ways you might be able
to do it, these are the ways we expect things to be phrased,
these are the ways we expect people to communicate
with each other in a respectful and timely manner. We have put
this together, hopefully interesting reading for people.
It is a living document and an open source project. So, if you have things that you
think can improve it or find a typo or whatever, we are happy
to take your reports of things that could be improved there.
All right. So, moving on to what is the
open web? I asked this question, what does
the open web mean to you? I asked this question on our
favorite bird website a while back. And I don’t think a single
person agreed on what it means. And that’s — it’s fascinating
to me. If you ask me what I think the open web means, I
don’t think that I can tell you. Because it means a thousand
different things and almost nothing at the same time. But we
should still talk about it. So, talking about the open web,
here are some common terms that come up in the WordPress context
around the open web. So, RSS and now APIs are like
the REST API, public access to that. Pingbacks and trackbacks.
Very contentious. But interesting things. Important
things. Exporting and being self-hosted.
So, why are these things are part of the open web? And why do we talk about these
as like fundamentals of how WordPress as a piece of software
has APIs that interact and support the open web? So, these
are things that are openly available as a part of the
software. Right? So, RSS feeds are public. Some of the JSON REST API. Like you can’t make new posts.
But you can see the latest set of posts publicly in the REST
API on a site. This is a way for anybody to be able to interact
with your site, right? So, like an RSS reader, again, this takes
the power away from the website serving the content, right? It takes the power away from
their advertising model. It takes the power away from the
way they’ve decided to present that content and puts that power
back in your hands as a reader you can ingest the
content in a way that you want to and makes sense for you. These concepts are very concepts
are very similar, as you’ll see between open us and out open
web. Pingbacks and trackbacks are a
way of connecting content between
sites. There are more contentious,
especially in recent years with Spam and
abuse of these features. But they are being ways to alert
somebody that somebody else is talking about your content. Somebody sent a trackback to you
to let you know that they have linked to your site and
something that they’re talking about. This comes up a lot when
we think about what would it be like if we had social media that
was not a single large company? Right? What if we had something
that was what we call federated. I don’t know for how many people
that word is meaningful. But what would it mean to have like
a federated social media network
where the power of ownership of your content does not lie with a
single company, but rather lies with you? And we tie each of
your individual instances of your content together in some
way. And that’s what pingbacks and trackbacks were meant to be.
And I think that’s something that would be really nice to
revisit in the context of really now thinking about what we know
about bad actors. And how could we design these in a way to make
it useful for connecting people’s sites, for connecting
people’s content without centralizing the storage of
that. Exporting your content, also very important. So, that you are not tied to
that piece of software, right? Let’s say WordPress went rogue
somehow. Somebody took control of it and did something bad and
you don’t like it anymore. You can export your content.
Hopefully they will not have turned that off at that point.
But you should be able to export your content at any time and
take it somewhere else. The content should be yours and it
should be portable. And this also ties into being
self-hosted. We should reduce barriers to using the software
by providing things like hosted versions and whatever. But the
ability to run that software on your own, should you choose to,
is also very important. The web itself is also built on
top of a lot of things that we call
open web technologies. So, this also kind of mixes up
terminology a bit. These are ones that are very common in the WordPress space, HTML, CSS,
JavaScript, common across the web broadly, and PHP and SQL are
technologies. This is not necessarily that they are open
source. For instance, CSS itself doesn’t
have a source, per se. But what it does have is it has a spec
and an open process that you can observe and somewhat participate
in. And so, we call that an open technology because it is
developed in the open. Right? The things surrounding it. And
then on top of that, a lot of the browsers where the CSS is
interpreted, rendering engine, a lot of those now are also both open source and with
an open process. So, these technologyies, and we
like to think about what are the open web and we use open
technologies. But I really want us to take a step back and now think about what
got you into web development in the first place? So, take a
second and think about, what was the first time you did something with HTML? This is
gonna date me, I guess. Now you’ll be able to guess how
would I am. For me, my first real memory of messing with HTML was my AIM profile
which had a 1kb limit. And I wanted to squeeze as much in
there as possible as a teen girl. So, I went in and found out that
a lot of colors could be represented with three
characters in the hex code instead of six. Therefore saving
me characters and I could add just like one more
lyric to my profile or whatever. That’s really my first memory of
doing something with like an open web technology. I didn’t think of it as an open
web technology. I probably would have laughed at you if you told
me that was what I was doing. But it was — it makes me think
a lot about why we do what we’re doing, right? Why do we stay
doing these things and it’s not really about the technology. Or
hopefully it’s not really about the technology. It’s about what
we can do with the technology. What we can accomplish with it.
Whether that seems like something that’s silly now in
mind sight or something that is extremely meaningful. But what I
want us to think about more and more is not just, you know, what
technologies am I using? Is it the latest and greatest?
Is it something super open? But what are we doing with that
technology and how are we sharing that technology back
with people even if we’re not compelled to with the licensing.
There’s a tool that’s super cool now called Glitch. Has anybody heard of Glitch in
this room? More than I was expecting, actually. So, it’s got this very
GeoCitiess esthetic which I obviously love. But it’s an open playground for
code and for modern web applications. Where you have
your source code and you can edit it and you get an actual
instance of the code running spun up that anybody can see.
But also, anybody can see that code. And they can remix it and
take that project of yours and do something else cool with it
and extend it or make it do something else. And that’s
something that I think is really cool. So, the Glitch product itself,
I don’t know how much of that part is open sourced, but the
fact that it is supporting that kind of knowledge sharing is
really cool. So, we can see that intersection of, yeah, we have a
product, we have a company that’s built on top of
something. But we’re still supporting this knowledge
sharing. This bringing the power back to our users. Okay. So, I want to go back now to
these four freedoms. And how we think about these
freedoms. And how we think about them as
licensing for software. Okay? So, again, the four freedoms,
I’ll read them out again. And then these common things that we
think about in terms of supporting the open web. Now, here are some other things
in the WordPress space that I think are in support of those goals of user
freedom. And not from a licenseing
perspective, but from a support of the open web perspective,
right? Where we take those user freedoms and we support both the spirit of
the GPL, and also that user freedom that
the GPL is about in the first place and that open web.
Backwards compatibility. Everybody’s favorite topic —
That’s actually the second one is everybody’s favorite topic.
Backwards compatibility. Important here. Because if we
keep breaking things, what happens to sites? What happens to that content,
right if? If we don’t maintain compatibility, especially in
certain aspects of WordPress, around APIs or CSS, what happens
to people’s content if they stop maintaining their sites? But we
still want their content out there, right? We still want to
have that out there. We still want that as part of the web.
And to be able to continue to access it. And that also ties
into thing like security updates or autoupdates. Which you can debate about
tomorrow with the panel. And, again, how do we keep sites
online? How do we keep that content
available? Because our priority is not the technology underneath
it, right? The priority is the content and the experience of creating that
content and consuming that content. Right? And so, when we
think about what are our priorities and how do we support
the open web, it is having that
content continue to be available, continue to be able
to create that content and to consume it that is more
important than the actual technology itself. Accessibility in all manners. Which is also related, very
tightly related, to adaptive design. And this is making sure
that the software and the content and everything related
to it is available to all. And we really mean all. We don’t
mean most people in most circumstances, we mean all.
Right? And how do we continue to make gains on that front to
support user freedom? And finally, autolow barrier of
entry. We talk about easy installs and the availability of
the software and the size of the software that you’re downloading
and everything. And that’s also part of
maintaining that user freedom so that you’re able to be a part of
it. And to really feel like you’re a part of it. This is something I saw not long
ago. There’s dates, six weeks ago,
that really summarized the way that I have been thinking about
these things recently. And that, again, you may not
agree, and that’s okay. But is a really good thing to internalize
and think about. And I will read it. So, user freedom requires
more than the four freedoms. It requires marginalized users
having a say in the software. Being able to customize it to
better meet their needs regardless of their technical
ability. It requires software that serves the needs of humanity, not the rich. So, if we go back to this
definition of open source, so, now I’m gonna
tell you that I actually don’t like this definition of open
source. And the reason why I don’t like it is because it only
talks about the license. Right? The license must not
discriminate against any person or group of persons or restrict
anyone from making use of the program. I think it makes sense
to dial in what you’re focusing on in any given moment, right?
But to me, the definition of open source has to go beyond
this. It has to go beyond what does the license permit or not
permit? And in the open source sense, it’s going to continue to
permit a lot of things we probably don’t want it too
permit. WordPress is being used for lots of things that I
personally would rather it not be used for. But that would
violate the spirit of open source if I said you cannot use
it because you’re a jerk. Right? That’s to the how open source
works. But open source includes open
processes, right? And that’s why things like having a code of conduct and the values
that your code of conduct are protecting, that’s important. We
cannot have open source software or open community it is we don’t
think about who do we want this to be
for? Do we really mean everybody? And how do we
protect that and prove that and execute on that as we
create this software? This is something that I saw recently,
again. Everything is very recent in my
mind. This is something I saw recently
about open source that really, really
reminded me of why this is so exciting for me. And why open
source continues to be exciting. Why it continues to be such an
amazing place to work in and space to be in. Whether it’s
WordPress or not. But just directly interacting in
open source software. And the open source, you know,
philosophies. And so, this is — this is on
Medium, of course. But it’s a piece from somebody
about a project that they call the
Lydian Accelerator. It is about genetic mutations and open
sourcing a database around creating individualized
treatments for individual genetic mutations in order to,
hopefully, save their baby and then millions of others into the
future. I encourage you to look it up and read the whole thing.
This is a paragraph it. Not going to read the whole thing.
But what I thought was really important, and this is, again,
really highlighting the open source nature of it and what
they intend for this project to be. Which is, again, not for
something for pharmaceutical companies to own and attempt to
profit off of. Which is why these treatments probably don’t
exist in the first place. To have these individualized
treatments is is not a profitable,
marketable thing. But rather they’re making it, again,
bringing the power back to the users, in this case, the parents
and the physicians associated with the parents. So, their talking about N of
ones. This is the individualized treatments. But anybody
performing an N-of-1 should be able to tap into this
repository, this centralized bath base of
treatments how they’ve worked, haven’t worked, efficacy, all of
that. As long as they contribute back to it. And I think that
that’s an amazing thing. And I really hope that this is
something that is successful. I’m going to continue following
along with it. But it does remind me that, you
know, as we’re working on the software and all of that, which
I also do, we still have to think about making our software,
making our open source, open processes for humans. Right?
What are we enabling as we continue to work on these
projects? What do we want to enable,
right? How could we design our software? How could we design
licenses? How could we design codes of conduct? How could we
design events? How could we design anything surrounding our
open source projects to really make it about humans? To think
about what we want to enable. To think about what we could enable
and the cool things that people might be able to do for the
betterment of everybody else. And that’s it for me. Thank you. [ Applause ] SPEAKER: If you have any
questions, please come to the front corners of the seating
area. HELEN: I don’t know what kind of
questions people will have. So, this is the part I’m most
afraid of. AUDIENCE: I’m curious — I’m
curious about your thoughts on the
Hippocratic license and other do no harm licenses and what our responsibilities,
if any, are as developers to ensure our
code doesn’t get used for evil. HELEN: Okay. Yeah. So, for some background on this.
This is — I think it’s a topic that’s been around for a long
time. I don’t know that I’ve kept up with it over a long
period of time. But there’s the concept of licenses that
explicitly say do no harm. Right? So, there’s one, I think
it’s called the Hippocratic license that’s — I think it’s donoharm.dev I think
is the domain for it. Where it explicitly states — I
don’t remember the language, but it
explicitly states you cannot use the software to do harm. Some of
this is in reaction to recent events. Like I said, these are
long-running discussions and conversations in open source.
This is not a new concept. But a lot of I think attention on that
recently has been around specific events, right? So, who
is using open source? Who is using open source
technology to further negative causes, right? The imprisonment
of people or the suppression of people in particular. And then also when I said
“Interesting people,” that’s me, using family-friendly language
in my WordCamp talk. But some of the heads, the figure heads of
open source? History. You know, like 30, 40 years ago are people who have always been
known to not be, you know, good or kind to other people around
them. Especially in many certain
intersections of power and gender. So, a lot of it is also
thinking about like how do we protect ourselves from people
like that collecting power, right? In the name of restoring the
power to users. I am to the a lawyer, right? That’s what
we’re supposed to say before we launch into discussions about
these topics. It is really hard for me to reconcile the idea of restricting our
license with the true nature of free software, right? When we
talk about WordPress specifically at free software
and not just open source software because of the GPL. You can look up whose project
the FSF and the GPL was in the first place if you want to know
what kind of people I’m talking about. But it is really hard to
reconcile those two concepts. And I don’t know about from a
legal standpoint. But certainly from a person
working in free software, it is really hard to reconcile the
idea of preventing people from using software. Even though I
personally would love to. Right? But it is really hard to
reconcile those ideas of licensing your software. Now, it would be great if you
are processes kept those people out, right? And prevented them from
collecting power. But I don’t know about the license. And the oh thing there, I’m
gonna lose — about this license is that at least in the GPL in the four freedoms
sense, that second freedom, that
freedom to — to — I don’t want to like
misquote it. Let’s go back. To study how program works and
change it, that freedom to fork a piece of software is also really central
to this, right? So, can we cite that freedom as,
you know, what — is that gonna mic it impossible to enforce
nobody being able to use something derived from my
software because they can always take it and change it, right?
But that is also important for us. Because we can make, at
least, more ethical decisions in our own
software as much as we can. And then if a bad actor wants to
use it, then they have to go change it, right? So, the power does lie with us
to at least make ethical choices as much as we can. But in terms
of licensing preventing things, I don’t know.
AUDIENCE: Here we go. I have a question from online. How do you
think the open source community, the future will be
influenced by voice technology that’s being developed? HELEN: Wow. I don’t know if I’ve
ever thought about those two things together before. For me,
I think anything that allows more people to participate in
ways that are more accessible to them is a great thing, right?
Again, you have to have things like a code of conduct in place
so that you define, you know, their behaviors that you want to
see. Right? But the methods of accessing your process, your
software, your communities, do not define the behaviors
themselves. Right? So, anything that opens up
participation in my opinion is a good thing.
AUDIENCE: Is there anything that you can think of or that you
have in mind that we, as the WordPress community,
should be thinking about and focusing
on to do better? Anything specific?
HELEN: Yeah. I’m not lecturing the community. I — I think that there are a
lot of topics where we kind of paint them as being black and
white, right? And even in the course of my talk, I’m talking about things like, this
is what freedom means, all of that. But it’s really important
to continue to remember, especially in the process aspect
of things, right? When you have an open process for a project,
it is really easy for people observing that open process to
feel like they are watching decisions being made as a
opposed to being able to participate in that decision
making process. And I think that that’s something that,
especially at the scale that WordPress has reached, right?
There’s a lot that’s different between what I first started
contributing to WordPress and today. And I think at the scale
where we are now, it is really easy to feel
like you’re just watching it go by and the openness of the
process is meaningless because all it means is you can look at
it, but it doesn’t mean you can participate in it. I think
that’s a very understandable feeling. But at the same time I
would implore the community to really think about how they’re
phrasing these things in the dialogues that we have with each
other, right? And to remind each other that it
may not feel good right now. We may disagree with things. We may
not feel like we’re being listened to or something is not
going well or doom is coming because of X change. But it’s
really important to remember that we can continue to talk
about it, right? That we have events like this
where we can come together and discuss something like auto-updates with
hopefully no produce being thrown at anybody on stage,
right? So, that’s something that I would really like to see
more of, right? Is more — more acceptance that
not all conversations are going to be nuanced. But that we
should be able to aim for more nuance in our discussions about
things. And to be able to remember that, you know, the
process is only as open as we are making it as a community at
large. Right? The open process has to be a product of everybody
participating in it and everybody understanding that it
is an open process. Otherwise it will, you know, by itself become
closed if people don’t continue to push to participate. AUDIENCE: There I am. Thanks for
being here and thanks for giving this talk. You referenced the
departure of a number of people from the open
source — I don’t know, let’s say, community, loose community. And some people who are very
powerful, but also very abusive. And I think a lot of us see open
source technologists kind of examining what that means about the values that
we have kind of passively held for a
long time. And maybe engaging in a process of redefining what those collective
values are. And so, I’m real curious, as you participate in
that process of kind of with other people, but also
internally, what do you hope we hold on to? And what would you
like to see us let go of? HELEN: Yeah. That’s obviously
like a lot of why — I changed a lot of what this talk was about
in the last six to eight weeks because of current events.
Because it really made me think about, why am I doing this? Why
open source at all? If we have horrible, abusive people. Also
from background, I come from classical music. My degree is in classical music.
And classical music is very much the same as this for a lot of
reasons. And most recently that example is the collection of power with a few
very abusive mostly men in these communities who are well-known.
Who are protected by their power. And should not have been.
Right? But everybody was come police it come in it for decades. Google classical music scandals,
that’s what you see. I love classical music, I don’t want to
deal with this anymore. But it was known. It was what we call
like an open secret, right? Where these people were this
way. And so, when I think about,
what’s gonna happen? Is there really a vacuum of
power? What’s going to happen as we challenge what our values have been,
passively or actively, it comes down to for
me remembering who we’re making the software for. What they’re
going to do with the software. That should be for the
betterment of people, not to abuse other people, but for the
betterment of each other. AUDIENCE: Hi. Thank you for
everything you shared. And you mentioned the document
from 10up, the best practices. I’m assuming that that’s open
for us just to find on the web?
HELEN: Yeah. I really should have put a URL on that slide. It’s like 10upup.gitHub. io.
Yeah. AUDIENCE: The question I have
about that is, as a plugin developer, do
you have any information about how everything should be priced?
Because when you look at the four freedoms, I kind of have a hard
time understanding, you know, I’ll just — you know, all the booths that
are out there, if they’re a plugin developer, they’re having to sell
something. And then when you stop paying, then you don’t
necessarily get it updated. So, do you have any information
on how to structure that in a way that really makes sense to
the whole community? It just doesn’t seem to be clear
to me. HELEN: Yeah. Some of that is
because it is not clear to anybody I think generally.
But also it’s always changing. The landscape of what we’re
looking at is always changing. So, historically we’ve seen a
lot of pricing models around support and being able to
continue to update the plugins to get the latest and greatest.
Whether that’s what WordPress core does and split a path between
continuing updates and continuing feature development.
That’s up to that company. And something we’ve seen really rise
in the last several years is you pay to access a service that is
behind the thing that you’re on. One thing that we work on at
10up that is a free plugin itself, but the usage of it is not like free as in
cost is a plugin called Classify. Which ties into various cloud
services in order to do like AI, machine learning analysis of
your content. Right? So, it has some really cool things that I
think support the open web, right? Like automatically creating alt
text for your images so they’re more accessible for everybody.
Both to people who are looking at your website, and also to you
so you can search for those things later, right? You don’t just have everything
with like image 2048 as a file name for you to search for
later. But at the same time, like those services, like, the
machine learning itself and the ability to upload it and process
it, the power behind that, those are all things that cost money,
right? And so, we’re providing a
gateway for it that itself is free. But it does in the end, right,
cost the user money. And then, you know, the — I
mean, this entire ecosystem. A lot of it is built around
services. That’s what 10up is, we’re a service company. There’s
so much that you can do without having to close the software. And I think that that’s — it’s
tricky, right? It’s not easy, right? And I think the easiest
thing to think of is to close down the source of your software
and sell access to the source of your software, right? And so, this tends to be the
easiest we way to think about it. Especially with the way
businesses operate, how do you report profits and cost
acquisition? All that sort of thing. That
tends to be the route people take to close down that source. It takes creative creativity to
look at what prices works for you and
what that ties into. I’m not a business person for a
reason. I don’t have specific pricing advice. But that’s why it could be a
convoluted topic. SPEAKER: All right, final
question. AUDIENCE: Thanks for this. This
is not a question from me, it’s from Rachel Cherry on the
livestream. HELEN: I’m legitimately shocked.
AUDIENCE: Hey, Rachel, I’m going to paraphrase this. It’s in the
middle of a chat. You mentioned the history of open source came
from trying to break power away from corporations and give it to
the people. And you also kind of side mentioned that there’s some
power consolidation happening around corporations. So, the
question is, how do you reconcile the spirit of open
source and the open web in projects when the projects are
led by or influenced by people whose main priorities have to
align with profit margins for corporations? HELEN: So, I think that — I
think that I actually surprised — disagree with part of that
premise, which is that the motivation behind the changes
is that profit. Right? So, I think that in order to
sponsor software development, and this is something that the
open source community broadly is struggling with,
there has been some really interesting things recently. You can see about a funding
expert for like npm packages that went
over really poorly. But these are things that are fascinating
and are very much the current hot topic. Which is how do we
fund open source software development, right? And even several years back,
that curl vulnerability — curl? No, SSL. It was
discovered that it is like the part-time semi-sponsored work of
one person. Of this fundamental thing to
security on the Internet. And so, that’s something that’s
really I think become a current topic. In the way that we live,
because we live in a society, how do we fund this work?
Right? And what are those mechanisms of funding? And how
is that funding motivated? Right? So, I think that it is
very easy to see a company seeking to make a
profit, right? But if it’s not clear to people, you know, how
it’s making those decisions, and it probably isn’t,
externally, right? Because these are private
companies and they do private things. It is really easy once
you add open source software to it to assume that the part that
you can see is the motivation for the parts that you can’t
see. And so, I think that I — I disagree with that, right? So,
like if we think about in the WordPress space, who are large
companies that are supporting the development of WordPress,
right? How do they derive their profit? And are they making
changes specifically to maximize that profit? I don’t think so.
Right? I’m a part of a not huge
company, but 10up is about 180. It’s a fairly large company at
this point. And so, what are our motivations
for working on WordPress, right? Like, we could be asked the same
question. If I make a change in WordPress,
am I going to be questioned about am I maximizing profit
from one customer of 10up, right? And the honest answer
for me is going to be no. And I think that we should assume good
faith from other people, right? And I don’t — to me, it’s that
I don’t see that happening in the WordPress space. Which
continues to be shocking, right? I wait for it to happen.
I wait for somebody to come in and say, I want this change
because it’s gonna make me more money. Right? Somebody just
come out and baldly say it. Which I would probably have to
respect because they’re just coming out and saying it. And
then tell them no. But I do think that this community, one
of the things that’s been so amazing about it, and what’s
kept me in it for as long as I have been in it, is that
genuinely we don’t see that happening, right? And so, if I
think about something like Automattic which I assume is
something that’s being pointed at here, but something like
10up. Yes, we are maximizing our profits. We are businesses in an
American society. We’re American companies, right? With remote
employees. But we’re American companies, maximizing profits.
But we’re not doing it at the expense of open source software.
We’re doing it so that we can continue to support open source
software. And that does mean that we’re bringing our
learnings into it. But I don’t think that means that we’re doing it for the sake you have
of our businesses in that way. All right. I’ll be around. Thank
you. AUDIENCE: Thank you very much.
If you would like to continue your conversation with Helen,
she’ll be around here for at least a few moments, right? All
right. Our next session is in here at
11 average, user personas as an inexclusive design and
development tool. See you all in about 15 minutes. User Personas as an Inclusive
Design and Development Tool Carie Fisher SPEAKER: Hey, everybody! That’s
right. I talk loud. I don’t even need this microphone if they
didn’t make me have it. All right. So, welcome to the 11
a.m. session. And welcome to WordCamp US 2019!
[ Applause ] Yeah. Make sure you silence all
your devices. Those of you who have never had it happen to you,
this will be the time. If you’re in that back corner by the door, please scoot in so there’s
extra chairs so anybody who comes in late doesn’t have to
fight for a spot. If you have any accessibility needs or any
additional questions, find a volunteer wearing a red shirt
like mine or anybody wearing a black lanyard is an organizer
and they will be able to help you with any questions that you
have about WordCamp. We’re gonna hold all questions
until the end. We have microphones set up on the front
corners. Any time you have a question, walk over to the area
to get ready for the Q. That will be after the session
when we do questions and answers. And if you would like
to speak with the presenters in length, most of them will be
hanging out a few minutes at least after their sessions. So,
we’re not gonna have conversations in the Q&A part.
Let’s see. Everyone is encouraged to come to
contributor day on Sunday. If you’ve never been to a
Contributor Day, stop down at the sponsor
hall at the get involved table to learn
about Contributor Day and how you can give back to the
WordPress open source project and the communities that you
live. Also, don’t forget, WordPress party is tonight at
City Museum. You need your badge to get in. If you’re a kid, you
have to bring an adult. So, keep that many in mind. Next
I’m going to introduce you to my speaker, I’m Travis, the host
for this last session before lunch. So, we have Carie Fisher
with a user personas as an inclusive design and development
tool. Carie is an author, public
speaker and developer who is passionate about digital
accessibility and promoting diverseity in tech. When not
traveling, gardening, or making a mess of air latest DIY
project, maybe ask about that, she
devotes time to the development communities. Welcome Carie
Fisher. [ Applause ] CARIE: I’m not that Carrie
Fisher. But I’m to talk about design and development tools.
I’m doing this without notes. I might have more details later
that you can get from the links that I have if I forget
something today. Before we get going, show of hands. How many
people are designers in the group? All right. Lots of
designers. How about developers? All right. That’s about 50/50. Anyone else like marketing —
like content maybe? Editors? There’s a few of you. There’s
Kevin. So, this will kind of talk about all of these kind of
groups. Again, my name is Carie Fisher. Right now I’m a senior
accessibility instructor and consultant. I work at a place called Deque. We work with Fortune 500
companies and make their websites accessible,
dumping working on CMSs and frameworks,
and WordPress and Drupal. That’s who I am. Before I did that, I
worked as a frontend developer for about 15 years and so, I have kind of that back
hand knowledge and I’m bringing it into the accessibility world
a little bit. That’s where you can find me. So, today we’re
just going to talk a little bit about — so, how many people
here are familiar with, like, accessibility best practices
like WCAG and that sort of thing? Okay. So, I won’t speak too deeply on
this so we can get time for some of the examples. So, this might
be the first time that you’ve that you canned about accessibility or digital
inclusion. I want to give back ground for
those who haven’t heard about it. And then jump into personas and
then takeaways. I’m practical and I like thinking about accessibility on a kind of
esoteric kind of way. But I like to do things for on the ground.
What can you take away and actually bring to your
organization and implement in the future? All right. So, some
background. Again, we’re gonna talk about
the web accessibility guidelines or WCAG. When we talk
about people familiar disabled, we’re talking about people with mobility impairments,
cognitive impairments, hearing, vision, et cetera. This is one from the CDC talking
about the different percentages of people. We also talk about, you know,
the whole 56.7 million people or 1 billion people in the world
that are self-identifying as having a disability. But that doesn’t include all the
people in the world that can benefit from accessible websites
and apps. The guidelines, especially for people who aren’t
necessarily accessibility specialists or have to really
like kind of get into the nitty gritty,
we kind of talk about the WCAG guidelines more holistically and
more kind of like on the top level. As you get to know
website accessibility, you can get into like super-fine detailed granular
things, just like you could with any sort of tech out there. So,
we like to kind of take it back a little bit. Sometimes for like newer people
to think about it more conceptually. So, again, robust, sorry,
perceivable, operable, understandable and robust. It’s
the POUR acronym. So, we broke that down into kind of these
groups. Perceivable would basically be asking yourself, is
there anything on our website or app that a person with a
disability would not be able to perceive? So, that’s kind of
the understanding. Like the hearing, the sight,
this little icon is a Braille device.
Next is operable. So, you’re asking yourself questions like,
can users control interactive elements on our website or app? Or does our website have any
traps. I see that a lot with keyboard traps, for instance. An easy one for testing keyboard
is using your keyboard. Throwing away your mouse and
pressing tab and trying to interact with everything on a
website. Next is the understandable. Where you’re
asking yourself, is all the content clearly written? Are
all the interactions easy too understand and does the order of
the page make sense? This is one especially with the WCAG 2. 1, there was a refresh recently
last year, address more of these
cognitive needs. Because, again, cognitive going
back to the graph, that is one of the
number one after mobility issues is cognitive. And think of a lot
of people on the web, if you think of someone in a
wheelchair, right? They’re disabled. They have some mobility
impairments. But they might be able to
interact on a website or app, might have full use you have
their fingers. But this other group, this is a huge group.
People with like ADHD, people with Down’s syndrome, people with
dyslexia. And how can we make websites and apps more robust
for them? So, this one’s a very difficult
one to like totally get right. But it’s very important and one
that we’re starting to highlight more in the field of
accessibility. And this last one is robust here. So, we ask
ourselves, does our website only support the newest browsers
or operating systems? Is our website developed with best
practices? And does it work both in landscape and portrait
orientation? This one’s hard. Because if you think about all
the devices that are out there, you think about all the fluidity
that we have now on the web and on apps and how you can’t really
predict the device anymore. If there’s anyone out there who
has been twoing for a while, we remember the advent of like the
mobility, the mobile first, right? 2005 or something it
came. And as a frontend developer, I remember like my
mind being blown by the concept of how do I make this website
work not only on desktop, but on this
like laptop and on this phone? And that was, you know, we had
three break points to design and develop to. And now we have
infinite numbers. So, robust in some ways is
really easy in some ways because we have the fluidity in the web
device. But then we have the new things. Like we have games. We
have watches, wearables, right? So, it’s voice activated
controls, that sort of thing. We’re coming into that new
advent of explosion of technology and how that fits in
with the accessibility sphere. So, this one’s kind of an
interesting one. In case you weren’t aware, it’s
a numeronym, sort for
accessibility, the letters and 11 and why. Today we’re going to talk about
the inclusive design and development in relation tots persona to the
personas. But what I think about design
and development, we’re targeting the 25% of the severe
disabilities in the pyramid that you see over here. We have a pyramid — for those
with low vision, we have a pyramid 25%
severe, 37% mild, 16% minimal, and 21%
no difficulties. And then at the top, specialized products. The
goal here for all of you and when you’re talking about
inclusive design and development is to be targeting that 25%. What you do is by targeting that
25%, everybody underneath that can also use that whatever design or that
code or whatever — in that particular thing that you’re
targeting. I’m going to show an example next. But the extension
is something where specialized tools where
specialty devices like a screenreader Tor
a braille device. You should target the 2% 25%,
not forgetting the top top, but start there and go down. The
example is chooses the inclusive font. Here we have Gil Sans and PM
mono. And we have India, lettuce, and
the number one for cat. And I have the capital I, the lower
case element, and the number one all look the same, like a line. Owen if I don’t know if you have
gotten pass words with the Ls and numbers. And is that an L or
a one? And we have the P and the T and
the B and the Q. If you can flip it in the mirror
and it looks the same, that’s not necessarily an inclusive
font. Whereas on PT mono, you can see clearly the I in India, the L in
lettuce and the 1 in cat are distinct. I’m not going to
confuse the L and the I. And you can see the mini Sans Serifs identifying that
they’re different. We will see that later. Going back to that,
we’ve chose an font. In this case, choosing the font
PT Mono. People with dyslexia or ADHD
might be able to understand it, people with cognitive issues, by
targeting that 25%, everyone underneath that can also
understand it. So, yeah. Also, we talked about thinking about
color and contrast. I’m going to show a couple demos
into that too. Won’t go too far into this. A
lot of designers might be aware that have. But if you’re not,
WCAG that is regulations for large and small font and the
color ratio. You don’t have to memorize it or
guess. There are tons of tools and they’re really great. One of the tools I’m going to
show you goes beyond what some of the automated tools do. Show
that right now. So, this first one here is
called A11y rocks, A11y color palette. Some call it A11y. Does anyone have a fun font or a
favorite hex color? Just yell it out. 2524DA? D5A. Okay. I’m dyslexic this morning. D4A.
I think I got that. Anyone else? Color? FF4388, I think. All right. Any
other ones? Not a big deal. We can do that. All right. We got some great hexes. I use
some of the basic ones as well. The reason why I like this A11y
color palette, could be brand colors
or the ones I’m thinking about doing for any next design. And
I’m going to see the combinations of what works and what’s most
accessible, the color combinations. It’s going to show you the most
robust and accessible first. And, of course, that’s black and
white. But as I go down here, I can see like this peachy orangey
color with black. A little Halloweeny. But you can
see down here where it fails. You can see if it fails, the
ratio. And you get down here and you get like this pink and
orange on top of the orange. And you can see that definitely
isn’t very accessible because if I wrote text on this background with that
collar that color, that combination would fail. This is
also good if you have clients that you’re trying to show,
like, hey, these are the combinations that are gonna work
best on your site so we have that one. This other one that I
really like is called the color contrast analyzer. Because I
think a lot of people, especially in design, you know,
maybe your design’s not in code yet. Maybe you’re still figuring
out you’re in the wireframe or mockup stage and trying to
figure out the palests like we show the. The color contrast
analyzer is really great. And this is good for people
doing assessments or checking Dev. Because automatic color
tester tools are only going to pick up hex
versus hex. They can’t pick up text on top of a gradient or
image, right? These are the places where you can spot check
because this one does not require code. Like you can see
on my cute background here. My little fire and the dogs. As a
designer, I really love that green. I mean, I don’t. But I
might. So, I pick that, right? And I can see right away that if
I wanted to — I’ll swap the sides
— that if I have white text, maybe wasn’t the best choice for
my background. You can see the contrast ratio
of 105 to 1. And if I get in deeper, it will
tell me. This is great for icons. Maybe I want that darker
color. I’m still failing. Maybe guy for the black. Obviously
that will pass. But I really like this tool,
fen, again, because I can pick up on anything. It doesn’t have
to be code. It can just be random. I don’t know that a lot
of people are aware that have tool yet. So, I like to point that out.
All right. So, I’ll move on to personas. So, personas, they answer that
question of who we’re designing and developing for. To help
align strategies and goals for user groups and things like
that. So, here we go. But personas
aren’t — personas are kind of one of those things that are —
it’s kind of a gray area, right? Where you — you want to use
them, but you don’t want to only use them. Personas in a way are a way to
help guide the design and development process before you
get to your user testing. So, this is just sort of a guide.
So, we definitely to want make sure your personas are based on
real user data. Hopefully your own. But could be somebody
else’s. It’s also supported by all teams. It’s not just coming
from design and that’s it and developers never see it. And you
want to make sure it’s communicated early and often. And I think of it typically as a
toolset to create empathy. So, again, it’s thinking about
people in a different way. Personas are not stereotypes. We
don’t want to just do this and then never use them, they’re not
colorful artwork. Also not a substitute to user testing. You
definitely want to do your user testing later. And they are
useful, but they’re not useful if you don’t use them. So, I’m
gonna have to start unfortunately gonna read the
notes here on them. So, all my personas have kind of
a lot of information. I want to read this. Isaiah Smith. His
occupation, he’s an eighth grader. His culture is deaf. And what he wants to do is he
wants to watch an online video. So, the first persona is Isaiah. He is deaf, but he doesn’t
actually see being deaf as a disability. He considers it a
culture as I mentioned, as many deaf people do. He attends a
deaf high school and his primary language is ASL, American Sign
Language. That’s true of a lot of deaf people. They don’t
necessarily learn English first, they learn sign language first.
But being deaf hasn’t slowed him down in his 13 years. He’s young but a whiz on the
computer. He builds websites part time and part of the team.
Hoping to win nationals, but the tutorials have been hard to use
since the instructions aren’t subtitled. So, here’s an example, kind of
like the reverse of what Isaiah would experience. So, watch this video, this man
is using an American Sign Language and he’s telling us a
story. So, does anyone here know ASL? A little bit? Maybe?
Maybe not? I don’t know it either. I know a few things. I can sign my name and say thank
you and things like that. But he’s telling us a joke. What do you think that he’s
telling us? Anyone? You saw the title before I played it,
you might have a better clue there. He’s a lumberjack. He’s
cutting down a tree, right? He’s telling us a joke. There’s a tree, it’s falling.
He’s saying timber, he’s spelling out timber. This is the reality for people
who, you know, are deaf. If they don’t have captioning, if you
don’t have transcripts, if you don’t have supplementtal
information, it’s essentially the same thing as us telling
the story in ASL. Because we don’t know that language and
there’s no captioning, we don’t know what’s going on in the
story. We miss out on the joke, right if and he’s very — like I
feel if you can watch it, you can kind of get an idea. That’s probably similar to what
someone might feel like if they’re watching a video that
wasn’t captioned. If anyone wants a transcript
later, it’s funny. He’s eating a sandwich. Again, it’s important
to think about that. Has anyone watched the caption
fail videos? All right. This one’s really funny too. I
won’t set it up. See if you can just talk. It’s a few minutes
long. Bear with me.>>Why settle for one note grab
and go breakfast when the McDonald’s kitchen is a sizzling, toasty, symphony
— it’s time to wake up breakfast.
CARIE: I don’t pay for YouTube.>>You might have seen YouTube
videos with closed caption option to have the CC button display text on the
screen for what’s being said in the video.
>>The whole process is automated. The computer displays what it
thinks it hears. The results are always off and
usually hilarious.>>We had this idea to play
telephone with YouTube transcriptions.
>>We filmed it and downloaded it to YouTube. We downloaded the script and
used that as for round two.>>Then another script which
became round three.>>We’ve included the text on
the screen to make it easierier to
understand what we’re saying.>>Enjoy. CARIE: It’s a fun take on
caption captioning.>>Hey, man.
>>Hey, I have been trying to reach you for the past hour,
what have you been doing?>>Nothing. I was just polishing my little
league MVP trophy.>>Is that a euphemism for
something?>>No. What are you eating
>>A black bean burrito –>>Google how can it be free
range?>>What am I hold somethingen an
iPhone. –>>Yes!
>>I can’t believe it. You’re my best friend, man.>>I’m not taking you, I’m
taking my 8-year-old niece.>>You mean that — what?
>>It’s a lot making in South Carolina, yeah.>>The next time you want to
call and not invite me –>>The next time my niece is
released from a cult and gets to go an
amazing concert, don’t answer your phone.
>>Fine!>>Fine!>>Hey, man.>>Any time we put that style —
>>No, what are you eating?>>100% organic
>>Can part of my baby free range.
>>Marathon.>>Advantages to the LEED lady
Gaga puppet.>>They believe it, your best
friend.>>Actually I’m not taking you
to get 9 year niece.>>What?>>Without anybody calling
united –>>Next time you don’t want to
be happy for me, women eases release to
the amazing concert.>>Fine!
>>Five! CARIE: There’s only one more
round. It’s worth it. It’s funny.
>>Hey, man.>>Any time. But that’s how
we’ve handled one.>>I think what you’re talking
about, the legality traffic.>>Resenting your per
missiveness?>>What are you read something
>>Organic free range, being in retail.
>>Part of a difference free range?
>>Never guess what I’m holding? My hand?
>>Marathon.>>A lot of Iraq.
>>With the other email it would be a sense that.
>>You pets.>>But it was a bit. Your best
friend. When we get.>>Action not taken a dig, at
least 9-year-old niece.>>Trapped in goat cheese making
calls and network.>>Was a lot about meet –>>Without anyone called united
so-called me at at all.>>This ability to an amazing
concert, donating your pole.>>Fact.
>>Facts! You still there?
CARIE: So, there’s a bunch of these. It’s really funny. And I
think that accessibility is one of those things, it’s heavy.
There’s a lot going on and a lot to think about. But this is kind
of a light-hearted take on this. So, basically what we’re doing
is they’re kind of making fun of
the craptions, they’re not like the live ones going on right
now. I’m not sure. Maybe over there. So, when you don’t have
— when you rely on machines to do the captioning for you, this
is the kind of result that you would get. I work on an organization called
Accessibility Talks. And so, I’m just showing you
this real quick. We have access to — it’s really easy to change your — your videos —
trying to — what I’m trying to say,
captions on your videos. What I do is basically upload a video
to YouTube. I just uploaded this one I think
yesterday. What I do is I let YouTube do its thing, do its
initial captioning. Because that’s a lot of work and they
can do it. And then I go in and I actually edit the captioning.
So, I go — this is English by YouTube automatic, and then
English by you. And so, in this particular case, I look at what they do and then I
update the things. One thing to think about also with captioning
is a punctuation, capitalization, who is speaking,
these things are all important. It’s really easy to do. You can
kind of do a combination of the both. Getting back to Isaiah and our
persona. We want to make sure that our videos have captions
and/or transcripts. Again, depending on what kind of
level of compliance you need to have for accessibility needs to
do certain things. Hand captions is best, but the automatic
captioning is better than nothing at all. But just go back in and edit it.
Doesn’t take long. It takes an hour to edit. And
transcripts and captions are different and they’re both
important. It’s important to know. We also have audio description.
Audio description would be something like, scary music in
the background or somebody whispers offscreen. Setting the
mood. You wouldn’t know it was eerie
without the eerie music. You’re giving context to the content. And then now we have Farrah. A
sys admin for a well known company. The systems are crucial
to keeping the company’s service running and
she has a lot of team members who she ends
up supporting throughout the day. And she puts out technical fires
and everyone’s go to in the
department when it goes down unexpectedly. She’s been
dedicated to physical fitness and played left forward
on her soccer team and runs marathons. But this was hard what she was
diagnosed with early onset Parkinson’s last year. It’s made
it hard to use the mouse and she’s using the keyboard more
and more to navigate the web. Mobilities. More people in the United States
have mobility disability than literacy in the state of
California. And they outnumber California residents by nearly 3
million. All right. This one. So, ironically, so, anyone who
knows about accessibility knows that recently that there was a lawsuit with
dominoes. And this was ironically my
example like several months ago before the thing happened. And it’s just kind of funny for
me — yeah. This is my example. I’m showing you an emulator
called Funcify. It has a lot of different
emulators and simulators. Just like in web development, there’s
only so much you can trust emulators and simulators. It’s
not the whole picture, it’s a simulated experience. Mileage may vary. But we’re being Farrah and we
have a tremor. I have turned on Funkify, and
we press start. I have the mouse, it’s simulating what it
might be to have a hand tremor. I’m trying to do this. Right?
This is without keyboard. Say I don’t have access to a keyboard.
I’m trying to select a state. I’m really trying. Normally I
have someone come up here and do it. But this is too big of a
room, I think. But you can see kind of the effect of this person with a hand tremor
trying to order a pizza and it’s just pretty much impossible.
It’s gonna take me, you know, a little bit longer than the
average person to do it. So, you can see how that could be a
little bit frustrating after a time. So, at some point, she
probably would just call in and just kind of give up.
Navigating my keyboard alone is really awesome. I think it was Marcy Sutton came out with an npm
package where you can install to disable your mouse. Kind of fun
to do to a co-worker. Go in, disable their mouse and
see how they interact with the data. What you find, say it’s like
Skittles. This is skittles. com, anyone hear about the
zombie Skittles? Okay. They look like normal Skittles,
but every once in a while you get a
weird-tasting one. I don’t know if I like that idea. Say you get a package of zoom
zombie Skittles but you think it’s normal and you want to
explain. And you see here, but if I was a keyboard-only
navigator like Farrah, I could not get to that. That is a hover effect only. I
don’t know where I am on the page, my focus indicator is
missing. But I’m tabbing here. Let’s see. I want to go into
that. All right. Yeah. So, I can just tab throughout — oh,
there I am. Going further down. I’m actually moving on the page
now. But no matter how long I try, this infinite scroll
doesn’t allow me to jump into the bottom part, the legal
part, the accessibility part. Again, this is an easy test for
a lot of people. You can do a simulator like the
one for Funkify, or just press tab and
see what happens. Back to it. Go a little bit fast here.
Again, for people like Farrah with cognitive — not cognitive
— but physical disabilities like hands, plan out headings, pages, structures,
make sure if makes sense to all users
on all devices. And things on the bottom, make sure people
can get to them. Using and adding skip links to content.
Maybe your menu has 50 items and you don’t want someone to have
to tab through all 50, give them an option to skip over it. It’s
a simple anchor tag. It’s not very complex at all. All right.
Now we have Owen. Owen O’ Connor is studying bot
anyway and loves learning about the
latest discoveries in the plant world
and regularly visits online plant journeys to read pardon me his latest
website has released a new study. But he can’t interpret them
because the charts are poorly labeled. Fun fact, one in 12 men have
some sort of color blindness. Looking in the room, there’s a
lot of men here. Probably a few of you have color blindness. You
wouldn’t think, hey, that’s a disability. No one would check
the box, I’m disabled. I’m just color blind, I just happen to
perceive color in a different way. This is kind of one of those
hidden disabilities. It’s not that you can’t get by on your
day, but if you had a chart, in Owen’s case, he’s got to chart. And
he’s talking about three different plants. But the colors
to him look like this. And for him, without proper
labels, he doesn’t really understand the
content, right? So, in a way, he is not
disabled, but he is — could be benefited from
accessible websites. So, here’s an example. Here’s the two. We have clementine, tangerine
and kumquat. On the left, if you don’t have color Blindness, we
have a green, like a tan and an orange. Kind of an ugly design color
combination. But on the right we have — they’re all kind of
green — versions of green. So, how do you think that he could
maybe help this? How could the developer,
designer, help him? Any thoughts? What did you say?
Label each bar. Introduce patterns. Yep. Yep. Maybe a
different kind of color contrast. A different palette.
Those are all great. Again, just making sure that you don’t make
color the only identifier. In that case, color was the only
real identifier. Using tools to simulate what your site or app
would look like for different types of color blindness. I’ll
show you a simulator familiar too. But again, keeping in mind
that this is just a simulator. You want to test out levels of
gray scale. And not necessarily because so many people with
color blindness see gray. That’s kind of a misnomer that’s
very, very rare just to see gray. But that helps you a lot
really identify color contrast issues for people with like low
vision. So, it will pop out some different things for you. So, like you guys suggested, we
have maybe a gradient or maybe change
the different colors. Maybe we actually write the number on top
of the bar graph, right? There’s a lot of different ways.
Or in this case, we also have the example of adding a table
element. So, presenting the data in a different non-visual way. Let’s see real quick. I could
actually do it on — here, let’s do it on WordCamp.com. We’ll
pick on them. This actually looks pretty good. But let’s
see what it looks like. We have this other simulator I like to
use called Chrome Lens. I installed it as an extension. And then I just press Chrome
Lens here. Can you guys see that okay? Make it a little bigger. It’s show you how the pages look
through the eyes of someone with vision issues. When I push this, full
blindness. This is full blindness, a black screen.
Affect the 39 million people. But I can choose partial
blindness or serious to medium to mild
blindness or partial blindness. Because, again, you can be blind
in a gradient. It’s not just like you don’t see everything. A
lot of people who are blind still see shadows, colors, outlines,
changes in intensity of light. So, it’s not just black. But this is the kind of one I
like to look at are the different types
of red weak, red blind, green blind. You can see how these
colors are pretty close how things are kind of
green here. Blue blind. Blue blind is my favorite. I don’t
know if that’s a bad thing to say. It’s my favorite color
blindness. But I like these kinds of pinks and greens that
come out. And you can see, and this is the extreme one, which
is the gray. And I can see already that color contrast just
changing that to that gray scale, these colors to me, just
like with Owen, they look pretty much the same. So, in this case,
I don’t necessarily need these colors to help me identify
anything on the page or do any task here. But I’m kind of missing out on
that as well. All right. Lydian. Now we have
Eddie. Eddie’s cool. Eddie loved to build websites since middle
school. He’s always had a natural talent with code,
especially back in development. This was for — he works
primarily in Drupal. But he also likes WordPress because it’s
convenient for him to use. He likes the CMSs. Despite being
great at building websites and knowing the ins
and out of accessible tech, there’s a lot that a pro like
him can’t access. He’s a social guy and has a
pretty serious relationship with the smartphone and spends idle
time on Facebook and Twitter. While most of the friends are
good at adding alternative text on the posts, a lot of people
and companies he follows on Twitter tend to forget. he wants to stay up to date, but all-meme-placed GIFs or other image-based posts blocks him
from being included. Eddie might come to a site and
he gets to an image. And his screenreader is going to read
this alt. In this case, it just says nail. You’re like, yay, I’m a
developer, I’m great. I added an alt. What does snail mean? Like a normal snail just eating
lettuce? A psychedelic snail from the
’70s? Maybe one of those snail massage
face things, whatever, facials. Or maybe it’s like Spongebob’s
friend, Gary the snail. So, snail is a step in the right
direction. But it doesn’t really tell us the full story. Instead
maybe I said small pink snail resting on the top of a gray cap
mushroom with green moss in the background. That’s probably
closer to what you might have envisioned and thought about in
your head. We have to think about alts — I
think of them as a phone conversation. I’m going to call
my mom and say, hey, I’m in the park and there’s two
dogs and I hang up. That’s factual. If I call back and say, hey,
mom, I’m in the park and there’s two dogs and one is chasing me.
Right? That’s a totally different picture than what you
might have thought the first time. So, again, alts aren’t just
about snail. It’s about what the snail is
doing. The emotion, the feeling, the context of what the snail is
doing. And I see this a lot too. Like, snail, the alt is, save on
nature tours at national parks,
coupons, tours, wildlife, ecology, education,
field trip vacations, free cheap parking.
That’s keyword stuffing. That’s a black cat SEO. Don’t do this.
But people do that a lot. And you’ll get dinged for it for
sure. All right. So, here, again, we’re Eddie. Abdul has a post that says he
has my vote, election day on Twitter. What do we think? It’s in November of 2016 around
the presidential election, the last one. Who do you think he’s
voting for? He didn’t — oh, a democrat? No, he’s voting for this dog.
Says no to vacuums. Die really only have five minutes left? Oh, gosh within I need to go
faster. This dog, because he included alt can get Eddie in
the conversation. Just pointing out quick, it’s easy to go in
here to your profile. You go to more. You go to settings and privacy.
And then you go into — where is it? Accessibility down here.
And you can choose this compose image description description.
So, that gives me, every time I post, Instagram is good about
this, you can add captions to it. In this case we have the option
to reduce motion. But there aren’t any ways to add
information. Alt information to GIFs or videos. So, we want to make sure that we
add additional content in the actual text that we’re doing.
So, I have less than five minutes up I’m going to go past
a few of them. We’ll go on to the take waste
because I’m really, really at the end. So, going back to — so, kind
of skip through a few of those real quick. So, sorry. Talking
too much. So, I train sometimes and I go
for like days and speak for 16 hours. This is really fast.,
back to this real quick. Go fast. Make sure you turn on images for
Eddie, GIFs. Melissa has dyslexia, I have a
cool demo for her. You can go through it with at
lunch. But inclusive fonts, adding
rims, making sure you do to scale things. Making sure you
add things like margins, padding, line spacing and things
to your text are useful for people like Melissa who have
dyslexia. And bringing your text into small pieces or bullet
points or numbers. There’s a cool little demo with dyslexia, again, using Funkify.
You have dyslexia Danny. Take a look at this, this is an
introductory guide to understanding cognitive
disabilities. And, again, this is simulating what it might look
to people who have dyslexia. And, things are kind of changing
and moving. And one letter might be — or
might be moving to another section and that sort of thing
opinion. So, simulating your content, making sure that makes
sense is something to think about when you’re using — when
you’re creating content or developing and designing. We have we have Camil a fascia. It is a confusing things are
other things. She might confuse a horse with a
cat in aphasi oh a. If you’re using icons, add text. It’s not
too difficult to do. Make sure there’s enough
whitespace so things are not on top of each
other to minimize the distractions. And giving users
enough time to complete tasks. We have this where we can get
timed out. We want to make sure if I’m doing a bank application
or something like that, and I’m typing halfway through it says,
hey, this is your checkout warning. Like, your session’s
about to time out due to inactivity, do you want to
continue or do you want to end? So, giving you users like
choices to extend the time. Thinking about them cognitively
like processing. This is especially try if you’re doing
anything with like bank information, right? Taxes.
Anything like personal information that they’re putting
out there. Going faster. And the last one is Raymond. He’s
got vestibular disorder. What vestibular disorder is, is
like going to a site like this, I’m not showing an extreme
version. This is a low key version. But if you do have
things with vertigo, don’t watch this part. Close your eyes. But
as I’m scrolling down the page, things are kind of moving
around. And as designers and developers, this is kind of sites that we love to
design and develop for. A lot of cool going on, cool SVGs with
cool movement and animations with code. It’s interesting and
it’s cool. But you can also do that responsibly, right? We have this really cool thing
called prefers reduce motion that’s out. It’s supported by a
lot of browsers and it’s becoming more and more popular.
But what I could do as a frontend developer, add an autoquery, at
prefers reduced motion. And then add additional content of what I
want it to do. In the case of my website, if I
go to Carie Fisher.com. Tabbing all my time. I have this purpley notey
things. But if I go into my settings,
and I go into accessibility and I go into display, I have this
one that’s called reduced motion. And you can see any purply
thing’s disappeared. And that’s the same thing with like my
about here. It’s stopped. But if I go back here, and
refresh it, it’s actually an SVG that kind of outlines and builds
it in. So, it was very simple. I could just stop my animation. As
a designer or developer, you could add additional fun things
that are slower paced or some other options that might not
trigger somebody like Raymond. So, unfortunately, I have one
more minute left. But so, I’ll finish up on Raymond. But
there’s some really great resources that I’ve linked to as
well. But, again, don’t automate or
fly your media slide shows. Make sure the user takes control
of media-based features. Careful of GIFs. I’m not saying you can’t do fun
things, but do it in a responsible way. Give alternate options for
whatever delight that you put out there so you don’t trigger
vertigo and seizures. I’m going to jump to the end there. But
there are a lot of people that you’re going to think about
different processes. Like in the content phase and the design
phase and the mockup and the development phase, you’re
thinking about different groups. But at the end, I just want you
to be thinking about them. It doesn’t matter how and when, you
want to do it often. But go to bit. ly/a11y. Our ESOU, our CES, a11y
resources. You’ll find links to these
really cool things, the UK government personas. And then the a11y rocks
accessibility style guide, Chrome lens, some of the things
that we demoed today. So, the power of the web is in
the universality. And the power of everyone is an essential
aspect. I hope you think about this the next time you design
and develop. Thanks. [ Applause ] SPEAKER: Thank you very much,
Carie. Carie will be hanging around if
you want to ask questions. CARIE: Sorry about the time.
SPEAKER: No, lots of great information. It’s fine if you go
right up against the time. So, thank you very much, Carie. Lunch is at noon down stairs in
hall 2, next to hall 1, which is the sponsors hall. Dietary needs, gluten free,
vegetarian, have signs at the stations. It’s a buffet style. If you are kosher or Halal meals
or other needs, grab a uniformed catering staff member and they
have all of that for anybody with special dietary needs. We
will be back here at 1 p.m. for a tour through the WordPress database with Julie Kuehl. Thank
you all. And enjoy your lunch. A Father Through the the
WordPress Tour Through the the WordPress
Database Julie Kuehl .
. word fest SPEAKER: Take that again. All
righty. Welcome to WordCamp US 2019,
we’re excited to be here in St. Louis. My name is Tom Carney and I will
be your host today until 5:00.
Before we start, I would like to two over a couple things. If you could, silence all cell
phones and other electronic devices likely to make noise. If you could, please move closer
to the center. So, people can get to seats, you
know, when they come in a little bit
later. If you have any questions,
please raise your hand. A mic runner will be able to get you a mic to ask your question. There will be a Q&A after the
presentation on this talk. And then in the interest of
time, just leave all questions to the end.
If you want to speak with the presenter, just speak with her
at the end of her — or at the end of this presentation. And remember the after party you
will need your badges and that will be at the Museum. And we want to encourage
everyone to come out to Contributor Day on
Sunday. And then here is Julie Kuehl.
She is — she lives in north — or Fargo, North Dakota. She
currently provides technical support for CoSchedule which
makes a family of agile marketing
products that organizes content like WordPress
posts, social media and marketing team workflows. But next week she’ll be in a new position as a support analyst
with In infinite leap that has technology solutions and health
care solutions. Besides WordPress, Julie’s other
passions includes cars and motorcycles. Dive bars, science fiction,
black blacksmithing and bagpipes. Let me introduce Julie Kuehl. [ Applause ] JULIE: They didn’t tell you
about the bright lights up here. That looks a little odd. Not
like it looked 15 minutes ago. Is there anything we need to do
there? There we go! That looks better.
Okay. Before we begin, a bit of a
disclaimer. First off, I am certainly not a database expert.
Honestly, I really don’t even work with the WordPress
database. If you heard me I do support for marketing teams and teams and
now health care providers. I don’t dig into the database on a
regular basis. But be a friend once told me, Drew James, that
you want to learn WordPress, you should just read the code. And so, I looked at him like he
was nuts because at that time I wasn’t a coder. But whether or
not I understood everything I was looking at or not, because I
most certainlily did not, I learned a bunch just by looking
at that code. And every time I looked, I found
— I understood it a bit more. So, in that — this talk is
meant to be in the spirit of that advice. Just learning by
looking. So, we’re gonna take a tour of
the WordPress database together. And when you ask questions that
I can’t answer, I will be happy to ask the crowd and find
someone who can. So, with that, let’s begin. WordPress is the combination of
code files such as PHP, HTML, CSS,
JavaScript, and a database. You need both. And we actually spend
a lot of time talking about the code files, you know, themes
and plugins and what goes into those and even WordPress code in
itself. But many of us don’t really know much about the
database. Which is — doesn’t kind of get its fair share. So,
if you’ve never actually lifted the hood to take a look at the
WordPress database, here we go. First off, oh, and I should say,
too, if this is not what you expected, now is your chance to get up and go and
go to the other wonderful talks that are going on that I kind of
wish I was going to as well because they are all really
good. But, yeah, if this is not what you expected from this talk, then
feel free to head over to one of the other options. So, gonna start with why a
database? Because you can keep information in a lot of
different formats. You can keep it — well, you can
keep it on sticky notes and you can keep it on note pads and you
can keep it in document files, word files, Google Doc files,
those kinds of things. But why database? Because databases, whether you
use a database, the files, the amount
of space that you’re taking with those files is actually smaller. That makes them faster to use,
faster to return to display in a
website. Makes them faster to search. So, if you’re actually
looking for something, it’s faster to find what you’re
looking for. And one of the most important reasons is that
because they’re more flexible and therefore more powerful. And
even WordPress in general takes advantage of some of this
concepts that we’re gonna talk about in terms of a database
because it grabs information from one file and puts it in
with another file and another file to create a web page, a
dynamic web page rather than a Stack a static web page.
So, then, what is a database? Well, it’s an organized set of
data. It’s kind of like a spreadsheet. Sort of. But not
really. Does have columns and rows. Has fields or cell, I guess we
would call them. But what’s different about it is that it is
divided into different spreadsheets which in a
database, which are called tables, that are then connected
to each other. So, spreadsheets are usually —
and I know you can have multiple spreadsheets and Excel will even
let you connect spreadsheets to one another. And that’s getting
kind of close to a database. But not really. Because a good
database is going to be normalized. And if you do any
coding, you probably have heard of the DRY principle.
D-r-y, don’t repeat yourself. You want to only have
information stored once in one place. It makes it easier to
find. And most importantly, for me, at
least, that makes it easier to update and maintain. If you have a typo, and that
typo is only in one place, it’s easy to fix the typo. Or a phone
number changes or your address changes or if your last
name changes. If that name or phone number or address is in
one place, you update it there and use it everywhere, that’s pretty
easy. If that phone or name or address
is stored in 300 different locations, I can guarantee you
that you will miss one. The idea of a good database being
normalized is to help prevent those types of problems. And a
they’re also relational. And this is where we really
depart from being a spreadsheet to being a database. Where the
data that is stored in a particular place can be related
to data that is stored in a different place. And after I’d
basically kind of written that slide and did a quick search to make sure I really understood
the definition of those two and ran across this one which basically saysly
exactly what I was sighing, but were the. The normalization is the — the
first is that there is no redundancy of data, the DRY
principle. All data is stored only in one place and that data
dependencies are logical. Meaning that related data items
a stored together. So, in my examples of phone numbers, all
phone numbers would be store together, all names are stored
together, all addresses are stored together. It is important
for many reasons, but chiefly because it allows databases to take up as little disk space as
possible, resulting in increased performance. We get so used to
offloading stuff to the cloud and you’re that we
don’t often times think about disk space. Although I am
because my computer’s getting kind of full. But everything we
store does take physical space. It’s just not in your house or
in your office or on your computer. But it is taking space
somewhere. And so, the — anything we can do to reduce
that space, to reduce the footprint of the data that we’re
keeping, can be beneficial. So, I’m gonna walk through a
quick example of what a spreadsheet
looks like. Because most people, if you’re not familiar with a
database, you probably have seen a spreadsheet. This example is just four
different locations. We have addresses, a city, state, and
post codes. If you look at that, we’ve got
four different addresses, four
different cities, but only two different
states, Missouri and Minnesota, and three different post codes.
The first one and the last one are the same. So, this is very human-readable.
Human-friendly. It’s pretty easy to — because there’s only a few
of them, you can spot things pretty well. But, you know, there are ways
that we can turn this spreadsheet into a
database. And the first step is we’re
gonna assign an ID to each of those essentially cells in the
spreadsheet. So, now we have an address with
an ID of 1 and city with an ID of 1
and state with an ID of 1 and post code
with an ID of 1. So, we haven’t really changed
anything so far. It still looks a whole lot like a spreadsheet.
Except at this point we’re gonna normalize that and take out
those duplicates. We really only have to have Missouri and
Minnesota in there once. We really only need each post
code to be in there once. So, we just went from 16 cells
in that database, 16 — in the
spreadsheet — down to 13. Which is a 20% reduction on a
very small set of data. So, some of the savings in space
can be pretty significant when you start talking about large
amounts of data. Now, that takes care of it being normalized. But
then what about relational? We need to relate Birch Street
to Greenvail. We need to relate Breezeway to
Sandy Shores. We need to relate Sandy Shores
to Minnesota. And Minnesota needs to be related to the two
post codes that are associated with it as well. So, we have these relationships,
one-to one-to-one leadership relationships. There is a Birch Street in
Greenvail. There is only one Green vale in
Minnesota. But Minnesota has two zip codes. So, we have one state
with two zip codes. And so, it’s a matter of how you
connect those things and relates those things that allow us to
find what we’re looking for as well as save that space. So, if
we go back to the spreadsheet where we started, again, very
human-readable, very human-friendly. But if you look
at like the number of characters there that are in white and just
like the amount of white on that screen, in that table, compared
to this. You can see how much less white there is there. And how much more efficient a
computer, who deals with numbers better than letters, would be
able to get through that. So, now we basically still have
those same four locations, but instead of saying Green Vail, I
can’t remember the names of the cities and states
off the top of my head, but we have the first location being address one, city
one, state one. The third location being address three, city three, state two, post code
three. So, it’s a much more efficient,
much smaller way of storing that
data. But it’s not — no longer a
spreadsheet. It is now a database that has
five tables. The first table is the one that looks the most like
the spreadsheet. It’s the one I just showed you. It has the links to the other
data in the other tables. It has an address table which contains
each of the unique street addresses. And you might think,
well, that would just be the same as what was in the
spreadsheet. But it’s possible to have two
123 Main Avenues. One is in Missouri, one is in
Minnesota. Now we only have to store 123
Main Avenue once in the street address database. But when we get back to those
locations now we say it’s 123 Main Avenue
in this city, in this state. So, even addresses can become
reduced. Cities has each unique — and
unique is important here. Each city should be unique, but it
should not be duplicated. States, you’re probably all
familiar with how the states work in a database. If you fill
out a form online, you have to select from the long list of
states, and sometimes a long list of
countries as well. Because that is in a table in
the database. And having worked with forms in the past that have
not been in databases, where people type in the actual name
of the state and then you have to go and try and find everybody
in the state, the typos and the capitalizations and the fact
that they put the city in with the state or the zip code is
now, you know, the nine-digit zip code rather than the five-digit zip code in all of
those kinds of things can make that a nightmare. Now we have a
table that has each unique state to choose from. And good forms
ask you for your post code and can tell you which city you live
in. Now, again, that locations table is the same as that first
spreadsheet, but it’s just showing the locations in
the other tables where that data can be found. So, the big
question at this point, especially after lunch, why does
any of that matter? Because this is the WordPress
database. And these are the tables that are contained within
it. There are 12 tables in the default install of WordPress. We
are gonna go through them at a very high level. Very high
level, of what they contain. And right now that diagram
that’s up there might look like nothing to you. Maybe you’ve
never seen it before. But by the time we get done, I’m
hoping you’ll understand a little more about how they’re
connected and what might be in there. But I want you to notice one
thing in the diagram, at the bottom left and bottom right,
there are two tables that do not have lines to the other tables.
And the first one that’s like that is the one at the bottom
left, I believe, is WP_options. The WP_options table is one of
the most important ones, in my opinion, in the WordPress
database. Because it holds most of the
sitewide settings like the URL, the admin email, the theme that’s active, how
many posts should be on an archive page, default 10, up to
6 or up to 25. The time or date format if you
prefer month, day year or month, day,
year. And images sizes. There are usually three default
image sizes of small, medium and large. If you have custom image sizes,
those are in WP_options as well. Some of the themes use the
WP__options table to store their default as well. It can be more than just the
default options. Then we’re going to talk about the tables
that are are a posts that are in the WordPress database. And when
we talk about posts, it’s really posts and pages and
custom post types and a bunch of other stuff, actually, that
gets stored in the post table. I would argue that this is the
most important table in the WordPress database. It has the
most fields to it. It usually has the most data stored in it, the most records stored in
it as well. So, things like the title of the post, the actual content of the post,
the time that it was published or scheduled, the excerpt, the
actual status, is it published or is it scheduled are
published in the WP_posts table within the database. The WP_postmeta table contains
metadata about the post types stored in
the WP_posts table. It can be the page template used with that
type of post. Old slugs that might be associated with the post, menu items, custom
fields and some plugins. This is not a default. But some plugins use the WP_post
to store SEO information, the key words or snippets or
featured images or whatever. So, they have two tables around
posts. We also have two tables around
contents. Or comments, excuse me. The first is the WP_comments
table. And this might be the second largest table in the
database. Certainly in terms of fields I believe it’s the second
largest. It can either be the second
largest, it can be empty. Maybe you don’t allow comments on your
site. Or it can actually be bigger
than the WP_posts file. If you have very few posts, but a lot of comments, this could actually
be the largest chunk of data in your database. And it stores
information about comments including their author’s name,
the author’s URL, the email and the actual text of the comment,
as you would expect in a comments table. The WP_comment meta table stores
metadata such as the status of the comment, approved or pending
and any other sort of data about data
regarding comments. So, the comments with kind of the
in-between, sort of. These are all kind of connected. We have
posts, we have comments. And then we have users. Because
users make comments that are attached to posts. So, we have users and user
metadata. WP_uros stores information about
users. Name, password, email, user
status. Things associated with people, a person. The user meta contains meta
information about users, including the user name. A subscriber, editor, author, an
admin in the database and anything on
the my profile section where things like the color scheme for
the admin dashboard. Those types of things will be stored in the
usermeta as well. So, those are the kind of really
obvious tables, I guess. We have content and posts. We have
comments in the comments table. We have users who make comments
so that makes sense. Then we also have terms. And this is the
little more complicated. And I have to admit, I don’t —
I kind of wrestle with this because I don’t really dig into
it all that much. But there are actually four tables around terms and/or tax on mist
my taxonomies if you want to call that. The WP_term_taxonomy, in this
case, age group. The WP_terms, the actual terms. When you select a tag or
category, this is the actual tag or category
you’re selecting. We have a term of 5th grade, in
the taxonomy of age group. Additional data about the term,
I’m saying 5th grade equal 10 years
old. I’m not sure if that’s true. But the example. And the
one that ties they will themselves all together, the
WP_term_relationships table that connects all the terms and the
taxonomies that we’ve laid out here. So, start with the
WP_term_taxonomy table. It’s not big, but it defines the
terms in the table. This is the one that’s going to talk about the categories, the tags,
the custom taxonomies that you’ve
defined for your WordPress site. And then there’s the WP_terms
table which is used to store the actual terms that are used in
your taxonomies. So, if you have a category of
news, WP_terms is gonna have the word “News.” If you have a
category, I’m gonna pick one out of the air here and just
say, pets. The terms — that would be the taxonomy. And the
term would be dog or cat or bird or ferret. And so, this table is specific
— it’s storing specific terms that are associated with the taxonomy. WP_termmeta. It’s a place to
store metadata about the terms and taxonomies. I have to admit,
it’s empty in most of the databases, the WordPress
databases I worked in. So, I was kind of struggling to come up
with an example for it. I do understand that WooCommerce will use it to store metadata about
product attributes and categories. But, again, a lot of ’em,
databases, or the sites I work with,
there’s really nothing in this table within the database. WP_term_relationships is what
ties it all together. It manages the relationships between post types with terms in
WP_terms. So, this is the one that says,
this post over here belongs to this
term over here. This category. So, this post has a category of
dog which is part of the taxonomy of pets. Ties them all
together. It’s where relation — we talked about that relational
database. This is pretty much about what
it says: Relationships. And the last table in the default WordPress installation database
is the WP_links table. There’s a fair amount of fields there.
But honestly, it’s been used — it was used by earlier versions
of WordPress and I don’t really see it used a lot these days
blog roles haven’t been a thing nor a while. And every database looked as,
this is an empty table. That doesn’t mean it has to be. If
you like blog rolls and you want to use it for your own purposes,
it’s there. But we keep it for backwards compatibility for
those sites out there that take advantage of WP_links. Those are
the 12 default tables in the WordPress database. But sometimes there are other
database tables as well. Because some plugins and themes will add
their own tables to the database. And some plugins and
themes will add a lot of tables to the database. They will
actually add more tables to the database than what WordPress
did. I think I saw a random number this morning. I think WordFence drops in like
over 20 tables. I haven’t tested that or counted that. But seems
fair. I know that there are other ones that put in like sliders even will
put in a half dozen tables in the database. So, is that good
or is that bad? Like a lot of things, important questions in
life, the answer is, it depends. More tables are not necessarily
bad. It’s kind of like plugins. More plugins are not necessarily
bad. It depends on how they’re written, it depends on how
they’re coded, it depends on how they’re used. But be aware that
there are consequences when you have more tables to the — in
the database. And I’ll just give an example
for my current job that I still have
today. Where I work with CoSchedule
which has a plugin that interacts with WordPress sites.
And we interact with custom post types if they’re present and WordPress
sites as long as they’re in the WP_posts table. If you set up a
custom post type and it goes into its own table in the
database, we can’t find it and we can’t work with it. So, is
that good or bad? That depends on whether or not you want to
work with CoSchedule. But if you’re not doing that and you
want to keep it separate, then that’s a good thing. So, be
aware that you may look at your database and actually find a lot
more tables than the 12 I went through. And that’s because plugins and
possibly even themes have it. I’ve seen themes add tables to
the database because they have embedded —
essentially embedded plugins into it. So, these are the default tables
in the WordPress database. Now, if you look at this diagram
now, after we’ve gone through that. Again, I mentioned earlier
that there are two tables in the bottom corners that are not
related to anything else. But if you look at the center table,
that is the posts. And if you look to the left, you
start to see the term, all of those
tables. Term relationships, WP_terms, WP terms taxonomies.
They’re all related to posts. If you go up, you see users
because you can have users associated with posts. Somebody
has to be the author. But users can also be associated with,
first off, metadata, but also with comments. So, off there on
the right, you see comments and then the metadata for comments. And then at the bottom you have
those WP links for those blog roll
links. So, word of caution. Because now that you’ve seen the database, with great power comes
great responsibility. Knowing what’s in the database and
looking at what’s in the database is something I really
encourage you to do. Do not be afraid of looking at the
database. But be very afraid of making
changes to the database. You could — directly in the
database. You can do some pretty
significant damage by making changes directly in the
database. There are times when perhaps you
actually do want to go directly in the database and make
changes. But be aware that that is very
dangerous ground. So, with great power comes great
responsibility. It’s out there. You can do that. But you may
have to be like that previous slide of that poor guy out there
in the middle of nowhere with the broken down car going help,
help. Can somebody fix my database? And the answer might be no.
Because you changed it. But I do encourage you to look
in the database and understand how your database is put
together and how it’s working. There are some resources I used
to put this slide show together so if you would like to see
those. What I would like to do now before we jump out is
actually show you a database. No, not that one. Let’s start
with this one. This is the raw brand new
install — oops oop. It’s not gonna do
this. Hang on. Let me find my display. There we go. All right. So, this
one is — not the right one. Let’s go with this one here. I’ll make it bigger. We’re gonna start by looking at
the options table. This is the structure — I know it’s small. I may do something there to —
it doesn’t want to do that. This is the actual structure of
the WP_options table. There are only four records — or four
fields up there. Option ID, option value,
autoload. Each field has a type, one is
DIBINT, big integer. Variable character, long text, another
long character. The structure of the table defines the data that
can be put into the table as well. Another advantage of
databases, to be honest. Here’s the actual content that’s in
there. Again, I realize this is way too
small for pretty much anybody to read. But up there at the top,
there is the site URL, the home URL, the blog name, the blog description, you know,
the tag. There are the mail servers, the admin email is in
here. Down here at the template up here is the active theme that you have
going on. So, this is that WP options
table that’s not really connected to
anything else. This is the WP_posts table. It goes on for a while too. It’s
not forever. But for a while. This is where my actual WP_post
content is right here. These are my actual blog posts
on this site. All in one tiny little field. You think about
that, you wrote this big long blog post, put in all the images
and captions and pull quotes and it fits into one little field in
the database. But it does. And so, this might be someplace that
you would visit if you were trying to track down an error that just
cannot be solved in the frontend. Occasionally things get wonky
there. The other table I wanted to look
at is WP_users. The structure here, user login, user password, user nice name, user
email, user URL, user registered,
which is a date-time, user activation key,
user status and then the display name. To, those are all the data
that’s stored about a particular person. But then this is the
content. This particular one, again, is an off the shelf
pretty default install of WordPress that has the theme
review teams XML test content in it. So, there’s only five users. And
my email is up here, and my password is here too. But notice
they don’t store the password in plain text. It is encrypted. And
so, you can’t actually even go into the database and find people’s
pass words. Again, with great power comes
great responsibility. And that’s one of the things that they’ve chose ton make sure they
— the Core developers have made sure to be responsible with as
well. So, this a very, very plain — and I’m just gonna
quick — I will go through these just real quick to see the
default one. WP comment meta is empty. WP
comments, this one has a few comments. So, you can see what
those look like. Again, it’s not — that’s pretty much all of the
data right there. The WP — oops — links table
is empty. WP options is the one we looked
at earlier. And it does go on for a little while. WP postmeta, this one, because
of the test data in here has
significant amount actually of post meta. WP_posts where all the posts are
stored. Term relationships, connects to each other. Remember
the IDs? This ID is connected to that ID. Connect those two
things. Term taxonomy. This is where it shows the categories.
Has a description of the category. Post tag. NAV menu falls in here as well.
Post format. Term meta. This one’s empty in this case as
well. The terms, these are not empty. These are all the
categories and tags. But notice in the term table
that you can’t actually see whether or not this is a
category or tag unless you understand what the term group
is that you’re looking at. User meta and users. All right. So, this was a plain Jane
database. This one is not. This one is actually a website
that — it’s a local version of a website that is out there. And
the first thing I want you to notice is how many more tables
are in this database here on the left
side. I’ve got everything from — I
believe these might be backup tables.
See, I don’t even know. There’s another thing to do. Go in and
look at your database and see what’s being stored there
because as far as I’m concerned, these could
probably all get deleted and I would be fine. We have the WP Give plugin has
— a handful, half dozen or so tables
there. NF3, that must be Ninja Forms. And the particular theme is not
even active on this website, but it was installed at one time.
It’s not even installed — it’s not even there. But when I
installed it one time to test it out and see what it
looked like, it dropped tables into the database and did not
remove them. So, that is one reason to be
familiar with what is in your database to see exactly what is
in your database and whether or not you actually need it. Let’s see if some of those empty
ones have anything in here. WP post meta. A few things in there. WP term meta. Nope. That one’s
empty here. Term taxonomy has a few things. This is my age
groups. Term relationships again is connecting things to each
other. Terms has the actual terms. These are the ones that
we are choosing from the drop down lists. Posts. All the posts. Custom —
oh, let me show you this real quick. I’m not sure if you can
see it because it’s so small. Where did it go? I’m looking for post type. There
we go. Post type over here in this column over here. You can see that actually this
first one is a page. The second one is a revision. That’s a whole nother record in
the database because I changed something. Another page,
revision, attachment. ACF field group, ACF field. A
lot of advanced custom fields happening in this site. Those
are post types being stored in the default WordPress posts
table. That particular plugin chooses
to store that data in the default table. So, you can see
that post type can really involve a lot of things that you
wouldn’t expect. Attachments, revisions, NAV
menus, different custom fields and
custom post types. A lot of different things go
into posts. So, I think with that, I’m going
to go ahead and open the floor for
comments. And see if anybody has any questions that they would
like to ask about the database that I might have any
clue to answer. I think they do want you to come
up to the microphones because — it’s being live recorded and so
people in the back can hear you. Yeah, if you have a question,
please come up to the microphones. Go ahead.>>[ Away from microphone ] JULIE: Okay. The question is
about WooCommerce and what — how it interacts with things. So, my default install of
WordPress, I didn’t download WooCommerce, but
I I did download WooCommerce, but
I didn’t activate it. Let’s see if we can do — we want to set
it up. Let’s see if it does anything to
the database just by installing it. Okay. We do actually have to finish
setting up. Okay. I don’t know. Pick an address. There we go. Continue, continue. I don’t
know. We’re just gonna continue until
it says I have to. 5 bucks for shipping. Yep. They want 5 bucks for shipping. Oh, I don’t know if I want to do
all of those things. Let’s do none of those things
right now. And let’s skip that step for
right now. Awesome. So, if I go into my — to create
a product. I’m not sure I can answer your question based on
this demonstration. Because you were asking about
users. Does anybody actually know the
answer? Because I’m gonna guess it can. That is why we use databases is
so that it can grab that information from that table. Because WooCommerce knows that
the WP_users table exists. So, it would make sense to connect
it. I know if I log into my sites
that I have WooCommerce on, I might be the site admin. It
knows that. And I’m the store manager, and it knows that too.
It’s stored in one place. I can go into my profile and see both
of that information there. So, I’m guessing it does.
Another question? AUDIENCE: Is there a database
for the statistics on the visitors to
the site? JULIE: Good question. That would
depend. Actually, that’s probably
Google. Usually — okay. Throw it out to the crowd on that one
too. Does anybody know — have an
answer for that one? Jetpack? Jetpack might be storing
visitors to the site. Yeah. I’m thinking because every solution
I can think of involves a plugin
with essentially a third-party. That data is probably being
stored offsite. Google Analytics, if I want to
know how many website visitors I have, I
have to go to my Google Analytics to see
that. Sometimes Google Analytics can be in your WordPress site. I can almost guarantee data is
not being stored there. Data would be tremendous. And Google
is holding that data, not your website. Are there any
other questions? AUDIENCE: When you see that
you’ve tried a plugin and you decided you don’t want to use
it, but it left stuff in the table and you’re like, I think I
can delete this, can you tell me, is there any reason you
shouldn’t delete it? Or what should you be watching for?
JULIE: Okay. All together now, one, two, three? What do you do
first? AUDIENCE: Back up your database.
JULIE: Got that. Yeah. If you back up your database and delete
— that’s — as a matter of fact, now that I’ve noticed
those tables, that’s what I’m going to do. Back up the
database and take those tables out and see what happens. And
when the site crashes, I’m going to restore from backup and go,
okay. Rather than trying to delete all
of them at once, let’s do it one table at a time and see where it
is. And go as far as I can to clean
up my database. There are reasons you may want to clean up
your database. As a matter of fact, there are plugins that
would clean up your database. The first one that comes to mind
is WP_optimize. But, yeah, if there are things that are left
behind and no longer using, they will start looking for that.
Yeah, if you actually did want to go in and use that great power and do
some direct editing in the database, obviously you want to a back up. And you want to know how to
restore from your backup before you start messing with it. Any
other questions? AUDIENCE: Yeah, I have a
question. Right here. JULIE: Okay. Thank you.
AUDIENCE: Why do plugin developers not remove their tables when they —
when you uninstall your plugins? JULIE: I’m not a plugin
developer, so, you would have to ask them. But I can guess that
some plugins actually do. There’s a check box. Do you want us to delete
everything from the database? Click here so that you are in
control of whether you do or don’t. A lot of the plugins that
don’t, I know that when you come back — whether you reinstall
that plugin, you’re basically up and running again. They may
have made that choice that if we leave that stuff here and they
want to come back, they don’t have
to start from scratch. WooCommerce, I’m not done
setting this up. It takes a bit to set up a WooCommerce store. I
don’t know because I haven’t done it lately. But it I took WooCommerce out,
I don’t want that anymore, and it gets rid of all of that, then I have to
start from scratch and do it over again. Depending on the plugin and the
developer, you may have to make the choice.
AUDIENCE: If you have the option to wipe the data, does it wipe
the tables as well? JULIE: Yes, usually. That might
be part of the choices it presents to you. But, yeah, I
would think, yeah. Usually if they get rid of the data,
they’re talking about getting rid of the tables.
AUDIENCE: Thank you. JULIE: Any other questions?
Okay. I’m gonna do like an encore
because there’s a couple of things that I would like to show that — let’s see
if I can find it now — that nobody’s
asked about. Because there are some times
when you actually would want to be in the database. If you can’t figure out your own
password, you’re the admin in the site, you have FTP access,
you have access to the database and you cannot remember the
password you’ve put on that site and don’t have access to the
email you used. You did a typo or something, you can’t find it.
Sometimes it’s just easier to go into the database and just reset
the password. So, other times you might want to — you get
into some weird redirect loop with the URLs. You went from a
staging site to a live site, or you changed the blog name or
something. And you just need to go in and say, this is the
domain for this site. In both the site and the home
fields. And it’s just sometimes easier to do that in the
database. And sometimes you can track down
weird things that are happening. Only through the database. It’s
like, why isn’t this category showing these things? And you
actually start looking at the database and go, oh, yeah, I
forgot that bit. Sometimes troubleshooting, you wind up
looking at the database, trying to figure out what’s happened
with content. Same thing with verifying that a custom
something or other is going where you want to. We were
talking about, does it use the users table? Go into the
database and look. Does — when you delete a plugin, does it
delete the tables and data with it? Go in and look. So, that
might be a legitimate reason to go into the database and
actually start making some changes. So, this one trick, this is my
favorite reason to actually go into the database. It’s usually when somebody’s
forgotten a password and can’t access the email. You can go into the WP_users
field and the passwords field. I showed you they were encrypted.
You can’t just type in a password. But if you type in an MD5
encrypted, they call it a function
password, MD5 hash generator will do that for
you. You can type in your plain text
password. And you can get the encrypted
code into your database. You should be good to go and change
your password. That’s the most common reason I personally am in
the WordPress database making changes. I just wanted to leave
you with that little trick before we wrap up here. I thank
you for your attention. Especially after lunch in a dark
room with dark slides talking about a database. There were no loud snores. Thank
you so much. Enjoy the rest of your day. [ Applause ] technical SEO Checklist: How to Optimize a WordPress Site for
Search Engine Crawlers Pam Aungst SPEAKER: Okay. Welcome, welcome.
Are you ready for your 2:00 session? You’re here for
technical SEO checklist. This is what this room is for. Before we get started, Wordfest
tonight at 7:00. And that Contributor Day is on
Sunday. We hope to see all if not most of you there. So, it is
my great pleasure to introduce to you Pam Aungst. And Pam is the owner of Pam Ann
Marketing and stealth seven Analytics. Both specialize in SEO, PPC and
analytics. She is a passionate advocate for WordPress and regularly gives
talks at WordCamps around the country
about SEO, Google Analytics and business topics. Pam has a personal mission to
talk about mental health and the importance of taking care of one’s self in
order to survive and thrive at work and
at home. Everybody, a hand for Pam Aungst.
[ Applause ] PAM: Thank you. Good morning, I
get to have you in the middle of the afternoon slump after you’ve
eaten lunch and you’re getting tired. But I’m going to try to make
this technical dry stuff as exciting as possible. That’s
what we’re talking about today, technical SEO. I am going to start with a brief
overview of why SEO is important and why technical SEO, in particular, is
very important. I’m also going to walk you through a condensed
version of my technical SEO checklist which the full thing
is very, very long. It’s got 50 different categories of things on it with kind of
sub-topics under that. It’s very, very long. I’m give you a
condensed walk through today. But I will also give you a link
to the full spreadsheet to download the audit template they
use with every little thing on it when I audit a site for these
technical things. Let’s get right to it. I have a lot of
information to go over. I want to make sure I go kind of
quickly here and we’ll wait on questions until the end. But
definitely get to everyone’s questions at the end.
Fortunately the break is right after this as well. I won’t run away afterwards if
we don’t get to all the questions
formally in the session. Here we go. Why is SEO important? I
feel that search engines, unlike other digital marketing
channels, are the most powerful place to get found by a
potential customer. Because these users are specifically
sitting down or, you know, tabbing in on their phone,
they’re specifically going to a search engine because they are
seeking something that they want either now or soon. They want or need it now or
soon. That’s such a high level of
intent to transact and do business. You can’t find that in other
channels. Social media ads and behavioral ads have great
marketing to be sure you’re getting in front of the right
person. But it’s not necessarily the right time that they want or
need something. So, search engines are unmatched
in the level of the intent to buy that these users have.
That’s why I feel that SEO is important. Now, let’s talk about
why technical SEO is particularly important. That
requires a quick primer on how search engines work first. Go through that really fast. Search engines perform three
basic steps in order to produce search results. The first is
that they crawl the Internet. They send a software program,
often called a bot or a robot or, you know, a crawler, Google bot, BING bot,
whatever it’s called. It crawls from link to link on the web
just to discover all the different content that’s out
there. There’s hundreds and trillions of pages. They first
have to crawl it and just find it all. After that, they index
it. Meaning they take a copy of the content on the page and
store it in their own databases. That’s what gets searched
against. And that’s necessary to produce search results quickly.
Crawl it, discover what’s out there and then index it, which
is collect a copy of it. Then they can rank or sort the
results in ordered results. So, crawl, index, rank are the
three steps that search engines do to produce results. But
technical SEO is so important because it makes so that search
engine crawlers can access your site. Can crawl it. And can take
a copy of it and index it and put it into the search engine.
It can’t rank you. you can’t show up if you can’t
do the two things. You could have the best content on the
web. If a search engine crawler program cannot access or
understand your site, that doesn’t matter. You will not
show up. At all. So, that’s why I feel that technical is like
the foundation of SEO. It’s the most important thing. That
should be looked at first. And I’m going to go through thousand look at how to look at some of
the most important things. Start with basic/traditional things.
People say that SEO is changing all the time. I don’t think it’s
necessarily changing, it’s just getting more and more complex.
Google is always just adding to the already-long list you have hoops
it want why is tow jump through with something new and something
new. The basics have not changed. There’s a lot layered
on top of it now, but the basics haven’t changed. Start with
that. Websites should be on a
well-supported, open source platform like WordPress. I do link to an article here
that explains why I say that. But I don’t have to sell you on
WordPress. You’re all at WordCamp US. You’re already fans so I don’t
need to convince you how great it is. But if you’re curious to
read it, I will give you a link to download these slides at the
end and you can read the article. We’re all fans of
WordPress here. Moving on. As much as of a fan of WordPress
as I am, I adore it and advocate for it all the time.
There is one thing that drives me nuts about it. Which is this
check box here that I refer to as the check box of
death. Formally it’s called the search engine visibility check
box. It’s in the WordPress reading settings and it’s so very often gets
forgotten about and is left checked when a
site launches or a redesign of a site launches. If I had a nickel for every
single time that happened, and a client comes to me and said, why
is my site not in search engines anymore and I found that check
box was checked, I would have a lot of nicks. But it bothered me so much that
I coauthored a plugin to monitor for this. I needed to as an SEO
agency because I’m responsible for make sure that my clients’
websites don’t fall out of search engines and they will if
somebody accidently checks the box. So, create a Sea visibility
monitoring plugin to send out email alerts if that check box
is checked on a production site. Incredibly simple, but
important. For now, it’s at cross check.
SEO.com. Must make sure that search
engines are allowed to access your website and make sure that
the check box of death is not checked. Similarly, there’s one other
thing that can completely kill your search engine visibility. And that’s a disallowed
directive for the website in the text file. It’s an SEO practice to have a
robots at any time txt file it tells them what they’re allowed
to and not allowed to crawl. There are certain pieces of
content that you don’t want showing up publicfully a search
engine. Here’s where you can say, I don’t want this page or
this section or this sub directory to be in search
engines. And I want to allow everything else. You see the last line on there
is allow slash. The slash alone means everything else on the
site. But if you accidently or if a
plugin sets that line instead of allow
slash to disallow and just a slash, your entire website is
now blocked from search engines. The same way as if your check
box of death was checked. Got to make sure that doesn’t
happen either. And it does happen by accident. I have a
client that they have a really good workflow. They only post changes to to
their website on staging. And have everybody internally QA it
and check it before they push it live. But something in the
process is broken in that every time they push it live, they
overwrite their robots file with the staging one which says
disallow this whole site. They dropped out and I found myself
manually checking the website every single day. Again, the cross check plugin
will monoforfor that monitor for ma.
Those two things, the check box of death and the robots file are
important because they will exclude you from search engines
in totality if they are not configured correctly. So, if you’ve attended to those
two things. Now you’re sure that you can be in search engines,
there’s plenty of other things you can and should do to make sure that your site is very
search engine crawler friendly. One is an XML sitemap. An XML
sitemap is sort of like a table of contents. It’s a techie file for search
engine crawlers, not for humans. But it’s basically a table of
contents of the contents on your site that you want indexed. A lot of SEO plugins will take
care of this. I’m a big fan of Yoast, it works
really well, I’m sure others do it. There’s an XML sitemap, and
once it’s generated, snit it to search console. If you haven’t
heard of search console, it’s a free tool by Google. Sort of similar to Google
Analytics. But different in that Google
Analytics monitors the activity on your website. Google search
console monitors the technical health as it pertains
to Google bot, it’s about errors
that the search engine crawler
encountered when trying to crawl on your website. That’s
the most important SEO tool you could possibly ever use. If you do nothing else today, if
you get nothing else from this talk, at least set up search
console for your site so you can find out. That’s the only place
that Google will communicate directly with you on if they’re having issues crawling
or indexing or including your site in search results.
Incredibly important to set up search console. Anyway, once you have an XML
sitemap, submit it. They will probably find it, but it’s a good idea to submit it there and
it will tell you if there are errors. That’s another reason to
submit it so they can process it. I said the XML sitemap is
not for humans. You want to have a sitemap for
humans that is like HTML. Regular old page. An outline of
all the pages on the site. And that actually is not just for
humans, it’s very human-friendly. But it’s also
for search engine crawlers to gain an understanding of the
hierarchy of the pages on the site. What’s nested under what. So, that has been shown to
increase crawlbility rates if you have an HTML sitemap as
well. It could just be linked to in the footer like in the
example here. But it should be dynamicically-generated and
updated. So, if you add a new page at any
point in time, you won’t have to remember to add it here, you can have it
dynamically updated. Plugins do that, I have been
using WP sitemap page. That’s linked from the slides
here that and that makes an easy short code to
use to dynamically update the pages to stay up to date and you
can put that in the sitemap page and link from
the footer. Those are the two types of sitemaps. I’m going to
jump around with other technical tips. One is pretty simple.
Regarding one-page designs, people often ask me, you know,
those websites that are just one big long page and they have a main NAV like home,
about, whatever, but it really just hopped down to another part
of the page. Don’t do that. If you want to be on search
engines, don’t do that. Yes, there are ways to work around to
make it look like separate pages on the backend to the search
engine crawlers. But it’s work arounds. It’s not a good
solution. Search engines prefer that sites
have actually separate pages. Just don’t do that. Next up, breadcrumb breadcrumbs.
This is something you should do. Breadcrumbs, similar to the HTML
side Map, they help search engines understand the structure
and the hierarchy of a website. Especially if they’re marked up
with schema markup. Schema markup, if you don’t know
what that is, it refers to additional code that you can add
behind the scenes of your website. One of the other things
that you can do behind the scenes that’s still okay. Usually hide stuff behind the —
not allowed to hide behind the scenes on a website. It’s behind the scenes humans
don’t see it, but web crawlers do. And it gives pieces of
information so that search engines can
understand it with artificial intelligence and
machine learning knowledge. Understand what the letters and
numbers mean. It’s telling the search engines, this is a
breadcrumb and this is the first page in the breadcrumb, this is
the second page in the breath bread couple and so breadcrumb.
And understands what it’s crawling. Yoast can help with
this. Not only generating the breadcrumb for you, it will also
generate the schema markup. That can be pretty easy to implement.
Next up, I put this under the category of technical because it
does kind of have to be tended to when you’re putting the site
together or redesigning a site. You want to make it extremely
easy for your website visiters to find and follow your presence
on social media. There is a correlation. Google’s very
careful to say it’s not causation. But there’s a
correlation between content that gets shared a lot on social and
content that ranks high in searchening ins. So, you want to make sure to
make sure that that’s shared by yourself and others. And share
buttons, share button here, follow button here, on the
website. Make sure to include that in your design. You also
want to make sure to show dates on blog articles. This is an item of great debate.
But in the SEO world. But whenever there’s an item of
great debate in the SEO world, I fall
back on what Google is say saying, their
representatives, straight from the horse’s mouth information.
They say you should have dates on your blog articles. Not only
that, you should also show the original published date in
addition to the last modified date. They do encourage you it
update your content and keep it fresh and up to date and
relevant. But they don’t want you to
change the original date. They want you to leave the original
date as is and use the last modified date. It’s in the field
in WordPress, but not often shown on articles. This here, wp last modified
info, that’s a plugin that might be able to help you show the
last modified date. Oh, and on — if you have any content that’s like whitepapers, case
studies, more evergreen content, it’s totally fine to leave dates
off of those, but you want to have an author name
on them. I’ll talk about why shortly. Okay. Jumping around
again. URLs. You want to make sure to have
search engine-friendly URLs. That’s easy, set the permalinks
to post name. And try to avoid underscores and
when you’re implementing
functionality, avoid program terse parameters. If you can come up with
something without parameters, the better. Title tags are one of the most
important I think this is SEO. Tells the search engines the
topic of the page. It should contain key words. Like you use
a keyword tool to verify that people do often search those key
words and you want them in the title tags. Any SEO plugin can
help you manage this. I used Yoast forever so I use Yoast. But one thing to note is that I
don’t feel like you should have the site title in there. By default when you install
Yoast, it puts the page and the title tag and lets you modify
that, but automatic automatically appends the
website to the end of the title tag. That’s using valuable real
estate in the title tag and diluting the
match between what a user types in as
far as key words go and what key words
you have in the title tag. I like to remove site title. And
you can do that sitewide on each type of content in the Yoast
appearance settings. Okay. Flying through because we have a
limited time. Images should contain alt text.
Both an SEO item and an accessibility item. Search
engines, as well as screenreaders that people who
have trouble seeing use to read website content to them, neither
of those can understand what an image is unless you put words to
the image. So, the alt text field exists. You’ll see it in
WordPress as soon as you upload an image, alt text is blank. You
can fill it out with a description of the image. It
should be an accurate description of the image. If you
can, try to use the keyword for that page, the primary keyword
that you have been trying to optimize that page for in the
image alt text. But what’s of utmost importance
is it’s an accurate description of the image. If you can’t go that, that’s
fine. All right. Meta descriptions are another thing
to make sure that you have on each page. And, again, just
about any SEO plugin can help you implement these including
Yoast. They are not a ranking factor. They will not make a
certain page rank higher. What they are is that preview of
text, that excerpt of text underneath the search engine
results. So, when you Google something and there’s a preview,
that’s ha meta description. And it’s good to have because it
encourages people to click through to your result. It’s not
something that’s going to make you come up higher, it’s
something that’s going to make you get more out of your SEO
efforts because it’s basically like an opportunity to write a
little ad or the page. It’s like ad copy. A short description of
the page. Content that’s compelling. Tell people what
they’re going to get out of visiting that page and that
increases click through rates which increases SEO traffic. All
right, next up, broken links are another item of great debate.
Just about everything is in SEO. But broken links are not a
ranking factor. I don’t argue that. That’s what people argue
back and forth, are they a ranking factor? They’re not a
ranking factor. But I feel like they absolutely matter for SEO. Because what a broken link is a
dead end for both human users and
search engine crawlers and that’s not a good thing. Search
console specifically will report on broken links because Google
bot hit a dead end when they tried to crawl the website.
That’s just never a good thing. Make sure you monitor your
website for broken links and fix them with
301 redirects. And make sure all URLs, even the older, ancillary
ones that you are not thinking about are redirected upon launch
and monitor. I also use screaming frog to
crawl a side for broken links. But monitor in console. Because
they could be linking to you or have a typo. Or you changed the URL, those
external links are of huge value for SEO. You don’t want to lose
those. Monitor search console con
carefully. And there’s a broken links
plugin, redirection by John Godly. It will help you do 301
redirects really easily. Old URL, new URL. That’s all you
have to put in. You can do advanced settings so
if you change the name of a page, it will create a 301
redirect for you. So, I like that one. Also on the topic of
broken links, make sure you have a custom 404 error page with
human-friendly language for if your humans hit a dead end on
your site and you can direct them where they might want to go
next. But also, including links on this page has been shown to
improve crawl rates. Because when a search engine crawler hits a broken link, if they hit
a 404 page with a bunch of other links, it can keep going, keep crawling, it
won’t stop. That’s good for SEO. At least have a high-level
outline of phage pages on your state to
have a custom 404 error page. Next up, security. This is a reference page — I
keep referencing Google. BING follows basically everything
Google does. If Google has something new,
BING has it in couple weeks. Everything about weeks is
because they’re the leader of the pack. So, search engines,
not just Google, continent don’t want content
with malware. That’s simple Pi. They don’t want users to be
hacked. But it’s difficult to know. Even
scanners will miss certain types of malware and hacked content
that’s deep enough buried in the code or the database. So, follow
all the best practices. This is a whole other talk, website
security. But if you get an opportunity to check out a talk
on that, do. It’s important for SEO. And make sure to use SSL.
If you haven’t already. Most sites have this already. But if
you don’t, the way to make sure is that your website loads with
HTTPS and not just HTTP. Most hosts include that for free now
or if they don’t, you can even get
a free SSL certificate from a website called Let’s Encrypt.
And that will make sure that you have that SSL security on your
site. Okay. Now those were all basic things that are not
changed over the years. Some more recent and advanced stuff
is what I have coming up here. You want to make sure your
website is responsive. I think most people are aware of this by
now. Around April 2015. We had mobilegeddon where Google put
their foot down, you have to have a mobile-friendly website.
And so, a lot of people made a mobile-friendly website at that
point in time. What they’ve clarify is they
want responsive. Not a separate mobile site, like
m.your domain.com. They were super-clear on that recently.
They want you responsive. And they want you to do responsive
their way. And they have guidelines —
Google has guidelines for your font sizes, how far apart your
tap targets should be, all sorts of things. So, you want to run
your site through the Google mobile friendly test to make
sure that it meets all of those more finicky requirements. So,
just being responsive isn’t enough. You have to be responsive in the
way that Google thinks you should do it. There’s a report
called the mobile usability report and that will tell you additional information about
what Google thinks about the mobile friendliness of your
pages. I think the last stat that I heardfuls 65 heard was 65% of searches
were on mobile on Google now. They’re obsessive. They changed
the indexing process to be mobile first. If you have a
desktop version a responsive version of the website, in the past, Google would primarily
crawl the desktop version and judge
you based than. Now they’re mobile-first. They will judge
you first and foremost on the mobile version of the
website when it comes to how good they
think you are. Staying on mobile, Google
invented AMP, accelerated mobile pages is what it stands for. Not
a technically way to describe it is that it’s like another layer
of responsive. So, you have normally on a
website, I got a demonstration here. So, this is my website in
responsive version which basically reorders and squishes
and stacks the same stuff that’s on the page into a
phone-size screen. But over there is the AMP version of the
same page. AMP really strips it down. Like it strips out a lot of the
design and styling and JavaScript. And they do that so that it
loads lightning fast. And actually if you have an AMP
version of a page, when someone is
searching on their phone in Google and your result comes up,
you’ll get a little lightning bolt icon next to your result
kind of promising the user that this page is gonna load
lightning fast. So, that is something that can be of benefit for sure to implement. It can be easy for certain types
of content and not so easy for other types of content. Basically, it’s pretty easy in
most cases to implement it on blog posts. Blog posts are basically mostly
text. Not a lot of design element in
them. It’s easy to use the official AMP for WordPress
plugin, which I have linked here, to simply slap AMP on to
your blog posts. Now, if you want to do it on pages, it’s a
lot trickier. It’s good to do it if you can. My formal
recommendation to my clients is, at least do it on blog posts. I’m not sure the cost benefit is
there to do it on pages because it’s so much harder to get
things like forms and certain design layouts working on AMP.
But if you want to try it, I would recommend a different AMP
plugin, the AMP for WP plugin is much more
robust when it comes to integrating
with form plugins and advances stuff that up to do if you’re
going get all of your pages into AMP. Now, regardless what have
plugin you use to implement AMP, something important to know is
that AMP does not automatically care over. The AMP version of a page does
not automatically carry over your Google Analytics code. I
see this happen a lot. People don’t realize that, they
implement AMP and all of a sudden their traffic looks like
it’s dropping in Google Analytics. It’s not actually
dropping. It’s just that there’s no Google Analytics tracking
code on the AMP version of the pages. So, that is important to
implement separately. It has to be in a completely different
format than the Google Analytics script. But both have a specific
settings screen that makes it very simple
to add your Google Analytics code there. Don’t skip that
step. Another step not to skip when implementing AMP is to make
sure your AMP page is valid. AMP specifications are weird. It’s
not like regular website coding. So, you got to make sure that
the pages validate in Google’s AMP testing
tool which is linked to there. Another mobile thing that’s very important is not to have what
Google considers intrusive pop-ups. There’s a — I can never say
this word — mobile interstitial penalty. Basically it’s about
pop-ups. They don’t want you to have pop-ups that are not user-initiated
that cover the main content of the page. So, there’s examples
there on what they feel are intrusive and unreasonable
versus what they feel is reasonable. So, basically you
can have like a banner that’s maybe, you know, 25% of the page
come up at the top that doesn’t keep the user from reading the
body content. But if you have something like that first one
where it’s just, you know, a box — taking up a majority of the
page in the middle so people don’t read. They don’t like that
and you can get kind of demoteed in search
engine results for that. Another thing to avoid is duplicate
content. There is not a penalty for this. There is a penalty for
the mobile pop-up thing. There’s not a specific penalty
for duplicate content. But it’s not good because search engines
don’t want to show two copies of the same page in the search
results. They’re basically just going to ignore additional
copies. And sometimes they ignore the copy that you want
shown. So, you want to make sure you don’t have two different
URLs displaying the same or very, very similar content.
Similarly, you don’t want to have different pages using the
same title tags, the tame meta descriptions
or the same X1 tags. There are tools here that are
good for identifying duplicate content.
Unfortunately there’s not an all in one. Different ones do different
pieces. Screaming Frog checks for
duplicate title tags, H1 tags, meta
description, et cetera. Siteliner will tell you if you
have the body copy, the meat of the page if you have two different URLs with the
same or two similar content in the body of the page. And Copyscape checks for
duplicate content on your page and elsewhere on the web. That’s
duplicate content, that’s not just two URLs having same and
similar content. It’s other URLs on the we can
and Copyscape checks for that. You want to check for duplicate
content in search console’s report under
the excluded category. Google will tell you if they ignored a
page because they considered it a duplicate. If you can’t get
away from having two URLs with the same or similar content,
that’s not a problem. Just mark one much them as the original with something called a real
canonical tag and Yoast can help you set
this up. It will show one in search results and ignore the
other. And you want to make sure the
web page loads one way with the HTTP,
HTTPS, the dub dub dub version, and redirector to one that starts with HTTPS. Did
doesn’t matter with the dub, but you want to force all the ways
that people type it in to redirect to one way. There’s a tool, HTTP status.io,
put in the domain name and check that canonical domain check
button and it will tell you if it’s all good or not. All right.
If you are using Yoast, this is a tiny little thing that
probably isn’t an issue. But they did have one update where
this was turned to no by default
which should not be. And that’s media attachment redirects. You
want to make sure this is set to yes. It probably is. They fixed
it in later releases. But once in a while I still come across a
site that has that set to no. That’s just a quick double
check. Okay. So, before I mentioned author names on
content, this is another thing that Google has been talking a
lot about lately that is of great debate, as per usual, in
the SEO industry. But, again, I just default back to whatever
Google tells me to do, I’ll do. So, they say you should have awe
nor author names on your content.
Blog articles, et cetera. You want to show who wrote them
and mow credible that person is. Show a bioIt is for that person.
Have a short biopositive at the bottom. I use a plugin called Starbucks.
Starbucks? Starbox. I need coffee, obviously. To add a blurb and then I link to the
full bio, with more information on why I know what I’m talking
about. And then also on the full bio page, I also used schema
markup. I’ll give you more information about how to
implement schema in a moment. But I implemented schema markup
so that Google can understand that I am a person. I have, you
know, a degree and a job title and a description and I have all
sorts of other things that I marked up in my bio. So, that,
again, they can use artificial intelligence, machine knowledge
of sorts to understand more about me as an entity. That’s
big in SEO, not just trying to match key words, but understand
an entity. An entity would be a person or a thing or an object. They’re trying to understand
entities. I’m a person, I have all these credentials and I
wrote the article at hand which makes it more trustworthy. Another thing they talk about is
EAT, expertise, authoritative
authoritativeness in and trustworthiness. You want to demonstrate that.
Another super-important thing that Google talks a lot about lately
is your website should load fast. You may feel like it does.
Especially on mobile they’re picky about this. You’re on bye Wi-Fi or 4G LTE,
12 or 18 megabits per second on average. They want your site to
load quickly on a 1. 6 megabits per second 3G
Internet connection. Which is super slow connection. But they
want to make sure that your website loads fast on mobile on
that connection. So, there’s a tool — well,
first I’ll give you a plugin and then testing tools. The plugin I like for all things
page speed related is WP Rocket. Simply because it covers almost
all things page speed-related. You can accomplish what WP
Rocket accomplishes with a mix of other plugins, but WP Rocket
just makes it easy because it’s all in one. But it is paid. So,
you can implement this in a free way with other plugins. But
first you want to test what Google thinks of your site
speed. And they have a tool called
PageSpeed insights. And that will tell you how fast your website loads on that super slow
3G 1. 6 megaby thes megabits per
second. Don’t worry about a hundred,
that’s not it. But don’t be in the red. They color code the
scores of red, yellow and green. Definitely don’t be in the red
and get it as close to green as you possibly can. Another great tool for speed
testing is GTmetrix. It’s free. You can login. To create a free account to
login and set settings. Test with desktop and mobile in
different locations or whatnot. And give use a lot of
information about everything or not page and you can
troubleshoot why your website is not loading quickly. And similarly, WepPage Test. org is another tool for
emulating different conditions and browsers what you’re doing
speed testing and give use a ton of information. So, those
are helpful. All right. A couple of random tips about scripting.
When JavaScript is disabled, you want to make sure that your content
is visible and crawlible. This is less important because Google
is getting a lot better at reading and rendering
JavaScript. But it’s still kind of clunky the way they do that.
If JavaScript is disabled, you want the most important words to
be visible. And Google can crawl everything,
they want to crawl your CSS and JavaScript, basically everything
unless it’s a page you don’t want included in search results.
And other random tips. IFrame, text and obviously Flash
are incredibly search engine unfriendly it’s okay to use
iFrames for a video, but don’t iFrame whole pages of text into
another page. Speed up a little bit here to make sure we have a
few moments for exceptions so, I mentioned schema a couple times
now. And schema is complicated. It’s simple in theory. In theory it’s just additional
code you put on behind the scenes on a website to give
further context to the information for understanding it
with machine knowledge. But it can be tricky to implement. You
can view the guidelines — you can view the different types of
schema that are available and how to implement each on schema. org, the central place where the
guidelines are published and things you should have, there’s all sorts
of schema that you can use. At at minimum, company names,
addresses, phone numbers, videos, articles, author bio
pages, products if it’s an eCommerce site and any other
type of schema that applies to you. But those are a few to
consider as a minimum. Since since it’s tricky to
implement, it’s easiest to rely on plugins. The first one schema by Hesham
is easy to implement basic types of schema. Another one, WPschema.com, the
name of the plugin is schemapro. It’s a paid one, but user
friendly and easy to use. I like that as an alternative to the
first one. And then for video schema, specifically, I love this
plugin, WP YouTube Lyte. It connects to your YouTube
channel. You have to do a quick thing where you get an API for your — an API
key for your YouTube channel. But once you do that, it
connects to your YouTube channel and any
videos you upload to YouTube and embed in the site, automatically
generates the video schema for. Super handy. Otherwise you have
to remember to do that every time you add a video.
Important, similar to AMP, make sure your schema markup valley
dates. You have to do it correctly with the nesting of
the property. There’s something called the structured data
testing tool that Google has that you can put a URL in or
some code and see if your schema is done
correctly. One quick bonus tip and then
I’ll give you the link to the full audit
template of things that I check for technical SEO audits. Bonus
for local businesses, local businesses I being any entity
that needs to attract search engine users from a certain
geographical radius. Like a pizza place or a plumber, not
going to go beyond a certain radius. If you have a business
like that, make sure your physical office locations that you have a real street address
for have their own individual pages and you embed a link — or embed a Google Map
that is linked to the Google My Business map for Google My Business Google
Maps lists for that business, which is managed by Google My
can have business, they love to rename things like that all the
time. And mark your company name, address and phone number
up with schema markup. That’s very, very important for local
businesses to make sure that search engine crawlers
understand where exactly geographically you’re located. And search is very localized,
especially on mobile. So, you want to have schema
markup on your address, and you have different addresses, have
them on different pages and embed your Google Maps listing
on each. Okay. So, a couple minutes for questions and then
we are going into break after this. And I’m not running away.
But I want to point out where you can download the slides and the
checklist which includes all of these things I went over today
and even more. It’s crosscheck crosscheckSEO.
com/download. Download both thing there is. A couple
questions now and I’m happy to chat with anyone else
immediately after this, or Tweet me. We can meet up this weekend if
you want more personalized one on one help. Yes? AUDIENCE: [ Away from microphone
] PAM: Oh, sorry, we were supposed
to use a microphone. Is it working?
AUDIENCE: Hello? PAM: There we go.
AUDIENCE: Okay. I guess it’s in search console, you’ll get
sometimes error message or an email saying they’ve done your
site and it found some things like buttons
are too close together. Or text isn’t too big. That’s
not terribly helpful in terms of how big is the button supposed
to be? How bigger is the text supposed to be? How far apart? A certain number of pixels?
Wheres that written down? PAM: I agree, they’re vague with
the notices. I mentioned the usability reports in search
console. That’s what the emails are related to. It tell use
there’s a usability error. As of late, there’s a lot of false
positives in that. I see a lot of emails going out and test the
page with the mobile-friendly test and it’s fine. So, those
self-resolve. The first is double check.
AUDIENCE: That’s what I — I have customers, it sends it to
them, hey, what’s going on. I’ll go back and look. Everything
seems fine. PAM: Yeah, I have been meaning
to reach out to John Muller of Google
about that. He works with search console and it is so annoying. So, first just use the mobile
friendly test and verify that there actually is or is not an
issue. And if there is, they do publish the guidelines on
exactly what the font sizes should be and the spacing and
all of that. I don’t have the link handy. But I could send it
to you if we connect. They do lay it all out somewhere. AUDIENCE: Thank you.
PAM: Certainly. AUDIENCE: I have two questions.
The first question is about a slide you just had. When
embedding the schema for our company, is it appropriate to do
it for all pages? Or is there a certain page to
put it on? PAM: Very good question. I
should have mentioned, when it comes to schema, it’s important
that the markup that you’re adding to a page matches the actual human visible
content on the page. So, you want to add it to only pages
that show your address. So, if you have your address in your
footer and then your address legitimately is viewable by
humans on every page, you can add the schema on every page. But if the address is only on
the contact page, only add the
schema there. It’s important that the schema
markup relates to something on the page.
AUDIENCE: My second question. Other than for page load speed,
does a CDN or server location have any impact on page ranking?
PAM: Not separately from page load time. But both of those
things very much affect page load time and in turn, SEO.
AUDIENCE: Thank you. AUDIENCE: Hello. Follow-up
question to that. So, if you don’t have a physical address, do you — what would —
what would you suggest to do about the schema markup?
PAM: Good question. If you don’t have a physical address, you still — if it’s important
to only attract users from a certain region — like, you may
not have a physical address because you serve clients
nationwide and you work from home. Then you don’t need to worry
about this too much. But if you are a local business, do
something in person, only go to a certain mile radius, at least
mark you were the city, state and zip. Or if a county if
you’ve, you know, if you want to use a county. Like give as much of that as you
have. Maybe you won’t have a street address piece. But you
could list your city, state, zip and your county and your state
and make that up with schema. AUDIENCE: So, you would say if
you’re an information product company that sells globally, you wouldn’t need
schema? PAM: You wouldn’t need to focus
on trying to make it clear to search engines where you are
geographically located. That can be an advantage in one way
because it might boost you in that region. But in another way, it can be a disadvantage because it can kind
of pigeon hole Google into thinking you only serve that
region. You don’t want to focus on it too much if you’re
nationwide. Okay I’m going to wrap up. If you would like to sit down
and go over an issue with me, just
Tweet me. Thank you, everyone. [ Applause ] . . SPEAKER: The lights are coming
up, it must be show time. I have an intro. Awesome. SPEAKER: Okay. Good afternoon.
Welcome, welcome, everyone. Just want to make sure you’re in the
right room. This is the hacking mindset talk. So, you got two
more talks. We have a wonderful speaker coming up. But before I do that, I’m Aita,
I’m the room MC. Turn off your cell phones or any device that
might make noise and remind you about tonight, which is the
Wordfest, the after party. So you know need your badge to get
in and it starts at 7:00. And also to remind that we would
love to see you all there on Sunday
for Contributor Day. So, your talk — your speak for
today is Miss Kathy Zant. And Kathy has been leading
data-driven web projects for over 20 years for companies
large and small. In the last decade, she has
focused on PHP, MySQL and the WordPress
platform. Her primary interest at the
moment is WordPress security. Kathy works for WordFence where
she’s done everything from clean hacked websites to operation
management, sale, marketing, and everything in between. She
is passionate about helping people and getting the most out
of WordPress and the community. So, please, help me welcome
Kathy Zant. [ Applause ]
KATHY: Thank you. Thank you, guys. Wow. This is exciting. Is
everybody having a good WordCamp? Yeah? Whoo! All
right. Okay. Before I start telling you all
of the hacker’s secrets, how many actual hackers do we have
in the room? Raise your hand. All right. So, we — well, we don’t to want
get too far ahead of ourselves. But do you call yourself a
hacker? Do you consider yourself a
hacker? All right. Well, I’ll ask you at the end.
I’ll ask you at the end and see where we’re at, okay? All
right. Well, I was given a wonderful
introduction. But if you want it all written
down, it’s on the slides which I’ll Tweet how when we’re done
here. I have been working with WordPress for a very long time. Before that, I worked with all
kinds of other technology. Databases plus scripts are my
game and securing them is what I do now. I’ve done everything
that you could possibly imagine at WordFence. I love the
company. I love my team. Some of them are here right now. If you
are using WordFence on your site, give them a round of
applause because they are keeping you safe. And having fun here at WordCamp.
How did I get here? Well, anybody who is in security
or has any idea about security gets
here because they got hacked. The first time I got hacked was
my first job working for an
insurance company in a data center in suburban Chicago. And
I inherited a server that someone else set up. Someone
much smarter than me, right? You know, they went to school
and have a degree in computer science and they set it up. And
I went to go check log files one day and there was a text file in
the root of the web directory. And it said, you have been
hacked. I ran around with my hair on fire. Found my bosses. Incident
response began. It turned into quite a bit of an incident
response. They then turned to a tiger team
and attacked basically the entire network because of this one text file.
Quite a few years later after I was a freelance developer, I set
up a WordPress site for my husband. And his site got hacked. It was the Tim Thumb
vulnerability. If you have been working with WordPress for a
long time, you have probably seen a website with a Tim Thumb
vulnerability. I helped him clean that site. That was my
first hacked WordPress site. Interesting, on the other side
of the continent, a guy, Mark Monder
had his website hacked and it was the same vulnerability. Mark
got busy. He got busy not only helping
patch that Tim Thumb vulnerability. Tim Thumb is an image
compression library and included in a lot of themes. It’s a big
deal. But if you go into the files and
see Mark Monder at the top, it means you have a safe version of
Tim Thumb. Not only did Mark patch that vulnerability, he got
busy writing a program we all know and love, WordFence. That’s how it got started. Now
WordFence is install on over 3 million WordPress sites
worldwide. Kind of a big deal. So, that’s how we got started. So, I’m going to talk about the
hacker mindset, but with security tips that you can take
home to secure not only your WordPress site, but very life
online. So, tip number one, has anybody ever inherited a website
from somebody else? Yeah. Tip number one: Never assume
that is secure. Assume that it’s not. Do an audit on it. Take a
look at how everything has been set up. If you’ve inherited a
phone from someone, a computer from someone, never make the assumption that was set
up securely. Never assume anybody else knows what they’re
doing. Because you can’t blame someone
else for a hacked website when it’s
sitting on your server or a hacked serve their you’re
responsible for or a hacked computer that has all of your
financial data on it. So, you have to take
responsibility for security. Now, cleaning hacked sites, I’ve
talked to a few people here today and
they’re like, ewwww! That’s so gross. It’s a mess. And it was
kind of like life. There was a picture of Forrest
Gump. But he’s copyrighted. So, now the box of chocolates. Cleaning hacked sites kind of
felt like being Forrest Gump sitting with the box of
chocolates and never knowing what you were going to get. You would open you are our
ticketing system, a ticket of a hacked
site, and take a look and it could be anything. No two looked
alike. You would see some patterns. You would see the same
vulnerabilities being attacked because of a specific campaign.
But every day that I would open up a ticket and clean a hacked
site and open up another ticket and clean at hacked site. And
sometimes clean 30 sites because they were all on the same
C-panel and every single one was compromised, it was always a
challenge. And it kind of reminded me a lot
about life. Is there anyone in this room who
is not challenged by something in your life right now? Whether it’s complicate with
conflict with a spouse or a family member or someone that’s sick or your dog
dies and it sends you into two weeks of
tears? No that I’ve been there. I’m lying. I’ve been there.
We’ve all had challenges. Is there anyone here who doesn’t
have a challenge right now in their life? Anybody who is like
living in a bowl of cherries? Anyone special? Because I would like you to
sprinkle that pixie dust on me if you’ve got it. We all have
challenges, right? This is life. Even little kids. Parents
in here? Remember your little kid learning how to walk? Boom!
How many times they fall down? And what do they do? Do they
give up or did they just keep getting back up and crashing
again and falling down a stair or two? Hopefully not too bad.
But they keep going at it, right? There’s challenges in
life. And it seems like when we’re born, and we came into
this world, we seem to have a mindset that was prepared for
these kinds of challenges. That was prepared to deal with
difficulties. That was prepared to think outside of the box that
was prepared to fall down and get back up again. But sometimes we lose that. Now, there was a man named
Victor Frankel who wrote a book called Man’s Search for
Meaning. I how to read it in college. Anybody else read it?
Yeah. It was assigned to a lot of us. This quote stuck with me
since college. Between stimulus and response there is a space.
And in that space is our power to choose our responsible. And in our response lies our
growth and freedom. Now, Victor Frankl, he had a few
challenges. Victor Frankl was in the
concentration camps. And yet he looked although that particular
challenge, which is probably worse than I would say even my
dog dying, and he responded to that differently. He saw that the stimuli of that
challenge didn’t have to be — didn’t have to lead to a
negative response. He didn’t have to give up. He could look
at that challenge and he could rise above and beyond it. And I
think that’s what the hacker mindset is all about. It’s about
seeing challenges. It’s about seeing your entire
life in a different way. And it’s about grasping that space
between stimulus and response. And choosing your freedom. All
right. Does that sound interesting to anyone? You want
to be free? Then you got learn to think like a hacker. Because
how you respond to your challenge is your experience. If
you respond a challenge or a difficulty and you go cry in
your room for two weeks, how is that helping you? How is that helping you grow? If your little kid falls down a
flight of stairs or falls down when he’s learning to walk and
never gets back up again, where does that leave
them? Life is pushing and pulling us to our greatness.
It’s pushing and pulling us in directions that, you know,
sometimes we might not want to go. But those challenges are pushing
us towards really finding out who we are. It starts out when we’re
walking. It goes through school and teachers telling you that
you’re not smart enough or that you have a learning disability
or that you have a problem and you’re ne’er going never going to
surmount that problem. Can you hack beyond the challenge that
stands before you if because your greatness is not going to
come in a vacuum. It’s going to come because you decided to go
into that space between stimulus and response. And choose
differently. And if you’re working with
WordPress, ah, you have plenty of
opportunity to deal with challenge challenges. Anybody in here whose site is
under attack right now? The smart ones are raising their
hands because they know. Now, that screenshot that’s up there
is from the WordFence dashboard. We’re on 3 million sites. We see
some things. So, those are the types of attacks that we’re
seeing. Because WordPress powers over a third of the Internet.
It’s under attack. Hackers understand economies of
scale. And they’re going after the biggest fish in the pond.
And if you’re working with WordPress, you know why it’s the
biggest content management system out there. It’s the most functional, it’s
the most easily extensible. It’s where most of us are making our
living. It’s awesome. And hackers are looking for ways
in. Thinking like a hacker and
securing WordPress and securing the rest of your life is good
for business. Now, this study came from AT&T. They found that companies with proactive security policies
actually are more successful in business. 24% sales growth over
a 3-year period with 20% profit margins? Now, companies without
proactive security policies only experienced 6% growth with 3%
profit margins. Hmm m… now, obviously AT&T is trying to
sell you security services. But think still did the research
and it’s still valuable. They’re finding out that people who
think proactively about security, they have a mindset.
And they’re probably thinking proactively about other areas of
their business as well. It’s not limited to security. So,
security is a great place to start. Because you have an
asset. It’s your WordPress website. Securing that asset is going to
help you start thinking like a hacker and it’s going to spill
over into other areas of your mindset
in dealing with your business as well. So, let’s get proactive
about security. If you’re using WordPress right
now, you can go on WordFence. com, go on to the site security
audit. Google WordFence site security
audit. There’s a sample report. In the back of the report, is
what our trained security analysts look at when they’re
analyzing your site security. You could hire one of our guys
to do it, you can get a premium
license. Or you can do it right now. Not right now. You’re at
WordCamp. Tomorrow when this is all done, you can go download
that report and start proactively looking at the
security of your site. And it will spill over into other erareas of your areas of your
life as well. Even not dealing with WordPress, you can think
about security. If you don’t have a a WordPress
site, I’m sorry to report, you are still under attack. We all
are. We’ve bull we’ve all been
hacked. I bet everyone in this room has at least one email
address in a breach. A man named Troy Hunt has a
website called have I been PONED? And takes these that end up in
the big, scary dark web and places
like Torrents and whatnot that hackers share information and
puts the information in the database. You can put your email
address in there and see if you have been in one of these
breaches. If you’ve used LinkedIn, you’ve
been in a breach. If you use Adobe or have used
Adobe in the somewhat distant past, you have been in a breach. And if you have any credit cards
whatsoever, there is a credit reporting agency that had a very high
scale breach that even if you didn’t have a contract with them, your information
ended out on the web for hackers to poke at. So, we are all under
attack. So, security tip number three:
Go on to I have been pwned, put your
email addresses in there were see where your information has
been in dumps. And if your email address is in there, I’m sorry to say, a password
might be there in there. Nobody reuses password. Has anybody
ever reused a password? Do you remember the good old days when
you could do that? Ah. Yeah. I used my cats, my dog, my kids’
names. Can’t do it anymore. Those passwords and are in a
breach and they are using them to poke at other services,
including your WordPress site to try to get in. So, security is
good for business. The hacking mindset is something that could
change your life. So, let’s take look at who hackers really
are. Are you a hacker yet? Getting
there. Let’s look at who hackers really are. And take a look at
the hacking mindset. So, is a hacker this guy? You see this
guy in the media all the time, right? This is the hacker. The big scary guy with the Guy
Falks mask. Or maybe a guy in a scary room looking at his
computer in a hoodie. He’s scary. Or maybe it’s the non-conformist
teenage hacker girl. All right. I’m involved in security
marketing and I hate to tell you that security
stock photography, if you have a good sense of humor, take a look
tat. It is slightly ridiculous. So, we have loads of fun with
this. But the media tries to tell us that hackers are what?
Bad guys. People to be scared of. Someone who is trying to
steal all of your information and your money. Hacker sounds
scary. But here’s an alert. These guys — anybody know who
that is? That’s it. Steve Wozniak, Steve Jobs, Apple
computer. Way back in the day. Actual hackers. It took some creativity to
create the first personal computer. It took thinking
outside of the box. It took thinking beyond what was
acceptable. And these guys were actual
hackers. Phone freaking back in the late
’70s, early ’80s. You could play a 2600 hertz tone
into a phone and — an log phone — and
you could actually get free long distance. Which if you’re old
like me, was a big deal. I wish I knew about it. But I didn’t. The funny thing is, as I was researching phone freaking, this
Captain Crunch whistle made a perfect
2600 hertz tone. You could use a Captain Crunch whistle to get
free long distance. All right. Now, who is an actual hacker?
Kids. Has anybody ever been to San
Jose to the kid’s museum there? It’s on Wos Way. The kids
museum. Steve Wozniak, WosWay. They’re a
bunch of kids having a good time. Remember the kids standing
up after they fell? Not giving up? Hmm… we’re starting to
learn about the hacker mindset, aren’t we? What did we lose? Hackers, like our kids, don’t
see different things. They see things differently. And
so, what I’m inspiring you to do is to look at everything in
your life. just a little bit differently.
So, normal people would see a locked door. What does a hacker
see? I could pick that lock. Normal people see the way things
have always been. Get stuck in our ways, don’t we? Hackers see
a new way of doing things better. Like personal computers. Normal
people see the rules and the regulations and the way it’s
supposed to be done because that’s what the government tells you to do
hackers see rules as things to transcend. To be bent. Rules to
be broken. We see vulnerabilityies. Hackers see opportunity
opportunity. Hackers see systems as a
collection of rules. This used to be the spoon kid
from the matrix. But now we just have a bent spoon. Copyright.
You remember the matrix. Neo. What did Neo do at the
beginning? What was his job? He was a programmer and he was a
hacker. He had the mindset ready to look
at the Matrix in a different way. All right. I may be a
little bit cliche by saying that this whole world is a
system that could be hackable. But you have to look at
everything in your life — not just your
computer, not just your phone. Not just your relationships.
Your mind. It’s all hackable. It’s all changeable. That’s how
we were born. We were born to look at things and feel things
that we couldn’t do. And to think beyond that.
Otherwise would we run? We would have given up long ago.
Innovation comes from seeing the challenges in your life. Those
things that we talked about where I asked if everybody’s got
a little bit of something they’re trying to work out.
Those challenges are things that you can look at differently and
you can look at them differently today. You can start asking
questions. What if? What if this happens? What if that happens? So, let’s dive a little deeper
into the how and why of thinking like a hacker. Does anybody remember the Target
breach that happened in 2013? That was a story, huh? Oh, my
gosh. So, what happened? It was around Christmas time.
Thanksgiving. And HVAC vendor had VPN,
virtual private network, access into
Target’s network. That computer got hacked. Heating and
air-conditioning computer got hacked. 19 days. After they did
the postmortem on what had happened, they found that those
hackers were in that system for 19 days. Was it a guy in a
hoodie? Could have been. Maybe it was a group of guys from the
Ukraine. Who knows who it was. But they had patience. Now, if they had gone in there
and said, oh, look, Target’s HVAC
system. I wonder if we can turn the air-conditioning on in
Minnesota? Great. That’s fun. But they looked at that system
and said, I wonder, where can we go?
Where can the rules be bent? Where can the rules be broken? They ended up 1800 point of sale
cash registers across the United States. Bing. The mother load.
Patience. So, security tip number four. That’s a scary story.
Functionality isolate your website. Anybody use Cpanel? Anybody got
more than one WordPress installation in your c Panel.
All right. I cleaned a hacked site. It was a Brazilian agency. This agency had 30 sites in a
cPanel. One of the customers had a pass
word in a data dump in a breach. Hacker got in. Went to the four-page theme
editor and pasted that 404 page as a PHP back door. That gained them access to 30
WordPress websites. They appended a JavaScript
redirect into every single JavaScript
site in that cPanel. That agency’s customers, every one of them, was redirecting site
traffic to a bad plaits on the website. So, one site, one
C-PAP. That’s our recommendation. If you are going
to put more than one in a cPanel, watch them
carefully. Remove everything you’re follow the using.
Plugins, you’re not using, don’t just deactivate, get them out.
Themes also. And a test site, if you want to
test if a theme is going to work autocertain way or a plugin is a
certain problem, still an entry way into your production site.
Delete that or take care of it. Hackers are persistent. That’s
just an image that, you know, I’m sure it’s been on Facebook.
It’s been in your feed. It’s been shared 40,000 types, I
think. Patience and persistence are two key traits of a hacker. Do you give up before you get to
the mother lode? The Target hackers didn’t. Are
you going give up before you want to be? Patience and
persistence. If you need practice, head down
to the WordFence table, pick a lock. It takes patience, it
takes persistence. And then all of a sudden, you’re thinking
like a hacker. Visualize the solution. Don’t try to force it.
Often helps. More security tips. So, treat the problems of your
life and security like games. Or puzzles. Often times we get like
emotionally attached to an outcome. Or we get emotionally
affected by the negativity that might be the shade that’s being thrown at us by an
adversary, it’s all just a game. If you can stay in the hacker
mindset, you’re going to treat it like a game. And you’re going
to be more able to be flexible to recapture that child
like exuberance that we once had in order to see solutions where
other people just see problems. So, look for those
opportunities. Because those challenges really are your steppingstone to your
greatness. If you watch your site security, it’s a great
practice for looking a the problems in other areas of life.
So, go pick a lock. And backups is in there. Because backups.
Everybody is backing up, right if all right.
So, scaling the attack. Is it a guy that hoodie trying to get into Sally’s cat blog.com? Or
is it just a bot? It’s a bot. 99. 99% of the bad traffic we see
comes from a handful of IP addresses just
trying to get into WordPress and these are bots that are
programmed. Maybe the guy is wearing a hoodie, I don’t know.
But it’s bots. They are looking for
vulnerabilityies or opportunityies. So, you can do
that too. In all areas of your life. And in security, you can
leverage technology to make security more effective. There
are firewalls, intrusion prevention, intrusion detection,
malware scanning, password managers. They’re all kinds of
technology to help you stay secure so that you can free your
mind up to think like a hacker. So, look below the surface. When
you’re seeing a problem, you’re seeing just the top of the
iceberg. The solution is always a little
bit deeper. Take some curiosity. It takes asking what if? How
does this work? What’s really going on here? Everything in your life is
hackable. Now, no security talk would be
complete without talking a little bit about ethics, right?
I mean, that’s what really the whole negative connotation of a
hacker is all about. It’s all about ethics. So, are you going
to put ethics first? Are you going to put money first?
Because all these hackers, what they’re trying to do, when
they’re trying to get into WordPress, they’re trying to put
scripts on there to direct to advertising networks or malware that’s going to cryptomine to
make them more money. They’re trying to exploit the server
resources that you’re paying for in order for their profit
motive. But hacking. What’s it all about? What’s the intent behind your
hacking? Are you trying to hack the world to be a better place?
Or are you trying to hack the world for your own profit and
gain? Like Dr. Evil. So, I believe that there is such
a thing as white hat hacking. And I see it all the time. So, recently a guy found a way
to get past Instagram’s two-factor authentication. So,
two-factor authentication, a six-digit code, 1 million
permeations. He basically leveraged cloud servers to rotate through IP addresses and
basically brute forced past the two-factor authentication.
That’s pretty cool. He went to Facebook. Instagram.
And showed them his proof of concept of how we got in. They gave him $30,000. Pretty
sweet, huh? Hacking — ethical hacking can
pay. You don’t have to turn to the darkside, Luke. You can be a
white hat hacker. And there’s money in it. In the WordPress world, there’s
plenty of ethical hacking going on. Now, I’m gonna shoutout to
one of my coworkers, a man by the name of Matt Berry. He’s an
incredible guy. I don’t think there’s anyone on our team who doesn’t look at Matt
with the utmost in respect. Not only
technically, but just as a rock solid human being. Matt Berry is
incredible. I hope I’m not making you
embarrassed, but we all really, really respect you. Matt was doing an audit of
plugins we use on WordFence.com. We use WordPress too, of course. And he found a stored scripting
vulnerability in a plugin, syntax highlighter involved. He looked to find a person to responsiblely disclose this to
get it fixed and found that Automattic is the maintainer of
the plugin. The developer was a man by the name of Alex Mills.
Many of us in the WordPress community knew Alex because he
was such a prolific coder. He worked for Automattic. Many of my friends got into
coding PHP and coding for WordPress because of Alex. So, Matt got a $350 bug bounty
for discloseing this responsibly.
The patch has been put out by Automattic. He took that $350, his profit,
and he donated that in memory of Alex to the hospital that
treated him. There are ethical hackers. Matt Berry yay is one.
And I am proud to work with him. He is ethical hacking really at
its finest. And he is in the WordPress community. And it’s
one of the things that’s really special about WordPress. I
mean, we’re all here at a WordCamp, right? And it’s kind
of a special place. It’s our tribe. There’s a lot of very special
people here. And the hackers that exist in
this room. And the hackers that are out
there picking locks are also some
really fine people. So, security tip number six,
two-factor authentication. We’re using it, right? Anybody
not using two-factor authentication? Anyone confused
what two-factor is? I’ll just go over it really quickly. You
have a user name, you’ve got a password. They’re probably in a
breach somewhere. That two-factor authentication
code, your Google Authenticator app on your phone or Authy app on your phone
or 1Password which has it built into their system. Great tools.
Because even if they get your user name and password, they’re
not going to get the code unless they steal your device. It’s
going to add an extra layer of security. And if you want to really stay
secure, call your bank. Oh, my gosh, the banking system,
what the heck? SMS still? Come on, you guys. Get with the
program. So many of our financial institutions are behind the ball with this
and still using SMS-based two-factor authentication. It’s
kind of a sad state because there are things such as SIM
porting attacks where someone can two to a Verizon store, for example, and say, my
name’s Kathy Zant and my mom died and my phone’s not working
and I don’t know. And put that person under pressure. No, I
don’t have my ID because my mom just died and whatever. And get a S im card in a new
phone, boom, they have the SMS codes. Use the authenticator apps
wherever you can because SMS will go by the wayside. So,
that’s about it. But I have a question. I asked before if
there were any hackers in this room when I started. And I want
to know if anybody’s changed their mind. Any hackers in this
room? A few more hands. Oh, come on, you guys. This is like
my thing. Gonna hack your way out of problems, now, right? You’re gonna look at things with
fresh eyenses. You’re gonna say what if and
find solutions to your problems so that you can experience your
greatness. If you have any questions, I’m open for them.
Follow me. Watch my podcast, WordFence.
com/podcast, think like a hacker. And that’s it.
[ Applause ] we have a few minutes for questions if
anyone’s got them. Happy to talk about anything. Yes, my dog
really did die. I have a new dog now, though.
Any questions? Yes? AUDIENCE: [ Away from microphone
] KATHY: First thing you do. Make
a backup of everything. Make a backup of your log files and
your entire site. Store that backup elsewhere. Get it off
your server because a hacker might still be on your server. Then I would run — I would run
a WordFence scan, install WordFence if your site is still
functional. Make sure you’re backing up your database as
well. Because sometimes they get in there. And sometimes we get
site cleaning requests come in and the site
might just have something wrong with it. But it’s so broken,
they can’t figure out what’s going on. But make a backup. If you have a C-PAP, make a
backup. Jetpack, tons of ways of making
the backup. The hosting provider will help you. You’re preserving
the evidence of what’s happened and then you can start trying
to clean it. If you go — just do a search for how to clean a
hacked site with WordFence and it will — there’s a whole
tutorial on how to do that. Or just how to clean a hacked site.
Another thing that I would really recommend is going on — just do
a search for Hardin WordPress. And there is a page on
WordPress.org that will give you a number of steps where you can more tightly
secure WordPress. Like, for example, like the Brazilian agency, cPanel nightmare they
cleaned up, 307 sites. Had they turned off theme editing, which
is something that you can do in your WP config file, then they
would have never gotten that 404 page
to paste in that back door with the theme editor. So — and how often are you
editing your themes with that, you know? You can just turn it
off if your site is live, production, doesn’t need to be
messed with. It’s just another way to harden WordPress. So, Google “Harden WordPress.”
Tons of tips there. Yes? AUDIENCE: What’s the — what’s
the most common attack vector that you see? Is it XXS? SQLI? Brute force? What?
KATHY: We did some research quite a few years ago, and it
was cross-site scripting attacks. When we see attacks happening,
they’re going after plugins. For the most part. So, keep your
plugins updated. Don’t install anything and just leave it there if you’re not using it,
delete it. That kind of good plugin hygiene will help keep
you safe. Cross-site scripting. Not that I’m selling from the
stage, the WordFence free, our
cross-site scripting is pretty stemmer.
AUDIENCE: You mentioned one site per cPanel? How does that apply with
multisite? Avoid multisite? KATHY: Multisite, okay. We have
seen intrusions with multisite. Same type of situation where you
have one site with an admin. And depending on how you have things
installed. We saw one intrusion happen where it was a reused
password. And the dump that it ended up in the database was domain name, you
know, user guy at domain name. com was the email address with
the reused password. Got into the system. Was not a super-admin, but they
had PHP exec installed. Not live. But the hacker made it live.
Ha, ha. Pwned. AUDIENCE: Well-played.
KATHY: Any other questions? I’m happy to answer anything. AUDIENCE: I’m curious, what’s
your opinion on 1Password for
two-factor authentication versus something separate like Duo or
Authy. It is convenient, but feels like my password and the two-factor
authentication code are in one place.
KATHY: Eggs in one basket. I use password management tools
and multiple authenticator tools. And I’m all over the
place. Even if I died, I don’t think my husband could get into
my stuff because I’m all over the place. So, obfuscation obviously is a
strategy. But also, you know, when I first
had that hack happen when I worked at that insurance company
way back in the day, they sent me to security school. And I
learned one very important principle of security. The most secure system is buried
in concrete 6 feet under. The most usable system is completely
open and is going to get hacked. Somewhere in the between all of
that is the happy medium. And that happy medium is going to be
different for each person, right? I mean, every time I use
two-factor authentication I curse it. I don’t like it. But I used it because I’ve seen
some things. My pass words are like ridiculous. So, it’s a personal decision.
And I mean, if you’re on a team and you have a two-factor
authentication, 1Password is really the only way to go. And
you’re using a shared system. Because that’s what that service
requires you to do. It works. Other questions?
AUDIENCE: Yes. Got one right here.
KATHY: Yes. AUDIENCE: Earlier in your
presentation you had — you mentioned intent behind the
intrusion. And when you first came on to
your team and realized that your pre-built server had been hacked, they left you a
convenient text file to say you are hacked. Most of the time to
my understanding they don’t want to be detected. With that, what do you think the
intent was? Or why did somebody leave?
KATHY: Somebody sprinkled pixie dust on me that day. I lucked
out. Sure, I’m gonna blame the person
who set the server up. I didn’t do it. I assumed. I made an
assumption. I was a younger kid. It was my first real hard core
I’m working in a server basement job. But still, take responsibility.
I learned the hard way to take responsibility. White hat
hacking happens. And that was a white hat hacker. What they
basically accessed was a bunch of HTML files. There wasn’t even
WordPress back then because I’m old. So, it was — there was
nothing for them to really get at at. But I think that person —
because they sent me down a track of learning
a lot. And other than that Tim Thumb thing, there’s no wood to
knock on. Oh, my god. I haven’t been hacked. Any other
questions? AUDIENCE: Yeah, I got one. So, request static websites, you
know, back in the day you would have one CSS file. Now with
modern day WordPress websites you might have 15 CSS files, a
bunch of inline CSS, a bunch of CSS in the head. There’s a lot
going on and it makes it really difficult for content
security policy. Which is, I’m starting to hear a lot more
about. I was just wondering, do you have any opinions on, you know, how valid
content security policy is? And good ways to implement that
in WordPress? KATHY: Content security policy.
Hm. Well, I mean, it’s gonna be different for each organization,
right? And you’re gonna have to take a lot of things into
consideration. What’s in your WordPress? Are you — I mean, I’ve heard
some stories and I’ve seen some things of what people put in
their WordPress. Oh, my gosh, if it’s personally identifiable
information, don’t put it in your WordPress. WordPress is not
the place to store that kind of information. But you’re gonna have user
information. Maybe you’re using WooCommerce and you’ve got, you
know, your customers’ information in your database?
So, each situation is gonna be — each site is gonna be so
different and you’re gonna have it look at that differently. With the static sites, and there
seems to be, you know, sort of this move towards headless WordPress and
sattic static sites sitting in front of WordPress and talking
to WordPress behind the scenes and things like that. I’m watching all that have with
interesting because I think it’s going to be fascinating to see
what happens. I don’t think it’s the right solution for everyone.
Especially right now. But it’s gonna be interesting. I’m
curious because you know what? When I first started coding,
there was no SQL injection. It wasn’t a thing. I remember — that’s how old I
am, I saw SQL injection come on the
seen and had to sanitize by inputs. My friends and coworkers
are laughing at me right now. But, yeah, SQL injection wasn’t
always a thing. And there’s security things that are going to happen 5, 6, 7, 8 years
from now that we are gonna laugh at that we aren’t doing now.
Each site’s gonna be different. You have to stay on top of
security. We love to do that for the WordPress community. We’ve
got your backs. Subscribe to our newsletter. If we know that
something’s happening, we’re going to let you know and we’re
gonna have your back. I have 4 seconds so I think I’m done. If
you have more questions, I’ll be at the WordFence booth and I’m
happy to answer anything there. So, go think like a hacker. Have
fun. Thank you. [ Applause ] Is Something Not Very Usable or
Accessible? Change It! Tracy Apps SPEAKER: Welcome, welcome,
welcome. I know it is the last session. Shake it off. I’m
telling you, you are going to be so glad that you came here
today. My name is Aita. Before I introduce you to this
lovely lady whom I consider a friend, I want to go over a few
things. If you have your conditions or any devices that
make any noise, we ask that you silence them now. Also, don’t forget tonight is
the Wordfest. Our version of the after party. It is at 7:00 at
City Museum. You need to have your badge in
order to attend. Make sure you have that with you. And don’t
forget that contributor day is on Sunday. We hope to see all,
if not most of you there. So, this lovely lady here is
Tracy Apps. Her bio says, behind the bow
tie, Tracy Apps at taps is a big
picture doer, a translator a UX creator. For Tracy, UX is so much more
than making pretty buttons. With over 20 years of web development
experience, including work with Fortune 500 companies, Tracy’s curiosity
and love of problem solving has led to many amazing
opportunities. She’s taught web development, design and UX at several universities
including UW-Milwaukee, her alma mater and
is a nationally-known and renowned public speaker. Most
recently, Tracy co-launched a podcast, women in WP. Tracy is a drummer, bow tie
aficionado, obviously, and she could probably dead lift you if
you gift her the opportunity. And I had the opportunity of
spending time with her in Costa Rica
where we were speakers and get to know her as a person. But I
got to sits in on her talk. It is amazing. You’re in if for a
treat. Tracy Apps. [ Applause ]
TRACY: Thank you so much. Welcome. So, it’s a long title. — is something not very usable
or accessible? Then change it! Let’s start here. Does this look familiar to
anyone? I mean, you’re at a WordCamp. You’re at WordCamp US. So, you probably see this this a
lot. But have you ever done work for clients and they seem a
little lost? Don’t really foe what to do? Well, the cool thing is, we can
change it. How about this? Our new editor. You know, for some, this might
be super-easy and straight forward to understand. It’s very
clean. For me, I found myself clicking
all over the place trying to figure out where the buttons
were because I just saw them there. And so, for me, it was —
it started to be really frustrating. I have actual video of me using
this here. There. So, we got the — that’s a
French cooking show. So, yeah, well, I labeled this here. So,
you see me. And then all of a sudden, like, where’s the
interface buttons, there they are! Okay. So, yeah. Poor cat. So, it’s an
adjustment. It’s something new. But the great news is that we
can change that. Because WordPress is open
source. And we have this power to change
things which is one of the big reasons
why I continue working with WordPress in my daily life and in my work. So,
if you know any user experience designers, you’ll know our
favorite word is “Why.” But why change it? I had some frustrating times
with the change of the new interfaces. But I have a lot of
history. I have been using WordPress —
well, my first blog was on B2, which was
the codebase that eventually was
worked to become WordPress. So, I have been doing this for so
long. So, I have my own biases. And I’ve developed my own
habits, good or bad. But — and I’m used to things a certain
way. So, when I’m frustrated, it
might just be a me problem and not a software problem. So, it’s
hard for me to take a step back and have a neutral view of
what I am testing or looking at. So, instead of just making
assumptions, I decided to run a very simple
usability test with just a couple people that don’t have that same history,
that same experience with WordPress. Because, you know, I just end up
being the old man that yells at a cloud. And I don’t want to
just be that. So, we’ll do an actual test. So, we did this
really simple thing. Five tasks. About a dozen questions. And
only like a hand full of people. One thing a lot of people say,
well, I can’t do usability testing because I don’t have all
the fancy tools. Well, it doesn’t require all of this
technology and all of this time and budget. It could be done
simply. I did this on my laptop. How, you ask? Well, I am glad
you asked. So, here’s what I did. I
installed a local environment. You can use whatever tools you
use. So, that I could have just a
simple, plain no customization, no extra
plugins, plain vanilla WordPress install on my computer. And made a test account. And set it up with the things
that I wanted to test. So, you know, put in some test
content of things that I wanted to test
on people. I create a script. And I print out my copy which
has the tasks as well as the follow-up questions. And then I print up a smaller
version with just the tasks for the user
to read along with or also refer to, you know, while they’re
doing the task if they need to refresh it so they can look at
that. And then also we just have a
consent form. There’s a bunch of different templates over at
usability.gov. Lots of great resources there for usability
and such. So, I highly recommend that. But you don’t have to
write it from scratch. You can use one of the templates there.
Now, when it came to the script, there was a couple things that
you have to keep in mind. One, the questions need to be written
in a very neutral way. Nothing leading. And then also, I say, leave some
time in your schedule for that test,
for it that session, for questions that aren’t on your
script that are follow-up questions. Respond to and ask deeper
questions of the things that they are doing or experiencing or struggling with. Now, these tests worked best
with very simple actionable, you know —
like very simple tasks. And so, these big tasks, big
complex tasks can be broken down into smaller tasks and then have
follow-up questions within them. And we had to include some
instructions. So, at the beginning, first outlining the
goals Like, what are we doing here?
And some limb cations. Because a lot limitations. A lot
of times when we’re testing something, it’s something in
production. It might not work completely. It might be a
prototype or even wireframes. So, you know, letting people
know that not everything is gonna work. And the content is all place
holder text about cats. Just to prepare for that so that
they don’t focus on those things. Reminding people to think out
loud. And just a narration of
everything they are thinking and doing and why am I clicking on
this? It’s hard, but you just, you know, just pretend like
you’re talking to yourself throughout this whole process.
And remind them to do that. And the big part is, this isn’t
a user test. We’re not testing the user. Or the abilities of
the user. We are testing the software, the product, the
website. So, there is no way of failing. And actually, when a user or
participant in these tests cannot achieve the task, that gives us
just as much information or even more very valuable data that,
well, that needs to change. And we can see where the problem
points are. And that is really gold for
being able to make these things better and
change them. All right. Then I use — there’s just a
built-in screen recording software on my Mac. And then I used Quicktime or
whatever other video program and I set up my webcam. So, I
recorded the screen. And then from the video, the
audio and visual of the person as they were going through the
test. And reminding them — this is isn’t something that I’m
gonna publish. It’s just for me to review later. So, I like to record the video
because I don’t — you get the best
results when they feel comfortable. And I don’t know
about you, but I can’t feel very comfortable if there is someone right here, right behind
me, or right in front of me asking me questions. Now, do
this thing. And I’m like ee — okay. So, I
then I can sit further back and then review the video later.
Because one of the big things, we know about communication is
that really only 7% is the actual words that we use. There’s like 38% which is the
tone, the tempo, the volume. And the biggest part is the
physical. Facial expressions, gestures. Posture Posture. So,
just hearing even just an audio recording is not even going to
give us the full picture of what that
person is communicating through all of
these pieces. And now, here, the biggest most difficult part of it is to not
interrupt. To just observe. And leaving an
awkward amount of silence. And then leaving some more. For some people, like myself, I
internalize and I process things. And I don’t always — if
I’m not given that opportunity or I feel like I’m being rushed
or I’m being interrupted, I’m not gonna give a complete answer
because I’m still processing it. So, by leaving that space there,
asking a question, asking them to do a task, and then silence. And then count another 10
seconds. Because sometimes now, oh, I
thought of something now. I processed that. So, what did I
find out? Well, there were some of these things — I went into this test with
some assumptions. And so, those are the things that I wanted to
test. And so, I, a lot of these things
that I found aligned with that. Which was great. But there were
other things that I did not even expect to find. So, for example, this icon at
the top here that pencil icon, what does
that mean? For me, it means edit. I see it
in all these interfaces that say, oh, yeah, well, that’s the
edit button. But every single one of my participants struggled
with that. Even one said, oh, yeah. That’s where to write text. So, here’s it’s saying, I’m
gonna edit this photo. But they were like, oh, but that’s where
to write text. So, it doesn’t compute. Well, it makes sense.
They were a writer. They use a pencil to write. What
else? Our lovely dashboard. I saw some — some fun patterns. I asked, what is the first thing
you see? Well, I see this yellow thing
here. I don’t know what DIVI means. But I see the word tavern here a
couple times. So, that’s cool. And I don’t know what these
boxes are for. Really boils down to, it doesn’t
matter how long you have been Internetting, the struggle is
real. You can be from zero years to 20, 30 years. We all struggle
with these things. And it’s hard because there’s a lot of things that we assume as
universal that are not. But remember, we can change
these things. Because — and there’s a lot of kind much
different options on this. So, but where do we start? We’ll start with the dashboard. So, like I said, I saw some key
themes from the test results. One, that the hierarchy was not
clear. When they logged in, they didn’t know what to look at
first. Or what actions to take. What was most important. There
was information that wasn’t relevant to them. And even language that, or words
that they didn’t understand or had a different understanding of
them. And then extra space was more
confusing than it was helpful. So, again,
the whole premise of this talk is we can change things. And we
have some options. So, one way we can change things
with plugins. So, I asked on Twitter for some
recommendations of people that make sites for clients in
particular. And I got a whole bunch of
responses. And this is just a fraction of what is out there. So, I won’t go into what each
plugin does or which one is better
because it all is relative to what the end
goal is. How much you want to modify, how you want to modify is all dependent
on the application. Like, who is this for? So, after just
playing around with a couple, which I recommend if you have just, you know, 5, 10 minutes to
spare, just play around with them, and see what kind of
options you have. Especially if you do work for
clients. So, I just played around a little bit. And I made this. I mean, it’s
not perfect. But I’m addressing some the main concerns. Like,
the hierarchy. So, what do I do now here? Well, this client only needs to
really write a blog post. So, right there, right off the
bat I’ve got a big ole button for them to
click on to write a new post. And then you can do like a
customized widget. So, in this case, let’s say I
make a video tutorials for them. Or I subscribe to a video
tutorial site. A lot of great ones out there. And there’s one
or two videos in particular that really apply to them, I can include a link directly to
those videos. Oh, we talked about places to get stock
photography. Here are those links. Oh, and here is my email
address or how to contact me in case if you
have any other questions. So, I mean, I think that’s a bit of an improvement. So, moving right along. Now, let’s move to our post
editor, our new block. So, what’s good here? Well, it’s
very clean. It’s very clean. That the
vertical rhythm or the spacing, it just feels nice. It’s well-designed, really good
typography. And, you know, clear. Right? Well, what is not
as good? I’m not gonna say anything’s bad. Because, again,
it’s all relative. But, things that could be
improved on. So, one of the things that —
things are hidden. So, when I’m going around and clicking on
things and I can’t figure out where that button was I just saw
there, they’re all hidden. And hiding
things is not really great for accessibility. But also, let’s say if I had
that — that settings panel that had the
kind of more actions in there, I had
that hidden, if I am not a person that has — well, no major limitations and
mobility and can actually move a mouse with some precision and
I’m the type of person that would see this and I think, oh,
I’m gonna mouse around and see. I could think this is just my
website. I don’t — if I miss the buttons at the top and I
don’t know what the things on the side is, so,yI just ignore
that. Just looks like I’m reading
hello world. And the one thing to do with user experience
design is you want to make sure that the thing that the people
need to do, you want to make it easy for them to be able to do that thing. So, never sacrificing
functionality and accessibility for the sake of design is very
important. So, it’s also really good. I
have one block selected. And there’s a really clear focus. It’s a good contrast between —
so, I can see very clearly that I am editing this one and not
the other ones that are behind it. That is really — really good. But the problem is also because
of this — how the vertical spacing is, there’s also this
opportunity for it to overlap and completely cover up
up — this one completely cover up the block above it. So, that can feel kind of
frustrateing. I love this about the blocks. Is
you can reorder them. And I think that saves so much time.
Especially for someone that doesn’t write very well. And
then I was like, oh, I want to reorder everything. I can just
move the blocks around. That’s a great thing. The issue that I found was that
those handles, the move handles, only show up when you mouse over
it or tab directly to them. So, if I don’t know that they were there, and most of the
participants never found those because they didn’t understand what the dots were
and arrows were, so it’s not very clear. And so, those are hidden even
when I have that block activated. So, remember the talk — our
talk is we can change it. Well, this — let’s look at what
we can do with just some little bit of code. With a little bit
of CSS. So, that is — one of my
favorite things that WordPress has is not only can we modify the frontend, the
public-facing portion of the site, but we can make editor
stylesheets or stylesheets that edit and change
how the administration area functions
and looks. And just as a disclaimer,
remember, I’m a designer by trade and by
education. So, the code — I will show you some code. It’s probably not really great. It’s more of a for inspiration
than instruction. So, please don’t take it verbatim. But this
is just some of the things that I was playing
around with some code to see how I could fix some of the things
that were frustrating me or that I saw my users like
stumble upon. So, let’s dive in. First off, I just have — I made
a stylesheet just for the blocks. So, it’s not going to —
so, I can just call that one in — into that
admin area and make changes just in that. Keeps it simple and clean in my
own code. So, let’s look at each of these
independently. So, this first one, the things are hidden. All
right. So, why don’t we just add a
simple border around it? So, I added just a line of code
to add a single pixel solid border
that’s semi transparent on all of the blocks. And making sure
that we still keep that contrast within the focus. Because, you
know, so, making that a little bit thicker and a different
color. That kind of thing. And while we’re at it, those add
— insert a block. Those little plus signs between the blocks. I kept randomly finding them and
then forgetting — it was really hard. So, let’s make those visible all
the time too. That’s a function that’s kind of important that I
want to be able to access pretty easily and know where it is. So,
let’s look at what that is is. So, got the borders. I can see where my blocks start
and stop. I can kind of see the, you know, all of the like the
insert blocks. All right. I think we’re making some
progress here. All right. Next thing. This overlapping. Go back into our code and simply
adding some margins, top and bottom. And then taking those
insert block buttons and kind of adjusting
where they show vertically on the page between the blocks. And
now we have this. Now, I’m sacrificing the really
nice feel of that vertical rhythm. So, it’s gonna be more
scrolling. It’s not as compact and
designer-y. But for me, this will serve my
purpose much better because then I’m not guessing where I need to click
or drag. So, I don’t mind the extra scrolling in my editing. So, this, to me, feels much
better. All right. What’s next? We have the — that only visible
on hover. The reorder. Because I think that’s a pretty important
function. So, I want to make that visible. At least when I have that block
active. So, go back to the code. And I literally just added
opacity 1 to make it solid instead of opacity zero or
whatever it was. This block mover. All right? Now we have this. So — and this
feels better to me. I know I can see like I have that block. I
can see I can move it. I can see my controls. I can easily click
from there to any other block. And it just — just with a few
lines of code. I’m pretty happy with this. So, I don’t know. I
think so. Brent does is too. Finally, we talk about
community. There may not be an I in team, but there is in
collaboration and community. Which is very — very applicable
because we have — if we don’t have all of us show up at the
community, then the community is not complete. So,
right? This is open source. So, we can all contribute. Because
open source is powered by all of us. Right? Well, kinda. It’s powered by
those with the privilege to do so. Especially in ways that we
traditionally recognize someone as a core contributeor.
Submitting code, fixing bugs. Those kinds of things. Because
that does require this privilege of either, you know, any of
these. Resources, technology, having
the equipment to be able to run the very large codebase that is
the Gutenberg blocks in development mode.
Having even access to the information or know where to find out
thousand contribute. Having that support or network
around you. And time, for example. I mean, how many people can
donate time for free when we have to pay
bills? So, kind of these limitations
create kind of a — a pattern. Now, don’t get me wrong. I
think, in my opinion, the WordPress community is one of the most
diverse and inclusive communities in the tech industry
that I have ever seen. It’s not as reflected as I would
like to see when it comes to core
creators and contributors. Who creates? Who decides? Who
controls? Who has that ability to be at
that table? And add their — add their
expertise? And this really might make — we
might have to change our mindset a
bit. So, I don’t contribute to Core,
but because I don’t see where I fit there. There’s a lot of
people that feel that same way. And we have great ideas. We
really want to contribute. But we don’t know how to because we
don’t have those privileges to be able to spend time on a Slack
meeting during the daytime hours. Or something — any of
the kind of available opportunities are hard for some
people. So, you know, what if we more
open sourced the way we open source? Thinking through other ways of
having people contribute I think is really important. You know,
having a — right within the admin area, a suggestion box. And then that can go — or town
halls will people can raise their concerns. In user experience we do these
workshops, these design workshops to figure out what the
problem is and all of these things and figure out
the why and how the best way to solve that. Well, what if we had some more
of an online virtual that — workshop that wasn’t tied to a certain time
zone, but was open and anyone could contribute to it? Or
let’s say I have an idea, but I don’t have the ability to follow
through with it. Is there a way we can have like a tag team?
And now — but I can take that and I have the ability to use
that. And run with it. Or mentorship programs. What a better way to
intentionally grow our core contributing community
than by intentionally inviting others to
train, to help with design, development, strategy, whatever
it is. Bringing more people and more
voices and more diversity to the table
only makes us better. Makes the product better. Makes WordPress
better. And just because I’m on this
side of the podium, doesn’t mean that
anything I say or any of my ideas are more important, are more relevant,
even more good. So, I want to hear from
everyone. If you go on Twitter, I’m just — you know, we can Tweet with this
hashtag because this isn’t being used. #changeitWP. We could improve how WordPress
is, but also improve the way we improve
WordPress. Some new processes that we can
— we can follow to really bring more
people to the table who don’t have check all of the boxes that I can donate this
time. Or these different privileges.
So, we can have this lower barrier to entry to really
include more people within this. I think it’s really important. And it’s good — one thing to
note, is that change is something that’s always going to
be changing. Right. It’s a journey. We’re not gonna like
have a destination and we’re gonna just nail it.
It’s going to be perfect. We are growing. Technology is growing and
changeing. , so, like what we do, we grow,
we change. We learn something else, we learn, we grow, we
change. We learn something new, learn,
grow, change. As long as the software and the things that we create follow that same
pattern, that is good. And it only gets better when we
all have a say in this. So, I think that this is really
key is no, we’re not gonna get it perfectly. But we’re go that
do better. And then we’re gonna do a little
bit better. And then we’re gonna do a little bit better. And I think we can do. Thank
you. [ Applause ]
We have some time. Anyone havey questions? Or ideas. Bring them
too. Yeah. AUDIENCE: [ Away from microphone
] TRACY: Sorry, I could — he’s
coming with the microphone. AUDIENCE: I don’t have specific
ideas. But do you have specific ideas about how we make this more open to
everyone? Those barriers are — I mean, they’re real barriers. So, how do we — how do we break
that? And how do we protect those new
people from the clannishness that might
occur? TRACY: Yeah. One of the big
things is that change of mindset of what is valued. Because if I come with like a
sketch on a napkin, versus I come with code — code to fix a bug. That code that fixes that bug is
really valued as a valuable, you know, you are a Core
contributor. But if I bring an idea that like, I’m not a
designer, I’m not a developer. But I think this would really
help. Having that ability and that
pace to be able to do that, whatever it looks like. And that
I know. If it’s something — it’s got something online. Something that’s not — that I
have to be at something at a person assign. Because what if I
can’t during that time? So, something more open that way. So, brainstorming some ways that
we can do this that it does not require
us to be online at a certain time. But we can still have that
conversation goal. And that it’s just known that everything that
people contribute is as much value as the other thing is
a big mindset shift on that. Anyone else? AUDIENCE: [ Away from microphone
] TRACY: Learn more about the — AUDIENCE: What the results were?
TRACY: The — AUDIENCE: Were they able to add
all the cats and be successful?
TRACY: I’ll tell you. What I did — the task were pretty
simple. One was just like find where you can create a post. And
then make something. You know? So, it was more of a — what do
you think you can do on this page? And because it was really plain
and simple, I got the comments of like, well, it doesn’t look
like it can do much here. And then one of the things that
I saw is a lot of people want to — when they want to create
space, they just hit return a lot and it creates a
new block every single time. Every single time I just see
block, block, block, block. And then they just like delete,
delete, delete, delete. And everyone, when they wanted
to move something, they tried to highlight and drag like the
whole block. And so, it just highlighted and then whatever. I also tested my mom with this.
Which was really fun. She kept right clicking and say open
image in new tab because she wanted to Edited that image. So,
it was just one of those things where, oh, I hadn’t really
thought about that. You know, it’s really interesting. So, the
hardest things. And I had another task was just to replace
an image. That was — that one was really hard for a lot of people because that
— each is an icon it it’s just an icon. And there’s no one right off the
bat hovered over something long enough for that tool tip to show
up. So, they all just kind of were like, I don’t know what
that means. I don’t know what that means. I don’t know what it
means. And I saw this, it was going across all of the —
because with the image block, you have like the alignment and
then you have the edit button. And then, I don’t know,
something — there’s also like you change to another thing,
right if had and I saw it go, all right, alignment left, align
right, center, full, skipped right over the edit button. And
then something else. And whatever. And no one got that edit button.
Because it’s not a universally understood thing. So, yeah. It
was just fascinating. I would — yeah. Anyway, yes.
AUDIENCE: So, it seems like an actionable item would be to add
a text label to the edit pencil.
TRACY: Yes. Actually, honestly, I think there should be an
option to be able to have, just like with Microsoft Word does
this. I want to see all of the icons
on the — on my menu, I want to see
icons and text. I just to want see text. Sure
it’s gonna fake up more space, but usability is — should not be
sacrificed for design. So, yes. It’s never a good idea to use an
icon-only because it isn’t universally understood. No
matter how much we think it is and how — well, it’s used very
often. It’s probably understood differently by different people.
So,… any other questions? Y’all want to get to the after
party? Right? Well, thank you for sticking it out with me to
the last session. I will be around.
[ Applause ] Thank you.

Leave a Reply

Your email address will not be published. Required fields are marked *