HTML
When to use GET (Forms)
the default method when submitting form data is GET. However, when GET is used, the submitted form data will be visible in the page address field. Get must not be used when sending sensitive information. Also has size limitations.
Change HTML to XHTML
1. Add an XHTML <!DOCTYPE> to the first line of every page 2. Add an xmlns attribute to the html element of every page 3. Change all element names to lowercase 4. Close all empty elements 5. Change all attribute names to lowercase 6. Quote all attribute values.
DocType Declaration
<!DOCTYPE html> <html> <head> <title></title> </head> <body> </body> </html> helps the browser determine what type of HTML document it's trying to parse and display.
Make a Dead Link
<a href "#"></a>
Abbreviation Element
<abbr title=" ">Abbreviation</abbr>
Address Element
<address>
Audio Element
<audio controls> <source src="horse.ogg" type="audio/ogg"> <source src="horse.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio>
Block Quote Element
<blockquote cite="URL">
Body Tag
<body>
Line Break
<br> inserts a line break without starting a new paragraph. Has no end tag.
Computer Code
<code> element defines a fragment of computer code. Text surrounded by <code> tags is typically displayed in the browser's default monospace font. Does not preserve extra whitespace and line-breaks.
Data List Element
<datalist> element specifies a list of pre-defined options for an <input> element. Users will see a drop-down list of the pre-defined options as they input data.
Emphasis Tag (Italics)
<em>
Grouping Form Data with FieldSet
<fieldset> element is used to group related data in a form. <legend? element defines a caption for the <fieldset> element.
Form Tag
<form> element defines a form that is used to collect user input. An HTML form contains form elements.
Heading Tag
<h1> Browsers automatically add a margin before and after a heading
Heading Tag
<h1>. heading sizes go all the way from h1 to h6.
Head Tag
<head>
Horizontal Rule
<hr> Used to separate content, or define a change in an HTML document. Places a line through the page
Image Tag
<img src="" alt="Rabbit with lop ears in barn" width = "" height = "">(should specific either width or height, not both.)
Radio Button for Forms
<input type="radio"> defines a radio button (for selecting one of many choices.)
Submit Button for Forms
<input type="submit"> defines a submit button (for submitting the form). Submits the form data to a form-handler, which is typically a server page with a script for processing input data.
Text Input for Forms
<input type="text"> defines a one-line text input field. Default width of a text field is 20 characters.
Input Element
<input> element is the most important form element. can be displayed in several ways, depending on the type attribute.
Keyboard Input
<kbd> element represents user input, like keyboard input or voice commands. Text surrounded by <kbd> tags is typically displayed in the browser's default monospace font.
List Item Tag
<li>
Highlighted text Element
<mark>
No Script Tag
<noscript> tag is used to provide an alternate content for users that have disabled scripts in their browser or have a browser that doesn't support client-side scripts.
Ordered List Tag
<ol>
Output Element
<output> element represents the result of a calculation (like one performed by a script.)
Paragraph Tag
<p>
Short Quote Element
<q>
Program Output
<samp> element represents output from a program or computing system. Text surrounded by <samp> tags is typically displayed in the browser's default monospace font.
Script Tag
<script> tag is often used to define a client-side script (Javascript). The <script> element either contains scripting statements, or it points to an external script file through the src attribute. Common uses for Javascript are image manipulation, form validation and dynamic changes of content.
Select Element
<select> element defines a drop-down list.<select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select>
Strong Tag (Bold)
<strong>
Table tag
<table style="width:100"> <tr> <th></th> </tr> <tr> <td></td> </tr>
Style Attribute
<tagname style="property:value;">
Table Data/Cell Tag
<td>
Text Area Element
<textarea> element defines a multi-line input field(text area). <textarea name="message" rows="10" cols="30"> The cat was playing in the garden. </textarea>
Table Heading Tag
<th>
Title Tag
<title>
Table Row Tag
<tr>
Unordered List Tag
<ul>
Variables
<var> element defines a variable. Could be a variable in a mathematic expression or a variable in programming context.
Video Element
<video><video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>
Client
A computer that is requesting files from a server.
Head
Contains information about the html file. User does not see.
Relative Path
Describes how to find a file from a directory that is not the root directory.
Name Attribute(Forms)
Each input field must have a name attribute to be submitted. If the name attribute is omitted, the data of that input field will not be sent at all.
XHTML Elements
Elements must be properly nested. Elements must always be closed, in lowercase. All documents must have at least one root element.
Local Paths
Every file has an address, which we call the "path." An absolute path is written in relation to the computer's root directory. /Users/cameron/Documents/file.txt. This URL will only work on the home computer.
HTML Plug-ins
Extend the standard functionality of a web browser. Can be added to web pages with the <object> tag or the <embed> tag.
XHTML
Extensible Hypertext Markup Language. Almost identical to HTML, but stricter.
FTP
File Transfer Protocol. Downloading or uploading files.
Absolute File Path
Full URL to an internet file. <img src="https://www.w3schools.com/images/picture.jpg" alt="Mountain">
HTTP
HyperText Transfer Protocol. Used for common web pages, not Encrypted.
HTML
HyperText("text with links in it") Markup Language.
Tags
In HTML a tag is used for creating an element. The name of an HTML element is the name used in angle brackets such as <p> for paragraph. End tags are preceded by a slash character "</p>
Javascript
Makes HTML pages more dynamic and interactive.
XHTML Attributes
Names must be in lowercase, attribute values must be quoted, and attribute minimization is forbidden.
Commenting in HTML
Opening: <!- - Closing: - - >
Nesting
Placing one HTML tag inside of another.
Markup Language
Programming language used to make text do more than just sit on a page. Turns texts into images, links, tables, lists and more.
Figure Element
Represents self-contained content, frequently with a caption <figcaption>. Usually a <figure> is an image, illustration, diagram, code snippet etc. that is referenced in the main flow of a document, but can be moved to another part of the document or to an appendix without affecting the main flow.
HTTPS
Secure HyperText Transfer Protocol. Secure Web Pages, Encrypted.
Object Element
Supported by all browsers, defines and embedded object within an HTML document. Used to embed plug-ins (likes Java applets, PDF readers, Flash Players) in web pages. <object width="400" height="50" data="bookmark.swf"></object>
Embed Element
Supported in all major browsers, defines an embedded object within an HTML document. Web browsers have supported the <embed> element for a long time. However, it has not been a part of the HTML specification before HTML5. <embed width="400" height="50" src="bookmark.swf">
Boilerplate Code
The basic HTML code required to begin creating a webpage.
Server
The computer responsible for providing a website's files. Servers run software that exposes files to the web. They have an external path that anyone can access and is the reason why the web works.
Autoplay Attribute
To start a video automatically. <video width="320" height="240" autoplay>
Why Use XHTML?
Today's market consists of different browser technologies; some that run on computers, or mobile phones, etc. XML is a markup language where documents must be marked up correctly.
URL
Uniform Resource Locator: used to address a document(or other data) on the web. syntax rules: scheme://prefix.domain:port/path/filename
IFrame
Used to display a webpage within a web page. <iframe src="url of inline webpage"></iframe>
Anchor Tag
Used to link content outside of the current page.
XHTML Document Structure
XHTML DOCTYPE is mandatory. The xmlns attribute in <html> is mandatory(<html xmlns="http://www.w3.org/1999/xhtml">), and <html>, <head>,<title>, and <body> are all mandatory.
Attribute
a characteristic or description for some content in the element.
File
a file on your computer.
Path
a way of describing where a file is stored. There are local paths and external paths.
When to use POST(Forms)
always use post if the form data contains sensitive or personal information. the POST method does not display the submitted form data in the page address field. Has no size limitations, and can be used to send large amounts of data.
Body
contains content, such as text, images and links. the content in the body is what will be visible on the actual page.
Prefix
defines a domain prefix(default for http is www).
Path
defines a path at the server (if omitted: the root directory of the site)
Option Element
defines an option that can be selected. By default, the first item in the drop-down list is selected.<option value="fiat" selected>Fiat</option>
Pre Element
defines pre-formatted text. the text inside this element is displayed in a fixed-width font, and preserves both spaces and line breaks.
Domain
defines the Internet domain name(like w3schools.com)
Action Attribute
defines the action to be performed when the form is submitted. Normally the form data is sent to a web page on the server when the user clicks on the submit button. If the action attribute is omitted, the action is set to the current page. <form action="/action_page.page.php">
Filename
defines the name of a document or resource.
Port
defines the port number at the hose (default for http is 80)
Cite Element
defines the title of a work. <cite>
Scheme
defines the type of internet service(most common is http or https).
HTML File Paths
describe the location of a file in a web site's folder structure. Used when linking to external files like web pages, images, style sheets and JavaScripts.
Form Elements
different types of input elements, like text fields, checkboxes, radio buttons, submit buttons and more.
Using Javascript to Change HTML Content
document.getElementById ("demo").innerHTML = "What you would like to change it to.";
Using Javascript to Change HTML Attributes
document.getElementById ("image").src = "picture.gif"
Using Javascript to Change HTML Styles
document.getElementById ('"demo").style.fontSize = "new value" document.getElementById ("demo").style.color = "new value"; document.getElementById ("demo").style.backgroundColor = "new value";
How Javascript Selects an HTML Element
document.getElementById("demo")
Relative File Paths
points to a file relative to the current page.
Method Attribute
specifies the HTTP method (GET or POST) to be used when submitting the form data. <form action="/action_page.php" method="get"> <form action="/action_page.php" method="post">
