Resolution – Measured in mega pixels, typically the larger the better.
Optical Zoom – How close you can make the image appear without losing any quality.
Touch Screen
Resistive – Single touch
Capacitive – Multi touch
output devices
Printers
Resolution – Measured in DPI (dots per inch)
Speed – Measured in PPM (pages per minute)
Type – Laser or Ink Jet
Monitors
Size – Measured diagonally in inches (9″,21″)
Resolution – Measured in pixels (1920×1080)
Type – LCD/TFT uses a flat panel of coloured cells to change the colour of the light shining through it. OLED uses a matrix of tiny LEDs to produce an image.
processor type – How many bits can be processed in a single operation (16bit, 32bit, 64bit )
number of processors – Single Core, the processor can appear to do more than one thing at a time using time slicing. Multi core, different processes are run on different cores.
Processor speed (Hz) – The number of times per second the processors voltage is switched, this allows the processor to carry out an operation. Typically measured in Gigahertz (GHz).
memory
RAM – Volatile, losses contents when power disconnected. Dynamic, requires constant refreshing to remember contents.
ROM – Non Volatile, contents kept when power disconnected. Not writeable, contents can not be changed.
cache – Located on (or very near) processor. Static, contents do not need refreshing.
device type
Desktop – Used for tasks that require a fair amount of processing power and storage.
Laptop – Portable devices that use a battery and keyboard.
Tablet – Ultra Portable device that uses a battery and touch screen.
Smartphone – Small Ultra Portable device that uses a batter and small touch screen.
Including sections of program code in your website, to help make it more dynamic or interactive, is called scripting.
Client-side scripting
A section of code is sent to the client computer and executed there, in the browser.
It is commonly used to add interactive elements to a webpage.
JavaScript is a language commonly used for client-side scripting.
Server-side scripting
A section of code is executed by the web server.
It is commonly used to create dynamic webpages, often connected to a database on the server.
Popular languages for server-side scripting include PHP, ASP, Perl and ColdFusion.
SEO (Search Engine Optimisation)
SEO is the process of improving the ranking of your webpage in search engine results, in order to increase traffic.
Some SEO techniques include:
Making sure each page of your site has a unique, concise and descriptive title contained in the <title> tag.
Using the description <meta> tag to include a summary of each page.
Using concise URLs.
Submit an XML sitemap to the companies which run the search engines
Using brief, descriptive filenames and alt text for images
Search engines and web crawlers
A web crawler (aka spider) is a piece of software which follows links from web page to web page, analyses the text on each page, and indexes the pages with related keywords.
Search engines then use this index to find relevant pages when you carry out a search.
Optimisation of code
Load times of webpages affect traffic. By making code more efficient, file sizes, and therefore load times, can be reduced.
Some techniques include:
Using a single CSS file to hold all the formatting information for the site.
Putting all JavaScript into a single external file, to reduce fetches from the server.
Remove/reduce internal commentary and white space.
Thank you to C O’Toole & A Madill from Braidhurst High School for allowing me to edit and publish this here.
Write the answer for the question in an A4 pad. If you get stuck go research the answer in the “how to pass book” ( you can add this information to the powerpoint for future reference).
The answer are displayed in Yellow, so you can check them. Don’t just copy the answer!
Use the higher course summary sheet to traffic light the section the questions came from, that way you are building a picture of the areas of the course that confuse you.
Green got it right without research
Yellow got it right after research
Red got it wrong
Use the course summary to plan your next revision target
Write the answer for the question in an A4 pad. If you get stuck go research the answer in the “how to pass book” ( you can add this information to the powerpoint for future reference).
The answer are displayed in Yellow, so you can check them. Don’t just copy the answer!
Use the N5 course summary sheet to traffic light the section the questions came from, that way you are building a picture of the areas of the course that confuse you.
Green got it right without research
Yellow got it right after research
Red got it wrong
Use the course summary to plan your next revision target
The structure of a website can be planned using a site map. This will show how the pages in the site link together, usually in a hierarchical structure.
The layout of individual pages can be planned using wireframes. These will show how text, graphics, links, etc will fit together on the page.
You may also consider noting formatting information, such as colours and fonts to be used.
Multi Level Structure
A multi-level navigation structure involves sub-levels of navigation.
It can be useful for keeping websites with a lot of information organised.
For example, the BBC website, allows you to choose a category, then another category within that, then another category within that, and so on.
HyperText Markup Language
HTML is a language used to define the content of a webpage, using a variety of tags.
An HTML page begins with the <head> element. This can include a variety of other elements which give information about the page, such as the title, meta information, location of style sheets, etc.
After the <head> comes the <body>. The <body> element contains the content to be displayed.
Some more advanced HTML tags you should know:
Tag
Notes
Example
<title>
Included in the <head> element of the page.
Defines a title in the browser toolbar
Displays a title for the page in search engine results
Provides a title for the page when it is added to favourites
<title>
ACME Corporation home page
</title>
<meta>
Included in the <head> element of the page.
Provides information about the page, not visible in the browser.
There is no ending </meta> tag.
Example 1
<meta name=”description” content=”ACME Corporation – Unlikely contraptions for all your needs”>
Allows CSS (see below) styles to be defined within an HTML document
Included in the <head> element of the page.
<style>
p{margin-left:20px;}
body{
background-image:url(“background.gif”);
}
</style>
<script>
Used to define a client-side script (see below), such as JavaScript.
Alternatively, can provide a link to an external script file.
Example 1
<script>
document.write(“Hello World!”)
</script>
Example 2
<script src=”js/lightbox.js”>
</script>
<button>
Used to create a clickable button
<button type=”button”>Click Me!</button>
CSS Cascading Style Sheets
CSS is a language used to define the look and formatting of HTML documents.
CSS can be included within an HTML document, but it is preferable to link the HTML to a separate CSS file.
Using a separate CSS to define the formatting of HTML documents can help to give a consistent look across a website, save time and create more efficient code.
The look of all pages in a site can be changed by editing only the CSS file.
CSS can be used to provide different style rules depending on the type of device being used to view the webpage.
The rules of cascading stylesheets state that:
embedded styles within the text over-rule all others
document level styles, defined in the document , over-rule external Stylesheets
external stylesheets only apply if they are not over-ruled by the other 2 methods
body
{
background-color:#d0e4fe;
}
h1
{
color:orange;
font-weight:bold;
}
p
{
font-family:”Times New Roman”;
font-size:20px;
}
This CSS sets the background colour for the body of the page, the colour and style of any text within <h1> tags, and the font and size of any text within <p>.
Any HTML file which is to use this formatting would simply include a line like this in the <head> section:
Where “mystyle.css” is replaced with the name of the CSS file.
Static Webpages
A static webpage looks exactly the same every time it is accessed, the content does not change.
Dynamic Webpages
Dynamic webpages can contain different content depending on the conditions in which they are accessed, meaning that users can be presented with a page relating specifically to their needs.
Database-driven pages are the most common example of dynamic pages. If information changes in a database which the page accesses, then the content of the page will change to reflect this. For example, online shopping, banking, buying tickets, etc.
Interactive Webpages
Interactive webpages offer a more immersive experience, allowing the user’s actions to affect the content. Creating interactive pages usually involves the use of JavaScript or Flash.
Scripting
Including sections of program code in your website, to help make it more dynamic or interactive, is called scripting.
Client-side scripting
A section of code is sent to the client computer and executed there, in the browser.
It is commonly used to add interactive elements to a webpage.
JavaScript is a language commonly used for client-side scripting.
Server-side scripting
A section of code is executed by the web server.
It is commonly used to create dynamic webpages, often connected to a database on the server.
Popular languages for server-side scripting include PHP, ASP, Perl and ColdFusion.
Compression
Appropriate use of compression can reduce the load times of webpages.
The webpage itself can be compressed, reducing the amount of data which has to be sent to the client computer. The browser will decompress the page before displaying it.
SEO (Search Engine Optimisation)
SEO is the process of improving the ranking of your webpage in search engine results, in order to increase traffic.
Some SEO techniques include:
Making sure each page of your site has a unique, concise and descriptive title contained in the <title> tag.
Using the description <meta> tag to include a summary of each page.
Using concise URLs.
Submit an XML sitemap to the companies which run the search engines
Using brief, descriptive filenames and alt text for images
Search engines and web crawlers
A web crawler (aka spider) is a piece of software which follows links from web page to web page, analyses the text on each page, and indexes the pages with related keywords.
Search engines then use this index to find relevant pages when you carry out a search.
Optimisation of code
Load times of webpages affect traffic. By making code more efficient, file sizes, and therefore load times, can be reduced.
Some techniques include:
Using a single CSS file to hold all the formatting information for the site.
Putting all JavaScript into a single external file, to reduce fetches from the server.
Remove/reduce internal commentary and white space.
Accessibility
Web accessibility means making sure that all users can easily access and navigate your website.
Some ways in which accessibility can be improved include:
Using CSS media queries to identify the type of device accessing the webpage, and adjust display accordingly.
Using appropriate alt text for images, as these can be read by reader software.
Make all functionality accessible from the keyboard.
Make all text content easily readable and understandable.
Usability
Usability refers to how easy your website is to use.
Some ways in which usability can be improved include:
Making main navigation easily identifiable, with easily identifiable links.
Using consistent style throughout.
Ensuring the most important content is above the “fold” (the point where the bottom of the screen cuts off the page).
Including a clear path to contact details and information about the organisation.
Beta testing
Beta testers carry out testing on the final website before it goes live.
Beta testers could be anybody not involved in the development of the site, such as potential customers.
The purpose of beta testing is to identify any problems that occur in normal use.
Usability testing
Usability testing involves testing how easy the website is to use.
Eye-tracking
Eye tracking software and hardware allows testers to analyse the way in which a user reads the information on a webpage.
This can help in adjusting the layout to focus attention on the most important information.
Think aloud
Think aloud testing involves users describing their thought process as they try to complete a task on a website.
This can help in identifying design issues which may cause problems for users.
The 
