Meta Tags
Description Meta Tags - For SEO reasons You should always use the description meta tag when creating your html document. Meta tags help the search engine understand your web pages. Meta tags inform the search engine of your website content. See examples below of meta tags best practices.
- Description Meta Tag Example: <meta name="description" content="Your Smart Guide to Internet Success: Tutorials on SEO, Internet Marketing, Web Design, Languages, What do you want to learn today? Join Free"/>
- Description can help with ranking in the search engines
- The meta tag description should be between 140 and 160 characters in length
- You must create new meta tag content for every page.
- Keywords Meta Tag Example: <meta name="keywords" content="web design, web development, programming languages, seo," />
- No more than 7 keywords or keyword phrases
- Separate every keyword or keyword phrases using commas
- USA Charset Tag Example: <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- HTML Title Tag Example:
- <!DOCTYPE html>
- <html>
- <head>
- <title> How to Learn HTML</title>
- </head>
- <body>
- </body>
- </html>
CSS Style
I'm not going to tell you a lot about CSS files, not yet. I'm going to be creating a tutorial on the subject. Today, I'm just going to inform you that a CSS style will allow you to make every page look the same on your web site by changing one file..
There are three way to employ CSS styles. Try not to use the inline styles; Unless you have no other options. See the examples below.
CSS Style Type
- External CSS - (Tutorial External CSS Link Will Go Here)
- Internal CSS - (Tutorial Internal CSS Link Will Go Here)
- Inline CSS - (Tutorial Inline CSS Link Will Go Here)
- Inline Option Example Try not to use this option
<!DOCTYPE html>
<html>
<head>
<title>HTML Examples</title>
</head>
<body>
<p style="color:green;" rel="color:green;" rel="color:green;" rel="color:green;" rel="color:green;">The text will be green.</p>
</body>
</html>
Alternative Options
- External CSS
- Internal CSS
External Example The Best Option
- <!DOCTYPE html>
- <html>
- <head>
- <link rel="stylesheet" type="text/css" href="filename.css" />
- </head>
- <body>
- <h1>This Heading Will Be Blue</h1>
- <p >All paragraph texts will be white on a black background.</p>
- </body>
- </html>
Internal Example A Good Choice
<!DOCTYPE html>
<html>
<head>
<title>HTML Examples</title>
<style>
body {background-color: black;}
h1 {color: blue;}
p {color: white;}
</style>
</head>
<body>
<h1>This Heading Will Be Blue</h1>
<p >All paragraph texts will be white on a black background.</p>
</body>
</html>
If you have any questions about using HTML, CSS, or Javascript please use the dussicion group or send me an PM here at Wealthy Affiliate. If you like this tutorial, please click on the like button and tell me how I can make it better.
UP NEXT: HTML Code - How to Comment Out HTML
I like it that way.
Cheers