Web Technologies (1.3.3) Flashcards
What is HTML?
The language that web pages are written in and defines the structure and order of the webpage.
()
All code between these tags is interpreted as HTML
()
The body contains all the content in the browser content area
()
Use to link external files e.g. CSS stylesheets
Self-closing
Used in the head container
()
Contains the website metadata and is a container for all head elements.
()
Defines the title of the document, seen in the tab of the web browser.
Put inside “head” container.
<h1></h1>
, <h2></h2>, <h3></h3>
Header styles in decreasing importance (<h1> is most important)</h1>
<p></p>
Used to define a paragraph
<img></img>
Used to place an image in a webpage
Self-closing tag
Tag parameters are:
-src=”/img/myImage.png”- path to image, image name and file type
-alt =”” - text displayed if image cannot be displayed
-height=”” - height of image
-width= “” - width of image
<a></a>
Anchor tag used to add hyperlinks
Uses href=”” to define the location of the hyperlink
<div></div>
Defines a page division or section
Groups elements to format with CSS
()
Defines a form that allows a user to input data to be processed.
Uses:
- method=”post/get” -specifies HTTP method used when sending data
- action=”URL” -Where to send the data when the form is submitted
- id=”myForm” - unique form identifier
()
Defines a field where a user can enter data, used in a form element. Types: - Text (type="text") - Submit button (type="submit") - Checkbox - Email - Password
<ol></ol>
Defines an ordered list ie. 1., 2., 3.
()
Defines a client-side script e.g. javascript
May contains a link or the script itself
<a></a>
Anchor tag used to add hyperlinks
Uses href=”” to define the location of the hyperlink
<li>
</li>
Defines an element of a list, used inside unordered and ordered lists.
<ul></ul>
Defines an unordered list (uses bullet points)
What are classes and identifiers?
Class and identifier selectors are the names which you style, this means groups of items
can be styled, the selectors for html are usually the div tags.
What is the difference between a class and identifier?
Classes use a full stop to prefix the name e.g. .classname
They can be used multiple times
An identifier is defined with a # e.g. #identifiername
They must be unique, can only be used once
What is CSS?
A script/language used to describe the style of a web page by specifying how HTML elements look.
What is internal/embedded CSS?
When the CSS is places in style tags and entered directly into the HTML document.
What is external CSS?
When the CSS is placed into an external style sheet which can be accessed from the HTML using (
CSS example
Body
{
margin: 0px;
padding: 0px;
background-color: white;
font-family: Arial, Helvetica, sans-serif;
Font-size: 18px;
Text-align: center;
}CSS: background-colour
Sets background colour of element
- Takes Hex, RGB, or named colours
e. g. body{background-colour: #cccccc;}
CSS: border-color
- Sets border colour of an element
- Takes Hex, RGB, or named colours
CSS: border-style
- Sets border style
- Types are solid, dotted, dashed etc.
CSS: border-width
- Sets border width
- Takes any value in pixels
CSS border e.g.
.myDiv{
border: 2px solid #000
}
CSS: color
Sets colour of text inside element
CSS: font-family
Sets font family for selected element
CSS: font-size
Sets font size for selected element
CSS: height
-Sets height of element
CSS: width
-Sets width of element
What is javascript?
A programming language used to add interactivity to a webpage.
What is lossy compression?
Reducing the size of a file while removing some data
Lossy Compression DISADVS
Data is removed and can not be retrieved:
Could cause an image to become pixelated or a sound to lose quality
Lossy Compression ADVS
Useful in scenarios where some data loss has little effect to end user e.g. voip, images etc.
Allows for faster transmission and upload times
What is lossless compression
The file size is reduced but data isn’t lost so the original can be recovered.
Lossless Compression ADVS
No data loss
More efficient, only removes redundant data
Lossless Compression DISADVS
Compressed file bigger than a lossy compressed file
