Post on 10-May-2015
Unit 1: Web FundamentalsLesson 6: Search Engine Optimization
August 21, 2013
2
Lesson 6: Search Engine Optimization
Introduction to HTML
Learning to Use HTML
HTML and Email
History and Future of the
Web
HTML and Forms
Search Engine
Optimization
Learning to Use CSS
Introduction to CSS
Reusing Code
3 Ways to Use CSS
Separation of Concerns
Launching Your Own Website
Lesson 1 Lesson 2 Lesson 3 Lesson 4
Lesson 8 Lesson 7 Lesson 6 Lesson 5
Lesson 9 Lesson 10 Lesson 11 Lesson 12
Build understanding Develop skills
Recap from last time (I)
3
• HTML is important not just for receiving information, but also for sending data to a server
• Forms allow us to actively engage with the internet, both sending and receiving information as we browse websites
Amazon server
Amazon database
Recap from last time (II)
4
• There are many different types of forms – these allow for many features such as account login and search bars
• User information is stored in databases, which are similar to filing cabinets with a different file for each user
Google search Gmail sign-in
How to attract visitors to your website?
5
• We’ve already looked at how to view, interact with, and send data to websites
• But if you’ve built a website of your own, how do you get people to actually visit your page?
Not very effective…
One of the best ways is to show up in search results
6
• Search engines such as Google and Yahoo want to show the most relevant websites to their users
• If a user searches ‘lawn chairs’, they should expect to see results for:
Companies selling patio furniture
Pictures of lounge chairs
But not a TSwift music video!
Meta tags
7
• To help Google decide what a website is about, they look at meta tags, which are words that describe the content on your site
• Meta tags can be used to tell what language a page is written in, who authored the page, or even the location of the business or site owner
A few examples of meta tags
8
Type of meta tag Example
Locations served by a business
Type of content
Keywords describing the page
Where to find meta tags? (II)
10
2. Right click on an empty region (make sure your cursor looks like and not ). Click ‘View Page Source’ to view the HTML.
Click here
Where to find meta tags? (III)
11
3. Now you should be able to see the HTML of the page. The meta tags are located near the top of the page.
Let’s take a closer look…
Where to find meta tags? (IV)
12
4. You should see the meta tags underneath the <head> tag.
<head> tag
Meta tags
Where to find meta tags? (V)
13
5. Without knowing too much about meta tags, we can already guess what some of these mean:
A short description of Apple and the page are about
The author of the page is “Apple Inc.”
Which keyword meta tags should I use? (I)
14
What you should do What you should NOT do
Use keywords that describe your website’s content
Choose keywords that are specific to your page
Consider what users will think to search when they want to find you
Which keyword meta tags should I use? (II)
15
What you should do What you should NOT do
Use keywords that describe your website’s content
Choose keywords that are specific to your page
Use keywords that are unrelated to your website
Choose keywords that are too general or vague
Consider what users will think to search when they want to find you
Pick keywords just because they’re popular search terms
We want to make sure the RIGHT users are able to find our website
Exercise: brainstorming keyword meta tags (I)
16
• Suppose you are the owner of the website for Pixar Animation Studios. You need to brainstorm 5 keyword meta tags to use. What would they be?
• Hint: think of words or phrases that describe your page’s content
Exercise: brainstorming keyword meta tags (II)
17
• There are many great keywords you could have used. Below are just a few examples of good and bad keywords
Good keywords Bad keywords
Pixar
Animation
Toy Story
Nemo
Buzz Lightyear
Brown
Hat
Andy Murray
Tesco
Microsoft
Company name
Name of Pixar film
Names of Pixar characters
Woody may be wearing a brown hat, but these words are not specific to Pixar
These keywords aren’t relevant at all
Search engine optimization (I)
18
• In the past, to get to the top of the search results, you just needed to choose the right keyword meta tags
• Now search engines no longer look at meta tags to decide what order to display search results
Search engine optimization (II)
19
• Search engines now use complicated algorithms to determine which websites are most important
• Search engine optimization (SEO) is how website owners improve the rank of their page in search results
One of these algorithms looks at links between pages to decide which pages are most important
Meta tags are still important
20
• Even though meta tags no longer affect a page’s ranking, they are still very important!
• Meta tags will appear in search results to describe your page to potential visitors
• Good meta tags can help attract the right audience to your site!
This is the meta description tag
Summary (I)
21
• Meta tags describe the content on your website and can help you attract the right audience
• Meta tags appear in the <head> section, usually near the top of the HTML code
• Good meta tags are specific and accurately describe the content on your page
Summary (II)
22
• Good search engine optimization (SEO) can help your site get more visitors
• While search engines used to rely on meta tags, they now use complex algorithms to determine how to order search results
One of these algorithms looks at links between pages to decide which pages are most important
23
What to do on your own
1. Go to URL to complete the Codecademy course online
2. Do the practice set on the material learned
3. Take the follow-up quiz to test your understanding
Get ready to learn CSS!!