Saturday, 10 May 2014

HTML Overview - Basics-3

1) Absolute Links :
Absolute links are those that include the entire pathname. In most cases, you use absolute links when linking to pages or sites that are not part of your own Web site.
<a href="http://www.yahoo.com">Visit Yahoo!</a>
2)Relative Links :
Relative links are called so because you don’t include the entire pathname of the page to which you are linking. Instead, the pathname you use is relative to the current page.
<a href="contactSk.html">Contact Sumit K</a>
3) Create an Anchor :
An anchor is a place within a page that is given a special name, enabling you to link to it later.
Sample for moving from Top to bottom or vice versa on same page using anchor tag:
https://drive.google.com/file/d/0BwyaWKtCo9z7dUsxTUlaUUlYZFU/edit?usp=sharing
4) E-mail Addresses :
When you want to give someone easy access to your e-mail address, you can include it on
your page as a mailto link.
<a href="mailto:ksumit@gmail.com">Email Sumit K!</a>
OR
<a href="mailto:ksumit@gmail.com?Subject=HTML
Book&cc=blogbooks@gmail.com"> Email me about this Blog</a>
5) Change Link Colors :
Attributes of the body tag to customize the three link colors of aWeb page: normal link colors (link), visited link colors (vlink) and active link colors (alink).
<body bgcolor="#ffffff" text="#000000" link="#003366" vlink="#999999"
alink="#ff33cc">
6) "alt" attribute of the img tag to provide alternative text for an image or an alternate image.
<img src="photo.jpg" width="391" height="274" alt="This photo of my blog, when i first started." />
7) Lists : Three different types of lists possible in HTML:
Ordered lists (ol) : default bullets (1,2,3,...)
Unordered lists (ul) : default bullets (disc sign)
Definition lists (dl)
   My favorite bikes are:
  <ol>
    <li>Bullet</li>
    <li>Pulsar</li>
    <li>Twister</li>
  </ol>
  The end tag for li is optional in HTML, but required in XHTML
  <dl>
  <dt>Coffee</dt>
  <dd>Black hot drink</dd>
  </dl>
8) Table and address :
Files for the reference, please follow the link below
Address:  https://drive.google.com/file/d/0BwyaWKtCo9z7TDJzcWoxN1NhXzQ/edit?usp=sharing
Table and address:  https://drive.google.com/file/d/0BwyaWKtCo9z7d1c0a2Q1X3JUSXM/edit?usp=sharing

HTML Overview - Basics-2

1) HTML is case-insensitive and, in fact, very forgiving. This means all of the following three examples would be considered the same by the browser:
● <html>
● <HTML>
● <HTml>
whereas XHTML is case-sensitive and requires all tags to be lowercase. Of the three previous examples, the browser would properly interpret only the first.
2) HTML doesn’t require quotation marks unless the value of an attribute contains a hash mark or a space, as in the following case:
<font face="Times New Roman">
XHTML does require all attribute values to be placed within straight quotation marks.
3) Comments or notes you need to add to your Web pages
<!-- Remember to like this(ksumitinfo.blogspot.com) blog if you like the info -->
4) CSS offers three types of style sheets:
 ● Inline : Styles are embedded right within the HTML code they affect.
  <h2 style="font-family: verdana;color: #003366">
 ● Internal : Styles are placed within the header information of the Web page, and then
 affect all corresponding tags on the page
 <head>
 <title>CSS Example</title>
 <style type="text/css">
 <!--
 h2 {font-family: verdana; color: blue}
 .red {font-family: verdana; color: red}
 -->
 </style>
 </head>
● External : Styles are coded in a separate document, which is then referenced from  within  the header of the actual Web page
5) Nonbreaking space character entity (&nbsp;)
6) Preformat : 
The only time pressing the RETURN or ENTER key in your page creates line breaks in the browser view is when the pre tag is used. Short for preformat, the pre tag renders text in the browser exactly as you type it.
7) Horizontal Rules :
One way you can separate sections of your Web page is to use the hr tag. By default, this tag produces a thin, gray horizontal line called a horizontal rule.
8) Logical Styles :
<abbr>  Indicates an abbreviation 
<acronym> Indicates an acronym 
<cite> Marks a reference to another source or a short quotation, italic
<dfn> Highlights a definition or defined term, italic
<em> Provides general emphasis, italic
<strong> Provides a stronger general emphasis than with <em>, bold
<var> Suggests a word or phrase that is variable and should be replaced with a specific value, italic
9) Physical Styles : 
<b> bold
<big> increases the font size by 1 each time it is used,(maximum size is 7,default size is 3)
<i> italic
<tt> typewriter font
<small> decreases the font size by 1 each time its used,(minimum sizeis 1,default sizeis 3)
<strike> Strikethrough
<sub> subscript
<sup> superscript
<u> underline

HTML Overview - Basics-1

1) HTML  : Hypertext Markup Language
2) HTML is a means of telling a Web browser how to display a page.
3) HTML files have an .html or .htm file extension.
4) URL : uniform resource locator.
5) The Web was mostly text based until Marc Andreessen created the first graphical Web browser in 1993, called Mosaic. This paved the way for video, sound, and photos on the Web.
6) Web server is a computer, running special software, which is always connected to the Internet.
7) A Web browser is a piece of software that runs on your personal computer and enables you to view Web pages. Web browsers, often simply called “browsers,” interpret the HTML code and provide a visual layout displayed on the screen. Many browsers can also be used to check e-mail and access newsgroups.
8) Dynamic HTML (or DHTML) is a newer version of HTML, in which page content is easily changed and customized on the fly, without having to send and receive additional information from the server. Style sheets, used especially in DHTML.
9) JavaScript is a scripting language designed to give Web pages more interactivity than can be achieved through HTML. Even though the name might make you think otherwise, JavaScript is different from Java, which is a full programming language.
10) !DOCTYPE :  Tells the browser which set of standards your page adheres to 
-Lists the standard (see the section “The Three Flavors of XHTML”) 
–Identifies the location of the standard by linking to the URL.
11) The Three Flavors of XHTML
The W3C has specified that XHTML 1.0 be available in three flavors, or versions, to
accommodate the transition time during which developers and browsers migrate from HTML 4.0 to XHTML. You need to identify your page with one of these three flavors to help the browser validate it. Because most of your pages will probably fall into one of the three categories, you can simply copy-and-paste the DOCTYPE from one page onto all the others.
    a. XHTML Transitional : This is the category under which the majority of your pages will
probably fall. It enables you to use those HTML 4.01 tags that are deprecated, as long as
you also follow the XHTML rules, such as closing all tags (even ones like br, that aren’t
required to be closed in regular HTML). Pages that are transitional are prepared for XHTML,but are also compatible with older browsers that don’t understand XHTML. To validate your pages against this flavor of XHTML, use
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">.
    b. XHTML Strict : Pages that fall into this category don’t contain any deprecated tags.
These pages may not be compatible with older browsers. To validate your pages against
this flavor of XHTML, use
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"DTD/xhtml1-strict.dtd">.
    c. XHTML Frameset:  Sites using HTML frames to divide the pages must identify with the
frameset flavor of XHTML. To validate your pages against this flavor of XHTML, use
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"DTD/xhtml1-frameset.dtd">.