describe the function of HTML.
it is the language/script that web pages are written in
it allows a browser to interpret and render a web page for the viewer by describing the structure and order of the web page
<html></html>
all code written within these tags is interpreted as HTML
<body></body>
defines the content in the main browser content area
<link></link>
used in the head to link to an external CSS file
<head></head>
defines the browser tab or window heading area
<title></title>
defines the text that appears with the tab or window heading area
<h1></h1>, <h2></h2>...
heading styles in decreasing sizes
<p></p>
a paragraph separated with a line space above and below
<img src = ‘location’, height=x, width = y>
self closing image with parameters for image and dimensions
<a href= ‘location’> link text </a>
anchor tag defining a hyperlink with location parameters
<ol></ol>
defines an ordered list
<ul></ul>
defines an unordered list
<li></li>
defines an individual list item
<i></i>
italic text
<b></b>
bold text
<del></del>
crossed-out text
<ins></ins>
underlined text
<div id= “page”></div>
creates a division of a page into separate areas each which can be referred to uniquely by name
<input type = “type“>
specifies an input field where the user can enter data
can be many various input types (e.g. text box, radio, button)
self closing
<form action="URL"></form>
creates an HTML form for user input
the elements of the form are enclosed within the <form> tags
the form data is sent to ‘URL’ when it is submitted
what is the type parameter for <input> tags to create a text box?
“text”
what is the type parameter for <input> tags to create a submit button?
“submit“
what is a selector?
names groups of elements which you style
for example: classes, identifiers, and HTML elements (such as h1 or p)
identifiers and classes can be set within element tags using id = ‘ ‘ and class = ‘ ‘
what is a class?
a selector that can be used multiple times on a web page
defined with a full stop as a prefix to the class name
what is an identifier?
a selector that must be unique to each web page // only used for one element
defined with an initial hashtag ( # )
what is CSS?
it is a script/language like HTML but it is instead used to describe the style of a web page
CSS can be used to specify the way HTML elements look, it can be applied to whole tags such as <h1>, <p> or <div>
what is inline CSS?
an element is styled when it is defined, using the style attribute and within the element’s tags
this is a form of internal CSS in which elements are styled individually
e.g. <h1 style=”color : red;”> heading text </h1>
what is internal CSS?
defines the styling for a single HTML page
defined in the <head> section of an HTML file, within <style> tags
what are the drawbacks of using internal/inline CSS?
changes to formatting have to be made separately for each HTML page
it is a lot of work to keep the look of the site consistent
the site is slower to access for users (as the formatting information is reloaded for every page)
what is external CSS?
external style sheets are used to define the style of many HTML pages
the link to the style sheet is added to the <head> section of the HTML page
e.g. <link rel=”stylesheet” href=”styles.css”>
what are the benefits of using external CSS?
content and formatting are kept separate
changes can be made to the external style sheet and affect the whole site, saving time and ensuring consistency
style sheets can be changed for different themes, or different devices
background-color
sets the background colour of an element
border-style
specifies what kind of border to display (e.g solid or dotted)
border-width
specifies the width of the four borders, can be in pixels
border-color
sets the border colour of an element
color (named and hex colours)
sets the colour of text
font-family
specify the font of a text
font-size
specifies the size of the text, can be in pixels
height/width
sets the height/width of an element, in pixels
describe the features and functions of JavaScript.
it is a language that runs in a web browser, that can be embedded into HTML with the <script> tag
it’s main function is to add interactivity to websites
it isn’t compiled, instead it is interpreted
this is as it is likely to be run on a variety of machines with different architectures/processors (interpreted code is machine independent)
what are the advantages of using JavaScript for client side processing?
can be used to input data on the client's computer
the local computer can fix invalid data before sending it off to the servers,
it can ease the traffic off of the busy servers
chosenElement = document.getElementById(“example”)
chosenElement.innerHTML = “Hello World”
changes the text of the ‘example‘ HTML element to ‘Hello World‘
document.write(“Hello World”)
writes ‘Hello World‘ directly into the HTML page
alert(“Hello World”)
creates a pop-up box with the text ‘Hello World‘ and an OK button
what is a search engine?
a program that searches through a database of internet addresses looking for resources based on a criteria set by the client
it will run the user request against its index, which must be constantly updated as new sites are made and old ones are removed
what is search engine indexing?
the process of a search engine collecting, sorting and storing data in its index
what is the purpose of web crawlers?
web crawlers are used to collect information
they work by traversing the internet web page by web page looking for linked sites
they index any pages, content (keywords and phrases) and metadata they find
robots.txt files can be used to instruct web crawlers
what is the PageRank algorithm?
an algorithm used by Google to rank website pages, and compile the list of results returned by a search engine
higher ranked pages will show up first on the search engine
what three features determine the PageRank of a page?
how many incoming links it has from other web pages
the PageRank of the web pages that link to it
how many outgoing links it has to other web pages
what is the dampening factor in the PageRank algorithm?
a value between 0 and 1
probability that a user will not follow a link
what is server side processing?
server side processing is when a client sends data to a server for it to be processed
this means no information is processed on the client computer
common server side scripting languages are SQL or PHP
what is a server?
a device which provides a central point of control/access
what are the benefits of server side processing?
doesn’t require plugins
can perform large calculations much faster than clients
not browser dependent
it’s more secure
name a process requires server side processing.
encoding data into readable HTML
queries and updates to the server database
complex calculations
what is client side processing?
client side processing is when a client processes the data on its local device
this means all of the information is processed on the client computer
this is also called client side scripting, and uses languages such as JavaScript
what are the benefits of client side processing?
web page can immediately respond to user actions
executes quickly
gives developers more control over the behaviour and look of the website
name a process requires client side processing.
initial data validation
applying website styles
manipulating UI elements
why are inputs often checked client-side and server-side?
client side processing can be modified/altered by the user
to prevent malicious code (such as an SQL injection / XSS)
to prevent non-validated inputs being sent to the server
browser may not support client-side language // scripting could be turned off