HTML & CSS

HTML is the markup language for creating websites that can be uploaded to the World Wide Web.  It can be written in any text editor including notepad which is usually installed as standard on all computers. 

Using text editors specifically designed for writing HTML, such as Dreamweaver or Aptana, offer additional functionality to aid the writing of code.

Instructions are input to the HTML page in the form of tags and commands.  A tag is opened with the tag name which is enclosed with <> charachers, for example <body>.  The tag is then closed by enclosing with the characters </ and >, for example </body>

The fundamental components of an HTML page are the html, header and body tags.

  • The HTML tag contains the entire code for the page
  • The Head tag contains information about the site which are not directly delivered to the browser.  This can include links to external stylesheets and javascript sheets, meta tags and scripts.
  • The body tag sits below the header tag and contains all of the information that is delivered to the user’s browser.

The basic anatomy of an HTML page:

<html>

  <head>

  </head>

  <body>

  </body>

</html>

Within the body tag, content is input by enclosing within additional tags such as <div> (for divisions, i.e. sections) and <p> (for paragraphs).

 A page created using an HTML page only will deliver raw, unformatted text / images to the page with no styling.

It is possible to add styling to the HTML page by either assigning styles in the header to specific divs and classes, or by adding styles within the individual tags themselves.  However,  these methods are inefficient when creating sites with multiple sites of consistent formatting, and therefore external stylesheets are created using CSS pages.

As with HTML, CSS is a markup language that can be written on any text editor.  A single stylesheet is usually assigned to all pages of a site.  Styles are assigned to the various elements of the html page (e.g. divs).  CSS stands for Cascading Style Sheets, which is a reference to the hierarchy structure that it adheres to.  Styling assigned to a parent element applied to all child elements within.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s