Women In Tech SEO - SEO and UX - It's a Match - #WTSWorkshop

Slide 1

Slide 1 text

No content

Slide 2

Slide 2 text

About Sara ● International SEO Consultant ● From sunny Barcelona ● Polyglot ● Background in Translation & Localization ● Master’s in UX/UI Design @sarafdez @sarafdez /in/internationalseo sara-fernandez.com

Slide 3

Slide 3 text

Understanding User Experience @sarafdez linkedin.com/in/internationalseo sara-fernandez.com

Slide 4

Slide 4 text

What Is UX? @sarafdez “User Experience" encompasses all aspects of the end-user's interaction with the company, its services, and its products.” — Don Norman and Jakob Nielsen, NNgroup

Slide 5

Slide 5 text

What Is UX? @sarafdez https://www.youtube.com/watch?v=9BdtGjoIN4E

Slide 6

Slide 6 text

Everything Is User-Centered @sarafdez “No product is an island. A product is more than the product. It is a cohesive, integrated set of experiences. Think through all of the stages of a product or service – from initial intentions through final reflections, from the first usage to help, service, and maintenance. Make them all work together seamlessly.” — Don Norman, inventor of the term “User Experience.”

Slide 7

Slide 7 text

Can You Identify UX, UI, and Usability? @sarafdez Making a website or app easy to use Making a website or app attractive and effective according to users' preferences Making users feel positive about a website or app

Slide 8

Slide 8 text

UX vs UI vs Usability @sarafdez Making a website or app easy to use Making a website or app attractive and effective according to users' preferences Making users feel positive about a website or app Usability UI UX

Slide 9

Slide 9 text

UX-UI Explained @sarafdez Incorrect Correct

Slide 10

Slide 10 text

5 Usability Factors to Get Right @sarafdez Learnability Memorability Efﬁciency Errors Satisfaction

Slide 11

Slide 11 text

Peter Morville's User Experience Honeycomb @sarafdez

Slide 12

Slide 12 text

UX Laws and Cognitive Biases @sarafdez linkedin.com/in/internationalseo sara-fernandez.com

Slide 13

Slide 13 text

Hick’s Law @sarafdez The time it takes to make a decision increases with the number and complexity of choices. The more choices you give a user, the longer it takes for them to make a decision.

Slide 14

Slide 14 text

Hick’s Law: Bad Navigation Structure @sarafdez https://www.007museum.com/

Slide 15

Slide 15 text

@sarafdez https://www.amazon.com/ Hick’s Law: Good Navigation Structure

Slide 16

Slide 16 text

Fitts’ Law @sarafdez The movement time to a target depends on the size of the target and the distance to the target. The smaller your target area is, the longer it takes the user to perform that action based on the distance/size ratio.

Slide 17

Slide 17 text

Fitts’ Law @sarafdez In this example, CTAs are large and eye-catching and easy to see and navigate to. https://www.intercom.com/

Slide 18

Slide 18 text

Miller’s Law @sarafdez The average person can only keep 7 (plus or minus 2) items in their working memory. Display information in chunks so that it’s manageable to users to remember what they consumed.

Slide 19

Slide 19 text

Miller’s Law @sarafdez When users see a homepage looking like this, loaded with all types of information, they just get scared. https://www.getthat.com/

Slide 20

Slide 20 text

Miller’s Law @sarafdez This design reduces the cognitive load by presenting only the information that’s important to users. It’s a simple and clean interface with little to no distractions. https://www.harrods.com/

Slide 21

Slide 21 text

Miller’s Law @sarafdez Chunking credit card digits into groups of four helps users when they’re entering their card number and checking they have entered the correct card details. https://www.gumroad.com/

Slide 22

Slide 22 text

Von Restorff Effect @sarafdez Also known as the Isolation Effect, it predicts that when multiple similar objects are present, the one that differs from the rest is more likely to be remembered.

Slide 23

Slide 23 text

Von Restorff Effect @sarafdez Highlight elements like CTAs to stand out from the rest of the design, it’s easily noticeable by the user.

Slide 24

Slide 24 text

Serial Position Effect @sarafdez Users have a propensity to best remember the ﬁrst and last items in a series.

Slide 25

Slide 25 text

Serial Position Effect @sarafdez Highlight key information in the beginning and the end, while placing the least important items in the middle of your sequence.

Slide 26

Slide 26 text

Jakob’s Law @sarafdez Users spend most of their time on other sites. This means they prefer your site to work the same way as all the other sites they already know.

Slide 27

Slide 27 text

Jakob’s Law @sarafdez Think how most of the ecommerce sites behave. They follow similar patterns and checkout processes. This way the user will focus on their task rather than learning new models. https://www.asos.com/

Slide 28

Slide 28 text

Jakob’s Ten Usability Heuristics @sarafdez https://www.nngroup.com/articles/ten-usability-heuristics/ They’re general rules of thumb you can follow to help create more accessible, user-friendly, and intuitive digital products.

Slide 29

Slide 29 text

Conﬁrmation Bias @sarafdez The tendency to interpret new evidence as conﬁrmation of one's existing beliefs or theories.

Slide 30

Slide 30 text

Anchoring Bias @sarafdez It makes us depend too heavily on a particular piece of initial information when making decisions or judgements.

Slide 31

Slide 31 text

Bandwagon Effect @sarafdez The tendency to do (or believe) things because many other people do (or believe) the same.

Slide 32

Slide 32 text

Gestalt Theory @sarafdez It’s the theory of visual perception and how our brain pieces together reality. https://uxplanet.org/gestalt-principles-in-ux-design-2e0f423bfcb5

Slide 33

Slide 33 text

Pareto Principle @sarafdez Also known as the 80/20 rule. 80% of the effects of any given process come from 20% of the effort put into it. To illustrate this in a UX context, it's like saying: 80% of your users use 20% of your features.

Slide 34

Slide 34 text

List of Cognitive Biases @sarafdez https://en.wikipedia.org/wiki/List_of_cognitive_biases

Slide 35

Slide 35 text

SEO + UX @sarafdez linkedin.com/in/internationalseo sara-fernandez.com

Slide 36

Slide 36 text

How Does UX Affect SEO? @sarafdez When users are satisﬁed… Google is satisﬁed. Google rewards sites that care about UX because it aims to provide the best possible search experience for the user. To achieve this goal, Google's algorithms are designed to evaluate websites based on their UX, and favor those that care about it.

Slide 37

Slide 37 text

SXO: Search Experience Optimization @sarafdez

Slide 38

Slide 38 text

Optimizing for SXO @sarafdez More engaging and satisfying UX Higher rankings and increased trafﬁc

Slide 39

Slide 39 text

Ways to Improve UX and SEO at the Same Time @sarafdez linkedin.com/in/internationalseo sara-fernandez.com

Slide 40

Slide 40 text

Page Speed @sarafdez Implement lazy loading Compress and resize images Enable browser caching Take advantage of a CDN

Slide 41

Slide 41 text

Mobile-First Indexing @sarafdez Make sure that Google can access and render your content Create a mobile-friendly site Make sure that content is the same on desktop and mobile https://developers.google.com/search/docs/crawling -indexing/mobile/mobile-sites-mobile-ﬁrst-indexing

Slide 42

Slide 42 text

Easy Navigation & Site Structure @sarafdez Keep your site structure simple. Make it easy for users to navigate your site to ﬁnd what they’re looking for.

Slide 43

Slide 43 text

Information Architecture @sarafdez Key IA practices that can improve both SEO and UX include conducting user research, organizing content into categories, using clear and consistent labels for navigation, and optimizing website navigation. https://thegray.company/blog/information-architect ure-practices-seo-ux

Slide 44

Slide 44 text

Accessibility @sarafdez Accessibility laws exist to aid people with disabilities. limited internet speeds, or different technological preferences. Accessible websites provide a more positive UX and equal access to information and services for all users. https://www.interaction-design.org/literature/topics/accessibility

Slide 45

Slide 45 text

Core Web Vitals @sarafdez https://developers.google.com/search/docs/appearance/page-experience

Slide 46

Slide 46 text

Collaborating with UX Teams for Great Results @sarafdez linkedin.com/in/internationalseo sara-fernandez.com

Slide 47

Slide 47 text

Stop Working in Silos @sarafdez ● Each team should keep their independence, but everybody should have visibility over what’s being done ● Make sure teams communicate any relevant changes that could affect SEO or UX ● Have touch-point meetings

Slide 48

Slide 48 text

Ask for User Research Data @sarafdez ● Have access to UX Research and usability testing ● Take into account users’ feedback ● Get in touch with customer service and sales teams as well to learn users’ pain points and needs

Slide 49

Slide 49 text

Tips for UX Teams @sarafdez ● Make sure UX teams use headings and subheadings accordingly ● Ensure the content is always the same on mobile and desktop ● Share with UX teams general SEO best practices

Slide 50

Slide 50 text

Additional Resources @sarafdez linkedin.com/in/internationalseo sara-fernandez.com

Slide 51

Slide 51 text

Useful Websites @sarafdez ● Nielsen Norman Group - https://www.nngroup.com/ ● Interaction Design Foundation - https://www.interaction-design.org/ ● UX Planet - https://uxplanet.org/ ● Smashing Magazine - https://www.smashingmagazine.com/ ● Usability.gov - https://www.usability.gov/

Slide 52

Slide 52 text

Books @sarafdez

Slide 53

Slide 53 text

Books @sarafdez

Slide 54

Slide 54 text

Books @sarafdez

Slide 55

Slide 55 text

Thank You! Any questions? 💡 @sarafdez @sarafdez /in/internationalseo sara-fernandez.com