Hyper Text Markup Language.  My First Heading My first paragraph. Example Explained The DOCTYPE declaration defines the document type The text between.

Slides:



Advertisements
Similar presentations
HTML I. HTML Hypertext mark-up language. Uses tags to identify elements of a page so that a browser such as Internet explorer can render the page on a.
Advertisements

HTML Basics Customizing your site using the basics of HTML.
Introduction to HTML & CSS
Internet Services and Web Authoring (CSET 226) Lecture # 5 HyperText Markup Language (HTML) 1.
Ideas to Layout Beginning web layout using Cascading Style Sheets (CSS). Basic ideas, practices, tools and resources for designing a tableless web site.
Hyper Text Markup Language.  HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is not a programming language,
WeB application development
Website Design.
ASHIMA KALRA.  WHAT IS HTML WHAT IS HTML  HTML TAGS HTML TAGS  FORMATTING TAGS FORMATTING TAGS.
INTRODUCTION TO HYPERTEXT MARKUP LANGUAGE 1. Outline  Introduction  Markup Languages  Editing HTML  Common Tags  Headers  Text Styling  Linking.
1 eVenzia Technologies Learning HTML, XHTML & CSS Chapter 1.
Hypertext Markup Language. Platform: - Independent  This means it can be interpreted on any computer regardless of the hardware or operating system.
Made by: Dan Ye. Introduction Basic Last Page ☆ HTML stands for Hyper Text Markup Language; ☆ HTML is not a programming language, it is a markup language;
Chapter 2 Introduction to HTML5 Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
HTML BASIC
Computer Sciences Department
Review HTML  What is HTML?  HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is not a programming language,
Basics of HTML.
Multimedia and Web Technology Prepared by: Asst. Prof. Maryam Eskandari.
Chapter 2: The Client Side: HTML CIS 275—Web Application Development for Business I.
HTML. What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is a markup language A markup language.
Ku-Yaw Chang Assistant Professor, Department of Computer Science and Information Engineering Da-Yeh University.
DAT602 Database Application Development Lecture 14 HTML.
Programming in HTML.  Programming Language  Used to design/create web pages  Hyper Text Markup Language  Markup Language  Series of Markup tags 
HTML Structure & syntax
ACM 511 HTML Week -1 ACM 511 Course Notes. Books ACM 511 Course Notes.
Essential Tags Web Design – Sec 3-3 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course materials.
All Web pages are written with some form of HTML (HyperText Markup Language). HTML documents are saved as Text Only files so virtually any computer can.
HTML INTRODUCTION, EDITORS, BASIC, ELEMENTS, ATTRIBUTES.
HTML. WHAT IS HTML HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a markup language A markup language is a set of.
Introduction to HTML. HTML Hyper Text Markup Language Page Title My First Heading My first paragraph. Page Title My First Heading My first paragraph.
Programming in HTML.  Programming Language  Used to design/create web pages  Hyper Text Markup Language  Markup Language  Series of Markup tags 
Introduction to HTML. What is a HTML File?  HTML stands for Hyper Text Markup Language  An HTML file is a text file containing small markup tags  The.
Introduction to HTML. What is HTML? Hyper Text Markup Language (HTML) is a language for describing web pages. HTML is not a programming language, it is.
Basic HTML PowerPoint How Hyper Text Markup Language Works
Hypertext Mark-Up Language Web Page Creation HTML.
XP Tutorial 9 1 Working with XHTML. XP SGML 2 Standard Generalized Markup Language (SGML) A standard for specifying markup languages. Large, complex standard.
CSC 330 E-Commerce Teacher Ahmed Mumtaz Mustehsan Ahmed Mumtaz Mustehsan GM-IT CIIT Islamabad GM-IT CIIT Islamabad CIIT Virtual Campus, CIIT COMSATS Institute.
HTML Structure & syntax. Introduction This presentation introduces the following: Doctype declaration HTML Tags, Elements and Attributes Sections of a.
HTML: Hyptertext Markup Language Doman’s Sections.
Introduction HTML (Hypertext Markup Language) is used to create document on the World Wide Web. HTML is not a programming language, it is a markup language.
HTML Basics Let’s Make a Web Page. What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is not a.
Ali Alshowaish. What is HTML? HTML stands for Hyper Text Markup Language Specifically created to make World Wide Web pages Web authoring software language.
Lecture: Web Design Assis. Prof. Freshta Hanif Ehsan Faculty of Computer Science Kabul Polytechnic University Spring Semester
HTML Basics Computers. What is an HTML file? *HTML is a format that tells a computer how to display a web page. The documents themselves are plain text.
HTML Basic. What is HTML HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is not a programming language, it.
Introduction to HTML Year 8. What is HTML O Hyper Text Mark-up Language O The language that all the elements of a web page are written in. O It describes.
©SoftMoore ConsultingSlide 1 Introduction to HTML: Basic Document Structure.
HTML Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.
WEEK -1 ACM 262 ACM 262 Course Notes. HTML What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML.
Objective: To describe the evolution of the Internet and the Web. Explain the need for web standards. Describe universal design. Identify benefits of accessible.
HTML HYPER TEXT MARKUP LANGUAGE. INTRODUCTION Normal text” surrounded by bracketed tags that tell browsers how to display web pages Pages end with “.htm”
What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a markup.
HTML-I Basic HTML Elements. HTML (Hyper Text Markup Language) HTML is a document layout and hyperlink- specification language. i.e. a language used to.
HTML. INDEX Introduction to HTML Creating Web Pages Commands And Tags Web Page.
HTML Tutorial. What is HTML HTML is a markup language for describing web documents (web pages) HTML documents are described by HTML tags Each HTML tag.
1 Introduction to HTML. 2 Definitions  W W W – World Wide Web.  HTML – HyperText Markup Language – The Language of Web Pages on the World Wide Web.
Blended HTML and CSS Fundamentals 3 rd EDITION Tutorial 1 Using HTML to Create Web Pages.
HTML Structure & syntax
HTML Structure & syntax
Basic HTML Introduction to HTML.
Pertemuan 1 Desain web Pertemuan 1
HTML.
Internet Technologies I - Lect.01 - Waleed Ibrahim Osman
Understand basic HTML and CSS terminology, concepts, and basic operations. Objective 3.01.
Web Application Development
Pertemuan 1 Desain web Pertemuan 1
HTML Structure & syntax
HTML Introduction.
Presentation transcript:

Hyper Text Markup Language

 My First Heading My first paragraph. Example Explained The DOCTYPE declaration defines the document type The text between and describes the web page The text between and is the visible page content The text between and is displayed as a heading The text between and is displayed as a paragraph

 HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is a markup language  A markup language is a set of markup tags  The tags describes document content  HTML documents contain HTML tags and plain text  HTML documents are also called web pages

 HTML markup tags are usually called HTML tags  HTML tags are keywords (tag names) surrounded by angle brackets like  HTML tags normally come in pairs like and  The first tag in a pair is the start tag, the second tag is the end tag  The end tag is written like the start tag, with a forward slash before the tag name  Start and end tags are also called opening tags and closing tags

 "HTML tags" and "HTML elements" are often used to describe the same thing.  But strictly speaking, an HTML element is everything between the start tag and the end tag, including the tags:  HTML Element:  This is a paragraph.

 The purpose of a web browser (such as Google Chrome, Internet Explorer, Firefox, Safari) is to read HTML documents and display them as web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page:

 Since the early days of the web, there have been many versions of HTML: VersionYear HTML1991 HTML+1993 HTML HTML HTML XHTML HTML52012 XHTML52013

 The declaration helps the browser to display a web page correctly.  There are many different documents on the web, and a browser can only display an HTML page 100% correctly if it knows the HTML type and version used.

 HTML5   HTML 4.01   XHTML 1.0 

 Bgcolor  Background  Topmargin  Leftmargin  Rightmargin  bottommargin

  Align  left,right,center

 The comment tag is used to insert comments in the source code. Comments are not displayed in the browsers.  You can use comments to explain your code, which can help you when you edit the source code at a later date. This is especially useful if you have a lot of code.  It is also a good practice to use the comment tag to "hide" scripts from browsers without support for it (so they don't show them as plain text): 

 The declaration must be the very first thing in your HTML document, before the tag.  The declaration is not an HTML tag; it is an instruction to the web browser about what version of HTML the page is written in.  In HTML 4.01, the declaration refers to a DTD, because HTML 4.01 was based on SGML. The DTD specifies the rules for the markup language, so that the browsers render the content correctly.  HTML5 is not based on SGML, and therefore does not require a reference to a DTD. 

 HTML 5   HTML 4.01 Strict  This DTD contains all HTML elements and attributes, but does NOT INCLUDE presentational or deprecated elements (like font). Framesets are not allowed.   HTML 4.01 Transitional  This DTD contains all HTML elements and attributes, INCLUDING presentational and deprecated elements (like font). Framesets are not allowed. 

 HTML 4.01 Frameset  This DTD is equal to HTML 4.01 Transitional, but allows the use of frameset content.   XHTML 1.0 Strict  This DTD contains all HTML elements and attributes, but does NOT INCLUDE presentational or deprecated elements (like font). Framesets are not allowed. The markup must also be written as well-formed XML. 

 XHTML 1.0 Transitional  This DTD contains all HTML elements and attributes, INCLUDING presentational and deprecated elements (like font). Framesets are not allowed. The markup must also be written as well-formed XML.   XHTML 1.0 Frameset  This DTD is equal to XHTML 1.0 Transitional, but allows the use of frameset content.   XHTML 1.1  This DTD is equal to XHTML 1.0 Strict, but allows you to add modules (for example to provide ruby support for East-Asian languages). 

 Writing HTML Using Notepad or TextEdit  HTML can be edited by using a professional HTML editor like:  Adobe Dreamweaver  Microsoft Expression Web  CoffeeCup HTML Editor  However, for learning HTML we recommend a text editor like Notepad (PC) or TextEdit (Mac). We believe using a simple text editor is a good way to learn HTML.

 To start Notepad go to:  Start All Programs Accessories Notepad

 Type your HTML code into your Notepad:

 Select Save as.. in Notepad's file menu.  When you save an HTML file, you can use either the.htm or the.html file extension. There is no difference, it is entirely up to you.  Save the file in a folder that is easy to remember.

 Start your web browser and open your html file from the File, Open menu, or just browse the folder and double-click your HTML file.  The result should look much like this:

 Attribute  Color  Size  Face

 Attributes  Width  Height  border

 #6699ff

 Bgcolor  Scrollamount  Width  Height  Direction (up,down,left,right)  Loop

 List item 1 List item 2 List item 3

 Attributes  Start  TypeA,a,i,I,1   one  two 

 Attributes  Start  Typecircle,square,disc   one  two 

 Definition Description, Definition List, Definition List   Definition Term Definition of the term Definition Term Definition of the term

 The tag defines an embedded object within an HTML document. Use this element to embed multimedia (like audio, video, Java applets, ActiveX, PDF, and Flash) in your web pages.  You can also use the tag to embed another webpage into your HTML document.  You can use the tag to pass parameters to plugins that have been embedded with the tag. 

 Attributes  bgcolor  Width  Height  Cellspacing  Cellpadding  background

 The tag defines a hyperlink, which is used to link from one page to another.  Clickme   By default, links will appear as follows in all browsers:  An unvisited link is underlined and blue  A visited link is underlined and purple  An active link is underlined and red

 HTML Tag. Not Supported in HTML5 

 The tag is used to define style information for an HTML document.  Inside the element you specify how HTML elements should render in a browser.  Each HTML document can contain multiple tags.

 h1 {color:red;} p {color:blue;} A heading A paragraph.

 The tag specifies a section that is quoted from another source.  The tag is not supported in HTML5. Use CSS instead.  For 50 years, WWF has been protecting the future of nature. The world’s leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.

  Action  Methodpost/get

  (rows,cols)   (allow=multiple) for list  Size to define number of fields 

 The tag is used to group related elements in a form.  The tag draws a box around the related elements.  Personalia: Name: Date of birth:

 The tag is used to define a client-side image-map. An image-map is an image with clickable areas.  The required name attribute of the element is associated with the 's usemap attribute and creates a relationship between the image and the map.  The element contains a number of elements, that defines the clickable areas in the image map.