HTML5/CSS3/JAVASCRIPT
Required HTML Tags
<html>, <head>, <title>, <body>
Header Element
Defines a header for a document, section, or article.
Raster Image
Made up of pixels (ex: photograph)
Resistive Touch Screens
Made up of several layers, topmost layer flexes when pressed
Gesture
involves fingers touching a screen or mouse gestures
RGBA
red green blue alpha color model
Web form
A Web page that provides input fields for a user to enter data, which is sent to a server for processing. From there, the information is stored in a database or forwarded to a recipient
Positioned Float
A CSS construct that enables you to position images, text, and boxes anywhere in an HTML document and then wrap text completely around these elements.
Global Attribute
A global attribute can be used with any HTML element; in other words, it's permitted globally.
targetTouches
A list of touch points currently in contact with the screen and whose touchstart occurred within the same node
Unordered list
A list that displays list entries in a bulleted list.
Ordered list
A list that orders the list entries using numbers, by default.
createElement Method
A method used to display an image when a button is clicked or some other event occurs
Computer Program
A recipe we direct the computer to execute that results in a particular display or action
Named Flow
A set of elements taken from the source and to be flowed into a content container.
Nav Element
A set of navigation links as a document 's primary navigation
Vendor Prefixes
A way for browser makers to add support for new CSS features before those features are fully supported in all browsers
<figcaption>
Adds a caption to an image on a Web page
Dynamic Application
Adjusts and responds to such action by end users
File API
Allows a browser or application to upload files from local storage to a remote server without the need for a plug-in
localStorage
Allows users to save larger amounts of data from session to session
WebSockets
An API that offers full duplex communication through a single socket over the internet
Table
An HTML table contains rows and columns, and is used to organize and display information in a grid format.
Events
An action that triggers another action to occur
Event Handler
An optional script or executable that handles input received in a program
Parsing
Analyzing a sentence into its parts and describing their syntactic roles
Content Containers
Areas into which content is flowed
FileList
Array-like sequence of file objects
Automatic Validation
Automatic validation of input means the browser checks the data the user inputs.
Fallback
Backup content that displays if primary content cannot
CSS Exclusions
CSS Exclusions are another name for positioned floats
Client-side Validation
Client-side validation is the process of validating user input before submission to the server
Linear-gradient
Creates a gradient from top to bottom or vice versa, or from corner to corner
Radial-gradient
Creates a gradient that radiates out from a central point
Repeating-linear-gradient
Creates a repeating linear gradient, which results in straight bands of gradient color
Repeating-radial-gradient
Creates a repeating radial gradient, which results in circular bands of gradient color
Block-level element
Creates boxes that contribute to the layout of a document
Doctype
Declaration found at the very top of almost every HTML document. Specifies the language of the rules the page uses
CSS Regions
Defined areas (regions) of an HTML document where content can flow.
Footer Element
Defines a footer for a document or section, and typically contains information about the document or section
Article Element
Defines a part of an HTML document that consists of a "self-contained composition" that is independent from the rest of the content in the document.
Section Element
Defines a section in a document, such as a chapter, parts of a thesis, or parts of a Web page whose content is distinct from each other.
Inline elements
Designed for laying out text and doesn't disrupt the flow of the document
Accelerometer
Device that measures acceleration. Detects forces applied to the device
Interactivity
Enables an end user to take an action in an application , usually by clicking a button or pressing a key .
<mark>
Enables you to highlight blocks of text in HTML documents
<audio>
Enables you to incorporate audio into HTML documents using minimal code
<video>
Enables you to incorporate videos into HTML documents using minimal code. Has attributes such as poster, autoplay, controls, and loop
Datalist Element
Enables you to present the user with a drop-down list of options to select from
XMLHttpRequest API (XHR)
Enables you to use JavaScript to pass data in the form of text strings between a client and server
Form Input
Form input is the information a user enters into fields in a Web or client application form.
getCurrentPosition
Gets the device's current position
CSS3 Grid Layout Model
Gives developers greater control over complex layouts compared to the flexbox model. Uses columns, rows, and cells. Child elements of a grid are called grid items
GPS
Global Positioning System found in most modern devices to track location
CSS Flexbox Model
Good for forms that reposition and resize when the user changes the size of the browser window; Enables relative sizes and positioning. Child box is a flexbox item.
File
Includes read only informational attributes about an individual file
Scale
Indicates the amount of two finger pinch zooming that occured
Rotation
Indicates the amount of two finger rotation that occured
Semantic Markup
Intuitive markup that gives better meaning or definition to several tags so they make more sense to humans, programs, and Web browsers.
Subroutines
Is a programmers sometimes identify functions that return no value as
Callback
Is a response to an event , such as a script execution in response to a mouse click
Function
Is a segment of a program defined and performed in isolation from other parts.
Library
Is collection of resources , like prewritten function code and subroutines , that developers use to create programs
Methods
JavaScript function that belong to objects
Required by both canvas and SVG
Javascript
User Input Form Validation
Javascript validates user entries and suggest alternatives
sessionStorage
Keeps data only for one session until the browser is closed. Isolated to a specific window/browser tab. Multiple windows/tabs can maintain their own session data
Tag Pairs
Keywords that structure an HTML page. Keywords are surrounded by angled brackets. Usually come in pairs
Multi-column Layout
Lets you create columns, divide text across multiple columns, specify the amount of space that appears between columns (the gap), make vertical lines (rules) appear between columns, and define where columns break.
Civic data
Location data thats easily understood by humans
Vector Image
Made up of lines and curves based on mathematical expressions
Metro Style
Metro UI consists of large "Live Tiles"; as used in Windows 8
Iframe
Mini boxes on a Web page that contain external content embedded in an HTML document, as the content source.
Attributes
Modifiers of HTML elements that provide additional information
Absolute Positioning
More exact and uses geometric placement
Autofocus Attribute
Moves the focus to a particular input field when a Web page loads
translate()
Must use an x and y value to position the element relative to the original or default position
Content source
One or more blocks of text in the same or a separate HTML document that holds the content you want to flow through a layout
Parent/Child Relationships
Parent box can contain multiple child boxes. Child can inherit CSS styles from a parent
Placeholder Text
Placeholder text is text displayed inside an input field when the field is empty.
Nesting
Placing one element inside of another
JavaScript Library
Pre-written JavaScript code.
Menu Element
Presents a list (or menu) of commands, usually with buttons. The W3C prefers that you use the menu element only for context menus, lists of form controls and commands, toolbars, and similar items.
Recursion
Programming technique where a function calls itself. A key part of animation.
Geolocation API
Provides a device's latitude and longitude coordinates
Pattern Attribute
Provides a format (a regular expression) for an input field, which is used to validate whatever is entered into the field.
Blob
Provides access to raw binary data
FileReader
Provides methods to read and display a file
Geodectic data
Raw location data such as latitude and longitude
Depreciation
Removing elements from the list of available HTML elements
AppCache
Saves a copy of Web site files locally in a structured form. Only saves files listed in the cache manifest
SVG
Scalable Vector Graphics. Loads into the DOM. Changes to fit screen. Highly detailed and scales well
Web Workers
Scripts that run in the background performing calculations or other actions that allow for a more responsive user interface
Cookies
Small text files that web sites save that contain information about the user and their browsing preferences. A variable in JavaScript. Content can change as browsing preferences change
Flow-into
Specifies a content source.
Flow-from
Specifies one or more content containers.
<figure>
Specifies the type of element you're adding
Variable
Stands for piece of data
Data Types
String, number, array, boolean, null, object, undefined
Element
Tag pair or empty tag. Can describe content, insert graphics and create hyperlinks
CSS Selector
The HTML element that you are trying to style: p {color:brown}
Aside Element
The aside element is used to set off content that's related to the current topic but would interrupt the flow of the document if left inline.
Animation
The display of a sequence of static images at a fast enough speed to create the illusion of images
Email Attribute
The email attribute requires the user to enter an email address into an input field.
jQuery
The leading JavaScript library
Identifier
The name of a variable or function. Cannot be the same as words already used in the language
Server-side Validation
The process of a server validating data received from a user input form.
Hyphenation
The process of connecting two words with a hyphen mark (-) or breaking words between syllables at the end of a line.
Validation
The process of verifying that information entered or captured in a form is in the correct format and usable before sending the data to the server.
Validation
The process of verifying that information entered or captured is in the correct format.
Required Attribute
The required attribute requires information in a field when the form is submitted.
Declaration
The style for a specific selector: p {color:brown}
Touchstart event
Triggered by every new finger touch
Gesturestart event
Triggered by every new two finger gesture
Touchend event
Triggered when a finger is lifted from the screen
Touchcancel event
Triggered when the device launches another application
Canvas
Use JavaScript to draw pixel based shapes on a canvas. Animate objects, render text w/ embellishments, include color, gradient and pattern fills. Use for small drawings and screens
<img>
Used with the <figure> tag to display an image. Used to add images to an HTML document. The src and alt attributes are required
UI
User interface, portion of a website or application with which a user interacts
Capacitive
Uses electrodes to sense objects touching the screen, object must have conductive properties
watchPosition
Watches the device's position as it changes overtime and generates an event if a change occurs. clearWatch stops the watch
WHATWG
Web Hypertext Application Technology Working Group formed by Apple, Mozilla and Opera to define and document the HTML5 specification
WOFF
Web Open Font Format
Which multi-touch gesture does not work well
Zooming and Scrolling
SVG filter
a set of operations that use CSS to style or modify an SVG graphic; may include feBlend; feColorMatrix; feImage or feMerge
HTML, CSS and Javascript
all three components of the HTML5 family
@font-face
allows developers to use whatever font style that they choose
Inline Flow
allows you to fill as much width as required
Block Flow
allows you to fill as much width that is available
<i>
alternate voice or mood, like spoken text
Transform
an effect that lets you change the size shape and position of an element
Windows Store
an online global marketplace for Metro Style
Shadow Options
blur, spread, color or inset
Rounding a specific part
border-top-left-radius; border-top-right-radius; border-bottom-right-radius; border-bottom-left-radius
<style>
can be used for simple styling
Transition
change an element from one style to another
WebStorage
consists of AppCache localStorage and sessionStorage
box -shadow
creates a drop shadow around layout elements
Border-radius
creates rounded corners around a header, footer sidebar etc.; you can put pixels or ems
3D Perspective
defines how a browser renders the depth of a 3D transformed element
Cascading Style Sheet(CSS)
defines styles for HTML in a separate file; changing font or background color
Opaque
does not let light pass through
Canvas
draw pixel-based shapes; canvas accepts two attributes height and weight
Windows Runtime(WinRT)
foundation of the Windows 8 operating system;
Font-family
good way to specify specific font for an app or site
2D scaling
increase or decrease the size of an element; use scale(x=width y=height)
<em>
indicates emphatic stress
<strong>
indicates strong importance
HTML
is a markup language; not a programming language
JavaScript
is a scripting langauge
The Footer
is defines as a document or section , and typically contain information about the document or section.
The Header
is defines as a document,section ,or article of HTML.
sessionStorage
keeps data for only one session; until browser is closed
<link>
links an HTML file to the CSS file
Validator
looks for code that is incorrect or missing or an unclosed tag; makes sure nothing is wrong with the Document
Hidden Overflow
makes overflow invisible: scroll, visible, hidden
Transform Methods
matrix, perspective, rotate, scale, skew and translate
Translate
moves an image without rotating, skewing or turning the image
Application Packaging
process of bundling an application and various files into app container; easy to distribute and deploy app
Bounding Box
rectangular border around content; can be invisible or visible
V-shadow
set the horizontal position of the shadow
H-shadow
set the vertical position of a shadow
Gradient
smooth change of colors; methods of CSS background property
Font-family
specifies the font for a specific element
Font-size
specifies the size of a font
Font-style
specifies the style of a font, such as normal italics, or oblique
Font-weight
specifies the thickness of font characters
Font-variant
specifies whether text should be displayed in small caps
Application
starts when the browser opens and ends when the browser is closed
3D skewing
stretch in more than one direction; use elements skewX(skews x axis) and skew Y(skews y axis)
Animation
the display of a sequence of static images at a fast enough speed to create an illusion of movement
Declaration Property
the style attribute for the selector: p {color:brown}
Declaration Value
the value of the property: p {color:brown}
2D skewing
to stretch it in one or more directions; transform: skew(enter xdeg, enter ydeg)
2D rotation
turns it clockwise by a specific number of degrees; uses rotate(enter deg here)
3D Rotation
use elements rotateX(rotates around x axis) and rotateY(rotates around the y axis)
<small>
used for small print
<b>
used to offset text without conveying importance
Float Positioning
useful when layout is in columns; element used to move element as far as possible to the left and the right
Visible Overflow
writes over the content that follows it
Transparent
you can see through
