In my recent computing lessons I have been studying web page design, and how HTML and CSS are used to create web pages. HTML is an acronym that stands for Hyper Text Mark-up Language, and is used to annotate textual information which is the content of web pages, so that a web browser can interpret and the information that it is sent and represent it as a web page on the screen. HTML primarily maintains the structure of a web page; as it does not contain any of the content, and in addition can be used to design it although this is uncommon these days, because CSS can be used instead which generally results in less time being wasted. This is because each page does not need its design changed as laboriously as when using tags for design, and can simply refer to a ‘stylesheet’ or an internal/inline style.
Another mark-up language used by web page designers and others is XML, which refers to 'Extended Mark-up Language' and is used to transport information. Individuals devise their own tags, and as such they can invent different ones for many different purposes. Overall, XML transports web page data, whilst the HTML is responsible for formatting and displaying it. Furthermore, HTML and XML are only two of many mark-up languages which are used to inform how something should be displayed, often used by printers and operating systems. For the exam I must know some of the essential tags used when making pages through HTML. These include <html> to start and finish a web page, as well as <head> and <title> to give the web browser information about the page obviously including the title, <body> which contains the body of the text in addition to <strong> and <em> which change the style of the text, making it either in bold or italics. Two other important tags are <ol> which creates a list and <li> which creates an item in a list. Critically I must also know that all tags used must be closed by using the same tag again with a forwards slash, an important example being </html> at the end of a web page.
CSS (or Cascading Style Sheet) is used to define the style of a web page separate to the HTML, and may be internal, external or inline. Internal CSS is used when information about a particular piece of text for example is kept inside the web page with the text, whilst external CSS is used when this information is kept in a separate stylesheet. The other type of CSS is inline, which involves maintaining this design inside the web page, but separate from the content – making any style applicable to any part of the web page. This can be useful as different texts can be set to different ‘styles’ one has created, but inline and internal CSS still involve changing the design inside each web page which wastes time, making external CSS the most efficient, and as such that is most commonly used.
CSS selectors can be used to change backgrounds, as well as the properties of some text and many other factors. An example of an inline style is shown below, which is typical of the way that inline selectors are set out and used to specify the characteristics of some text. This inline style is presented below inside the head of a page coded with HTML.
<html>
<head>
<title>Test page</title>
<style type=”text/css”>
.test{
font-family:Arial;
font-color:red;
font-size:16px;
}
</head>
<body>
<br/>
<br/>
<p class=”test”>This is a test page.</p>
</body>
</html>
One final thing worth mentioning in this post is the three main types of colour schemes used within web pages. The simplest is monochromatic, which is a single colour or different shades of one colour. The other two however are comprised of more than one. Analogous colour schemes are comprised of colours which are close together on the colour wheel, whilst complementary ones are comprised of different colours on opposite sides of the colour wheel, generally the same distance from the centre.
One final thing worth mentioning in this post is the three main types of colour schemes used within web pages. The simplest is monochromatic, which is a single colour or different shades of one colour. The other two however are comprised of more than one. Analogous colour schemes are comprised of colours which are close together on the colour wheel, whilst complementary ones are comprised of different colours on opposite sides of the colour wheel, generally the same distance from the centre.
An excellent and thorough summary. The next step for you would be to carry on doing some HTML/CSS coding (perhaps try one of the free tools - or any other tool) - to consolidate your knowledge
ReplyDelete