HTML Flashcards
What is HTML?
Markup language for creating and displaying webpages.
Not a programming language.
Building blocks of the web.
Details on creating an HTML file
Does not need a server
Files must end with .html
What is the root / home page of a website?
Index.html
What are HTML Tags?
The basic building block of any web page.
Different tags format the way information is displayed.
What are element names surrounded by?
Angle brackets <tag>content</tagname></tag>
They usually come in pairs, start tag and end tag
What is a different between the start and end tag?
The end tag has a forward slash
What is a self closing tag?
Tags that don’t contain any content
<br></br>
What is in the head area?
Page title, links to CSS files, and JV files, metadata (description and keywords)
What tags are contained in the body?
Headings <h1>
paragraphs <p>
What should be the first thing on a web page?
The declaration which tells the browser what type of HTML the page is written in, which is HTML5
<!DOCTYPE html>
How do you make comments in HTML?
<!- -
Left arrow, bang, hyphen, hyphen
What is the default style sheet?
User agent stylesheet
List two characteristics of Inline Elements
Do not start on a new line
Take only the necessary width
List two characteristics of Block Elements
Start on a new line
Take full width available
What are some Inline Level tags?
<span>, <img></img>, <a></a></span>
What are some Block Level tags?
<div>, <h1> - <h6>, <p>, <form>
</form></p></h6></h1></div>
What does the strong tag do?
Says the text is surrounds should be strong in some way, such as bold.
Also note that strong can be customized using CSS
What does the <‘em> tag do?
It emphases the text it surround, e,g. Italics
What is the <a> tag used for?</a>
Puts a link in the text
What is the attribute href used for?
The location where you want a link for an <a> tag to open</a>
Hypertext reference
What is the target attribute used for?
Opens a new tab when clicking on a link so the user is not sent away from the active webpage
How to you write the attribute for target?
Target=“_blank”
What is main purpose of tags?
To provide information about elements
What are key value pairs?
The key is the constant the defines the data set, e.g. href
And a value which is a variable that belongs to the set “http://google.com”
What are values in key value pairs always in?
Quotes
What is a List?
A bullet point item
What type of tag does a list item have?
<li>
</li>
What is the tag for an ordered list?
<ol>
</ol>
What is a basic difference between an UL and OL?
a UL is bulleted and an OL is numbered
When are UL’s usually used?
Web site navigation, e.g. navigation bar at the top of a page
What is the thead tag used for?
The area for the table heading
What is the tag <tr> used for?
To create a row for the table
What is the tag <td> used for?
Table data that goes into a row
What does the attribute action, within a form do?
Submit the form to a certain page, e.g. php
Action=“process.php”
What does the attribute method within a form do?
Makes a POST request to a form on a server
What is something POST is used for in a form?
Add data to a database
What does the tag <br></br> mean, and do?
It is a line break to separate things manually when not using CSS yet
What does the tag <hr> do, and mean?
Means horizontal rule and creates a horizontal line across the page
What does the input type email do?
Validation to ensure a valid email address is used
What are the three types of Quotations elements?
Block quote, Abbreviate, and Cite
What is an HTML5 semantic tag?
A tag that clearly describes its meaning to both the browser and the developer
List examples of HTML5 semantic tags.
Header, footer, aside, main, article, nah, section, details
What information usually goes into the header?
Logo
What usually goes into the article element?
Individual blog posts
What is the aside element?
Has to with sidebar content
What is in the foot element?
Copyright and privacy policy links, e.g.
What is the small tag used for?
Create date (of articles) or sub content such as, “Post by Daniel on January 20th, 2023”
What is the code for copyright?
©
Ampersand, copy, semicolon
What is an ID represented with?
Number sign
What is meta data?
A set of data that describes and gives information about other data
What are examples of meta data?
Author, date created, date modified, file size
Why is meta data important in web pages?
it contains descriptions of the pages contents, as well as keywords linked to the content and is often displayed in search results by search engines.
What does the property box-sizing do?
Allows you to include the padding and border in an element’s total width and height
What happens if you set box-sizing:border-box on an element?
Padding and border are included in the width and height
What are the six positioning properties in CSS?
Static, Relative, Absolute, Fixed, Initial, Inherent
Purpose of the alt attribute?
Specifies an alternate text for an image if the image cannot be displayed
What is responsive web design?
Aims to make web design pages render well on a variety of devices
List different block level elements.
Div, footer, h1, hr, p
What are examples of semantic tags?
Footer, header, nav
What is true of html entities?
Begin with an ampersand and end with a semicolon
Are special symbols or characters, such as the copyright symbol
What are examples of container tags?
Article, h1, p
What element identifies the document title?
Title
A language that requires few plug-ins and standardizes how video and audio are presented on a webpage.
HTML5
A language that allows transition from HTML to XML.
XHTML
A metalanguage that is used to create other languages.
SGML
What is SGML?
A language that describes the function and context of the information contained in a document. Used to store and transport data.
XML
Describe XML
HTML 4.01 added support for?
Forms
Multiple spoken languages
Scripting languages
CSS
Tables
HTML5 introduced which elements?
Audio
Footer
Header
Nav
What is wire framing?
The process of working on an outline for a web presence
What org creates all web standards?
World Wide Web Consortium (W3C)
Who states that federal agencies must make electronic information accessible?
Section 508 of the Rehabilitation Act
Specific set of guidelines that should be followed to make web content accessible.
Web Content Accessibility Guidelines (WCAG)
Group that focuses on accessibility for W3C technologies?
Web Accessibility Initiative (WAI)
The ___ element is used to contain meta tags, links to style sheets, and the title element.
<link></link>
Identify the element
<p class=“special”>Check out our weekly special!</p>
Class
identify the value
<p class=“special”>Check out our weekly special!</p>
Special
What is a block level element?
List block level elements
<div>
<footer>
<h1>
<hr></hr>
<p>
</p></h1></footer></div>
Difference between head and header elements?
List the three “heads” in order from first to last
Head, Header, Heading
<head>
<header>
<h1>
</h1></header></head>
What is a semantic tag in HTML?
<footer>
<header>
<nav>
</nav></header></footer>
What is an HTML entity?
List container tags?
<article>
<h3>
<p>
</p></h3></article>
List empty or void element tags?
