Overview of HTML.pdf

Overview of HTML The Beginning of HTML  Hyper Text Markup Language ? HTML is a Language for describing web WHAT pages HTML is not a programming language, it is a markup language IS HTML A markup language is a s...

Overview of HTML The Beginning of HTML  Hyper Text Markup Language ? HTML is a Language for describing web WHAT pages HTML is not a programming language, it is a markup language IS HTML A markup language is a set of markup tags HTML uses markup tags to describe web pages INTRODUCTION OF HTML HTML (Hyper Text Markup Language) is used to create documents on the World Wide Web. It is simply a collection of certain keywords called ‘Tags” that are helpful in writing the documents to be displayed using a browser on internet. It is a platform independent language that can be used on any platform such as Windows, Linux, Macintosh, and so on. INTRODUCTION OF HTML HTML also provides tag to make the document look attractive using graphics, font size and colors. User can make a link to the other document or the different section of the same document by creating Hypertext Links also known as Hyperlinks.  HTML is the lingua franca for publishing hypertext documents on the World Wide Web. Modern, web-based Hypertext started with THE Timothy John Berner’s Lee at CERN (European Laboratory for Particle Physics) in BEGINNING Geneva Switzeland. In 1989, Lee’s paper “Information Management: A Proposal” outline the needs OF HTML for an internet-based hypertext protocol that will overcome “geographical dispersions” of researchers in sharing papers and materials.  In 1990, his proposal was reformulated with the help of Robert Caillian and the name World Wide Web was born. The forerunner of Web browsers implementing the ideas of Tim Berner-Lee was the first apha version of “Mosaic X”, released in February 1993 by Marc Andersen and his team In august 1993, the same team released the free version of Mosaic for Macintosh and Windows OS.  Create, save and view HTML document Format a web page using section OBJECTIVE heading tags Describe Ordered and Unordered lists OF HTML Explain graphics in HTML document Describe hypertext link and making text/image link  World Wide Web ? World Wide Web abbreviated as WWW or W3 and commonly known as Web WHAT WWW is a system of interlinked hypertext documents accessed via the IS WWW internet. With a web browser, one can view web pages that may contain text, images, videos, and other multimedia and navigate between them via hyperlinks BROWSING THE WORLD WIDE WEB Behind the beauty and elegance of these pages and codes that make things happen, the browser interprets these codes written Hypertext Markup Language so that information is displayed properly. In effect, browser like Microsoft Internet Explorer and Netscape Navigator serve at translator of HTML codes to produce the “screen image” of web pages. BROWSING THE WORLD WIDE WEB By definition, HTML or Hypertext Markup Language is a set of words, symbols and rules over the use of these words and symbols, under which web pages are design and displayed. A Web Page, on the other hand, is the product of an HTML documents as seen within the environment of a browser. Web pages are more “physical” and graphical while HTML documents are mainly instructions for producing a desired page. WHAT a good web-browser (Chrome ? or Microsoft Edge) TOOLS a good text editor like: ○ VSCode (cross platform) DO WE ○ Notepad++ (win) ○ textWrangler (osx) NEED TO ○ sublime text (cross platform) ○ ecode (cross platform) START WHAT ARE THE 3 LANGUAGES DEVELOPERS MUST LEARN? HTML to create the document structure and content CSS to control is visual aspect Javascript for interactivity  HTML CSS Javascript BROWSERS AS RENDERER Browser's act as a renderer that takes documents and construct a visual representation of them. Starting with the most simple one, a text document, it will try to visualize it. You can try, drop any.txt file into your browser to visualize it. The problem is that text documents without any formatting tend to be hard to read for the user (and quite boring). That's why HTML was created, to give text some format. MARKUP LANGUAGE There are many markup languages that add special tags into the text that the renderer won't show but use to know how to display the text. In HTML this tags use the next notation: My name is Javi HTML The HTML allow us to define the structure of a document or a website. HTML is NOT a programming language, it’s a markup language, which means its purpose is to give structure to the content of the Hi website, not to define an algorithm. It is a series of nested tags that contain all the website information (like texts, images and videos). Here is an example of tags: This is a title The HTML defines the page structure. A website can have several HTMLs to different pages. HTML: main tags Although there are lots of tags in the HTML specification, 99% of the webs use a subset of HTML tags with less that 10 tags, the most important are: : a container, usually represents a rectangular area with information inside. : an image : a clickable link to go to another URL : a text paragraph : a title (h2,h3,h4 are titles of less importance) : a widget to let the user introduce information and : to insert CSS rules : to execute Javascript : a null tag (doesn't do anything), good for tagging info HTML: other interesting tags There are some tags that could be useful sometimes: : to create a button : for playing audio : to play video : to draw graphics from javascript : to put another website inside ours HTML: wrapping the info We use HTML tags to wrap different information on our site. The more structure has the information, the easier will be to access it and present it. We can change the way the information is represented on the screen depending on the tags where it is contained, so we shouldn't be worried about using too many tags. HTML: tagging correctly Try to avoid doing this: Do this instead Title Title Here is content. Here is some content Here is more content Here is more content D O THIS T DON