EP1000

Documentation Techniques

The important function of documentation is to provide a “timely” source of information, so that

Hence a documentation tool should:

Good and popular solutions to this problem is to use a text editor and create Internet website that can be hosted on the World-Wide-Web.

Text Editors

A good text editor should be simple to use and available on a variety of platforms. The choice is arbitary, however, the following criterion are often used to make a choice:

HTML - the language of the web

All websites are developed using HTML (HyperText Markup Language). The language describes how the information is to be displayed in a web browser. Watch: How a web browser builds and displays a web page

In order make available information on the www, you need the following

Although we are NOT going to make you Web Professionals, you need a certain amount of knowledge on developing a web page as it is the most convenient method of dispensing information. It is common for a modern-day technologist to be familiar with the following technologies:

For most of our work, in presenting information, we need only a working knowledge of HTML and CSS. The following sites and tutorials give a basic introduction of HTML:

This is the basic outline of a HTML file that displays a

<!DOCTYPE html>
<html>
<head>
    <title>My First Web Page</title>
</head>
<body>
    <h1>Welcome to my first web page!</h1>
    <p>This is a paragraph.  It is just some text written without regard
    to the use of whitespace, as HTML ignores spaces, tabs and newlines.</p>
    <p>Sometimes we would want to have un-ordered lists of items, also known as,
    bullet points.  Some of the list items are links to other sites..</p>
    <ul>
        <li>Web Servers and hosting services</li>
        <li><a href="atom.io">Atom Text Editor</a></li>
        <li><a href="www.google.com">Google Search</a></li>
    </ul>

    <h2>About us</h2>
    <p>You can also imbed images in a web-page, here is a nice pictures
    of the Fablab in SP</p>

    <img src="images/fablabt11.jpg" height="30%">

    <p>I hope you enjoy the facilities here!</p>
</body>
</html>

Assignment 2

In this assignment, you will learn about HTML, develop a web page and try publishing it on your web browser. Along the way you need to do some reading, watching YouTube videos and do some basic research.

I have provided approximate timings for you so that you do NOT spend all your time (doing something you like and neglecting other modules!)

Time Task
30 min Watch at least one video on HTML to give you a fast introduction to HTML
45 min Complete one online tutorial on HTML to give you confidence in developing a webpage.
60 min Use a text editor to create a simple webpage with the specifications below.

Here is a quick guide:

  1. Use your favorite text editor and create a new file “mypage.html”.
  2. Create a basic webpage structure and save the file.
  3. Open your web-browser, drag-and-drop your file on the browser, it should be renderend (displayed) on the screen.
  4. Continue making changes in your text editor, saving it and previewing it on the broswer, until you get it right.

Specifications

Your webpage must, at a miniumum, have the following:

Sample: mypage

Questions

You must be able to answer the following questions:

  1. Why must you use a text editor to write your HTML files? Why can’t you use Microsoft Word?
  2. You have named your page “mypage.html”. Internet sites require you to name your root file “index.html”, why is that so?
  3. What are HTML links and anchors? How do you use them?

You will be required to present your work to the class as the next session.

April 2020