[Return to Web Creation for Newbies]  [Return to "J.R.'s Yosemite" Home Page]   [Clip Art Page]

So...you want to create a web page TODAY?  Well, you have come to the right place!

If you stumbled upon this page from a search engine or somewhere else, let me introduce myself.  I am J.R. Dunster, web page newbie.  Well, to be honest, I am now a web page geek, but there is still plenty of newbie in me!  I have been working off and on on this "pet project"---a "Web Pages for Newbies" page.  I do not claim to be an expert, but I am a newbie, and it was not all that long ago that I was very scared and intimidated by the whole idea of making a web page!  But I learned to do it, so can you.  So, to give you some first "baby steps", I am creating this little "kit".  I will give you some free software to download (sorry, Windows only!) and then I will give you step-by-step instructions on how to use it.  Soooo...here we go!

You may want to print out this web page---it will make it easier for you to follow all my instructions.

New! I have been working on a new web site, webcreation4newbies,com, which is all about web authoring, being a webmaster, getting a domain name, choosing web host, getting your own web site online, making web graphics, earning money from your site, listing well in search engines, and a lot of other things. Check it out!

[Download your software]  [Preparing for your first web page]   [Learn how to create your page with Web Wizard software]  [Learn how to tinker with your first page with a text editor]  [Learn how to upload (publish) your finished web page]

Downloads:

Sure, there are those "online editors" (where you make your page while online, using a strict template)  on many web page services, and I guess they are OK.  They are supposed to be easy, and for anyone.   But this freeware does not require you to be online to create a page, and it is still easy enough for a "newbie" to grasp.   You can tinker and fiddle with your page (as much as you feel comfortable) and it won't be so difficult to undo, as it sometimes can be with online editors.

Click on these links to go to the web pages where you will download your software.  (All these downloads will be pretty brief---they are not very big files.)   I have set it up so that when you click, a whole new browser "window" will pop up, leaving the page you are looking at now intact, "behind" the new page.  Just do your downloading, bookmark the new page, (if you like) and then close the window.  This page will still be there.  You can then go on to the next link, and do more downloading, until you are finished!

http://www.hermes.net.au/web/webwizard.htm.  Web Wizard, The "Duke of URL".  This is a cute little program that has been around for a while.  It will be what you will use to actually create your first page.  There are some limitations to this little program, but it does a good job, and you will have a web page when you are done!

http://www.ftpx.com   FTP Explorer.  This is a very easy ftp program, and it's free.  It is what you will use to "upload" (publish) your finished web page up to your web space (on GeoCities, or wherever.)  Note:  If you have trouble getting through to FTP Explorer's site, try http://www.thesharewaresite.com/ftp.html instead.  It will list many shareware and freeware FTP programs.  Also, if you are using Windows 3x, you might want to find a 16-bit FTP program at this site.  All these other FTP programs should all work well, but a little differently than FTP Explorer.   (You may want to try Cute FTP, it seems pretty easy.) 

http://www.jgsoft.com   EditPad.  (Known as "The Best Postcardware Text Editor in the World!") OK, so this is not exactly freeware.   It is "postcardware", the software designer only asks that you send him a postcard (he collects them) as payment for using the software.  This is a nice text editor, and you can use it to "look under the hood" of your freshly created web page, and fiddle and tinker with it, if you like. 

[Back to Top]

Getting Prepared:

Got your software downloaded?  Great!  Now it is time to do some "homework"!

Get your notepad out, because you are going to do some preliminary planning for your web page.  (You may want to print this web page, so you can refer to it all later.  I do ramble a bit!)

• What is your page going to be about?  What is the title going to be?   Something like "My Home Page" is fine (though rather common.)  Write some ideas for a heading down.
• Web Wizard allows you to add a "subheading" under your title.  It might be something like "Welcome to My Corner of the Web" or something like that.   Make a note of your subheading.
• Want to have a picture on your page?  Probably---they can really dress a page up.   Web Wizard likes you to use only GIF files.   You can surf the web and look for GIF files to pick up.  (To do this, you "right click" your mouse arrow over the image, and a pop-up window comes up.  Choose "Save Image As" or "Save Picture As".  Another window comes up, asking you where you want to put the image.  Put it in "My Documents" folder, and make a note of where it is.  You don't want it lost in the bowels of your PC!)  When you have found a good GIF image for your web page, make a note of it's general location.  Web Wizard will help you look for it, but you will have to know basically where it is!  Just to help you out, I have added a few cute little GIF files on another page.  Feel free to use any that may strike your fancy.
• Hey!  Have you found a spot for your web page yet?  If you haven't, try GeoCities.  It is a fun place to start.  If your Internet Service Provider gives you web space, find out more about it.  Does your ISP want you to sign up for your web space first?  Well, do so!  Make a note if you need any special passwords, or anything like that.  Also (and I will go into this more later) you will have to know the "ftp address" of where to send your web page.  This is not so scary.  Don't stress over it.  For the easiest way to go, try Geocities.  I will give further instructions assuming that you are with them.   (But many other services are quite similar to Geocities!)
• Make a list of your favorite links.  Web Wizard allows you a total of 5 links.  You can always add more links, with a little tinkering in EditPad.   (It is not scary, just some cut-and-paste stuff.)

  [Back to Top]

  
  

  Do you have all the things done that I listed above?  Great!  We are ready to install the software.  FTP Explorer and Editpad are zip files.  You will need a zip utility like "Win Zip" to unzip them.  (Go to www.download.com and download a copy, if you do not have it.)  Web Wizard just requires that you click on it.  A cryptic DOS window will pop up.  Do not be alarmed.  Web Wizard has now been "self extracted".  You will now see a funny little wizard head icon in a folder.   You will click on this to start Web Wizard.  Make it a shortcut to your desktop if you like.

  Web Wizard---Step by Step.

  • Double Click on the Wizard Icon.  The first window of Web Wizard will pop up.   Click on "Begin".  Another window comes up.  Click on "Next"
  • You will be asked about your page's title and subheading.  Fill them in!
  • Click to the next step.  You will be asked about what sort of background you want on your web page.  Do not choose "Pseudo Animation."  It may not work.  Even if it does, ecchh!  Hideous!  For the sake of ease, just choose "default".  (It will give you a white background.   Not the most exciting, but it gets the job done.)  If you want to have a background graphic, you can have Web Wizard help you find it.  Click "Choose a GIF or JPG file" (but Web Wizard lies—you might not get a jpg file to show up, so stick with GIF.)  Then click "Locate".  Go find the graphic file that you want to be tiled to make a solid background to your web page.  I have added a few "tasteful" background graphics on my "Clip Art" page.  Whatever background graphic you choose, do not make to too loud or too dark.  Web Wizard uses black text (and blue link text) by default, and you will lose your text on a dark or busy background!
  • The next window will ask you about your picture.  Choose to include a picture, also choose to have it centered, (it will probably look better that way.)  You will then be asked to find the GIF file.  Click on the "Locate" button.  You will then be allowed to search among your files to find the right GIF file.  When you find it, click on it's name, and then click OK.  The pathway and name of the file will then be listed in Web Wizard's little text window.  Click "Next".
  • Did you prepare a paragraph, or at least a few sentences about your web page?   Well, click to "include paragraph", and then fill in the text box with what you want to say!  When finished, click "Next".
  • Do you have any reason to provide a list of something?  If you don't, click "Next".  If you do, here is the window to put it in!
  • Ah!  The next window is where you add your links!  In the "Title", put in a description of the link.  Something like "Yahoo" or "My Favorite Baseball Web Site".  In the URL space, put in the web page address, making sure to add the "http://" part too.  (Like "http://www.yahoo.com".)  If you do not add this to the web address, the link will not work right!  Do not forget to do it! Now you are all set!  Do not choose to add Web Wizard's own favorite links.   They are old and outdated.  Click "Next".
  • Want to add your e-mail link?  Here is the spot to do it!  Click "Next".
  • Now, Web Wizard will say that you are all done.  Not quite.  It wants you to name your html file (your web page file name), and find a spot to put it.  It will obligingly put the graphic file that you included in the same spot that your web page file is, which makes it easier to find.   Click "Select" under the "filename" window.  A window will pop up, with the word "homepage" already in it.  For GeoCities, (and most everywhere else) you will want to change the word "homepage" to "index".  You then should browse around for a good spot on your computer to place your home page.  You may even want to make a special folder, titled "My Web Page".  Found a spot?  Good!  Click "save".  Then click "done".   Another window will come up, explaining that your graphic file was saved in the same folder as your home page.  Click OK.  You are all done!

    [Back to Top]
    
    
    

    Take a look at your new page.   Find the folder where your index file is.   Double-click to open it.  It is pop up, in your default browser.   (Netscape or Internet Explorer.)

    Does it look OK?  Great!  If not, you can always go through the whole process again with Web Wizard, as much as you like.  (Or, an easier way is to tinker with your page with EditPad.) To make sure that you got all the links right, open up your index file while you are logged on to your ISP.  Click on the links.  If they go through to where you wanted them to, then the links worked!   Bravo! 

    If things are not the way you like, or you want to tinker with it, and/or add more links, it is time to "go under the hood".   You will want to look at your web page file (called an "html" file) with a text editor, like EditPad.
    
    [Back to Top]
    
    
    

  • Using EditPad:

    • Unzip your downloaded Editpad file.  When things are unzipped (at least when using Win Zip) they are automatically put in folder (look in Windows Explorer) called "Unzipped."  Go look in "Unzipped," and find EditPad's folder.   Click on an icon inside that has a little green notepad picture.  This will open the program. 
    • Choose "File" (top left hand corner) and then "Open."  Find your "index" file, that you just created  with Web Wizard.
    • You will see weird-looking text at the top of your page.   Do not be alarmed, it is html, the code that tells your browser (Netscape or Internet Explorer) how to present your page.  It will give instructions (with special "tags") on what sort of font to use, how big the text should be, where to add a paragraph, an image, that sort of thing.  In between all these tags are the text of your web page, the things you filled into Web Wizard's text boxes.
    • Web Wizard also adds it's "comments" to the page.  These are invisible to anyone who views your finished page on the web, but you can get helpful tips from these comments.  These comments usually look a little like this: <!-- ** Suggestion: If you want less emphasis here you can use H3 instead ** -->   Ahem...never mind what that means, but you will now be able to recognize these comments when you see them on your page.
    • Look around your html file in EditPad.  You will start to see the areas where your text is.  If you want to reword something, or add more text, do so.  If you want to add a new paragraph, you must add the tag <P>.  Just like that.  Just the two < > things, with the letter "p" between them.  (It does not matter if it is a capital P or not.)  Putting the <P> tag in will tell the browser to add a space for a paragraph.  (Congratulations!   You have just used your first HTML tag!)
    • Want to add more links?  A link will look something like this: <A HREF="http://www.dunster.com">Visit my Family Home Page.</A><BR>   Just cut and paste (copy)  an existing link (including the <BR> tag at the end, I will explain why later) and tinker with it thus: replace the URL (the web page address) with another one---change www.dunster.com to www.yahoo.com. for instance.   Make sure not to tinker or touch any other tag, do not get rid of the http part, or the quotes, or anything else. Then, replace the text that is the description of the link.   In this case, change  Visit my Family Home Page to Visit Yahoo!  See how that works?  Not too bad, eh?  Just make sure to not remove any of the surrounding tags, you will need them.  Oh, and the <BR> tag?  That tells the browser to make a line break, so all your links will not run on together on the same line.  the <BR> tag is similar to to <P> tag, only that it does not make as big a space.
    • Have you tinkered around enough?  Then it is time to save your file in EditPad   Click "File" and then "Save As..."   If you are paranoid, save this new altered file as "index1" (or some other name) instead of keeping it as "index".  If you keep it as "index", and keep it in it's original folder, it will replace your original "index" file.  If you do not change this altered file's name,  EditPad will automatically ask you if you want to replace your original "index" file.  Say "No", and then rename the file.  This is just until you check your altered file in Netscape or Internet Explorer (and also made sure that the links all work.)  If it passes the test and looks good to you, then change your new altered file to "index", and then replace the original "index" file.  If you still want to do more work, open it again in EditPad, and tinker some more!  That is the fun part of web authoring!
      
      

    [Back to Top]
    
    
    

    
    
    
    

    FTP Explorer:  Uploading Your Page!

    Now it the Final Frontier---you are going to publish your page.  You should have two files to your page----your "index" file and your graphic GIF file.  (It should have a name like "image.gif")  Get FTP Explorer installed.  It will require you to unzip it, and then you will probably have to restart your computer.  

    • Click on FTP Explorer's Icon, while online with your ISP.  It will probably ask you to give your e-mail address.  Indulge it.  Give it a "throwaway" e-mail address, one that you do not mind getting out.  It will probably also ask you if you want it to give you some sample FTP addresses---say yes.  (Why not?)
    • Another window will pop up, with the names of many places, like "Happy Puppy" and "Microsoft".  Click on the button on the bottom that says "add".  It will clear all the text boxes on the right side of the window.   If you are going to publish your page to GeoCities, title the "Profile Name" as "GeoCities."  "Host Address" is "ftp.geocities.com".  (without the quotes.)  Leave the "port" at 21.  Next to "login" put in your GeoCities username.  For "password" put it (guess!) your password!   That's it.  Leave everything else alone.  Click the "Save" button on the bottom.  This will keep this address saved, so you don't have to go through this every time you want to upload something. (Please note: you will have to upgrade your Geocities account and pay a monthly fee in order to use FTP. However, many other web hosts still allow FTP, so don't assume that you must upgrade your Geocities account to get FTP access.)
    • Then, with "GeoCities" chosen, click "Connect".  It should take a few seconds, with weird text scrolling in the bottom section of the window.   Eventually you should get some sort of approval from GeoCities, and the window in the top right side will list the "contents" of your page.  There may just be an "index" file in there (one that GeoCities slaps up to fill the space.)   Don't worry about it.   Hopefully your new "index" file will replace it.
    • Chose "File" and then "Upload".  A window will pop up, asking you to locate the file you want to upload.  Find your "index" file.   Click on it, click on the "open" button.  FTP Explorer will now show this exciting picture of your file being transferred (little flying folders) to GeoCities.   Wait until you are sure the upload is finished.  Usually there will be a little text message at the bottom of the right side saying "Awaiting Command".  Then do the "File-->Upload" thing again, this time finding your graphic file.  (If you chose to have a background graphic, make sure you upload that file too.)  Wait for it all to finish again.  You are all done!  
    • You will note that your original "index" file and graphic files are still on your computer.  You have just sent a copy of it to your web page.  Now, go and see if your new web page published properly!  I do not know if this ever happens, but one possible problem that might arise is that you named your "index" file "index.htm" and the file GeoCities put up was "index.html".   In this case, GeoCities file may still be the one that shows up by default.  I am just being paranoid in mentioning this, but if there is a problem, consider this as a possible cause.
      
      

    (A final note:  If you have Netscape 3 or IE4 or higher, you can upload your files to Geocities online, using GeoCities "EZ File Upload".  The concept is easy, just go to your GeoCities File manager, and follow the instructions.)

    [Back to Top]
    

    
    

    Congratulations!  You are all done!  It will only get easier next time.

    Want to see an example of a simple web page I made with Web Wizard?  (See, it can look OK!)

    Some other notes on web authoring:  If you have Windows 98, or have the full installation of Internet Explorer 4, you will have the software "FrontPage Express" and "Web Publishing Wizard."  These are extremely easy (and free) software programs, I suggest you learn how to use them!  And, I won't even get into all the other software out there!  There are many excellent programs to choose from.

     
    
    
    

    Want to try a truly easy web page creation program?  Web Scrapbook is this intriguing, unusual program that has a wizard that literally talks and walks you through the whole process, and even uploads your web page for you.  However, it doesn't offer links, e-mail, etc.  But it seems to be fun.  Check it out, it's free!

    • Return to  J.R.'s Yosemite Main Page.

    • Go to Web Authoring for Newbies Page.

    • Get some Free Clip Art Samples.

All content of this page © J.R. Dunster 2001 - 2006

This page last updated:  May 1, 2005

[Return to Web Creation for Newbies]  [Return to "J.R.'s Yosemite" Home Page]   [Clip Art Page]