C779 - Web dev foundations.

<meta>

Example: <meta name="description" content="Enter webpage description here"> Specifies various metadata about the document. This can include keywords to help search engines index the page, revision dates, and a document description.

Common reasons for server-side scripts:

Database connectivity. Cookie creation and identification. Logon scripts. File uploading and downloading. Hit counters. Browser detection.

<blockquote>

Defines a block of text that is a direct quotation, utilizing an indented block. Blockquotes can CONTAIN paragraphs, but cannot themselves reside in a paragraph container. Do not use <h1> type tags inside of <blockquote> containers.

Responsive Design

Designing a website so that it changes depending on the device it is displayed on, allowing a comfortable experience on small monitors, large monitors, mobile phones, and tablets. Is not static, but dynamic.

Active Server Pages (ASP)

Microsoft's original server-side scripting solution, which utilized VBscripts to create ASP applications. ASP has largely been supplanted by .NET. PHP is considered an alternative to ASP. <%@ LANGUAGE=vbscript %>

block-level element

A markup element that affects at least an entire paragraph. Block-level elements are automatically preceded and followed by paragraph breaks.

Text-level element

A markup element that affects single characters or words (bold, italics, etc). Text-level elements will not add a paragraph break.

Standard Generalized Markup Language (SGML)

A metalanguage used to create other languages, including HTML and XHTML. Organizes concepts separately from their visual representation. With SGML, you can describe how data elements in a document relate to one another. SGML is NOT designed to format how that data appears or is styled. SGML requires that you create, or define, your own document language rules. This set of language rules is called the Document Type Definition, or DTD.

<dfn>

A phrase element that defines a definition term, and will italicize it. Example: <dfn title="HyperText Markup Language"> HTML </dfn> In the above, the word HTML would appear. If the user hovered above the word HTML, the definition (title) would show, in this case, HyperText Markup Language.

<samp>

A phrase element that defines sample output from a computer program.

<code>

A phrase element used for program code examples. Has a fixed-space font.

<var>

A phrase element used to define a variable. Will italicize it and make it appear better for math purposes.

<kbd>

A phrase element which defines keyboard input. Example: <p>Press <kbd>Ctrl</kbd> + <kbd>C</kbd> to copy text (Windows).</p> The above example would display: Press Ctrl+C to copy text (Windows).

What You See Is What You Get (WYSIWYG)

A phrase used to describe GUI editors for HTML (Dreamweaver, Web Designer, etc). You use a GUI to 'create' the code, and don't have to write the code yourself.

H.265

A potential successor to H.264. It supports up to 8k resolution videos, and is positioned to become one of the best codecs for 4k. Many systems do not support H.265, so when used, it is advised that alternative codecs also be made available.

Web Accessibility Initiative (WAI)

A program for developing strategies, guidelines, and resources to help make the Web accessible to people with disabilities

Common Gateway Interface (CGI)

A program that processes data submitted by the user. Allows a Web server to pass control to a software application, based on user request. The application receives and organizes data, then returns it in a consistent format.

Go (Golang)

A programming language by google, first shown in 2009, and initially released in 2012. Go is relatively new, and hence has a smaller base than other programming languages. It has been gaining traction in recent years The primary goal of Go is production speed. It does not use a Virtual Machine like languages such as Java use, and instead compiles directly to machine code. As such, large scale projects can be compiled quite quickly. Projects in Go are inherently cross-platform. By default, they only produce a single executable file without any other necessary files (or dependencies), which makes distribution easy. Drawbacks to Go include a lack of support for fairly common features, such as generic typing, function overloading, exceptions, and inheritance. Go also suffers from sub-standard runtime safety.

Multipurpose Internet Mail Extensions (MIME)

A protocol that enables operating systems to map file name extensions to corresponding applications. Also used by applications to automatically process files downloaded from the Internet.

Extensible Hypertext Markup Language (XHTML)

A reformulation of HTML formatting so it conforms to XML structure and content rules. XHTML 1.0 had three separate DTDs which corresponded to the three HTML 4.01 variants (Transitional, strict, and Frameset). XHTML 5 uses a DOCTYPE declaration without a DTD. XML serialization of HTML5.

H.264

MP4 frequently uses this codec. H.264 has native support from most browsers that support HTML5. It uses less processor and battery power, as it does't require a plug-in.

Escape sequence for Copyright

&copy; OR &#169;

Escape sequence for Trademark

&reg OR &#174

CSS rule

A selector, property, and value, all grouped together. The below example is a rule. It specifies that the background color of the body be set to black, while the text is set to white. body { background-color:black; color:white; }

Navigating a directory

/mysite/aboutus.html The / tells the browser to locate a folder named mysite, located off of the root directory. In Windows terms, it is saying look at the root folder (C:\), and find a directory there called mysite. mysite/aboutus.html The lack of any initial characters tells the browser to look for the mysite subdirectory, which begins at the same level as the current directory. ../mysite/aboutus.html The initial two periods and forward slash instruct the browser to look for a directory named mysite which will begin one directory above the current directory.

Escape Sequence

A sequence of code that represents a special character. & (code for the specific character) ; Example: Less-than symbol &lt;

What video types does HTML5 support?

1.) MP4. Often uses h.264 codec. 2.)WebM. Often uses the VP8 codec, an open video compression codec by Google. 3.)Ogg. Uses the Theora format, which is a free video compression format and is available freely.

What are some of the functions a web server can perform?

1.) Receives data from a web form or a client-side script. 2.) Processes and reformats input data. 3.) Stores data on server-side storage systems such as database or file systems. 4.) Resends data to other servers for further processing or storage. 5.) Responds to client-side requests.

What are the necessary elements for client-server communication?

1.) Web Browser 2.) Web form 3.) Web Server 4.) Server-side scripting language or CGI script

Linebreak tag.

<br>

<em>

<em>Emphasize tag. By default, will italicize anything between it.</em>

Common HTML structural elements

<header> <nav> <section> <article> <aside> <footer>

Attributes of <input type="text">

<input type="text" name="textField" value="default value" size="12" maxlength="12"> NAME: the name of the text field. Associates the user's input to a name. VALUE: the default value (will be replaced by user) SIZE: the length of the field (does not restrict the actual characters used) MAXLENGTH: the maximum characters of the field (restricts the actual number of characters)

Paragraph tag

<p> A paragraph of text.</p> Can utilize the style attribute if using in-line styling (although CSS sheets should really be used) Example: <p style="text-align:center">

<pre>

<pre>t h i s w e i r d f o r m a t </pre> Will preserve all formatting information of the input text, in the exact format seen. It will preserve line breaks, empty spaces, and tabs. In the above example, it would display it exactly as written. Commonly used to display pre-formatted tabular data. Is often much faster than reformatting data using HTML, although HTML tables are generally much better looking and the better option when time isn't a factor.

Components of a table:

<table> Caption: <caption> (optional) Table Row: <tr> (required) Table Header: <th>(optional) Table Data: <td> (optional if a header is used) Example Table: <table> <caption>My Table</caption> <tr> <th>Name</th> <th>Age</th> </tr> <tr> <td>Jaren</td> <td>29</td> </tr> </table>

<video> attributes, elements, and values

<video width="40%" height="40%" controls="controls" poster="stillimage.png"> <source src="myVideo.mp4" type="video/mp4"> Your browser doesn't support this format. Width/height: controls the size of the video player. Will default to the size of the video if not specified. controls: specifies that the controls for play/pause etc be available. <source> Defines the media resource. Generally speaking, you should specify a source in several formats as a backup just in case one format isn't supported. type: identifies the format or MIME type of the video. src: specifies the location and file name of the video.

Scalable Vector Graphics (SVG)

A W3C recommended language which uses XML to describe graphics. Offers comprehensive animation support. Allows you to create cross-platform animated movies. The compression algorithms in SVG allow you to create high quality movies, with smaller file sizes. Has more efficient compression than JPG or GIF. Additionally, text within SVG images can be indexed and searched. You can also zoom in without a drastic loss in quality.

(forms) <textarea>

A container tag. It creates a scrolling text area space, where the user can enter multiple lines of text. You can enter the default text by placing it between the opening and closing tags. <textarea>Enter your text here. This is the default text.</textarea> Attributes include: cols: Specifies the width (in characters) of the box rows: Specifies the number of rows to display in the box. wrap: has values of "soft" and "hard". "Soft" is the default, and will not wrap (add newline characters) to the text. "Hard" wraps the text (adds newline characters) so that the text is formatted just how the user enters it in the field.

(forms) <select>

A container tag. The <select> tag is used to create single-option and multiple-option lists. If a value is not specified for each option (<option value="Once a week.">Once a week.</option>), the content itself is used as the value. In the below example, no value is specified, so the content is used as the value. E.g. How often do you poop? <select name="Frequency"> <option>Once a week.</option> <option>Once a month.</option> <option>I don't poop.</option>

Joint Photographic Expert Group (JPEG)

A graphical image file format commonly used for photographs. Uses lossy compression. Supports up to 24 bits of color information (16.7 million colors). JPEG compression is copyrighted in many countries. As a result, applications that use jpeg may cost more or have limitations placed on them.

Visual Basic

A language developed by Microsoft. VB was originally more of a procedural language, but over time adopted many object oriented features. VB is used for both stand-alone applications, and as server-side Web applications. Not often used as a client-side application in Web Browsers.

Extensible Markup Language (XML)

A language used to describe the data elements on a webpage. XML enhances the structure and navigation of data. XML allows data to be interchanged with all kinds of applications. XML is often used with intranets and extranets XML is NOT used to format the data's appearance.

Description list

A list containing a list of terms, each followed by its description.

Browser-safe colors

A set of 216 colors which could originally be displayed on all common color monitors. Nowadays, monitors can display a much wider spectrum.

Empty tag

A tag that only requires an opening tag, and doesn't utilize a closing tag. <br> (line break).

Image interlacing

A technique that allows a webpage to progressively show an image as it downloads, which assists people with low bandwidth. It will appear fuzzy at first, and gradually sharpen as the image finishes loading. By contrast, a non-interlaced image will only begin to show the top portion after 50% of it has been completed. The web-ready formats which support interlacing include: GIF 87A, GIF89A, and PNG.

Wireframe

A website wireframe, also known as a page schematic or screen blueprint, is a visual guide that represents the skeletal framework of a website. Wireframes are created for the purpose of arranging elements to best accomplish a particular purpose.

Web Content Accessibility Guidelines (WCAG)

Accessibility standards set by the WC3 for Web developers to follow in order to make Web sites accessible to individuals with disabilities.

Liquid Layout

All widths of the page are set with percentages rather than set pixel widths. The page will respond to being resized or to being viewed on smaller screens. Generally preferred over fixed-width layouts.

Checkbox

Allows a user to select multiple (non-exclusive) items. What gaming systems do you own? <input type="checkbox" name="PC">PC<br> <input type="checkbox" name="PS4">PS4<br> <input type="checkbox" name="Xbox">Xbox<br> <input type="checkbox" name="Switch">Switch<br>

Server-side language attributes:

Code is not executed by the browser, but by the web server. Code is generally placed into files called applications. The applications are assigned to execute permissions by the web server. An interpreter is installed and activated on the web server, which allows for code execution.

What constitutes a tag?

An element: This is what instructs the tag to do something. <p><body><h1> are all examples of elements. An attribute: Specifies a quality or describes a certain aspect of the element. For example, in the <a href="www.example.com"> tag, we utilize the href="" attribute to identify the hyperlink reference. The href is the attribute. A value: Gives value to the element and its attribute. In the above <a href="www.example.com"> example, the value is "www.example.com".

Image Map

An image that contains clickable regions, sometimes referred to as hot spots. Each of these hotspots can reference a different hyperlink. Hotspots are defined with a set of coordinates, which indicate its position on the image, and a URL reference. At one point in time, image maps required a server-side implementation, but that is no longer the case. Client-side image maps are now more common, as they do not require specialized server-side scripts.

JavaScript

An object-based scripting language that utilizes several built-in objects, such as: *Document: Obtain and write values to a document. *Navigator: Lets you determine the type of web browser accessing the webpage. *Arrays *Several others. JavaScript can be used on the client-side, or the server-side. Examples of content that JavaScript can add include: Popup windows. Automatic date and time changes Images and text that change upon mouse rollover. Cookie creation and identification.

Java

An object-oriented programming language developed by Sun Microsystems. Java is designed to run on any operating system that can run its interpreter. Some features of Java include: Simplicity. Object Oriented. Platform independent: You do not compile Java code to run on a specific platform. Rather, you compile Java code to run utilizing its interpreter. Secure: a wide variety of protections are available. Portable: One program can be on different platforms. Robust error detection. Multi-threading support.

WebP

An open-source image file format that provides lossless and lossy compression for images on the Web. Supports transparency and animations.

<strong>

Bolds a text (can be changed through CSS if desired). This tag also works with text-to-speech devices, and will be output through voice with more emphasis.

CSS

Cascading Style Sheets; a language used to describe how HTML elements should be styled

Python

Developed in the 1980's, but only became popular around 2004. Python is touted as being a very easy language to use, while also having a large amount of flexibility due to the wide variety of frameworks that are available for it. Python is not the best choice for Mobile web development, is generally a bit slower than other languages, and has some limitations in building high-quality 3D graphics.

<title>

Displays the title of the current webpage in the browser tab. The <title> tag is placed within the <head> container tags.

Section 508 of the Rehabilitation Act

Ensures that disabled individuals have a comparable level of access to information. Requires that Federal agencies provide accommodations for users with disabilities for all electronic and information technology developed, procured, maintained or used by federal agencies.

<link>

Example: <link rel="stylesheet" type="text/css" href="myWebpage.css"> The link tag is used to reference the stylesheet (usually CSS) associated with a specific HTML page. The <link> tag is placed within the <head> container tags.

Vector graphics

Graphics that use points, lines, curves, and shapes based on mathematical equations. Generally small in file size, and can be shrunk or enlarged without loss in quality. Can be converted to bitmap.

HTML 5 family

HTML 5. CSS. JavaScript.

What are some of the protocols hyperlinks can go to?

HTTP HTTPS FTP Email

<hr>

Horizontal Rule. Can assist in defining a thematic change on the page. Appears as a horizontal line across the page.

In CSS tables, text-align will align text in what direction?

Horizontally. Values for text-align include: left, center, right, and justify.

HTML

Hypertext Markup Language. Created by Tim Berners-Lee of MIT with colleagues at CERN. Standardized by the World Wide Web Consortium (W3C). One document can link to another location in the file, or to a separate document, by using HYPERLINKS which are embedded instructions within the text file.

Uniform Resource Name (URN)

Identifies resource by its name rather than its network location. One example would be the ISBN number used to uniquely identify a book.

Code for Background Images, background colors, text colors.

Image: background-image: url('myImage.png'); Color: background-color: black; Using hexadecimal: background-color:#000; Text color: color: black; color:#000;

Should HTML tags use upper-case or lower-case?

Lower-case. In order to be compatible with both HTML and XHTML, HTML tags should be written in lowercase (<br> and NOT <BR>).

<html>

It is used as a container for the entire HTML document. It should nest all code except for <!DOCTYPE>. It can contain several attributes: manifest: an attribute used for offline browsing. Lists the address of the HTML documents cache manifest. lang: Configures the page to a particular language. An English webpage would include <html lang="en"> xmlns: If content needs to conform to XHTML, this is where you specify the XML namespace attribute.

JavaServer Pages (JSP)

Java can be used to create a JavaServer Pages (JSP) API. JSP uses Java commands embedded into HTML code. Java can be used to create Java Servlets, which is an application that must be installed directly onto the remote server. Servlet code is NOT downloaded to the browser. To use Java Servlets, you must first compile the Servlet. Afterwards, you place it on a server capable of handling it. Apache Tomcat is one of the most popular web servers that supports JSP.

Embedding JavaScript in HTML

JavaScript can reside in an HTML document.

Internal hyperlink

Link to an area on the same page or another page of the same website. This can be done using ID's and #. The ID serves as a sort of bookmark or anchor in the page. The # is important, as it specifies that the href is referencing an internal location, and not an external one. If you wish to link to a specific bookmark in a different page, you can first reference the page, and then reference the bookmark you want: <a href="thePageIWant.html#thebookmark"> <a id="importantparagraph"> important paragraph here </a> ...further down the site... Go back to the <a href="#importantparagraph"> important paragraph </a>

Portable Network Graphics (PNG)

Lossless compression. Bit depth can be adjusted. Uses compression filters which support up to 48-bit color. Has support for transparency and interlacing.

&nbsp

Non-breaking space. Forces the browser to display a blank space.

HTML entities

Non-keyboard characters, such as the less-than symbol, greater than symbol, copyright symbol, and trademark symbol.

The web form process:

On a web page, you have a web form filled with information. This web page submits the form to the web server. On the web server, you have a web form processing script. This script will take the input of the web form, and process it in some manner. Actions taken by the web server or server-side script can include: 1.) Storing information in a database (for example, updating an inventory of some kind). 2.) Searching a database for a product (For example, a book on Amazon) 3.) Sending processed information back to the user. (A confirmation an item has shipped).

HTML 4.01 Frameset

Required for pages that used HTML frames, which placed Web pages inside one another to create separate panes in the window.

HTML 4.01 Strict

Required the exclusive use of CSS when defining layout instructions. Deprecated tags were not allowed.

Client-side languages

One example is JavaScript. Client-side languages are run on the individuals computer after the page itself is loaded, thus relieving the server of the burden of processing it.

<ol>

Ordered list, or numbered list. Uses numbers rather than bullets. The list items themselves should utilize the <li> tag. Example: <ol> <li>First item on the list.</li> <li>Second item on list.</li> <li>Third item on list.</li> </ol>

PHP

PHP Hypertext Preprocessor. A common server-side scripting language, used to create dynamic Webpages. PHP can either be embedded in the HTML, or saved as a separate standalone .php file. Whichever method is used, the code itself actually executes on the Web server. The syntax <?php

Common server-side languages:

PHP, Perl, Python, Visual Basic, Active Server Pages (ASP), C#, Java

Perl

Practical Extraction and Report Language. Perl is a cross-platform programming language that enables the creation of custom CGI scripts, in addition to system management programs. Perl is commonly used for a variety of things, including for web server processes. Perl utilizes a bit of code called the "shebang", denoted by the #! characters. This bit of code is responsible for pointing towards the location of the Perl interpreter.

Radio button

Reserved for two or more items which are mutually exclusive (You can only have one or the other). For example: Would you like to join our mailing list? <input type="radio" name="MailingList" value="Yes" checked="checked"> <input type="radio" name="MailingList" value="No"> term-98 VALUE: the value of the radio button (what it will show) CHECKED: Use this if you wish to make one radio button checked by default.

SEO

Search Engine Optimization. The process of improving a webpage so that search engines rank it higher.

Syntax terms of CSS3

Selector { Property:value; } Example: body { background-color:blue; }

vertical-align

Sets the vertical alignment of an element. Values: Top, middle, bottom In the context of a table, entire tables, rows, or even specific data entries can be vertically aligned. Examples: tr { vertical-align: top; } <td class="vertAlign">Vertically aligned data</td> td.vertAlign{ vertical-align: top; }

<audio> attributes, elements, and values

Similar to <video>. HTML5 supports .mp3, .wav, and .ogg. Utilizes a <source> element with src and type attributes to define the audio source, much like <video> does. Also utilizes the control attribute to display audio controls. Can utilize a loop="loop" command for looping, and an autoplay="autoplay" attribute for autoplay. <audio controls="controls"> <source src="audio.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio>

Container Tag

Tags that use both an opening and a closing tag. For example, <em>Words to be italicized</em>

<!DOCTYPE>

Tells the browser which version of HTML it is using.

<form> element attributes: name

Specifies a name used to identify the form.

<form> element attributes: autocomplete

Specifies if the browser should autocomplete the form. The default behavior is ON.

<form> element attributes: novalidate

Specifies that the browser should not validate the form.

<form> element attributes: accept-charset

Specifies the charset that will be used in the submitted form. The default value is the page charset.

<form> element attributes: enctype

Specifies the encoding of the submitted form data. The default value is URL-encoded.

<form> element attributes: action

Specifies the name and location of the CGI script used to process the form when using the POST method.

(Tables) border-spacing: 5px;

Specifies the spacing between the cells. In this case, there would be a spacing of 5 pixels between cells.

<form> element attributes: target

Specifies the target audience of the address in the action attribute. The default value is _self.

font-family

Specifies the typeset, or which font you'd like to use. It is considered a good practice to list backup fonts just in case the first has issues or isn't present. When listing a font with multiple words, quotations should be used ("Times New Roman"). Example: font-family: "Times New Roman", arial, sans-serif;

<form> element attributes: method

Specifies which method the browser will use to send form data to a web server. There are two values here: GET: Form data is appended to the URL of the webpage for use in a query string. This information sends information in cleartext, and is not secure (the information can literally be read in the URL). POST: Form data is posted to the URL specified by the ACTION attribute. Post is a more secure method for submitting form data. It can send more characters, though it may need additional processing by the CGI script.

<link> tag in the <head> section

Style sheet references are specified with the <link> tag in the <head> section.

Dithering

The ability for a computer to approximate a color by combining the RGB values.

What are some formatting rules in raw text strings?

The ampersand sign (&) delimits between name & value pairs. If a user didn't enter a particular field, it will be empty. The + sign denotes entered empty spaces (In the below, the user entered Eric Goldwater) Example: Name=Eric+Goldwater&[email protected]&Age=29&MailingList=

<body>

The body tag specifies where the actual body of the document begins, and includes all of the actual content of the webpage (text, videos, images, etc). The <body> tag is placed AFTER the <head> tags.

&gt;

The escape sequence for the greater-than symbol >

<head>

The head section allows you to insert <meta> tags (describes nature of the document), the <title> tag, and links to style sheets.

Image map attributes/elements

The image itself can be defined either before, or after the map. When defining the image, a usemap="#mapname" attribute is used. This will cause the image to be associated with the map with the same name, as seen below. <img src="myImage.png" usemap="#mapname"> <map name="mapname"> <area shape="rect" coords="coordinates" href="url" alt="description"> </map> The <area> element defines the shape of the hotspot. The shape attribute can be set to define the shape (rect, circle, poly, default). The number and types of coordinates will depend on the shape specified in the shape attribute: rect: x1, y1, x2, y2 circle: x1, y1, radius poly: x1, y1, x2, y2, ... xn, yn. (Up to 100 coordinate pairs) The alt attribute provides alternative text, and should be used whenever an href is used.

What happens if you forget to add <!DOCTYPE>?

The page will not validate with a markup validator. The markup validator can't verify what doctype you're using.

Fixed-width Layout

The width of the site is bound, or fixed. This is achieved by using width properties with a set px length. The webpage will not dynamically resize itself depending on the size of the screen it is being viewed on. Generally, liquid layouts are preferred over fixed-width layouts.

colspan and rowspan

These attributes indicate that a row or column should span X spaces. Useful, for instance, if you wanted the option for multiple entries under one header (For example, perhaps two phone numbers under one phone number entry) <th> Name </th> <th colspan="2">Phone number(s)</th> In the above example, the phone numbers column would span 2 cells, meaning there could be 2 listed phone numbers per name.

!Important

This directive can be used to specify that a particular rule be preferred if multiple rules exist. For example: p {color:red;} p {color:blue;} Normally, the text would show up as blue, as it is the last rule on the list. With the important directive, we can change this: p{color:red !Important;} p{color:blue;} In this example, the text would appear as red, even though the rule for blue occurs afterwards. The !important attribute should be used sparingly.

&lt;

This is the escape sequence for the less-than symbol <

Site Diagram (Storyboard)

This plan must include a statement discussing the purpose of the site, and the intended audience. It should also contain a rough outline of the pages needed, including: The default page (index.html or home page). Sections of the site (e.g. products, sales, contacts) An estimate of technologies required (databases, web servers, search capabilities, etc) Input should be obtained from stakeholders.

Graphics Interchange Format (GIF)

Two types: 87A and 89A. 89A is more common. Supports transparency, animation, and interlacing. Only supports up to 256 colors. GIF and its compression format are copyright in some countries.

URL

Uniform Resource Locator. Two variants: Fully qualified (absolute URL), and partial URL (relative URL). A fully qualified, or absolute URL, contains the full path to a resource. For example: http://www.somewebsite.com/somepage.html A partial URL assumes the current document path. For example: aboutus.html

<ul>

Unordered list. A bulleted list. List items themselves utilize the <li> tag. <ul> <li>First bulleted item.</li> <li>Second bulleted item.</li> <li>Third bulleted item.</li> </ul>

(forms) <input>

Used to create text boxes, checkboxes, radio buttons, and submit/reset buttons inside of forms. Takes the TYPE attribute. The type attribute specifies what the input will take the form of. Some common input types include: <input type="text"> <input type="button"> <input type="email"> <input type="submit"> <input type="reset"> <input type="checkbox"> <input type="file"> <input type="radio">

<iframe>

Used to embed another document in your webpage. For example, to embed a Youtube video. When done like this, you can use the embedded video from Youtube, rather than uploading your own source video. Width/height attributes define the size of the iframe. Src="" specifies the source of the video to embed. Any text enclosed in the iframe element will be displayed should the iframe be unable to load. Example: <iframe width="512" height="300" src="https://youtube.com/embed/whatever">

Good HTML coding practices:

User lowercase letters in tags. Close all tags. Surround attribute values with quotation marks. Once you've chosen your HTML standard, adhere to its methodology throughout the entire document. Responsive Design

Bitmap graphics

Uses square pixels, loses clarity when viewed up close or zoomed in. Also called Raster Graphics. Includes jpg, gif, and png.

XML Functionality

XML documents can be formatted into print documents, web documents, PDF documents, comma-separated-value (CSV) documents, braille, text-to-speech, and many other formats. Because the documents define only the content, changes can be made dynamically without input from the programmers or administrators. XML is not used to format webpages, but is used instead to describe the data from which the webpages are created.

(forms) <select> (multiple)

You can allow the user to select multiple items in a select list by utilizing the multiple attribute. For example, in the following, a user would be allowed to select multiple countries. The size attribute specifies how many menu items will appear before the user needs to scroll. <select name="Country" multiple="multiple" size="4"> <option>Australia</option> <option>New Zealand</option> <option>Jamaica</option> <option>Thailand</option> <option>Germany</option>

a:visited and a:link

a:visited can be used to manipulate the properties of a link that has been visited, for example changing the color of the hyperlink. a:link can be used to manipulate the properties of a link that has NOT been visited.