Home         Back




Saivaneri Web Tutor

 Chapter 1 – Web Page creation on PC (local)

 Ok Guys! From Chapter 1, which I emailed to you, I hope that you must have learned what is HTML? How HTML pages can be created etc. 

Now assuming that you already know how to create a HTML file, we go to the next step, HOW FAST we can work with a web site creation. 

To create a web site FAST, you need not know HTML at all!. Because, WYSIWYG (What You See Is What You Get) editors allow you to create web pages with out knowing a single line of HTML. But if you know little bit  basics, you can manipulate the WYSIWYG editors more to your advantage. 

Examples of WYSIWYG editors are…

1.                  Front Page 2000 comes with Office 2000

2.                  Front Page XP comes with Office XP

3.                  Macromedia Dream weaver 3.0 or 4.0 versions

4.                  Adobe Go Live

5.                  Net Objects Fusion

6.                  IML Web Dwarf

7.                  Allaire Home Site and more…. 

In contrast to this WYSIWYG editors, there are many hard coding editors also which requires thorough knowledge of HTML/DHTML programming, Java/CGI/PERL/CORBA/VB/SSI scripting. 

Examples of Non-WYSIWYG editors are…

1.                  1st Page 2000 –(FREE)             Download:- http://www.evrsoft.com

2.                  Coffee Cup Pro –FREE              Download:- http://www.coffeecup.com

3.                  Stones web editor                   Download:- http://www.stoneware.dk

4.                  Ace HTML                                        Download:-http://visicom.com

 Why the need of these Non-WYSIWYG editors?. Because WYSIWYG editors are not always reliable. Hard coding is sometimes useful to control the behavior of our web site more tuned.

 Okay, now we will start with Web site creation using the more popular and ubiquitous Front Page 2002 XP

 To create any web site, it is easy to learn reverse. That is, first create the web site by wizards, then read the HTML codes , so that you can come to know what code is doing the magic.

Practical 1:- 

bulletStart FrontPage 2002 XP, click File – New – Web Page – Web site Templates – select personal web template.
bulletNow you will see that the wizard is creating the web
bulletAfter this, nothing will be shown to you. To see the folder click View -Folder
bulletCan you see the folders and pages?
bulletNow the index page is the first page for any web, it has to be so on your web server also, on the internet. It can be either index.htm or index.html
bulletOn windows based web servers, it can be either default.htm also. But worlds’ 60% web sites are hosted on Unix/Linux based servers so index.html is the common standard.
bulletNow you also see these folders:- _private, images, photo gallery and about me, favorite, interest, feedback htm files
bulletThe folder which starts with a _ underscore is a hidden folder on windows machines. This folder is used by the webmaster only, not the user.
bulletUser only can go by jumping through the links available in the pages.
bulletThe first page index.htm is the gateway to the whole web site.. user has to hop from one page to another by clicking various links on text or photo etc…
bulletThis web will be placed in my documents/my webs/my web1
bulletDouble Click the index.htm page no you can see the page in the editor
bulletThere are 3 tabs in the editor:- normal, html, preview
bulletHave a good look of the page in the normal mode and preview mode now
bulletNow click the html mode
bulletNow you can see the actual coding written by the editor
bulletStudy this code thoroughly… you may recollect your experience with chapter 1 here.

Experiences Recollected

     ü       Every html page starts with <html> and ends with </html>

ü       <head>………………..</head> provides the header info for this file

ü       <title>………</title> gives the title shown on top of the browser

ü       <meta> tags provide many descriptions of the page like…

(a)name (b) content (c) language (d) program id (e) generator (editor) etc..

ü       <body> ……</body> contains the actual thing which we see on the browser

ü       and we also see many more common html tags here… like
(a) <table> …….</table>  for table

(b)<p> for parNagpurph
(c) <br> for breaking a line etc…    

ü       go through the whole page thoroughly, and make amendments in the normal mode and see the corresponding change in the html and preview mode….

ü       If you are unable to understand anything about tags, again please go through the chapter 1

ü       Now you can click File – preview in browser

ü       Now you are viewing the page in the browser…. Click the various links and get satisfied what it is links to and where you go..

ü       The same html source you can view by clicking the view source tab on the browser also.

ü       This view source opens the file in the text editor, so here there is no intuitive helps.

I think this chapter explained how to create a web site on the front page, see the file in different modes, preview it on a browser and edit it on the front page editor

 Any doubts, please ask me, since we are moving to next chapter