How to Create a Table in blog or website

From many days i had a question in my mind how to create a rows and columns in the blogger with a well formatted way after a bit R&D i came to know how to create a tables

1. HTML Tags (Traditional way of writing a table using tags quite confusing for non techies)
2. Make a table in word document and use it in blogger( My way... Easy and Cleaner way)

1. Start with first way using HTML tags

a standard html format /code for writing a table say 2 column and 4 rows is

<table>
<tr><td>One </td><td> Two</td></tr>
<tr><td>Three </td><td> Four</td></tr>
<tr><td>Five </td><td> Six</td></tr>
<tr><td>Seven </td><td >Eight</td></tr>
</table>

All the tables in html starts with <table> and ends with </table>

<tr> is tr=table row indicates new row in the table and usually ends with </tr>

<td> Indicates the start of the content of a table column where td=table data and this tag ends with </td>

though creating a table format using above method is a bit confusing for beginners the second way of creating a table will be easy...

2.A second way (My way ;) and easy method of drawing a table is to format it in ms word and save the file as webpage

follow the below instruction to create a table easily

-->Open the Ms word and create a table according to your needs

-->Click the File menu and select Save As HTML (or Save As Web Page).

-->Click Yes or Save in the dialog box that appears. as shown in below Picture



-->Now open the Saved File in Text editors such as Notepad or edit plus

-->copy the only part of codes beginning with <table> and </table>

-->now use this table code in html blogger post without having to remember about any coding

If you guys know still simpler way of creating a table in HTML do share with us so that others who are searching this information gets benefited


Partner site : online news

HTML5 Canvas

The canvas element is used to draw graphics on a web page.
Your browser does not support the canvas element.

What is Canvas?

The HTML5 canvas element uses JavaScript to draw graphics on a web page.
A canvas is a rectangular area, and you control every pixel of it.
The canvas element has several methods for drawing paths, boxes, circles, characters, and adding images.

Create a Canvas Element

Add a canvas element to the HTML5 page.
Specify the id, width, and height of the element:
<canvas id="myCanvas" width="200" height="100"></canvas>


Draw With JavaScript

The canvas element has no drawing abilities of its own. All drawing must be done inside a JavaScript:
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="#FF0000";
ctx.fillRect(0,0,150,75);
</script> 
JavaScript uses the id to find the canvas element:
var c=document.getElementById("myCanvas");
Then, create a context object:
var ctx=c.getContext("2d");
The getContext("2d") object is a built-in HTML5 object, with many methods to draw paths, boxes, circles, characters, images and more.
The next two lines draws a red rectangle:
ctx.fillStyle="#FF0000";
ctx.fillRect(0,0,150,75);
The fillStyle method makes it red, and the fillRect method specifies the shape, position, and size.

Understanding Coordinates

The fillRect method above had the parameters (0,0,150,75).
This means: Draw a 150x75 rectangle on the canvas, starting at the top left corner (0,0).
The canvas' X and Y coordinates are used to position drawings on the canvas.
Mouse over the rectangle below to see the coordinates:


Partner site : online news

HTML5 Audio

Audio on the Web

Until now, there has not been a standard for playing audio files on a web page.
Today, most audio files are played through a plug-in (like flash). However, different browsers may have different plug-ins.
HTML5 defines a new element which specifies a standard way to embed an audio file on a web page: the <audio> element.

How It Works

To play an audio file in HTML5, this is all you need:

Example

<audio controls="controls">
  <source src="song.ogg" type="audio/ogg" />
  <source src="song.mp3" type="audio/mpeg" />
  Your browser does not support the audio element.
</audio> 
The control attribute adds audio controls, like play, pause, and volume.
You should also insert text content between the <audio> and </audio> tags for browsers that do not support the <audio> element.
The <audio> element allows multiple <source> elements. <source> elements can link to different audio files. The browser will use the first recognized format.

Audio Formats and Browser Support

Currently, there are 3 supported file formats for the <audio> element: MP3, Wav, and Ogg:
Browser MP3 Wav Ogg
Internet Explorer 9 YES NO NO
Firefox 4.0 NO YES YES
Google Chrome 6 YES YES YES
Apple Safari 5 YES YES NO
Opera 10.6 NO YES YES


HTML5 audio Tags

Tag Description
<audio> Defines sound content
<source> Defines multiple media resources for media elements, such as <video> and <audio>


Partner site : online news

New Elements in HTML5

The internet has changed a lot since HTML 4.01 became a standard in 1999.
Today, some elements in HTML 4.01 are obsolete, never used, or not used the way they were intended to. These elements are deleted or re-written in HTML5.
To better handle today's internet use, HTML5 also includes new elements for better structure, drawing, media content, and better form handling.

New Markup Elements

New elements for better structure:
Tag Description
<article> Specifies independent, self-contained content, could be a news-article, blog post, forum post, or other articles which can be distributed independently from the rest of the site.
<aside> For content aside from the content it is placed in. The aside content should be related to the surrounding content
<bdi> For text that should not be bound to the text-direction of its parent elements
<command> A button, or a radiobutton, or a checkbox
<details> For describing details about a document, or parts of a document
<summary> A caption, or summary, inside the details element
<figure> For grouping a section of stand-alone content, could be a video
<figcaption> The caption of the figure section
<footer> For a footer of a document or section, could include the name of the author, the date of the document, contact information, or copyright information
<header> For an introduction of a document or section, could include navigation
<hgroup> For a section of headings, using <h1> to <h6>, where the largest is the main heading of the section, and the others are sub-headings
<mark> For text that should be highlighted
<meter> For a measurement, used only if the maximum and minimum values are known
<nav> For a section of navigation
<progress> The state of a work in progress
<ruby> For ruby annotation (Chinese notes or characters)
<rt> For explanation of the ruby annotation
<rp> What to show browsers that do not support the ruby element
<section> For a section in a document. Such as chapters, headers, footers, or any other sections of the document
<time> For defining a time or a date, or both
<wbr> Word break. For defining a line-break opportunity.


New Media Elements

HTML5 provides a new standard for media content:
Tag Description
<audio> For multimedia content, sounds, music or other audio streams
<video> For video content, such as a movie clip or other video streams
<source> For media resources for media elements, defined inside video or audio elements
<embed> For embedded content, such as a plug-in
<track> For text tracks used in mediaplayers


The Canvas Element

The canvas element uses JavaScript to make drawings on a web page.
Tag Description
<canvas> For making graphics with a script


New Form Elements

HTML5 offers more form elements, with more functionality:
Tag Description
<datalist> A list of options for input values
<keygen> Generate keys to authenticate users
<output> For different types of output, such as output written by a script

New Input Type Attribute Values

Also, the input element's type attribute has many new values, for better input control before sending it to the server:
Type Description
tel The input value is of type telephone number
search The input field is a search field
url The input value is a URL
email The input value is one or more email addresses
datetime The input value is a date and/or time
date The input value is a date
month The input value is a month
week The input value is a week
time The input value is of type time
datetime-local The input value is a local date/time
number The input value is a number
range The input value is a number in a given range
color The input value is a hexadecimal color, like #FF8800
placeholder Specifies a short hint that describes the expected value of an input field
Partner site : online news

Traditional SEO No More Relevant

This might be a surprise to the newbies of SEO, or even perhaps to some seasoned bloggers. As we all know, SEO (Search Engine Optimization) is all about link building to increase a blog’s visibility in search engines. This includes link exchange, comments on other blogs, forum posting, blog directories submission, article marketing, and bookmarking.
But since Google’s new search algorithm called Panda on February this year to, the traditional SEO is now beginning to fade away like a smoke. It proved on June this year when Google updated PageRanks. Some have been disappointed about the drops of their PRs from 5 to 3 or 3 to 0. Others were gratified by acquiring a PR of 3 or 4 from 0 without doing any SEO.
I can also prove this based on my blogs. My other blog, Blogirature, although more than a year old blog, only has 29 posts, without building any links at all from other blogs. In short, no SEO whatsoever. On June it acquired a PR of 1. My other blog called Beautiful Sites, a nine-month-old blog, with only 13 posts, also acquired a PR of 1. This also didn’t have any search marketing at all. The third blog called The Soundtripper started on May this year, although with a huge number of posts since it’s a music download blog, it got a PR of 3 just last month, August. This blog, Cebu and Davao, got a PR of 3 last June after doing SEO for more than a year with 400 + posts. Now, tell me if I am just having an illusion or what.
This is not only based on my own observation. The statement that the usual SEO is no more important comes from Google itself. I can’t remember if Matt Cutts has said this, but the other engineers of Google said something about the importance of high quality contents, and that they no longer rank sites according to number of backlinks, regardless of their relevancy. They, however, still stated that backlinks are still important but not anymore as what most web developers do: link exchange, forum signatures, blog comments, and as what stated above. They didn’t say anything further than that.
In my opinion, I think the PageRanks updates in June and August is exactly what the Google engineers are talking about. The drops and the increase of PRs speak for themselves.
To me this is good news for bloggers, because they don’t have to worry much on how they can be seen on Google and other search engines. They don’t have to worry about SEO anymore. What they need to focus more is traffic while writing useful contents. And that’s it. Just focus on traffic and write high quality contents, Google will do the rest.
To me PageRanks before are nothing but figures. They didn’t mean anything more than how Internet users see them and how web developers and bloggers want to mean them. Imagine, with billions of websites on the World Wide Web, how can Google measure sites’ popularity according merely through PageRanks?
Well, this is before, when PageRanks are measured through the number of backlinks of a site. PageRanks today is not as like in the old days.
Organic backlinks is still the best way and the only effective way on how Google give you your well deserving PR. And that can be achieved by writing highest quality content possible for your blog’s niche.


Partner site : online news