Auto And Trucks 1946Business And Finance 11381Cellular Phones 10Collectibles 10College Articles 455Computers And Internet 4892Education 839Environment 825Family 3852Food And Drink 1559Gadgets And Gizmos 924Gardening 68Gifts And Gift Baskets 18Government 806Health 5196Hobbies 959Home Improvement 2196Humor 203Kids And Teens 804Legal 1609Marketing 6217Men 338Music And Entertainment 779Online Business 4940Parenting 1369Pets And Animals 951Recreation And Sports 2236Relationships 684Religion 694Self Improvement And Motivation 7987Site Promotion 1526Sports And Recreation 217Travel And Leisure 2668Web Development 3317Women 2242Writing 2437
Improve your Website Through the Proper use of
Improve Your Web Site Through
The Proper Use Of Tags, Alt Tags & Attributes In Links
By Richard Zwicky
Improved web design, and search engine performance all in one easy step! Believe it or not, it is possible, easy, and really straightforward. There are 3 extremely useful tags and attributes that most people overlook, or do not take advantage of properly. Theses are alt tags, title attributes in links and tags.
The reason you want to spend some time focusing on these 3 facets of your web site is simple. Two of them make the web site easier to understand and navigate, for people and the search engines. The third one is much cleaner than the tags, and it works really well for key phrases and terms within the search engines. This article deals with the merits and value of each of these mostly misused, or ignored opportunities.
Alt Tags
The first opportunity is the one that is most often used, and misused: The alt tag. Alt tags are comments that should be used whenever you add a graphic, or image to a web page. Pictures are worth a thousand words to you and me, but zero to a search engine. An alt tag should be a little bit of short, descriptive text which helps any user (and search engine) understand what the reference is pointing to. If you are not aware of what an alt tag looks like, here's an example:
The code to make this banner appear is as follows.
![]()
When you move your mouse over the graphic, words appear. The words tell people what the graphic refers to, what it is about, and where it leads to. Internally, if you had a hardware store, you could use an image of a power tool link to a "tools" section, with the words "Tools & Power Tools" in the alt tag. It may be obvious, but most people don't take advantage of this opportunity. Most people don't even have alt tags attached to their images, or have alt tags that look like this - alt"" - not much good, they're blank. That's all the search engines, and some old web browsers will see - blank space.
Alt tags also afford you an opportunity to give the search engines more meaningful content to work with. If you have a graphics rich web site, there's very little to no text for the search engine spiders to use to analyze your site. If you attach a relevant alt tag to each image however, the search engines will read them as your textual content, and your web site will show up in relevant searches. Even if your website is content rich, the alt tags allow you to reinforce what is highly important, the key terms, within the content. Here's the key - use relevant terms. Don't just put "About Us" Use descriptive key terms, such as "About Acme Power Tools".
Tags
Next, we have the tags. Often, when web designers are building pages they use tags, and to emphasize the page heading, and subheadings for each section. Whenever you get the chance, use tags instead. There are 5 different tags. The largest two - & should be used for the major title on each page, and then the next three -
The Proper Use Of
By Richard Zwicky
Improved web design, and search engine performance all in one easy step! Believe it or not, it is possible, easy, and really straightforward. There are 3 extremely useful tags and attributes that most people overlook, or do not take advantage of properly. Theses are alt tags, title attributes in links and
The reason you want to spend some time focusing on these 3 facets of your web site is simple. Two of them make the web site easier to understand and navigate, for people and the search engines. The third one is much cleaner than the tags, and it works really well for key phrases and terms within the search engines. This article deals with the merits and value of each of these mostly misused, or ignored opportunities.
Alt Tags
The first opportunity is the one that is most often used, and misused: The alt tag. Alt tags are comments that should be used whenever you add a graphic, or image to a web page. Pictures are worth a thousand words to you and me, but zero to a search engine. An alt tag should be a little bit of short, descriptive text which helps any user (and search engine) understand what the reference is pointing to. If you are not aware of what an alt tag looks like, here's an example:
The code to make this banner appear is as follows.
When you move your mouse over the graphic, words appear. The words tell people what the graphic refers to, what it is about, and where it leads to. Internally, if you had a hardware store, you could use an image of a power tool link to a "tools" section, with the words "Tools & Power Tools" in the alt tag. It may be obvious, but most people don't take advantage of this opportunity. Most people don't even have alt tags attached to their images, or have alt tags that look like this - alt"" - not much good, they're blank. That's all the search engines, and some old web browsers will see - blank space.
Alt tags also afford you an opportunity to give the search engines more meaningful content to work with. If you have a graphics rich web site, there's very little to no text for the search engine spiders to use to analyze your site. If you attach a relevant alt tag to each image however, the search engines will read them as your textual content, and your web site will show up in relevant searches. Even if your website is content rich, the alt tags allow you to reinforce what is highly important, the key terms, within the content. Here's the key - use relevant terms. Don't just put "About Us" Use descriptive key terms, such as "About Acme Power Tools".
Next, we have the
should be used for the major title on each page, and then the next three - , & for subheadings. The smallest one, will look just like regular bold text on a page.
So why use them? The single most important reason to use these, aside from consistency of output, is for the search engines. The search engines weight different text within a page differently. We have found that terms used in tags are weighted heavier than regular text. This doesn't happen with using a attribute. The larger the text is (1 being largest, and 5 smallest size), the more weighty or important the key terms in the heading are viewed as being with respect to the overall document. Use the terms in these tags judiciously. Especially in the larger sizes. The search engines give these tags weight, because logically, the header for a page, and for each section of a page conveys the concept of what the entire document's focus is oriented towards. For this reason be very sure that you only use terms which you intend the web page to be found by.
Title Attribute
Different from a tag, this piece of code really should be used by everybody, without exception, just for the sake of being courteous. An example of a title attribute looks like this:<br/><br/><a href"http://www.sitepronews.com" title"SiteProNews - Webmaster Articles and Resources">SiteProNews</a><br/><br/>Note the title"..." segment in the hyperlink. Most people never use this attribute. The reason you should use it is simple: It's there for the blind. Text to speech browsers read the title attributes aloud, so that people who cannot see can still know what the page being linked to is about. If your are linking to a web page about John Deere Tractors have your title attribute in the link say so. <br/><br/>Using this attribute also has the benefit of adding search engine related content. After all, the terms you use will be highly relevant and specific; you have just added one more instance of them to the page. Plus, it's one more thing in the design of the web site that will have been done right from the perspective of the search engines. The search engines look favorably on web sites that have taken the time to get all the details right. This simple addition to your web page may do little, or it may give your web site the push it needs to move to the next level in search results.<br/><br/>In Summary<br/>The three features discussed in this article are all simple and easy to implement throughout a web site. If you only do one thing, make sure it's the title attribute: Anyone who is sight impaired will thank you. Getting all three right will help make your web site stand out, and your work stand out as that of a good web designer. They will also contribute to better search engine performance for your web site.<br/><br/><p> About the Author
<p>Richard Zwicky is a founder and the CEO of Metamend Software, www.metamend.com, a Victoria B.C. based firm whose cutting edge Search Engine Optimization software is recognized as the world leader in its field. Employing a staff of 10, the firm's business comes from around the world, with clients from every continent. Most recently the company was recognized for their geo-locational, or GIS, along with their phraseology technology and context sensitive search technologies. <br/></div><div class="panel panel-default" style="padding: 10px 10px 10px 10px;"><a class="btn btn-outline-primary btn-sm" href="/on/development/">development</a>
<a class="btn btn-outline-primary btn-sm" href="/on/tags/">tags</a>
<a class="btn btn-outline-primary btn-sm" href="/on/search/">search</a>
<a class="btn btn-outline-primary btn-sm" href="/on/engines/">engines</a>
</div> </div>
</div>
<!-- /#page-content-wrapper -->
</div>
<!-- /#wrapper -->
<footer class="footer">
<div class="container-fluid text-right">
<p class="text-muted"><i class="fa fa-copyright" aria-hidden="true"></i> <a href="http://ondapc.com/" target="_blank">ondapc</a> project 2024</p>
</div>
</footer>
<!-- CONTACT US -->
<div class="modal" id="contact">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title"><i class="far fa-envelope"></i> Contact Me</h4>
<button type="button" class="close" data-dismiss="modal"><i class="fa fa-times"></i></button>
</div>
<div class="modal-body">
<form id="contactar" name="contactar" method="post">
<input type="hidden" name="token" value="0f83b1a020207f39b769ed9fd1745124">
<input type="hidden" name="captcha" value="">
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fas fa-user"></i></span>
<input class="form-control" id="name" name="name" placeholder="Your Name" required="required" value="" type="text">
</div>
</div>
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="far fa-envelope"></i></span>
<input class="form-control" id="email" name="email" placeholder="Email" required="required" value="" type="email">
</div>
</div>
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fas fa-edit"></i></span>
<textarea name="message" id="message" class="form-control" rows="9" cols="25" placeholder="Write a message" required="required"></textarea>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">Send <i class="fas fa-chevron-right"></i></button>
</div>
</div>
</div>
</div>
<div id="contact" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><i class="fa fa-times"></i></button>
<h4 class="modal-title"><i class="fa fa-envelope-o"></i> Contact Me</h4>
</div>
<div class="modal-body">
</div>
</div>
</div>
<script>
$(function(){
$('#contactar').on('submit', function(e){
e.preventDefault();
$.ajax({
url: '/contactx/',
type: 'POST',
data: $('#contactar').serialize(),
success: function(data){
$('#contactar')[0].reset();
$("#contact-success").append('<span><i class="fa fa-check"></i> Message Sent!</span>');
}
});
});
});
</script>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Menu Toggle Script -->
<script>
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("toggled");
});
</script>
</body>
</html>
<!-- CACHE
904348f4fe6ce918c07e029d31454401
2024-05-11 15:11:48
-->
& for subheadings. The smallest one, will look just like regular bold text on a page.
So why use them? The single most important reason to use these, aside from consistency of output, is for the search engines. The search engines weight different text within a page differently. We have found that terms used in tags are weighted heavier than regular text. This doesn't happen with using a attribute. The larger the text is (1 being largest, and 5 smallest size), the more weighty or important the key terms in the heading are viewed as being with respect to the overall document. Use the terms in these tags judiciously. Especially in the larger sizes. The search engines give these tags weight, because logically, the header for a page, and for each section of a page conveys the concept of what the entire document's focus is oriented towards. For this reason be very sure that you only use terms which you intend the web page to be found by.
Title Attribute
Different from a tag, this piece of code really should be used by everybody, without exception, just for the sake of being courteous. An example of a title attribute looks like this:<br/><br/><a href"http://www.sitepronews.com" title"SiteProNews - Webmaster Articles and Resources">SiteProNews</a><br/><br/>Note the title"..." segment in the hyperlink. Most people never use this attribute. The reason you should use it is simple: It's there for the blind. Text to speech browsers read the title attributes aloud, so that people who cannot see can still know what the page being linked to is about. If your are linking to a web page about John Deere Tractors have your title attribute in the link say so. <br/><br/>Using this attribute also has the benefit of adding search engine related content. After all, the terms you use will be highly relevant and specific; you have just added one more instance of them to the page. Plus, it's one more thing in the design of the web site that will have been done right from the perspective of the search engines. The search engines look favorably on web sites that have taken the time to get all the details right. This simple addition to your web page may do little, or it may give your web site the push it needs to move to the next level in search results.<br/><br/>In Summary<br/>The three features discussed in this article are all simple and easy to implement throughout a web site. If you only do one thing, make sure it's the title attribute: Anyone who is sight impaired will thank you. Getting all three right will help make your web site stand out, and your work stand out as that of a good web designer. They will also contribute to better search engine performance for your web site.<br/><br/><p> About the Author
<p>Richard Zwicky is a founder and the CEO of Metamend Software, www.metamend.com, a Victoria B.C. based firm whose cutting edge Search Engine Optimization software is recognized as the world leader in its field. Employing a staff of 10, the firm's business comes from around the world, with clients from every continent. Most recently the company was recognized for their geo-locational, or GIS, along with their phraseology technology and context sensitive search technologies. <br/></div><div class="panel panel-default" style="padding: 10px 10px 10px 10px;"><a class="btn btn-outline-primary btn-sm" href="/on/development/">development</a>
<a class="btn btn-outline-primary btn-sm" href="/on/tags/">tags</a>
<a class="btn btn-outline-primary btn-sm" href="/on/search/">search</a>
<a class="btn btn-outline-primary btn-sm" href="/on/engines/">engines</a>
</div> </div>
</div>
<!-- /#page-content-wrapper -->
</div>
<!-- /#wrapper -->
<footer class="footer">
<div class="container-fluid text-right">
<p class="text-muted"><i class="fa fa-copyright" aria-hidden="true"></i> <a href="http://ondapc.com/" target="_blank">ondapc</a> project 2024</p>
</div>
</footer>
<!-- CONTACT US -->
<div class="modal" id="contact">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title"><i class="far fa-envelope"></i> Contact Me</h4>
<button type="button" class="close" data-dismiss="modal"><i class="fa fa-times"></i></button>
</div>
<div class="modal-body">
<form id="contactar" name="contactar" method="post">
<input type="hidden" name="token" value="0f83b1a020207f39b769ed9fd1745124">
<input type="hidden" name="captcha" value="">
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fas fa-user"></i></span>
<input class="form-control" id="name" name="name" placeholder="Your Name" required="required" value="" type="text">
</div>
</div>
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="far fa-envelope"></i></span>
<input class="form-control" id="email" name="email" placeholder="Email" required="required" value="" type="email">
</div>
</div>
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fas fa-edit"></i></span>
<textarea name="message" id="message" class="form-control" rows="9" cols="25" placeholder="Write a message" required="required"></textarea>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">Send <i class="fas fa-chevron-right"></i></button>
</div>
</div>
</div>
</div>
<div id="contact" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><i class="fa fa-times"></i></button>
<h4 class="modal-title"><i class="fa fa-envelope-o"></i> Contact Me</h4>
</div>
<div class="modal-body">
</div>
</div>
</div>
<script>
$(function(){
$('#contactar').on('submit', function(e){
e.preventDefault();
$.ajax({
url: '/contactx/',
type: 'POST',
data: $('#contactar').serialize(),
success: function(data){
$('#contactar')[0].reset();
$("#contact-success").append('<span><i class="fa fa-check"></i> Message Sent!</span>');
}
});
});
});
</script>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Menu Toggle Script -->
<script>
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("toggled");
});
</script>
</body>
</html>
<!-- CACHE
904348f4fe6ce918c07e029d31454401
2024-05-11 15:11:48
-->
will look just like regular bold text on a page.
So why use them? The single most important reason to use these, aside from consistency of output, is for the search engines. The search engines weight different text within a page differently. We have found that terms used in tags are weighted heavier than regular text. This doesn't happen with using a attribute. The larger the text is (1 being largest, and 5 smallest size), the more weighty or important the key terms in the heading are viewed as being with respect to the overall document. Use the terms in these tags judiciously. Especially in the larger sizes. The search engines give these tags weight, because logically, the header for a page, and for each section of a page conveys the concept of what the entire document's focus is oriented towards. For this reason be very sure that you only use terms which you intend the web page to be found by.
Title Attribute
Different from a tag, this piece of code really should be used by everybody, without exception, just for the sake of being courteous. An example of a title attribute looks like this:<br/><br/><a href"http://www.sitepronews.com" title"SiteProNews - Webmaster Articles and Resources">SiteProNews</a><br/><br/>Note the title"..." segment in the hyperlink. Most people never use this attribute. The reason you should use it is simple: It's there for the blind. Text to speech browsers read the title attributes aloud, so that people who cannot see can still know what the page being linked to is about. If your are linking to a web page about John Deere Tractors have your title attribute in the link say so. <br/><br/>Using this attribute also has the benefit of adding search engine related content. After all, the terms you use will be highly relevant and specific; you have just added one more instance of them to the page. Plus, it's one more thing in the design of the web site that will have been done right from the perspective of the search engines. The search engines look favorably on web sites that have taken the time to get all the details right. This simple addition to your web page may do little, or it may give your web site the push it needs to move to the next level in search results.<br/><br/>In Summary<br/>The three features discussed in this article are all simple and easy to implement throughout a web site. If you only do one thing, make sure it's the title attribute: Anyone who is sight impaired will thank you. Getting all three right will help make your web site stand out, and your work stand out as that of a good web designer. They will also contribute to better search engine performance for your web site.<br/><br/><p> About the Author
<p>Richard Zwicky is a founder and the CEO of Metamend Software, www.metamend.com, a Victoria B.C. based firm whose cutting edge Search Engine Optimization software is recognized as the world leader in its field. Employing a staff of 10, the firm's business comes from around the world, with clients from every continent. Most recently the company was recognized for their geo-locational, or GIS, along with their phraseology technology and context sensitive search technologies. <br/></div><div class="panel panel-default" style="padding: 10px 10px 10px 10px;"><a class="btn btn-outline-primary btn-sm" href="/on/development/">development</a>
<a class="btn btn-outline-primary btn-sm" href="/on/tags/">tags</a>
<a class="btn btn-outline-primary btn-sm" href="/on/search/">search</a>
<a class="btn btn-outline-primary btn-sm" href="/on/engines/">engines</a>
</div> </div>
</div>
<!-- /#page-content-wrapper -->
</div>
<!-- /#wrapper -->
<footer class="footer">
<div class="container-fluid text-right">
<p class="text-muted"><i class="fa fa-copyright" aria-hidden="true"></i> <a href="http://ondapc.com/" target="_blank">ondapc</a> project 2024</p>
</div>
</footer>
<!-- CONTACT US -->
<div class="modal" id="contact">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title"><i class="far fa-envelope"></i> Contact Me</h4>
<button type="button" class="close" data-dismiss="modal"><i class="fa fa-times"></i></button>
</div>
<div class="modal-body">
<form id="contactar" name="contactar" method="post">
<input type="hidden" name="token" value="0f83b1a020207f39b769ed9fd1745124">
<input type="hidden" name="captcha" value="">
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fas fa-user"></i></span>
<input class="form-control" id="name" name="name" placeholder="Your Name" required="required" value="" type="text">
</div>
</div>
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="far fa-envelope"></i></span>
<input class="form-control" id="email" name="email" placeholder="Email" required="required" value="" type="email">
</div>
</div>
<div class="form-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fas fa-edit"></i></span>
<textarea name="message" id="message" class="form-control" rows="9" cols="25" placeholder="Write a message" required="required"></textarea>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">Send <i class="fas fa-chevron-right"></i></button>
</div>
</div>
</div>
</div>
<div id="contact" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><i class="fa fa-times"></i></button>
<h4 class="modal-title"><i class="fa fa-envelope-o"></i> Contact Me</h4>
</div>
<div class="modal-body">
</div>
</div>
</div>
<script>
$(function(){
$('#contactar').on('submit', function(e){
e.preventDefault();
$.ajax({
url: '/contactx/',
type: 'POST',
data: $('#contactar').serialize(),
success: function(data){
$('#contactar')[0].reset();
$("#contact-success").append('<span><i class="fa fa-check"></i> Message Sent!</span>');
}
});
});
});
</script>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Menu Toggle Script -->
<script>
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("toggled");
});
</script>
</body>
</html>
<!-- CACHE
904348f4fe6ce918c07e029d31454401
2024-05-11 15:11:48
-->
Title Attribute
Different from a