Thursday, January 19, 2012

New addition:mobile version

Due to complains from our viewers/members about the difficulty of viewing/loading this blog on a mobile device and the large amount their local network provider charges them because of the large data been downloaded to their phones as a result of loading a large site, changes have been made and the mobile version of this blog has been created and optimized for your mobile devices....
If you are still having problems viewing the mobile version, please send your feedback to me by leaving a comment below this post or by using the form on the contact page of this blog and i will make the changes as quickly as possible...

Thanks,
WebsitesNBlogs.....

HTML:Meta Tags


Welcome to another post, in this post we shall be looking at yet another common tag used in HTML… Meta Tags…. I chose to discuss Meta tags today because anyone who has a website or blog or is planning to create one will obviously want that website/blog to be found by search engines(Google, Yahoo, Bing, etc.) and in so doing increase their reader base/traffic to their site.
Search Engines have become the most used tool on the internet today to find relevant information about just any thinkable topic and it is expedient that your website/blog gets found in this large sea of information that is available on the World Wide Web….. Wouldn’t it be very awful if someone was searching for information on a subject you know so well and you have taken the time to explain it in a well detailed manner on your site but can’t seem to see your site but all the person sees is other crappy websites that show up in their search result, that is why it is important to use Meta tags…
So, what really are meta tags……
Well, Meta tags are special tags in HTML that allow the HTML coder(the person that writes the website or edits it) to specify a description and keywords that a search engine can run through to see  if the website is relevant to the search criteria. It allow you to specify a description of your site that the user(the person searching) will see in his/her search result so that he/she can make the best choice of website to view.
To use Meta tags in a website is very easy, you use the tags <meta>. Unlike other tags like the <body> tag which have closing a tag, the <meta> tags doesn’t have a closing tag. The <meta> tag provides metadata about the HTML document, metadata is simply information about the HTML or website/blog data. Metadata will not be displayed on the page, but can be read by search engines.
Meta elements are typically used to specify page description, keywords, author of the document, last modified etc.
The <meta> tag always goes inside the head element.
E.g.
<html>
<head>
<meta   data goes here>
</head>
</html>
The metadata can be used by browsers in knowing how the content of a webpage is displayed or reloaded; it is also used by search engines in finding out relevant content using keywords; or other web services.
This post is consigned in the optimization of a website or a blog by using Meta tags so I will focus on description and keyword.
For specifying a description for a site, i.e. the description a person will see when he/she searches for your site we use the below:
<meta name="description" content="A place where everything relating to websites and blogs is discussed" />
You replace everything in between the double quote of the content with your own description E.g.

content=“put you own description here

To specify a keyword for a search engine to use to categorize your site content you use:
<meta name="keywords" content="AAA, BBBBB, CCCCCC" />
Where AAA, BBBBB, CCCCCCC represent your own keywords. You can specify as many keywords as you like as long as you separate each one with a comma, for example
<meta name="keywords" content="HTML, CSS, XML, BLOGS, WEBSITES" />

A lot of webmasters have used <meta> tags for spamming, like repeating keywords (or using wrong keywords) for higher ranking. Therefore, most search engines have stopped using <meta> tags to index/rank pages.







Happy new year from WebsitesNBlogs

Tuesday, January 3, 2012

New Beginings:part 5


Hello and welcome to another part (part 5) of the HTML series. In the previous part (part 4), I discussed the color attribute and its application in a body tag.
 In this post I want to explain how the color attribute can be used in another tag (the font tag). When used in the font tag, it “tells” the browser that you wish to display all the text in between the tag in that particular font, text size and color you specified.

E.g
let us take a look at a use of the font tag   <font> ..... some text .... </font>

we could modify the above tag combination by adding color=" your color ", size=“a number representing the size” or face=“font_family e.g. Arial” to the body opening tag.

i.e.  <font face=“Arial” size="3" color="red">This is WebsiteNBlogs, a site that contains all you need to know about websites and blogs. </font>

The above font formatting will change the font style/face, size and color of the sentence in-between the font tags to a size 3 Arial type font with its color being red.... As in the previous tutorial of the body tag, you can also use other colors.....hex codes can also be used to specify the color, a list of HTML color codes can be found here.
To use the hex code in a font tag is the same as in a body tag, you have to place a hash symbol before you text in the hex code. This is to " tell " the browser that you are inputting a code and not names ... 

E.g  <font color=#thehexcode> ...some text...</font>

i.e. <font color="#00FF00"> ..some text..</font>     changes the font color to Green.

Remember that RGB ( stands for Red Green Blue) color code ... so to specify maximum color use FF… that is why i used R(00) G(FF) B(00) to display the green above meaning, zero value for red, maximum value for green and zero value for blue; hence the code 00FF00.

 You can also use the RGB directly,
i.e. <font color="rgb(255,0,0)"> ..some text.. </font>     changes the font color to red.

As in the last part, I have also included a complete table showing how to use the various version of using the color attribute below...
Value
Description
color_name
Specifies the background color with a color name (like " red ")
hex_number
Specifies the background color with a hex code (like "#ff0000")
RGB_number
Specifies the background color with an rgb code (like " rgb(255,0,0) ")

The font tag also supports the following attributes

Attribute
Value
Description
class
classname
Specifies a classname for an element
dir
ltr    rtl 
Specifies the text direction for the content in an element
Id
id
Specifies a unique id for an element  

lang element
Language_code
Specifies a language code for the content in an element
style
Style_definition
Specifies an inline style for an element
title
text
Specifies extra information about an element
           
This is the same complete but simple page I posted in the last part (part 4) showing the full usages of the color attribute. The only edition I made to the HTML page is the font tag; I modified it with the other attribute (face and size) I discussed earlier in this post.

<html>
<body bgcolor="#FF0000">
<h1>Hello world!</h1>
<p>
<center>
<font face=  “verdana” size=“4” color="red">This is some text!</font> 
<a href="http://www.websitesnblogs.blogspot.com">visit here for HTML Tutorials!</a>
</p>
</center>
</body>
</html>

A point I should make here is that presently CSS implementation of the font face, size and color is being used. It is recommended that you use CSS.
I will discuss a very important HTML tag in the next post, a must to know if you want to make a website or a blog or already have one. See you in the next post...



Happy New Year from WebsitesNBlogs