COMPUTER TRAINING COURSE- HTML / AJAX / CSS / JAVASCRIPT

Source:- Freshersworld

What is HTML?

Hypertext Markup Language (HTML) is the main markup language for creating web pages and other information that can be displayed in a web browser.

The purpose of a web browser is to read HTML documents and compose them into visible or audible web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page.

HTML elements form the building blocks of all websites. HTML allows images and objects to be embedded and can be used to create interactive forms. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. It can embed scripts written in languages such as JavaScript which affect the behavior of HTML web pages.

Web browsers can also refer to Cascading Style Sheets (CSS) to define the appearance and layout of text and other material. The W3C, maintainer of both the HTML and the CSS standards, encourages the use of CSS over explicit presentational HTML markup.

Why HTML is Not a Programming Language ?

HTML is a type of markup language. It encapsulates, or “marks up” data within HTML tags, which define the data and describe its purpose on the webpage. The web browser then reads the HTML, which tells it things like which parts are headings, which parts are paragraphs, which parts are links, etc. The HTML describes the data to the browser, and the browser then displays the data accordingly.

How HTML is used to Navigate the Internet ?

Hypertext is text that references other web pages or text and that, when clicked on, allows the user to access the referenced text or webpage. HTML is used to embed hyperlinks within web pages. Hyperlinks allow the user to move easily within web pages and between websites stored on different servers.

HTML and the Internet: An explanation of Internet basics and how HTML functions in the Internet environment.

Ajax

AJAX stands for Asynchronous JavaScript and XML. AJAX is a new technique for creating better, faster, and more interactive web applications with the help of XML, HTML, CSS and Java Script.

Ajax uses XHTML for content and CSS for presentation, as well as the Document Object Model and JavaScript for dynamic content display.

Conventional web application trasmit information to and from the sever using synchronous requests. This means you fill out a form, hit submit, and get directed to a new page with new information from the server.

With AJAX when submit is pressed, JavaScript will make a request to the server, interpret the results and update the current screen. In the purest sense, the user would never know that anything was even transmitted to the server.

XML is commonly used as the format for receiving server data, although any format, including plain text, can be used.

AJAX is a web browser technology independent of web server software.

A user can continue to use the application while the client program requests information from the server in the background

Intuitive and natural user interaction. No clicking required only Mouse movement is a sufficient event trigger.

Data-driven as opposed to page-driven

CSS

• CSS stands for Cascading Style Sheets
• Styles define how to display HTML elements
• Styles were added to HTML 4.0 to solve a problem
• External Style Sheets can save a lot of work
• External Style Sheets are stored in CSS files

WhAT IS THE USE OF CSS?

CSS helps you to keep the information content of a document separate from the details of how to display it. The details of how to display the document are known as its style. You keep the style separate from the content so that you can:

• Avoid duplication
• Make maintenance easier
• Use the same content with different styles for different purposes

Example

Your web site might have thousands of pages that look similar. Using CSS, you store the style information in common files that all the pages share.

• When a user displays a web page, the user's browser loads the style information along with the content of the page.
• When a user prints a web page, you provide different style information that makes the printed page easy to read.

JavaScript

JavaScript is a scripting language used to create dynamic and interactive web content. It has a wide range of applications, including e-commerce (online shopping) and advertising networks such as Google AdSense

A scripting language is a lightweight programming language.

JavaScript is programming code that can be inserted into HTML pages.

JavaScript inserted into HTML pages, can be executed by all modern web browsers.

JavaScript is easy to learn.

ESSENTIAL JOB FUNCTIONS :

Builds software applications – Follows coding standards, builds appropriate unit tests, integration tests and deployment scripts

Assists in defining software architectures – Collaborates with leads to explore existing systems, determines areas of complexity, potential risks to successful implementation, learns the applications capabilities

Communicates continually with the client and project teams – Explains progress on the development effort

Owns success – Takes responsibility for successful delivery of the solutions

Translates designs and style guides provided by the UI/UX team into functional user interfaces, ensuring cross browser compatibility and performance

Contributes to continual improvement by suggesting improvements to user interface, software architecture or new technologies

REQUIRED SKILLS :

Highly skilled at front-end engineering using Object-Oriented JavaScript, various JavaScript libraries and micro frameworks (jQuery, Angular, Prototype, Dojo, Backbone, YUI), HTML and CSS

Well versed in software engineering principles, frameworks and technologies

Excellent communication skills

Self-directed team player who thrives in a continually changing environment

Strong customer service/client service skills

PPT ON INTRODUCTION TO HTML

Presentation On INTRODUCTION TO HTML
Download

INTRODUCTION TO HTML Presentation Transcript:
1.HTML

2.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.

HTML is written in the form of HTML elements consisting of tags enclosed in angle brackets (like ), within the web page content. HTML tags most commonly come in pairs like 

 (opening tag) and 

(closing tag), although some tags, known as empty elements, are unpaired, for example .

The first tag in a pair is the start tag, and the second tag is the end tag (they are also called opening tags and closing tags). In between these tags web designers can add text, tags, comments and other types of text-based content.

3.Tags
Tags
     The basic structure of an HTML document includes tags, which surround content and apply meaning to it.

    
   
     This is my first web page
    

4.Attribute
Tags can also have attributes, which are extra bits of information.

Attributes appear inside the opening tag and their values sit inside quotation marks.

They look something like
     Margarine

5.Elements
Tags tend not to do much more than mark the beginning and end of an element. Elements are the bits that make up web pages. You would say, for example, that everything that is in between (and includes) the  and  tags is the body element.

As another example, whereas “” are tags, “” is a title element.

6.HTML Tags

7.Some tags description

   
        The HTML body tag is used for indicating the main content section of the HTML document. The body tag is placed between the 

and the  tags.
 8.Some tags description



The HTML br tag is used for specifying a line break.

This is before the line break
and this after the line break.


9.Some tags description


    The HTML center tag is used to center-align HTML elements.

   This text is centered
 
10.Some tags description


The HTML base tag is used to specify a base URI, or URL, for relative links. For example, you can set the base URL once at the top of your page, then all subsequent relative links will use that URL as a starting point.

     Learn about JavaScript Arrays

Source: Power Point Presentations

PPT ON HTML

Presentation On HTML

Download

HTML Presentation Transcript:
1.What is HTML?
HTML is the "mother tongue" of your browser.

To make a long story short, HTML was invented in 1990 by a scientist called Tim Berners-Lee. The purpose was to make it easier for scientists at different universities to gain access to each other's research documents. The project became a bigger success than Tim Berners-Lee had ever imagined. By inventing HTML he laid the foundation for the web as we know it today.

HTML is a language, which makes it possible to present information (e.g. scientific research) on the Internet. What you see when you view a page on the Internet is your browser's interpretation of HTML. To see the HTML code of a page on the Internet, simply click "View" in the top menu of your browser and choose "Source".

2.HTML defines the structure and layout of a Web document by using a variety of tags and attributes. The correct structure for an HTML document starts with (enter here what document is about) and ends with . All the information you'd like to include in your Web page fits in between the and tags.

There are hundreds of other tags used to format and layout the information in a Web page. Tags are also used to specify hypertext links. These allow Web developers to direct users to other Web pages with only a click of the mouse on either an image or word(s)

3.What does H-T-M-L stand for?
HTML is an abbreviation of "Hypertext Mark-up Language" - which is already more than you need to know at this stage. However, for the sake of good order, let us explain in greater detail.

Hyper is the opposite of linear. In the good old days - when a mouse was something the cat chased - computer programs ran linearly: when the program had executed one action it went to the next line and after that, the next line and so on. But HTML is different - you can go wherever you want and whenever you want. For example, it is not necessary to visit MSN.com before you visit HTML.net.

Text is self-explanatory.

4.Mark-up is what you do with the text. You are marking up the text the same way you do in a text editing program with headings, bullets and bold text and so on.

Language is what HTML is. It uses many English words.

5.Elements and tags 
You are now ready to learn the essence of HTML: elements
.
Elements give structure to a HTML document and tells the browser how you want your website to be presented. Generally elements consists of a start tag, some content, and an end tag.

6."Tags"?
Tags are labels you use to mark up the beginning and end of an element.
All tags have the same format: they begin with a less-than sign "<" and end with a greater-than sign ">".
Generally speaking, there are two kinds of tags - opening tags: and closing tags: . The only difference between an opening tag and a closing tag is the forward slash "/". You label content by putting it between an opening tag and a closing tag.
HTML is all about elements. To learn HTML is to learn and use different tags.

7.Example 1: 
Emphasised text.
Will look like this in the browser:
Emphasised text.
This text is bigger.
This text is bigger.

8.Example 2: 

This is heading 1

THIS IS HEADING 2

This is heading 3

This is heading 4

This is heading 5

This is heading 6

This is heading 1
This is heading 2
This is heading 3
This is heading 4
This is heading 5
This is heading 6

9.So, I always need an opening tag and a closing tag?

As they say, there's an exception to every rule and in HTML the exception is that there are a few elements which both open and close in the same tag. 
These so-called empty elements are not connected to a specific passage in the text but rather are isolated labels, for example, a line break which looks like this:
.
10.Should tags be typed in uppercase or lowercase?
Most browsers might not care if you type your tags in upper, lower or mixed cases. , or will normally give the same result. However, the correct way is to type tags in lowercase. So get into the habit of writing your tags in lowercase.

Source: Power Point Presentations