Module 5

Browser plug-in

- A browser plug-in is software that can properly read and interpret a file format that the browser cannot. Ex: The Flash Player plug-in allows a browser to play Flash files.

Button widget

- A button widget can be created using the <button> opening and closing tags or with <input type="button">. The <button> element allows text and images to be displayed in a button, but an <input> button only allows text.

Checkbox widget

- A checkbox is a widget for input elements with the type attribute of "checkbox".

Fallback

- A fallback is a mechanism that allows a web page element to function correctly even if the browser does not support a particular element.

List box widget

- A list box widget is created by specifying a size with the select element's size attribute. - Ex: <select size="4"> creates a list box that shows four options at a time. - The multiple attribute allows the user to select multiple options. - Ex: <select name="flagcolors" size="4" multiple> <option value="red">Red</option> <option value="orange">Orange</option> <option value="yellow">Yellow</option> <option value="green">Green</option> <option value="blue">Blue</option> <option value="purple">Purple</option> <option value="white">White</option> <option value="black">Black</option> </select>

Password field widget

- A password field is a widget for input elements with the type attribute of "password". - Ex: <input type="password" name="secret" size="10" maxlength="10">

Polyfill

- A polyfill is a fallback using JavaScript code that makes certain features of HTML5 (Ex: the date picker) work on browsers that do not natively support those HTML5 features.

Radio button widget

- A radio button is a widget for input elements with the type attribute of "radio", which allows users to select exactly one value from possibly many values.

Text area widget

- A text area widget is an input element specified by <textarea> opening and closing tags that allows users to enter multiple lines of text. A <textarea> tag has optional rows and cols attributes to specify the initial size of the text area.

Text box widget

- A text box widget is an input element with the type attribute of "text" that allows users to enter a single line of text.

Widget

- A widget is an interactive component (usually graphical) that the browser uses to interact with a user. - Ex: Buttons, drop-down menus, and data entry fields.

Enctype form attribute

- An enctype attribute of "multipart/form-data" indicates the web browser should split a POST request into multiple parts, where each input field is sent as a separate part of the HTTP request message.

Input widget

- An input picker is a widget that allows the user to interactively pick a choice using a popup or other guided selection method. - Ex: <input type="date"> - Color is an input attribute. - The number input ensures user input is a valid number. - The range input control allows the user to select a value by dragging a sliding control along the length of a line.

Youtube video

- Including a YouTube video in a web page requires the <iframe> element. The <iframe> element allows a web page to be embedded in a rectangular area of the current web page. The <iframe> element uses the src attribute to specify the URL of the web page to display and the width and height attributes to define the width and height in pixels of the rectangular iframe.

<form> tag

- The <form> tag allows the web browser to send information from the user to the server. - The <form> tag has two primary attributes: 1. The action attribute indicates the URL where the form data should be sent. 2. The method attribute indicates the HTTP request type the browser will use to communicate with the server. The method is either GET or POST. GET is the default method and is used if no method is specified. - Ex: <form action="https://twitter.com/" method="POST"> ... </form>

<input> tag

- The <input> tag allows the user to enter information into a web page.

<label> tag

- The <label> tag displays descriptive text associated with a specific widget. A label has a for attribute whose value should match the id attribute for the widget being labeled. - Ex: <label for="username">Username:</label> <input type="text" id="username">

<option> tag

- The <option> opening and closing tags create a value, or option, the user can select within a drop-down menu. - Ex: <select name="sport"> <option value="football">Football</option> <option value="baseball">Baseball</option> <option value="basketball">Basketball</option> <option value="hockey">Hockey</option> <option value="soccer">Soccer</option> </select>

<script> tag

- The <script> tag allows a web page to include interactive content, which the browser assumes to be JavaScript unless indicated otherwise. The optional type attribute is used to indicate the content type when the content is not JavaScript. The src attribute provides the URL of an external document containing the interactive content. - Ex: <script src="https://example.com/my_interactive_content.js"></script> - Ex: <script type="text/javascript"> alert('Hello, World!'); </script>

<select> tag

- The <select> opening and closing tags create a drop-down menu (or drop-down list), which allows users to select one of several predefined values.

<style> tag

- The <style> tag allows the web page to introduce presentational directives, usually CSS. A <style> tag is placed in an HTML document prior to the <body> tag, because the style section is designed to describe the presentation of the entire document. Although only needed for non-CSS content and rarely used, the <style> tag has an optional type attribute that describes the content inside the tag.

Video element

- The <video> element displays a video in a web page. The <source> element is used in a <video> tag to specify the name of the video file to play.

Audio element

- The HTML5 <audio> element plays an audio file in a web page. The <source> element is used inside the <audio> tag to specify an audio file to play. - Different web browsers support different audio formats, so multiple <source> tags can be used to supply alternate file formats. The MP3 and AAC formats have wide browser support.

Submit button widget

- The web browser displays a submit button widget for an <input> tag with the type attribute of "submit", which sends the associated form's data to the server when clicked. A submit button uses the value attribute to specify the button's text.

<script> & <style>

- Unlike all other HTML tags, the contents within the <script> and <style> tags are not displayed by the browser. The <script> and <style> tags' purpose is to provide interactive functionality and presentational styling. - Ex: <html> <style> p {margin: 1em;} </style> <body> <p>The White House is the official residence of the President of the United States.</p> </body> </html>