Presentation on theme: "Introduction to HTML HTML HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a markup language."— Presentation transcript:
Introduction to HTML
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 markup tags HTML uses markup tags to describe web pages
HTML Tags HTML tags are keywords surrounded by angle brackets like HTML tags normally come in pairs like and The first tag in a pair is the opening tag, the second tag is the closing tag
HTML Documents = Web Pages HTML documents describe web pages HTML documents contain HTML tags and plain text HTML documents are also called web pages
Web Sites and HTML tags This is an example of a website that has been styled with HTML tags.
Creating your 1 st Web Page Open any text editor. Type in the HTML. Save in a.html file extension. Open in IE, Firefox or some other web browser.
Open notepad and type
Save with a.html file extension
Open the HTML document
After you save your document, the title changes on notepad Before saving After saving
File extensions – do you see them?.txt.doc.html.htm.psd.pdf.jpg.gif.xls.mp3.mp4.wav.wma
How do you show the file extensions? Tools Folder Options View Hide extensions for known file types OK
This tells the web browser where to start and stop looking. Your document always starts and stops with the and tags. The text between and describes the web page
This tag contains the title, meta, script and style tags used for more advanced formatting and effects. The text between and is not displayed in the web browser. The Head and Body does not overlap.
The title tag contains the text displayed at the top of your web browser. If the web site is bookmarked, then the will become the text for the bookmark. It is a web designer taboo to leave this tag undefined. For multi-page sites, each page title should be unique.
The text between and is visible to the people browsing your website.
Go make your own hello world web page Using your notes, go make your first website. Include a title. Include your name. Say hello.
From now on… I will just show the code between the Body tags.
HTML Headings Headings are defined with the to tags. defines the largest heading. defines the smallest heading.
Use the tag if you want a line break (a new line) without starting a new paragraph. The element is an empty HTML element. It has no end tag. Even if works in all browsers, writing instead is more future proof.
Text Formatting Tags TagDescription Defines bold text Defines big text Defines emphasized text Defines italic text Defines small text Defines strong text Defines subscripted text Defines superscripted text Defines strikethrough text Defines underlined text
Unordered Lists An unordered list is a list of items. The list items are marked with bullets. An unordered list starts with the tag. Each list item starts with the tag.
Ordered Lists An ordered list is also a list of items. The list items are marked with numbers. An ordered list starts with the tag. Each list item starts with the tag.
HTML Paragraphs Paragraphs are defined with the tag. Browsers automatically adds an empty line before and after paragraphs. You can align your paragraphs to the left, right and center positions.
HTML Rules (Lines) The tag is used to create an horizontal rule (line).
Go make your own hello world web page Unordered list Ordered list 3 horizontal rules 3 paragraphs Line brakes 5 unique test formatting