![Page 1: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/1.jpg)
HTMLHYPERTEXT
MARKUP LANGUAGE
The HTLM History
HMTL Basics
![Page 2: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/2.jpg)
TERMS TO KNOW World Wide Web (Web):The part of the
Internet that supports multimedia and consists of a collection of link documents
HTTP (Hypertext Transfer Protocol): set of rules for exchanging text, graphic, sound, video, and other multimedia files
Web Site: a related collection of web pages that is created and maintained by someone
![Page 3: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/3.jpg)
TERMS TO KNOW Web server (Host): a computer that
stores web pages and sends (serves) requested web pages
Publishing: copying web pages to a Web server so anyone who has Internet access can view it.
![Page 4: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/4.jpg)
WEB SITE TYPES
Internet• Public Access
• Share Information (personal, product, classroom, etc) with the public
Intranet• Private• Share
Information with employees or members of a group
Extranet• Select
business partners or customers
• Share information with partners or select customers with password
![Page 5: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/5.jpg)
WEB BROWSER Program that interprets and displays
web pages and enables you to view and interact with a web page
Flock
Safari (Mac)
Internet Explorer
Firefox
Opera
![Page 6: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/6.jpg)
TERMS TO KNOW URL (Uniform Resource Locator): the
address of a document or other file accessible on the Internethttp://www.scite.com/html3e/index.htm
Hyperlink (link): an element used to connect one web page to another web page on same or different server
![Page 7: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/7.jpg)
HTMLHYPERTEXT MARKUP LANGUAGE The authoring language used to create
documents on the World Wide Web. Tags or Markups: use of special
instructions to define the structure and layout of the web document
Platform independent: you can create an HTML files on one type of computer and then use a browser on another type of computer to view that file
![Page 8: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/8.jpg)
HTML HISTORY Tim Berners-Lee & Robert Calliau 1989
Developed a collection of tags that described how a document should look when viewed in a browser
Made it possible to create hyperlink s Tim Berners-Lee founded World Wide Web
Consortium 1994 Encourages universality of HTML Promotes an open forum for discussion among
Web Designers Seeks to promote standards for the evolution of
the Web to help make web accessible to everyone Regarded as the de facto organization to govern
HTML
![Page 9: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/9.jpg)
HTML VERSIONS DHTML: combination HTML, cascading
style sheets, and scripting language. Creates interactive, animated web pages
XML: uses tags to describe the structure and content of a document, not the format
XHTML: reformation of HTML so it conforms to XML rules. Combines the benefits of the display features of HTML and the stricter coding standards required by XML. Handheld devices and mobile phones can only
display XHTML code
![Page 10: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/10.jpg)
HTML VS. XHTML
![Page 11: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/11.jpg)
CREATING HTML DOCUMENTS Need an HTML Text Editor
Type the code directly in the documentNotepad or WordSave document with an extension .htm
or .html Software Application Software:
Dreamweaver, Front Page, Sausage Software HotDog
WYSIWYG (What You See Is What You Get)
![Page 12: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/12.jpg)
ELEMENTS OF A WEB PAGE
Title
Paragraph
Background
Text Links
Heading 2
Image Links
Image
Heading 1
Body
Navigation Bar
![Page 13: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/13.jpg)
NOTEPAD TEXT EDITOR Click Start button on Taskbar Type> Notepad in the search bar –
choose Notepad ++ Save files with an .html extension
index .html Filenames: can contain letters, numbers,
and underscoresCannot contain: : * ? Or spaces
To open an html file laterFile > Open > click arrow to the right of
Type > choose All > click the file you want to open
![Page 14: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/14.jpg)
HTML TAGS<DOCTYPE>: begins the web page in XHTML Indicates the version and type of HTML used;
includes a URL reference to a DTD at the W3C site.Strict: prohibits use of depreciated tags
Deprecated tags: tags that the W3C has earmarked for eventual removal; replaced with newer, more function tags.
Transitional: allows the use of deprecated tagsFramseset: used to support frames on the Web page;
allows use of deprecated tags
![Page 15: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/15.jpg)
HTML TAGS<html> </html> Indicates the start and end of an HTML
document<head> </head> Indicates the start and end of a section
of the document used for the title, keywords, metatags and other document header information.
![Page 16: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/16.jpg)
HTML TAGS<body> </body> Indicates the start and end of the Web
page body<h#> </h#> Indicates the start and end of the text
section called a heading; sizes range from the largest <h1> through smallest <h6>.
![Page 17: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/17.jpg)
HTML TAGS<p> </p> Indicates the start of a new paragraph;
inserts a blank line above the new paragraph.
![Page 18: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/18.jpg)
HTML TAGS FOR LISTS
<ul> </ul> Indicates the start and end of an unordered list
(bulleted list). There are three types of unordered lists: Type=“square”• Type=“disc” (default)o Type=“circle”
<ol> </ol> Indicates the start and end of an ordered list
(numbered list)
<li> </li> Indicates that the item that follows the tag is an item
within a list
![Page 19: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/19.jpg)
HTML TAGS FOR LISTS CONTINUED<dl> </dl>
Indicates the start and end of a definition list First line or term <dt> </dt> at the left edge; Next set tags are for the definition <dd> </dd>
are indented from the left edge
![Page 20: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/20.jpg)
HTML TAGS<hr /> Inserts a horizontal rule (line)
<hr /> default: line from left margin to right margin
<hr / size=“5”>: Increases the width of the line
<hr / size=“10” noshade>: line width increases and it doesn’t appear shaded (shaded is default)
![Page 21: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/21.jpg)
HTML TAGS<br /> Inserts a line break at the point where
the tag appears. Appears as single spacing between lines.
![Page 22: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/22.jpg)
HTML IMAGE TAGSImages can be used as the background, to
organize, or to clarify information Types of files used on the Web
GIF (Graphics Interchange Format): clipart
JPG (Joint Photographic Experts Group): photos
PNG (Portable Network Graphics): Fireworks file
Image Tag syntax
<img scr = “file name and type” any attributes />
![Page 23: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/23.jpg)
IMAGE ATTRIBUTES TAGS Align: controls alignment (bottom, middle, top,
left, or right) align=“top” Alt: allows text to be associated with image
alt=“flower pot” Border: defines the border width border=“5” Height: defines the height of the image
height=“2.5” Hspace: defines the horizontal space that
separates the image from the other text hspace=“15”
vspace: defines the vertical space that separates the image from the other text vspace=“1”
Width: defines the width of the image width=“3”
![Page 24: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/24.jpg)
COLORS IN HEXADECIMAL Predefined colors choices that can reference by
name: Silver, gray, maroon, green, navy, purple, olive, teal,
white, black, red, lime, blue, magenta, yellow, cyan Other colors use a Hexadecimal number
combination Hexadecimal is a base of 16 digits
0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f Hexadecimal colors use six digits White = ffffff (all colors) Black = 000000 (no color)
Background image tag: bgcolor=“red” bgcolor=“#fffbc6”
![Page 25: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/25.jpg)
VIEW WEB PAGEOption #1
Open the browserFile > Open > browse to file > OK
Option #2Browse to file using Computer
Multitask: Use Taskbar to switch between text editor and browser
After making changes in the text editor, click Refresh in the browser
![Page 26: The HTLM History HMTL Basics. World Wide Web World Wide Web (Web):The part of the Internet that supports multimedia and consists of a collection of](https://reader036.vdocument.in/reader036/viewer/2022062421/56649db15503460f94aa04b6/html5/thumbnails/26.jpg)
PRINTINGPrint Web page from the Browser
Click the Print icon (take a screen snipping)
Print HTML code in NotepadFile > Print (take a screen snipping)