HTML

Página 1

HTML Tags

<!DOCTYPE html> — document type declaration (for HTML5)

<html> </html> — marks beginning and ending of html document (required)

optional attribute:

lang — declares page language; useful for screen readers and search engines (ie lang=“en-US”)

<head> </head> — container which holds metadata (data about the HTML document which is not displayed)

<body> </body> — marks beginning and ending of visible content (required)

<script></script> — JavaScript code can be stored directly within HTML document as long as it is entered between these tags (tags can be placed in head or body depending on page load needs)

<h1> </h1> to <h6> </h6> — defines heading elements, h1 is largest/most important, (2,3,4,5,..) h6 is smallest, least important

semantic tag

users skim by headings — significant for structure

search engines index structure/content of webpages by headings

<hr> — defines thematic break in content (semantic, not presentational) — depending on the browser, may still display a horizontal line to emphasize the break

<br> — enters a single line break to displayed content

<pre> </pre> — defines pre-formatted text content — displays in fixed-width font and preserves spaces and line breaks (good for code, poems, etc)

<p> </p> — defines paragraph element

optional attribute:

style — specifies styling (color, font, size, etc)

title — adds title to element (appears upon mouse-over)

<a> </a> — defines link element

common attribute : href — set equal to the web address you are linking housed in quotes

<a href=“http:\\www.google.com”> GOOGLE </a>

text between opening/closing tags is the visible text with hyperlink

<b></b> — bold text [formatting]

<strong></strong> — important text (may be bolded) [semantic]

<i></i> — italicize text [formatting]

<em></em> — emphasized text (may be italicized) [semantic]

<small> </small> — formats text smaller than surrounding

<mark></mark> — highlights text

<del></del> — strikes-through text (deleted) [use for updates/modifications]

attributes:

cite — specifies URL that explains why text was insert

datetime — provides date of change

<ins></ins> — inserted text (pairs with <del> to show what replaced deleted text) — displays with underline [use for updates/modifications]

attributes:

cite — specifies URL that explains why text was insert

datetime — provides date of change

 — subscripted text

 — superscripted text

<img> — defines image element **no closing tag**

common attributes:

src — source; contains link/path to image

alt — alternative text; text to appear when image cannot render

width — defines width of image element

height — defines height of image element

<button> </button> — defines button element

text between opening/closing is visible on the button

<li> </li> — defines list items

child elements of <ul> or <ol> elements to specify items on each list

<ul> </ul> — defines unordered list element (bulleted)

<ol> </ol> — defines ordered list element (numbered/lettered)

<table></table> — defines table element

<tr></tr> — defines table row, should be child element of <table>

<th></th> — defines table header element, should be child of <table>, creates the header for each column in table

<td></td> — defines table data/cell (define individual cells on each row rather than who columns a time); should be child of <tr>

<form></form> — defines form element

<input> — defines input element

common attributes:

type — specifies format for input (text, radio, submit)

Página 2