1.3.4 Flashcards
HTML
Hyper text markup language, is standard markup lang for web pages. HTML elements are the building blocks of HTML pages and are represented by <> tags. Can have attributes (come in name/value pairs) that provide additional info about the element.
<html>, <link></link>, <head>, <title>, <body>, <h1>, <h2>, <h3>, <img></img>, <div>, <a>, <form>, <input></input>, <p>, <li>, <ol>, <ul>,
<script> HTML is the language/script that web pages are written in, which are read by web browsers, which the interpret the tags and render the page visually. HTML elements consist of start and end tags with content in between <h1> This is a message. </h1> The main text begins with <body> and ends with </body> HTML allows a browser to interpret and render a webpage for the viewer by describing the structure and order of the webpage. The language uses tags written in angle brackets (<tag>, </tag>). There are two sections of a webpage: the body and the head. The head contains the title of the webpage and the body contains the content of the webpage. </script></ul></ol></li></p></form></a></div></h3></h2></h1></body></title></head></html>
The process of rendering a HTML file into a web page
An HTML document begins with <html> and ends with </html> - these tags are non-visual.
Next <head> tag, a container for metadata (data about data) that is placed between the <html> and <body> tags. Metadata is data about the HTML document, so it’s not displayed.
The <title> tag defines the title of the document, must be text only, and is shown in the title bar, it's a required tag for all HTML documents.
The <body> tag defines the documents main text and contains headings, paragraphs, images, hyperlinks, tables, lists. only one body tag in HTML document.
The <h*> tags are used to define headings in order of importance and size, <h1> defines most important heading, <h6> defines least important, only one <h1> per page for the main heading.
the <p> tag defines a paragraph.
Browsers automatically add a single blank line after a <p> tag.
<img></img> tag is used to embed an image in an HTML document, images are not inserted into a web page but, rather, linked to web pages. creates a holding space for the referenced image. Requires 2 attributes: cr- specifies the file path of the image. alt- specifies text for the image in the event it cant be displaced for some reason. specify width and height of image.
<a> tag defines a hyperlink, used to link one page to another. Important attribute of the <a> tag is href, indicating the links destination. links will appear as follows in al browsers:
unvisited: blue, visited: purple, active: red.</a></a></title>
The <ol> tag defines an ordered list. An ordered list can be numerical or alphabetical,
The <li> tag is used to define each list item.
The <ul> tag defines an unordered(bulleted) list.
The <li> tag I used to define each list item.
CSS
Cascading style sheets, describe how HTML elements are to be displayed on screens, paper or other media. It saves a lot of work by allowing developers to control the layout of multiple web pages at once.
Can be included directly inside an HTML file if it designed in <> tag, will only affect style of page. By using external separate style sheets, you can change the look of the entire style by amending one file.
External CSS files are linked to an HTML file using the <link></link> tag.
Properties when using CSS:
Background color, border color, border style, border width, color, font family, font size, height, width
e.g. changing the colour: <h1 style ="color:red;">Mile makes it easier to change styles globally.
To link the HTML file with external CSS file we use the HTML <link></link> tag
<link rel=”stylesheet” type=”text/css” href=”MyCSS.css>
We can also define classes in CSS files, can put different font colors and sizes for them. That way using the <div> tag the HTML file can be divided to different fonts and colors- can use multiple different styles all held on one CSS file.
Java
HTML = defining pages, CSS = layout and formatting, java= controlling behavior.
Programming language for the web, can be used to modify both HTML and CSS. You can calculate, manipulate, validate data.
<form> is used to create HTML forms for the user input. can contain 1 or more of the following:
<input></input>, <textarea>, ,button>, <select>, <option>, <optgroup>, <fieldset>, <label>, <output>
Advantages of using JavaScript:
- Local computer can deal with invalid data before it is sent off to the servers,
- Eases the load on busy servers
- Reduces web traffic
</output></label></fieldset></optgroup></option></select></textarea></form>
Java outputs
Inputs from HTML forms can be retrieved from a webpage and handled using JavaScript:
Outputs:
Changing the attributes of a HTML element:
chosenElement = document.getElementById(“example”);
chosenElement.innerHTML = “Hello World”;
Writing directly to the document:
document.write(“Hello World”);
Displaying an alert box:
alert(“Hello World”);
search engines
A search engine is a program that searches through a database of internet addresses looking for resources based on criteria set by the client.
Makes the job of finding info on the web easier, when you submit a search via a search engine, it run your request against an index.
Indexing is the process of a SE collecting, sorting and sorting data in its index. Therefore, the index is the place where all the data the SE has gathered is located. Seeing results appear = SEI that provide it.
Searching the index is fast. However, the index must be constantly updated so that new sites/pages are added, old sites/page are removed, broken links are updated.
Search engines use programs - spiders/crawlers- that travel across the world wide web. They index any pages, content, metadata they find and map links between page by following all external/internal links. By this they continuously add to/update the index
They display the most high-quality websites with relevant content at the top of the page.
pageRank
Used to help compile and rank website pages and the list of results returned by a search engine. Higher-ranked pages will show up first.
There are two factors that determine the page rank of a page:
- How many incoming links it has from other web pages
- The page rank of the web pages that link to it
The assumption is that website of greater importance is more likely to be linked to from other websites.
pagerank
applying pagerank algorithm
calculating parts of pagerank algorithm
calculating first iteration
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.
ADV
● Does not require plugins
● Can perform large calculations much faster than clients
● Not browser dependent,
● More secure
Client side Processing
Client side processing is when a client processes the data on a local device. This means
that all of the information is processed on the client computer. This is also called client side
scripting, and uses languages such as JavaScript. This is useful for the following reasons:
● Webpage can immediately respond to user actions
● Executes quickly
● Gives developers more control over the behaviour and look of the website
