An overview of the World Wide Web

The World Wide Web, or the Web, is one of the more popular mechanisms for disseminating all types of information to people. We can present people with words, images, video, or audio - usually without the user having to install additional software or viewers on their computer. For some video and audio clips, additional software may be needed, but for the most part, computers purchased today come "web browser" ready. In addition to receiving information from the Web, people also want to create their own web pages and disseminate this information; they want to create their own home page on the Web. To create an HTML page, most people use an HTML editor - which assists you in inserting the correct HTML tags (commands) into your document. Because there are so many editors available, this tutorial is written such that a command is introduced along with its usage and format; i.e., how you enter a tag without necessarily using an editor. At the end of this tutorial you will find a link to a large collection of not only HTML editors, but various other tools available for Web users.

Understanding and using HTML

What is HTML
HTML stands for HyperText Markup Language. HTML is a subset of SGML (Standard General Markup Language) and is the language used to define the layout and attributes of a World Wide Web document as well as to create links between web documents (documents being text, sound, or graphics). HTML may appear intimidating at first, but once you begin to get the feel of it, there is little to be worried about; ten different coding commands will take care of 99% of your needs. Also, as html editors become more sophisticated, you will find they can do a lot of the "work" for you.

URL: Uniform Resource Locator

If you watch television, read magazines and newspapers, or receive mail at your home, you have probably seen a "URL" (uniform resource locator). When someone has information they want you to access via the Web, they'll give you its electronic address, its URL. URLs are unique to each document and are a relatively easy way to navigate between the millions of online documents. Knowing a documents URL allows you to go directly to it; from most browsers you can go to the tool bar and click on the "open" button or go to the "File" menu and choose the option "Open URL" or "Open file". Regardless of which method you choose, a box will appear on your screen where you can enter the URL of the information you wish to access. For example, to access information on using a web conferencing system called NetForum I would provide its URL: http://www.biostat.wisc.edu/nf_home/ You would then enter this in its entirety and click on "open." Be sure to enter a URL exactly as it appears since they are case sensitive.

Compiled By:-

Pankaj Kumar Bahety

Methods of preparing an HTML document

There are several ways an HTML document can be prepared: use an HTML editor such as HTML Assistant (used in this class; basic HTML tags are already built in and you select the text and just point and click on the desired tag located on the tool bar) use an HTML editor provided in your Word Processor (Microsoft Internet Assisstant for Word for Windows 6.0) create an ASCII text file (using a text editor such as TED, BBEdit, DOS edit, or any word processor that can save ASCII text) convert a Rich Text Format (RTF) file to HTML (most word processors give you an option of saving a file as RTF).

There are dozens of HTML editors and converters available, both free and commercial. Our philosophy is that no matter how good the HTML editor or converter, you'll have to do some tweaking at some time, so knowing what all the HTML tags mean is important. We make no recommendations on editors, but we will mention that Netscape Gold comes with its own editor and many word processors are now coming "HTML ready" (ie, have mechanisms for adding tags). Regardless of what editor you use, most of them have a toolbar with the different tags available and you select your text and then point and click on the appropriate tag.

HTML file extensions and the source document

When naming HTML files, keep in mind that some clients require your file name to have a ".html" extension (for DOS/Windows users, this is a ".htm" extension). To be safe, all HTML files you create should use the ".html" naming convention. You can view the HTML tags for any HTML document by looking at the "source" document that contains the HTML tags, usually called "View Source" or "View Document Source" from the "View" menu on most clients. Using this option is a nice way to learn new things as well as refresh your memory when working with HTML tags.

Basic HTML commands

This section covers some basic HTML commands and explains the steps involved in preparing a document for viewing via the World Wide Web. Basic steps: using tags HTML uses tags to communicate to the client (browser) how to display text and images. Tags are contained in < > symbols. In most cases you start with the beginning tag, put in the word or words that will be affected by this tag, and at the end of the string of word(s), you place a closing tag. For example, to create a title for a document you would do the following: <title>My First HTML Document</title> The closing tag normally contains a "/" before the directive to indicate the termination of the action. HTML tags are not case-sensitive, although URLs generally are. In most cases (with the exception of preformatted text) HTML collapses many spaces to one space and does not read blank lines. However, when you write your text you should leave several blank lines between paragraphs to make editing your HTML source document easier.

Compiled By:-

Pankaj Kumar Bahety

The HTML tag Although not currently required by all clients, the <html> tag signals the point where text should start being interpreted as HTML code. It's probably a good idea to include it in all your documents now, so you don't have to go back to your files and add it later. The <html> tag is usually placed on the first line of your document. At the end of your document you should close with the </html> tag.

The head tag Just like the header of a memo, the head of an HTML document contains special information, like its title. The head of a document is demarcated by <head> and </head> respectively. For the purposes of this class, only the title tag, below, should be included in the document head. A typical head section might look like <html> <head> <title>My First HTML Document</title> </head>

Titles A title tag allows you to specify a Document Title in your browser window. When people make hotlists, this title is what they see in their list after they add your document. The format is: <title>My First HTML Document</title> Remember, the title usually doesn't appear in the document itself, but in a title box or bar at the top of the window.

The body tag Like you might expect, the body tags <body> and </body> define the beginning and end of the bulk of your document. All your text, images, and links will be in the body of the document. The body should start after the head. A typical page might begin like <html> <head> <title>My First HTML Document</title> </head> <body>

Headers There are up to six levels of headers that can be used in your document, h1 through h6. Header 1 is the largest header and they get progressively smaller through header 6. Below are each of the six headers and how they usually appear in relation to one another. <h1>This is a header 1 tag</h1> This is a header 1 tag <h2>This is a header 2 tag</h2> This is a header 2 tag

Compiled By:-

Pankaj Kumar Bahety

<h3>This is a header 3 tag</h3> This is a header 3 tag <h4>This is a header 4 tag</h4> This is a header 4 tag <h5>This is a header 5 tag</h5> This is a header 5 tag <h6>This is a header 6 tag</h6> This is a header 6 tag Headers, as you notice, not only vary in size, they are also bold and have a blank line inserted before and after them. It's important to use headers only for headings, not just to make text bold (we cover the bold tag later).

Paragraphs In HTML, a paragraph tag <p> should be put at the end of every paragraph of "normal" text (normal being defined as not already having a tag associated with it). <p> causes a line break and adds a trailing blank line <br> causes a line break with no trailing blank line As a convenience to yourself and others who might have to edit your HTML documents, it's a very good idea to put two or three blank lines between paragraphs to facilitate editing.

Preformatted text The preformatted text tag allows you to include text in your document that normally remains in a fixed-width font and retains the spaces, lines, and tabs of your source document. In other words, it leaves your text as it appears initially or just as you typed it in. Most clients collapse multiple spaces into one space, even tabs are collapsed to one space. The only way to circumvent this is to use the preformatted tag. Visually, preformatted text looks like a courier font. <pre>this is an example of a preformatted text tag</pre> And this is how it displays: this is an example of a preformatted text tag

Boldface and Italics You can add emphasis to text by using the boldface and italic tags or the emphasis and strong tags. There is an underline tag as well, but most people don't use it since text that is linked is often underlined. The potential for confusion and the archaic nature of underlining in general make it a poor marker for emphasis. When using these tags, you usually cannot (and probably should not) have text that is both boldface and italics; the last tag encountered is usually the tag that is displayed. For example, if you had a boldface tag followed immediately by an italic tag, the tagged word would appear in italics.

Compiled By:-

Pankaj Kumar Bahety

Physical tags This is a <b>boldface</b> tag. This is how boldfacing appears. This is an <i>italic</i> tag. This is how italics appear. Logical tags This is a <strong>strongly emphasized</strong> tag. This is a strongly emphasized tag. This is an <em>emphasized</em> tag. This is an emphasized tag. There is a subtle distinction between the above "physical" tags which merely change the displayed font, and "logical" styles which are used (or eventually will be) to make types of emphasis client specific (for instance, using the <em> tag would make text red). While either style is fine, be aware that differences in these two kinds of tags may be more apparent with advances in HTML.

Lists There is an easy way in HTML to have numbered, unnumbered, and definition lists. In addition, you can nest lists within lists. When using lists, you have no control over the amount of space between the bullet or list number, HTML automatically does this for you. Neither (as yet) do you have control over what type of bullet will be used as each browser is different. Unnumbered lists Unnumbered lists are started with the <ul> tag, followed by the actual list items, which are marked with the <li> tag. The list is ended with the ending tag </ul>. For example, here is an unnumbered list with three items: <ul> <li> list item 1 <li> list item 2 <li> list item 3 </ul> Here is how that list would display: Numbered lists Here is the same list using a numbered list format: <ol> <li> list item 1 <li> list item 2 <li> list item 3 </ol> Here is how that list would display: 1. 2. 3. list item 1 list item 2 list item 3 list item 1 list item 2 list item 3

Compiled By:-

Pankaj Kumar Bahety

Definition lists Definition lists allow you to indent without necessarily having to use bullets. <dl> <dt> This is <dd> This is <dd> And yet <dt> Another <dd> Another </dl>

a term a definition another definition term definition

And here is how this would be displayed This is a term This is a definition. And yet another definition. Another term Another definition Nested lists Finally, here is a nested list within an unnumbered list (we could just have easily had a nested list within a numbered list). <ul> <li> list item 1 <ul> <li> nested item <li> nested item </ul> <li> list item 2 <ul> <li> nested item <li> nested item </ul> <li> list item 3 <ul> <li> nested item <li> nested item </ul> </ul>

1 2

1 2

1 2

Here is how that list would display: list item 1 o nested item 1 o nested item 2 list item 2 o nested item 1 o nested item 2 list item 3 o nested item 1 o nested item 2

Blockquote The blockquote tag indents the text (both on the left and right) inside the tags. The blockquote tag looks like this: <blockquote>...</blockquote> and displays like this:

Compiled By:-

Pankaj Kumar Bahety

Blockquoted text is often used for indenting big blocks of text such as quotations. The text will be indented until the ending tag is encountered. Again, note that the text here is indented on both the left and the right margins.

Center You can center text, images, and headings with the center tag: <center>This is a centered sentence</center> This is a centered sentence. The center tag automatically inserts a line break after the closing center tag. Horizontal Rule To separate sections in a document, you can insert a horizontal rule tag <hr>. A horizontal rule is displayed as follows: Addresses The <address> tag normally appears at the end of a document and is used most frequently to mark information on contacting the author or institution that has supplied this information. Anything contained within the address tag appears in italics. The address tag is another example of a logical tag, and although it currently does nothing but make text appear in italics, this could change as HTML code advances. Here is an example of how an address might appear: <address> Introduction to HTML / Pat Androget / Pat_Androget@ncsu.edu </address> And it would appear as: Introduction to HTML / Pat Androget / Pat_Androget@ncsu.edu

Comments It is possible to include comments in a source HTML document that do not appear when seen through a browser. This is most useful for giving warnings and special instructions to future editors of your document. Comments take the form: <!-----This comment will not appear in the browser-----> The comment can even break lines <!----This comment won't be seen by anyone either even though it's broken between lines--->

Strike-through Should you want it, there is a strike-through tag which displays text with a strike. <strike>This is struck through text</strike> displays as This is struck through text

Compiled By:-

Pankaj Kumar Bahety

Special Characters Finally, if you often use the characters which make up HTML tags (such as < >, and &), or you use special characters not in the ascii standard, you will have to use special tags. Here are the codes: &aacute; .... &acirc; .... &aelig; .... &agrave; .... &amp; .... & &aring; .... &atilde; .... &auml; .... &ccedil; .... &eacute; .... &ecirc; .... &egrave; .... &eth; .... &euml; .... &gt; .... > &iacute; .... &icirc; .... &igrave; .... &iuml; .... &lt; .... < &ntilde; .... &oacute; .... &ocirc; .... &ograve; .... &oslash; .... &otilde; .... &ouml; .... &quot; .... " &szlig; .... &thorn; .... &uacute; .... &ucirc; .... &ugrave; .... &uuml; .... &yacute; .... &yuml; ....

HTML commands for links

The real power of HTML is its ability to link to other documents and pieces of text, images, video or audio. Links are usually highlighted or underlined in a document so that you know of their existance. Clicking on the link opens up the document for viewing. Linking to other documents To link to a file on a Web server, your HTML tag would look like: <a href="http://www.ncsu.edu/">Welcome to NCSU</a> The text that appears between the beginning and ending tags ("Welcome to NCSU" in the above example) is the text that is the link the reader clicks on to go to that URL. When you make a link, imagine you're creating two anchor points: one exists in your document (the text to click on), while the other is the document to which you're linking. You basically create a thread between two points. Here are what the parts mean: <a -- starts the anchor href -- stands for "hypertext reference" http://www.ncsu.edu/ -- the URL of the other document Welcome to NCSU -- the text that will appear and be clickable /a> -- ends the anchor As long as you know the URL for a file, you can create a link to it.

Linking to a named anchor Anchors within the same document To link to a specific section within the same document, you must define an anchor name inside the document and then link to it. For example, if you were linking from the top of a document titled "chapter2.html" to the fourth paragraph of this same document, you'd give the fourth paragraph a name (any name, you make it up), in this case "important," and you'd create a link to this name instead of a URL. Continuing on with the above example. We are creating a link from the top of "chapter2.html" to the fourth paragraph; we are going to call this link "important". First, you would define the name "important" in the fourth paragraph with the name tag <a name="important">First sentence in fourth paragraph</a> Next, create the link to this "important" anchor (at the start of "chapter2.html"). It would look like: <a href="#important">link to important stuff</a>

Compiled By:-

Pankaj Kumar Bahety

The pound sign in front of the anchor name tells the browser to look for the link inside the document already loaded instead of looking elsewhere in another file. Note that anchor names are case sensitve, and that some kind of non-blank text must appear in the named anchor tag. Named anchors within another document There may be times when you not only want to link to a specific document, but more precisely, you want to link to a particular section of that other document. As an example, suppose you wish to set up a link from the document "Our first HTML document" to a particular section in a second document called "chapter2.html". First, you set up a named anchor in the document you are linking to (chapter2.html). To do this, go to the section in your second document where you want the reader to begin and define a named anchor. Name this anchor "important". Insert the following tag in the appropriate place in the second document: <a name="important">some text</a> Now to create the link in your first document. In your first document you need to include not only the file name, but the name you defined for the anchor. This named anchor is separated from the file name by a pound sign (#). Place this tag where you want the link to show up (the highlighted text). <a href="http://www.here.edu/chapter2.html#important">important part</a> A user would see that the first document has the words "important part" highlighted. Clicking on this highlighted text would take them to the "important" section in the second document.

Absolute and relative linking If a new neighbor you just met on the street asked you where you lived, you wouldn't give them your complete postal address. You'd say something like "two houses down on the left." Your postal address is your "absolute" address -anyone can find you using the information it provides. The information you gave to your new neighbor is your "relative" address -- just enough information to locate your house from where you were standing. The same concept works with URL addresses. When linking from one document to another in the same directory, only the second document name is necessary, not the entire URL. For example <a href="second_doc.html">Go to next page</a> You can also link across directories to a document by relative position. For example <a href="../third_doc.html">Go to third page</a> links to a document in one directory hierarchy higher than the current document. Relative links are strongly encouraged as they are easier to type and allow you to move groups of files from one machine to another without editing the files at all. Naturally though, relative linking becomes more and more dangerous the more directories you traverse. With that in mind, it's usually best to use relative linking only within files that are part of a single project (such as this HTML tutorial).

Putting an image in your document Images that appear on a Web page are called in-line images. When you have the image ready to be placed in your document, you must provide the path/location or complete URL of the image. The HTML tag is as follows <img src="path or URL of image file"> For example, <img src="http://www.ncsu.edu/images/new.gif"> Where "img src" stands for image source followed in quotes by the URL of the image. In this particular example, it is an image called "new.gif" that is located on the Web server "www.ncsu.edu" in the directory "images". If the image happened to be in the same directory as the document you are working on, you would simply reference the name of the file without needing the complete URL.

Compiled By:-

Pankaj Kumar Bahety

For example, if you have a gif called "mypicture.gif" in the same directory as the file, your reference would be <img src="mypicture.gif">

Text and Image Alignment Attributes of the image tag Text can be "floated" to the right or left of an image. The align=left attribute will float text down and to the left of the image; align=right will float text down and to the right of the image. The tagging looks like this: <img src="http://www.ncsu.edu/images/32x32/bshelf_clear.gif" align=right> This is an image of a bookshelf. With this new align=right tag, the text can be beside it instead of below it. It looks nice this way.<br clear=right> <img src="http://www.ncsu.edu/images/32x32/bshelf_clear.gif" lign=left> This is an image of a bookshelf. With this new align=left tag, the text can be beside it instead of below it. It looks nice this way.<br clear=left> It will appear like this on the Web page: This is an image of a bookshelf. With this new align=right tag, the text can be beside it instead of below it. It looks nice this way.

This is an image of a bookshelf. With this new align=left tag, the text can be beside it instead of below it. It looks nice this way. Important note: If you are floating text beside an image and use the <p> tag, a blank line will be inserted and the following text will also appear beside the image. When you want your remaining text to be below the image, you must include a <br clear=> tag so that text will go down to the next clear margin, below the picture. Specify clear=left if you are using align=left and clear=right if you are using align=right. The clear attribute is Netscapeonly.

Leaving space around an image You can increase the space around an image by specifying a horizontal or vertical margin in pixels. For instance, adding the attribute hspace=20 will put a 20 pixel margin to the right and left of the image. The attribute vspace= adds space to the top and bottom of the image. The tagging looks like this: <img src="http://www.ncsu.edu/images/32x32/bshelf_clear.gif" align=left hspace=20>This is an image of a bookshelf. The text is aligned to the left and there is a horizontal space of 20 pixels. It looks nice this way. It helps to add a horizontal space to the image so the text is not so close to the picture.<br clear=left> It will appear like this on the Web page: This is an image of a bookshelf. The text is aligned to the left and there is a horizontal space of 20 pixels. It

Compiled By:-

Pankaj Kumar Bahety

10

looks nice this way. It helps to add a horizontal space to the image so the text is not so close to the picture.

Alternative text Just in case a gif can't be displayed for some reason (network troubles or a user is viewing your document with Lynx, a line-mode WWW browser), it's a good idea to use the alt modifier to specify what should be printed if your graphic can't be displayed. <img align=middle alt="Spiffy pic" src="http://www.ncsu.edu/images/testgif.gif">

Making an image into a link Anything can be a link--text or images. To make an image into a link you simply put the image tag inside the tag for a link. For instance, we could make the belltower image into a link to the NC State homepage so that when the user clicked on the belltower the NC State homepage would appear. The tag would look like this <a href="http://www.ncsu.edu"><img src="http://www.ncsu.edu/images/ncsubell-red.gif"></a> As you can see, the <img src> tag is inside the <a href></a> tag. When an image is a link it will have a blue box around it in some browsers. Because your user may be viewing your document with Lynx (and won't be able to access any images) it is a good idea to have text along with an image as a link.

Supported image formats The latest release of almost every Web client now supports the "gif" and "jpeg" image formats. Both formats are ways of encoding image data, although the two are very distinct in the way they achieve this encoding. GIF = Graphics JPEG = Joint Photographic Experts Group Interchange Format

There are many programs on Unix, Macintosh and the Intel platforms that can convert between these and other graphic formats. Granting access to your HTML documents

The final step involving your Web page is to make it accessible to "the world". In other words, your Web page must reside in a place where others can access it to read your information, but not be able to change or delete this information. This next section covers placing information online in your Unity home file space. There are other ways to place information online if you are doing work for your department or administrative unit on campus. Sections covered in this tutorial: Changing the access permissions Your new URL Listing access rights Removing access rights Directory inheritance

Changing the access permissions Because your Unity/Eos account allows only you, the owner, to look at and read the files inside it, you must specifically grant the rest of the world access to your files in order to publish your HTML documents.

Compiled By:-

Pankaj Kumar Bahety

11

To give the world access to only your HTML files, you'll do several things: 1. 2. 3. 4. 5. Grant 'lookup' permissions to your home directory. Create a new directory called 'www'. Change directories to your 'www' directory Grant 'lookup' and 'read' permissions to your new 'www' directory. Move all HTML files you want public into your 'www' directory.

Below are step by step instructions on how to do these things. 1. Grant 'lookup' permissions to your home directory First, you're going to alter the AFS file permissions for your home directory so that "system:anyuser" (which is everyone in the world) has "l" (which means "lookup") access. Think of your directories as a series of boxes inside each other. Before someone can 'lookup' and 'read' what's in the 'www' box, they have to be able to 'lookup' what's in your 'home directory' box first. Be aware that when you grant system:anyuser 'lookup' access to your home directory, anyone will be able to see the file and directory names in your home directory. They won't be able to read the files or move into subdirectories, just see the names. Here is the syntax for the fs command: fs sa directory [access list entries] And here is what you should type: cd fs sa . system:anyuser l Explanation: The cd command simply makes sure you're in your home directory. The fs stands for "file system" while the sa stands for "set access." The period means the current directory (the one you're in). The moniker system:anyuser means any person, and the l means that anyone can 'lookup' file and directory names.

If you would like to limit access to users within the NCSU computing realm, you can grant "rl" access to system:authuser. If you use this user name, only people with Unity/Eos computing accounts at NCSU will have read/lookup access to your document. 2. Create a new directory called 'www' Second, create a directory called 'www'. All your HTML documents which you want to let others view will reside in this directory. The name of the directory will be a continual reminder that anyone can read what's inside. To create the 'www' directory type the commands cd mkdir www Explanation: The cd command simply makes sure you're in your home directory. The mkdir command actually creates the subdirectory. 3. Move into your 'www' directory Now move into the 'www' directory by typing the command cd www

Compiled By:-

Pankaj Kumar Bahety

12

4.

Grant 'lookup' and 'read' permissions to your new 'www' directory Once inside the www directory, you're ready to change its permissions to grant system:anyuser 'read' access. Here is what you should type: fs sa . system:anyuser rl Important: never give system:anyuser any more rights than 'read' or 'lookup'.

5.

Move all HTML files you want public into your 'www' directory Use the mv command (move) to move your HTML files into the 'www' directory. The synax for the move command is: mv [what] [where] For example, to move the file first.html from your home directory to the subdirectory www, you'd type mv test.html www Warning: if the destination directory doesn't exist (in this case the directory would be www), the mv command will rename the file as the directory.

Your new URL The URL (address) for your page will follow the convention http://www4.ncsu.edu/system/directory_path/filename All "users" are on the www4 server. To figure out what the system and directory_path are, do the following: Using the cd command, change to the directory that holds your page. Type pwd at the prompt. This command will show you the full path to your document. For example, if you are on the Unity system, you might see a path name that looks something like this: 3. /afs/unity.ncsu.edu/users/s/smitty/www/ 1. 2. (Instead of unity.ncsu.edu, you might see another system (such as eos.ncsu.edu), depending on where your home file space is.) 4. To figure out your URL, replace system with the name of the system you're using. For instance, if the first part of the path is /afs/unity.ncsu.edu/ you're on the unity system and would substitute unity for system. So far your URL looks like: http://www4.ncsu.edu/unity/ Now use the rest of the path (everything after the unity.ncsu.edu part) as it appears. Using the path above, the URL would be:

http://www4.ncsu.edu/unity/users/s/smitty/www/

Compiled By:-

Pankaj Kumar Bahety

13

5.

Now all that's missing is the filename of the page. Put the filename at the end of the URL. The full URL of the example would be:

http://www4.ncsu.edu/unity/users/s/smitty/www/homepage.html Note: You can use this method to figure out the URL of a document in a locker EXCEPT lockers will be on www2 rather than www4 (they are on different servers). Naturally, the locker must have the correct permissions set. For example, to link to a document in a locker you'd use http://www2.ncsu.edu/unity/lockers/users/s/smitty/file.html

Shorter URL for NCSU student and faculty personal pages The WWW4.NCSU.EDU server (the one with student and faculty personal pages) can now deliver URLs that use the ~userid/path construction, thus making them shorter and easier to type. For example, if your personal web pages are stored in a subdirectory named "www". The tilde-style URL would be http://www4.ncsu.edu/~userID/file.html

Listing access rights To list the access rights for a directory, move to that directory and type the command: fs la . You should see something like this: [rmnixon]...>fs la . Access list for . is Normal rights: system:administrators rlidwka system:anyuser l rmnixon rlidwka jehrlich rl Explanation: the fs part stands for "file system," the la stands for "list access," and the period stands for the current directory. If you see something else, such as a user you don't know, you might consider contacting a Computing Services consultant at 515-3035.

Removing access rights To remove someone from the access list, simply set their access to "none." For example, to remove access rights for user jehrlich, user rmnixon would type: fs sa . jehrlich none Directory inheritance Setting your home directory to allow system:anyuser 'lookup' access creates a slight problem. Anytime you create a new subdirectory in your home directory, the new directory will inherit the access permissions of the home directory. Since your home directory has 'lookup' permissions for system:anyuser, the new subdirectory will automatically have the same rights. Be sure to remove system:anyuser rights on new directories if you don't want people looking at the file and directory list. Navigation considerations for web pages

Compiled By:-

Pankaj Kumar Bahety

14

Previous material References to "previous" sections should probably have links to the previous material, and be very specific. Also be sure readers don't have a way to "get around" what you're claiming came previously. Keep the size of the page small if possible Because long, scrolling documents are hard to navigate, that is, it's difficult to find the same place inside one months later, they should be avoided. In general, long documents make the hypertextual abilities of HTML less effective. Although not engraved anywhere, a good length is three "monitor" fulls -- although monitors differ considerably. Provide navigation cues Instead of relying on the "Back" button built into most browsers, you should provide explicit cues and links for navigation, at the minimum answering the user questions Where am I? Where else can I go? How do I get back to the beginning?

Use consistent navigation options If you begin by using one navigation scheme, stick to it wherever possible. If you begin using an "up/down," "left/right" navigation scheme, stick to it. You might consider a navigation bar at the top and the bottom of pages.

Web ethics

Etiquette is using the correct fork at the dinner table. Ethics are a bit more stringent, perhaps, and are more likely to be taken seriously. Below are some things to keep in mind when building web documents. State the status of your document Although almost everything online is in constant revision (much to the consternation of some), you should endeavor to inform readers of the state of your document, especially if you know change is in the air. There are many "Under Construction" images that let people know you're still working on the document, or on certain sections of a document. Update, update, update! Old information is sometimes more harmful than none at all. If you place information on the web be sure you have a way (and a person) to update it. Be sure to time stamp your document so that people have an idea of when it was created and/or last updated. Refer to or copy information?

Compiled By:-

Pankaj Kumar Bahety

15

In general, use a link to refer to information that you believe should be mentioned, but that you have no power to update. This way you always get the most up-to-date information from that source. Copy information (text or images) only when it's legal (and then with appropriate attribution), and when it's not likely it will change without your knowledge or ability to update quickly. Advanced HTML http://www2.ncsu.edu/ncsu/cc/edu/html_trng/advclass/adv_intro.html This tutorial is designed to extend your knowledge of HTML tags after you have become familar with the tags that are presented in Computing Service's "HTML Basics." Important considerations Things to consider before using extended HTML tags

Additional HTML tags Horizontal line (<HR>) tag extensions o Changing the thickness, length and alignment Document content (<BODY>) tag extensions o Putting in a background color and image o Changing text and link color Graphical image sources (<IMG SRC>) tag extensions Floating text beside an image

Compiled By:-

Pankaj Kumar Bahety

16