Search Anything Related to Library and Information Science

HyperText Markup Language (HTML)


1. Introduction: HyperText Markup Language (HTML) is the main markup language for creating web pages and other information that can be displayed in a web browser. If anyone trying to do business on the Internet, taking the time to learn how to design his/her own website by using HTML and such other languages will play a major role in the success.

2. Importance of HTML: HTML pages are the standard interface to the internet and so any one who like to have his/her own website it is a good to practice to learn HTML by themselves than to handover his/her Webpages to any other Webmaster or HTML Wizard. Here are some of the reasons to learn HTML-
a) HTML Editors Have Some Problem: HTML editors are supposed to do the necessary HTML coding, however they are not perfect and can make mistakes. This is the main reason why you have to learn HTML. You need to make adjustments when the HTML editors put unnecessary codes and do your own HTML coding in case they crash. Sometimes, you may also face situations where the editor does not provide what you seek. When this happens, you can work to reach your desired solutions if you know HTML.
b) Saving Your Money: If you don’t learn HTML, you have to rely on someone who knows HTML and pay them for their HTML coding services. Learning HTML will save a great deal of money, by avoiding hiring a professional web designer.
c) Be Your Own Boss: If you know HTML, it will provide you the freedom to update the site by yourself.
d) HTML is Everywhere: HTML is commonly used over Internet. It is also used in most private corporate networks (Intranet), providing business or product information to client or even employ on CD-ROM for various presentations.

3. Making HTML Compatible to XML and XHTML: eXtensible Markup Language (XML) grew out of a desire to be able to use more than just the fixed vocabulary of HTML on the web. So, it can be said that the XML has user-defined tag and html is pre-defined tags. It is a meta-markup language, like SGML, but one that simplifies many aspects to make it easier to make a generic parser. Extensible Markup Language (XML) is a markup language that defines a set of rules for encoding documents in a format that is both human-readable and machine-readable. XML always needs close tags, and has a special syntax for tags that don’t need a close tag. However, in HTML, some tags, such as <img /> are always assumed to be empty and close themselves. Others, like <p> may close implicitly based on other content. And others, like <div> always need to have a close tag. In XML (including XHTML), any tag can be made self-closing by putting a slash before the code angle bracket, for example <img src="badan-barman.jpg"/>. In HTML that would just be <img src="badan-barman.jpg ">
eXtensible HyperText Markup Language (XHTML) is a reformulation of HTML in XML syntax. While very similar in many respects, it has a few key differences. Extensible HyperText Markup Language (XHTML) is a family of XML markup languages that mirror or extend versions of the widely used Hypertext Markup Language (HTML).
So, to be compatible with XML and XHTML, use of lower case letter; closing tags; putting an extra space before “/” and a slash before the code angle bracket in those HTML tags that are empty and close themselves like <img>, <br>; quotes around all attributes and the use of both “id” and “name” attributes is essential. All these will also help you in creating a readable and easily upgradeable HTML tags.

4. Basic HTML Document Structure: HTML codes always starting with lesser than (<) and ending with greater than (>) brackets and may be written in capital or upper case letter as well as small or lower case letters (you are requested kindly to use lower case letter only). The words in between the bracket are actually coded commands. These commands are called HTML tag because they “tag” pieces of text and tell the browser what kind of text it is. An element may also be followed by attributes, which are words describing the properties of the element, and further instruct the browser. Attributes are only contained in the opening tags to the right of the element and are separated by a space and followed by an equal (=) sign. The value follows the equal sign and is enclosed in quotes. Every webpage must include the following basic tags.

Fig. 1: Basic HTML Document Structure
<html>
<head>
<title>Title of the Page</title>
</head>
<body>
This area will contain the information or graphics that will be visible through a web browser.
</body>
</html>

If one gives a close look at the above tags then he/she will easily imagine that all tags have two parts. An opening tag indicates where a piece of text begins, and a closing tag, indicates where the pieces of text end. Closing tags starts with a / (forward slash) just after “<” symbols. For example </body> - closes the <body> tag.
Putting <html> at the very beginning of a document simply indicates that it is a web page. The </html> at the end indicates that the Webpage is over. Manny web browser will forgive one if one forget to put <html> tag and will displayed the page correctly anyway. Yet it is very good idea to include it because some software does need it to identify the page as a valid HTML document.
<head> - It contains information about the page such as the TITLE, META tags for proper search engine indexing, STYLE tags-which determine the page layout, and JavaScript coding for special effects. </head> - closes the <head> tag.
<title> - It is the title of the document that will be visible in the title bar of the viewers’ web browser. It gives the entire page an identifying name that isn’t displayed on the page itself, but only on the window title bar.  </title> closes the <title> tag.
<body> - This is where one need to begin his/her writing and placing other HTML codes. Only the text within <body> and </body> tag will be visible to the user.

5. Creating a Simple Web Page: To create a simple webpage one should write his/her information along with the basic HTML code in Notepad, the “Title of the Page” should be replaced by his/her own name of the webpage. After doing this, the file need to be saved as plain, standard ASCII text. Notepad and most simple text editors always save files as plain text, but one need to choose it as an option (after selecting <File>, <Save As>). Providing the file name “index”, ending in “.html”, Save as type: Text Documents “*.txt”; Encoding: “ANSI” is essential. Giving the extension of the file name as “.html” is very important, if one forgets it, text editor by default will give some other extension such as “.txt” or “.doc”, and if it happens, one will not be able to see his/her page in a web browser. The name of the first HTML document (Home page) generally is “index”. After that the user need to click on the “Save” button. It is a good idea to keep all HTML files within a single parent folder or the hard drive.
            After saving the file one need to right click on the file “index.html” and open it with a Web Browser leaving Notepad running too, this way one can easily switch between viewing and editing mode of the web page. If something does not look right, one need to go back to the text editor to make necessary correction and save the file again. In such cases one need to click the refresh or reload button to see the changes recently made in the web browser.
One may find it convenient to create and save a bare –bones page with just the basic HTML tags, and when he/she want to make a new webpage start this page as starting page, this way one can save the time of typing the obligatory tags every time.

6. Paragraphs and Line Breaks: To control where a line and paragraph break occur one need to type <p> tag at the beginning of each paragraph and a </p> tag at the end. It will skip a line between paragraphs. The <br /> tag forces a line break within a paragraph. Unlike the above tag the <br /> tag does not require a closing tag. Here another point that can be noted is that to conform to the new XML and XHTML standard, one always need to include a space and then a “/” (forward slash) within any opening tag that doesn’t have a closing tag like <br />.

7. Horizontal Rule: One can insert a horizontal rule with the <hr /> tag. It also causes a line break, even if one does not include a <br /> tag along with it. For a little extra blank space above and below a horizontal rule one need to put a <p> tag before the <hr /> tag and a </p> tag after it. Like a <br /> tag, <hr /> also does not require a closing tag.

8. Heading: Generally three types of heading tags are there - <h1>, <h2> and <h3>. Theoretically one can also use <h4>, <h5> and <h6> to make progressively smaller heading, but these are seldom in use as it does not show a noticeable difference between these and <h3> heading. Kindly note that heading will not be in boldface as it is already in bold.
Fig. 2: Heading Tags
Tags
Description
<h1> … </h1>
For a big level 1 heading
<h2> … </h2>
For a slightly smaller level 2 heading
<h3> … </h3>
For a smaller level 3 heading

9. Text Formatting and Font Control: User of the web browser can alter how a page appears by choosing different display option and or changing the size of the viewing window. Screen resolution, window size and optional toolbars can also change the page settings. However, for a default setting the webmaster must define the text formatting of the page. In this regard, the following paragraph will be helpful. It is better to avoid the underline text, as people expect the underline text to be a link.

Fig. 3: Text Formatting and Control Tags
Tags
Description
<b>….</b>
Or
<strong>…..</strong>
To use boldface

<i>…..</i>
Or
<em>…..</em>

To use italicized text.
(em means emphasis)

<u>….</u>

Underline
<small>….</small>
Text slightly smaller than normal
<big>….</big>
Big smaller text
<sup>….</sup>
TextSuperscript
<sub>….</sub>
TextSubscript
<strike>….</strike>
Draws a line through text
<tt>….</tt>
Monospaced small typewriter font
<pre>….</pre>
Monospaced small font, preserving spaces and line break
<b><i>…..</i></b>
To use both boldface and italicized together
<li><b>…..</b></li>
·  To use boldface within list
<font size=“5”>….</font>
Size can take any value from 1 (tiny) to 7 (fairy big), with 3 being the default size.
<font face=“aerial”>….</font>
This makes the font by name aerial to appear.

Defining the font as <font face=“aerial” “helvetica”>….</font> will forced the browser first to look up for aerial font, if it is available it will be used, otherwise the system will look for Helvetica. If none of the font is available, the browser will display the default font that is “Times New Roman”. By the above way one can also define more than two Font Faces. Since only the font that has on the user machine will show up and many common fonts go by several slightly different names and since the exact spelling of the font name is important so in reality, only reliable choice is to choose aerial (on windows machine) and helvitica (on Macintoshes).

10. Text Alignment: The following tags are used to align the text in an HTML document.
Fig. 4: Text Alignment Tags
Tags
Description
<div> ... </div>
To define a region of text to be formatted.
<div align=“justify”>......</div>
To justify more than one paragraph.
<p align=“justify”> … </p>
To align a paragraph to justify.
<p align=“center”> … </p>
To align a paragraph to center.
<p align=“right”> … </p>
To align a paragraph to the right margin.
<p align=“left”> … </p>
To align a paragraph to the left margin.
Similarly

<h1 align=“justify”> ... </h1>

<h1 align=“center”> … </h1>

<h1 align=“right”> … </h1>

<h1 align=“left”> … </h1>

And so on for <h2>, <h3> etc.


11.  List: Lists are used to group related pieces of information together, so they are clearly associated with each other and easy to read. There are three list types in HTML: unordered list - used to group a set of related items, in no particular order, ordered list - used to group a set of related items, in a specific order and description list - used to display name/value pairs such as terms and their definitions, or times and events.

Fig. 5: HTML Tags for List
Tags
Description
<ul>
<li> … </li>
<li> … </li>
</ul>
Unordered List
Bullet appears at each <li> tag instead of numbers.

<ol>
<li> … </li>
<li> … </li>
</ol>
Ordered List
Numbers will appear at each <li> tag.
<dl>
<dt> … </dt>
<dd> … </dd>
<dt> … </dt>
<dd> … </dd>
</dl>
Definition List
<dt> for Definition Term and
<dd> Definition Define.
                                               
12. List within List / Nested List: The list can be made a nested list by inserting one type of list within another.
Fig. 7: HTML Tags for List within List
Tags
Description
<ol>
<li>……</li>
<ul>
<li>……</li>
</ul>
<li>……</li>
</ol>
1……
  • …..
2…….


13. Bullet: Internet Explorer and Firefox normally use a solid circle for the first level bullet, a hollow circle for the second level bullet and a solid square for all deeper level.
Fig. 6: HTML Tags for Bullet
Tags
Description
<li type=“1”>……</li>
To display ordinary number.
<li type=“A”>……</li>
To display capital letter.
<li type=“a”>……</li>
To display lowercase letter.
<li type=“I”>……</li>
To display uppercase roman numeral.
<li type=“i”>……</li>
To display lowercase roman numeral.
Or

<ul type=“disc”>……</ul>
To display a solid disc.
<ul type=“circle”>……</ul>
To display a circle.
<ul type=“square”>……</ul>
To display a square.
<li type=“square”>……</li>
To display a square.
<ol start=“3”>…..</ol>
To start the number list at 3 instead of 1.
<li value=“12”>…..</li>
To renumber an individual point to 12.
<ol type=“A” start=“3”…..<ol>
To start a list with C.
(Similarly, this can also be used for 3, III, c).

14. Table: Each table row is defined with the <tr> tag. A table header is defined with the <th> tag and a table data/cell is defined with the <td> tag. By default, table headings are bold and centered.

Fig. 8: HTML Tags for Table and its View in Browser





Tags
Description
<table border="1">

<tr>
Table Row
<th>….</th>
Table Header
<th>….</th>
Table Header
</tr>

<tr>
Table Row
<td>….</td>
Table Data
<td>….</td>
Table Data
</tr>

</table>




Fig. 9: HTML Tags for Table and its View in Browser
<table border="1">
<caption align="top">
<center>Marksheet
</center></caption>
<tr>
<th rowspan=2>English</th>
<th rowspan=2>Mathematics</th>
<th colspan=3>Physics</th>
<th rowspan=2>Total</th>
</tr>
<tr>
<th>Theory</th>
<th>Practical</th>
<th>Total</th>
</tr>
<tr>
<td>65</td>
<td>75</td>
<td>40</td>
<td>20</td>
<td>60</td>
<td>200</td>
</tr>
</table>

Fig. 10: Attributes of a Table





Attribute
Value
Description
Align
left, center, right
Specifies the alignment of a table according to surrounding text
colorname
Specifies the background color for a Table
pixels
Specifies the width of the borders around a table
pixels
Specifies the space between the cell wall and the cell content.
pixels
Specifies the space between cells, default is 2
pixels %
Specifies the width of a table

15. Marquee: The <marquee> element is used to identify text that should move across a defined section of a webpage in a horizontal or vertical direction. The HTML <marquee> tag supports the following additional attributes –

Fig. 11: Attributes of a Marquee
Attribute
Value
Description
behavior
scroll, slide, alternate
Defines the type of scrolling.
bgcolor
rgb(x,x,x), #xxxxxx, colorname
Deprecated − Defines the direction of scrolling the content.
Direction
up, down, left, right
Defines the direction of scrolling the content.
Height
pixels or %
Defines the height of marquee.
Hspace
pixels
Specifies horizontal space around the marquee.
Loop
number
Specifies how many times to loop. The default value is INFINITE, which means that the marquee loops endlessly.
Scrolldelay
seconds
Defines how long to delay between each jump.
Scrollamount
number
Defines how how far to jump.
Width
pixels or %
Defines the width of marquee.
Vspace
pixels
Specifies vertical space around the marquee.

16. Special Character: One can insert the special characters at any point in an HTML document by inserting the appropriate codes for that character. One will fine more extensive list of codes for multiple character sets online at (http://www.w3.org/tr/rec-html40/sgml/entities.html). For example “©” copyright symbol has “&copy” and for registered trademark “®” has “&reg” code.

17. Custom Background and Font Color: The links are generally blue with an underline, after clicking on the link it become purple, the text are black and background is white. If one try to change this here is the tag <body bgcolor=“blue” text=“white” link=“black” alink=“blue” vlink=“red”>. Here “alink” means link in which the user arrived just now, “vlink” means already visited link. One can also use custom background and color for specific part of a html document by inserting tag like <font color=“blue”>….</font>, <p color=“blue”>….</p>. The color attribute can take any of the following standard color names. Aqua, Black, Blue, Fuchsia, Gray, Green, Lime, Maroon, Navy, Olive, Purple, Red, Silver, Teal, White, Yellow.
One can also use the Hexadecimal Colour Code. A hex triplet is a six-digit, three-byte hexadecimal number used in HTML, CSS, and other computing applications to represent colours. The bytes represent the red, green and blue components of the color. One byte represents a number in the range 00 to FF (in hexadecimal notation), or 0 to 255 in decimal notation.

18. Body Margin: All of the styling and display attributes of the <body> (and all other elements) have been deprecated in HTML5. Now, one can control the margins on the body using CSS. Just for example, with the <body> tag one can use the following as attributes
topmargin="0"
leftmargin="0"
rightmargin="0"
bottommargin="0"
and like that.

19. Image Tag: When one add graphics, sound, animation, video in the HTML document, than those things are actually not inserted in the HTML document rather one need to type the html commands telling the web browser where to find the media files. The following is an example of inserting an image whose name is “sristishreya-barman.jpg”
<img src="sristishreya-barman.jpg" />
If you want to control the height and width of the image then here is the code:
<img src="sristishreya-barman.jpg" height=“50” width=“100” border=“1” name=“Sristishreya Barman” alt="Sristishreya Barman">

20. Linking: The tag used to create a link is <a>, “a” stands for Anchor tag. “href” stands for Hypertext Reference and it is an attribute of the <a> tag.
a) Links Within a Page: Put the tag <a href=“#top”>Return to top</a> where the user will click and put the tag <a name=“top”></a> where one will go after clicking. In the second, the </a> tag must be included but no text between <a> and </a> is necessary. This type of links within a page is very important in creating alphabetical index and contents page of HTML document.
The new XHTML and XML standards call for to use “id” instead of “name” however if one want to be compatible with both all past and future software’s one can include both as <a name=“top” id=“top”></a>.
Note: The anchor name may be number, letter or combination of both, it is not only restricted to “top” only as in the above example.
b) Linking to Email Address: Put the tag <a href=“mailto:badanbarman@gmail.com”> badanbarman@gmail.com</a>, where the user will click. Clicking on the Email address will automatically lead the user to a new window where he/she can type his mail contents and can send the same to the person with Email address <badanbarman@gmail.com> immediately. Kindly note that the user should replace the <badanbarman@gmail.com>, with their own Email address. If feel necessary one can also use his/her actual name instead of the second Email address. Just like this <a href=“mailto:badanbarman@gmail.com”> Badan Barman</a>
c) Linking Pages that are in the Same Directory Folder: To link to other HTML pages that are within the same directory folder one need to put the name of the page to link to in quotes after “href=”,  like <a href=“index.html”>Home</a>. This tag will display the word “Home” in blue with an underline. When one click on it he/she will arrive at the page whose name is “index.html”.
d) Linking Pages that are in Different Sub Directory Folder within a Parent Directory Folder: If one has many web pages then he/she would like to place the files in different sub directory folder in such cases the linking between the pages would be slightly different. Suppose you have a folder by name “lislinks” and inside it there is a page by name “index.html”. Again there is another sub directory folder inside the “lislinks” folder by name “circular” and inside it there is a file “ugc.html”. Again, there is another sub directory folder by name “awards” inside the “lislinks” folder and it has a file name “kankana-baishya.html”. Now if you want to link from “kankana-baishya.html” document to the “index.html” document you should put the tag <a href=“../index.html”> Home</a> in the “kankana-baishya.html” document. Again, if you want to link from “index.html” document to “kankana-baishya.html” then you should place <a href=“awards/kankana-baishya.html”> Kankana Baishya </a> tag in the “index.html” document. Note that the forward slash is always used to separate different directory folder in HTML. The double dot “..” means change to directory folder.
            Again, if you want to link from “ugc.html” to “kankana-baishya.html” then you have to put <a href=“../awards/kankana-baishya.html”> Kankana Baishya </a> in the “ugc.html” document.
e) Linking to a Specific Part of Another Page: Put the tag <a href=“publication.html#2ndpart”>Full text of publish paper</a> (where “publication” is the name of the HTML page and after “# “ is the name of the anchor tag), When user will click on “Full text of publish paper” he will arrive at a particular location of the page “publication”  where <a name=“2ndpart” id=“2ndpart”></a> tag will be there.
f) Linking to Other Web Pages that are Over the Web: Clicking on the link <a href=“http://lislinks.com”> LIS Links</a> the user will arrive on the page  http://lislinks.com” just as he/she has type the internet address in his/her own web browser. Here one point can be noted is that one can leave the “http://” at the front of any address when typing it into most web browser, however one cannot leave it when one type an address into an “<a href=“”>” in the web page. Another point of consideration is that only file name is necessary to link one’s own pages but complete internet address (URL) is must in linking to other WebPages that are already available over the internet. To open a page in a new tab (window), you can use target=“_blank” like <a href=“http://lislinks.com” target=“_blank”>LIS Links</a> otherwise, you can put also put target=“_self” to compulsorily open the page in the same window.
g) Making a file Available for Downloading: The “zip”, “.exe”, “.docx” or “.doc” file can be made available for downloading just by linking to the file as done with other html file. Eg. <a href=“notice.doc”>Click her to downloaded the notice</a>. The precondition for this activity is that one should firstly upload the file on the web server.
h) Image as Hyperlink: To make an image into a click-able hyperlink, simply replace the hyperlink text with some HTML image code. For example: <a href="biodata.html"><img src="BadanBarman.jpg" /></a>. Here clicking on the image of Badan Barman you can arrived at his BioData.

21. Embed Tag: The <embed> tag is new in HTML5. It defines embedded content, such as a plug-in. The <embed> tag is supported in all major browsers.
Example
<embed src="helloworld.swf" />
Attributes: The following are the attributes of embed tag.
Attribute
Value
Description
height
pixels
Specifies the height of the embedded content
src
url
Specifies the URL of the embedded content
type
type
Specifies the MIME type of the embedded content
width
pixels
Specifies the width of the embedded content
align
center, left, right
Specifies the position of the embedded content
autostart
true, false
Specifies whether the embedded content will be played automatically or not
loop
true, false
Specifies whether the embedded content will be have the option to replay or not

22. Audio Tag: In HTML5, we have an audio tag, through which we can directly embed the piece of music we want with a very simple code. However, only three types of audio file are supported by browsers. So, to compatible with all browsers, it is a good idea to include all the three file formats inside a single audio tag. The browser will show the first recognizable format of audio.
Example
<audio src='audio.ogg' controls='controls'> </audio>
            The control attribute gives controls like pause, play and volume controls. Several other attributes like width and height of the audio window can also be set. Moreover, we can put any message between the opening and closing tags. This message will be displayed if the browser doesn't support audio.
If you want to control height and width of the audio, then here is the code.
<audio width='320' height='240' controls='controls' autoplay='autoplay' loop='loop'>
<source src='music.mp3' type='audio/mp3' />  
<source src='music.ogg' type='audio/ogg' />  
<source src='music.wav' type='audio/wav' />  
Sorry, your browser does not support the audio tag.
</audio>
            The attributes like autoplay causes the audio to play as soon as it’s get loaded. Setting loop attribute make it to replay the audio once it has finished playing.

23. Video Tag: In HTML5, we have a video element. However, only three types of video file are supported by browsers. To be compatible with all browsers, it is recommended to include all the three formats of video as source. The browser will show the first recognizable format of video.
Example
<video src='video.ogg' controls='controls'> </video>
            The control attribute gives controls like pause, play and volume controls. Several other attributes like width and height of the video window can also be set. Moreover, we can put any message between the opening and closing tags. This message will be displayed if the browser doesn't support Video.
            If you want to control the height and width of the video, then here is the code:
<video width='320' height='240' controls='controls' autoplay='autoplay' loop='loop'>  
<source src='video.mp4' type='video/mp4' />  
<source src='video.webm' type='video/webm' />  
<source src='video.ogg' type='video/ogg' />  
Your browser does not support the video tag.
</video>

24. Writing Comment in an HTML document: One can use comments in HTML to explain the function of the code, which can help editing the source code at a later date. This is especially useful when there are lots of codes. Comments are not displayed in the browsers; it is only visible in the source code. Comment tags <!-- and --> are used to insert comments in HTML. Kindly note that there is an exclamation point (!) in the opening tag, but not in the closing tag.
Example:
<!--You have to put the comment here. It will not be displayed in the browser-->

25. HTML Forms: Users don’t notice when a website works well for them because they’re too busy taking the information they came for. They do notice, however, when the pages take too long to load, the text is hard to read, some image is blinking all the time and causing a readable trouble and when they have no idea where to go next. In such cases they may like to contact the developer. To meet this end the site should contains feedback form, guest book that if filled up by the user will be mailed to the webpage developer at his/her email address. At the bottom of the home page, the email address should also be listed to encourage people to email the developer regarding link rot / broken links and such other issues. All these will help the developer in maintaining the page updated as users are supposed to report the problem they will come across in using the website.
An HTML form is a part of a webpage that includes areas where readers can enter information to be sent back to the webpage developer or the publisher of the webpage. Every form must begin with a <form> tag, which can be located anywhere in the body of the HTML document. The form tag normally has two attributes, i.e “method” and “action”. For example
<form method=“post” action=“mailto:badanbarman@gmail.com”>
Now a day “post” which means sending the form entry results as a document is a common way. However, one can also use “get” instead of “post” when submitting queries to search engine from a web form. If security is an issue, please choose POST because GET places the form parameters directly in the application URL (easily captured by network sniffers); POST can take advantage of encryption when transmitting the parameters as a separate transaction.
The action attribute specified the address to which to send the form data. One will have two options here. Firstly, one can type the “mailto:” followed by the Email address that will result sending the form data to the Email address directly. Secondly, one can type the location of a form processing program or script on a web server computer and the form data will then be sent to that program. The action “mailto:” not work properly for many people who use Microsoft Internet Explorer or Microsoft Outlook due to a bug in the Microsoft messaging system. Even when it works, the form results go to the address in a coded format that is very difficult to read. Therefore using the form processing script is the best option left. One can ask the Internet Service Provider (ISP) for a form processing script.
Note: One can also use Google Forms (https://forms.google.com), Zoho Forms (https://www.zoho.com/forms/), Feedback (http://www.freedback.com) or Survey Monkey (https://www.surveymonkey.com) to design and develop feedback or such other forms where there is a no need to write the HTML commands to design and develop a functional form. Even these services have the capacity to analyze the form themselves to provide a value addition.

26. Hit Counter: Generally many paid Web hosting services provided a details report regarding how many times each of the page was accessed, but many free hosting service does not provide the hit result, in such cases one need to set up a Common Gateway Interface (CGI) script on their server. Many Web development sites provide the code for this with details advice. Such site includes Histats.com (http://www.histats.com), Geovisite (http://www.geovisite.com/) and such other sites. One can also try Google Analytics (http://www.google.com/analytics/) that provides very insightful details about the website visitors.

27. Converting MS Word File to HTML: Simple MS Word documents can easily be converted to webpages by going through the route File -> Save As -> File Name (give a file name that should not contain blank space and special character) -> Save as type (here select “Web Page (*.htm; *.html)” or “Web Page Filtered (*.htm; *.html)”. The different between Web Page  and Web Page Filtered is that - "Web Page (*.htm; *.html)" format uses Microsoft Office specific tags to format the Web page to maintain all formatting features from the original word document while "Web Page, Filtered (*.htm; *.html)" uses only regular tags to format the Web page. Some formatting features from the original word document are lost (filtered out). Converting a word file to HTML is a convenient way in case it is needed on urgent basis. In MS Word, if there is a need, Ctrl + K command can be used to create a hyperlink.

28. Copy and Pasting HTML Tags from Other Websites: The HTML tags that are mentioned here only gives basic ideas of HTML tags, but they are not sufficient to create web pages of today. So user trying to design their own Webpages should look to other pages for some other codes or tags. There are different websites over the web with lot of prewritten HTML codes that hope to meet this kind of end. When user find a website whose tags are hope to be useful for him/her then he/she can consider of copy and pasting their HTML code to his/her own HTML document. To see HTML tags for any page on the web one need to click with the right mouse button (or hold down the mouse button if using a Macintosh computer) and then select “View source” from the popup menu. Now to copy the tag, just place the mouse pointer over the beginning of the HTML code one would like to copy.  Next, click and hold your left mouse button and drag your mouse over all the code you would like to copy. Now the code will be highlighted that only need to be copy and paste it to your own HTML document. The copy operation can also be performed by “Edit” -> “Copy” from the Notepad tool bar or by command Ctrl + C. One can also find the HTML code of a website by going through the option of “View” > “Source” in case of Internet Explorer. This type of copying the HTML tag will save considerable amount of time from the webpage developer. In Netscape Navigator and Microsoft Internet explorer one can view the HTML commands for any frame by right clicking it and selecting view frame source.

29. Conclusion: Any webmaster should give his/her emphasis to incorporate the maximum number of common elements to the pages of a website. If it is achieved then it will save a considerable amount of time.  The webmaster can try to develop one common document format, which can be applied to all document of a particular section or to the whole website.
In the above description an effort has only been made to describe how a basic website can be created at minimum cost without investing on webmaster and related software. This may not be an exhaustive writing where in one may find everything on webpage development under one roof. Further, HTML is not the only thing that one needs to create a good webpage of today. Development of website also demands the knowledge of other programming languages and software such as JAVA, PERL, etc.



How to Cite this Article?
APA Citation, 7th Ed.:  Barman, B. (2020). A comprehensive book on Library and Information Science. New Publications.
Chicago 16th Ed.:  Barman, Badan. A Comprehensive Book on Library and Information Science. Guwahati: New Publications, 2020.
MLA Citation 8th Ed:  Barman, Badan. A Comprehensive Book on Library and Information Science. New Publications, 2020.

Badan BarmanBadan Barman at present working as an Assistant Professor in the Department of Library and Information Science, Gauhati University, Guwahati-781014, Assam, India. He is the creator of the LIS Links (http://www.lislinks.com) - India’s most popular social networking website for Library and Information Science professionals. He also created the UGC NET Guide (http://www.netugc.com) and LIS Study (http://www.lisstudy.com) website.

No comments:

Post a Comment

Website Pageviews