Not a premium member yet? Save 100's of hours on lesson prep with a comprehensive library of GCSE Computer Science resources - including worksheets, tests, and PowerPoint presentations.
Download the complete GCSE Computer Science bundle including all teacher resources and student revision:
- 200+ Computer Science/ICT resources
+ any we release in the future!
- Access to all student revision notes
- OCR, AQA, Edexcel and WJEC compatible
- New 9-1 GCSE spec
HTML (Hypertext Markup Language) is the recognized markup language utilised in forming web pages. It defines the composition of web pages using markup. HTML elements are the primary units of HTML pages. HTML elements are denoted by tags. HTML tags label parts of content like heading, paragraph, and table. Browsers do not show the HTML tags but they are used to deliver the content of the page.
HTML tags are element names enclosed by angle brackets. HTML tags usually come in pair. The first tag in a pair is the start tag and the second tag is the end tag. The end tag is written like the start tag, but with forward slash inserted before the tag name. The start tag is also called the opening tag and the end tag the closing tag.
All HTML documents must start with a document type declaration: <!DOCTYPE html>. The HTML document itself begins with <html> and ends with </html>. The visible part of the HTML document is between <body> and </body>.
HTML tags are not case sensitive.
All HTML elements can have attributes. They provide additional information about the element. They are always specified in the start tag. They usually come in name/value pairs.
CSS (Cascading Style Sheets) defines how HTML elements are to be presented on screen, paper or other media. It saves a lot of work since it can control the layout of multiple web pages simultaneously.
Ways to add CSS to HTML Elements
- Inline – used to apply a unique style to a single HTML element. It uses the style attribute of an HTML element.
- Internal – used to describe a style for one HTML page. It is indicated in the <head> section of an HTML page, within a <style> element.
- External – used to define the style for many HTML pages by using an external CSS file. You can change the look of an entire website by changing one file. This is most common way to add CSS to HTML elements.
Structure vs. Presentation
The composition of a webpage could be regarded as a mixture of the following four elements:
- Content is the general term used for all the browser-displayed information elements like text, audio, still images, animation, video, multimedia and files of web pages. It does not require any additional presentational markups or styles in order to fully relay its message.
- Structure is the custom of using HTML on content to transmit substance and to define how blocks of information are structured to one another. Examples: “this is a list” (i, d, k), “this is heading and subheading” (<h1>, <h2>, …, <h6>), “this section is related to” (<a>), etc.
- Presentation of Style is anything related to how the content and structure is presented. Examples: size, color, margins, borders, layout, location, etc.
Most of the time it is difficult to clearly distinguish content from structure. For example, the <img> tag, as a structural element, is used to produce graphical content. In practice, the composition of a webpage can simply be viewed as a mixture of three elements: Structure, Presentation, and Behavior.
The following terms: separation of content and presentation, separation of meaning and presentation and separation of structure and presentation are being used correspondingly. Nonetheless, all of these terms basically refer to the separation of the content made meaningful by structure and presentation or simply the separation of the structure (HTML) and presentation (CSS).
The main goal of HTML 4.01 is the separation of structure and presentation. As specified in the section 2.4.1 of HTML 4.01.