1. Home
  2. Parenting & Family
  3. Stay-at-Home Parents

Log file Chat room Homeparents: HTML 101


homeparentsADM: Hi Tricia! Glad you could make it!! We are waiting for a few more to stop in before starting
HostessJulie: the first half of the chat is for html Questions and Answers... feel free to jump in if you have any
Janet: OK, I'll start...
Janet: I have a general question - how do you 'see' what you are going to create, if you just have a blank note tab in front of you? do you sketch on paper?
HostessJulie: good question....
HostessJulie: I see my pages in my head.. but having a layout on paper is a good idea, especially if you are creating a page for someone else.. they can sketch what they want
HostessJulie: sometimes the layout of the page just evolves as you are working on it
homeparentsADM: how do you view what you are making using just Notepad? I use Homesite, and it have a view option.
Janet: that is a big hurdle for me - seeing the layout then going to code. I need to see things all of the time :)
Janet: I do visualize how I want things, but I usually need to stay in visual mode
HostessJulie: you type the url in your browser.. for example if it were a file named barb.html on your c drive, the address would be c:\barb.html
homeparentsADM: ahh...I have used Netscape Navigator Gold to make a page...a what you see is what you get, but I didn't like how it changed a lot of the HTML coding
Barb: what determines the *ending* .. like html, or some are htm or some are .com?
HostessJulie: the only problem for me with "visual mode" is that you are viewing how that one program displays your page. When you hand code it, you can be pretty sure you are coding for most broswers
HostessJulie: html pages are htm or html... The default is html
HostessJulie: .com signifies an executable program
Barb: so every page that you *hand code* would end with .html?
HostessJulie: or a domain name
HostessJulie: Barb: you can use either.
Barb: ok, thanks - that's always baffled me.
HostessJulie: but if you had two files named index.html and index.htm the one with the html extension would display
HostessJulie: if you did not specify the file, but just typed in the domain name
homeparentsADM: Isn't it hard to type in all the coding manually? I just hit "quick anchor" with Homesite and the coding comes up when I'm making a link
HostessJulie: the reason for the difference is a long story that deals with dos and the way filenames were used prior to Windows 95
Janet: oh...I had wondered on that
HostessJulie: Barb: I don't find it difficult... but with Homsite, you are technically using html, you just have hotkeys.. so it's not like using a graphic editor
Tricia: I have homesite...Do you have to register it to get a manual or is it just learn by trial and error?
Tricia: And are there any worthwhile books on the market on building web pages?
homeparentsADM: It should have a fairly decent help section, Tricia..I did register my homesite..liked it so much
HostessJulie: Tricia: the best first book in my opinion is HTML for dummies... great book!
Barb: i have mspublisher which "publishes to the web" but at that point, i'm lost!
homeparentsADM: Homesite does some neat forms I found out..
Janet: does the Publisher have an FTP tool, Barb? (asking for your server password and user name to send files to the server)
Barb: yes
Tricia: A friend told me to try homesite but all those buttons make me lost
Janet: where did you get lost at?
Barb: ftp'ing it from "the page" to "the web"
homeparentsADM: I tried mspublisher with my personal homepage...wouldn't publish to the web because my ISP has to have a special web publishing tool..it doesn't support FTP
Barb: oh really?
Janet: oh really? I thought just Front Page had those extensions
Barb: maybe that's part of my problem
Tricia: Just I don't know what to do... Maybe I just need to be willing to experiment.
homeparentsADM: could be, Barb. Who is your ISP?
Barb: premier1.net
homeparentsADM: if they have a webpage, it might tell how to upload to the web..
Barb: the last time i tried to do a page i had to spend an entire afternoon with them to get it published to the web! very frustrating ... at that point i decided it was easier to pay someone else!!
homeparentsADM: tricia..I actually use very few of the buttons on HOmesite..mainly the quick anchor for links, quick picture for graphics, and the font buttons
Janet: can you take files created in mspub and ftp them up with another tool, like FTP Explorer? Or is it something in the code (back to html for hostessJulie :)
HostessJulie: no, it is with the way the isp handles their uploads...
Barb: janet, you KNOW i don't know what any of that means ... i'm definitely html challenged!!
HostessJulie: each one has different rules.. FTP is a security issue
homeparentsADM: it took me weeks of messing around before I could upload my personal homepage! But, it's not business related, or I would have paid, too!
Tricia: For my family page, I just used the editor that my ISP offers... but on that one I would like to put a picture and that just baffled me.
HostessJulie: that's why places like geocities have the online publishing tool
Janet: oh, I meant 'you' as a general question, Barb :)
Barb: oh, OK, thanks - i was taking it p ersonally! haha
HostessJulie: well does anyone feel like making a webpage?
Janet: haha - no, I don't know the answer either.
Barb: i'd love to.
HostessJulie: ok, are we all using windows?
homeparentsADM: sure, I'm game!
Barb: i am
homeparentsADM: yup-
Janet: yes
Tricia: I am.
HostessJulie: ok great.. fire up notepad
Barb: i'm fired up and ready!
homeparentsADM: ok...done..it's under /accessories, by the way
HostessJulie: if you haven't already done this, hit the float button on this chat window to open it up and remove that banner
Tricia: Okay I am there :)
Barb: me too
homeparentsADM: me too.
HostessJulie: http://www.mommy-mall.com/hna102198.htm
HostessJulie: ok cool...
HostessJulie: that address will take you to an example page we can create.. it also has some useful links
Janet: for those new to the chat room, you can hit the 'surf' button to take you to that page
HostessJulie: if you hit the surf button it should take you there
Janet:
HostessJulie: :)
homeparentsADM: my surf button didn't work..strange.:(
HostessJulie: if you right click anywhere on that page, you can select "view source" to see the code, if you want a cheat sheet
Barb: ok, i have that page now too.
Tricia: Do you need to highlight the address?
HostessJulie: no
HostessJulie: if surf did not work for you, then you can type that address into your browser
Tricia: Okay
HostessJulie: let me know when you all have that loaded
homeparentsADM: hmm...I just copied/pasted the url since the surf isn't working for me..
homeparentsADM: I'm there now
Janet: loaded
HostessJulie: ok you should have a blank page in notepad...
Tricia: Going there (Im a little behind but I will catch up!
HostessJulie: The first line is <html>
HostessJulie: that tells the browser it is a web page
HostessJulie: on the second line you type in
HostessJulie: <head>
Barb: i have a blank notepad and the url opened - wow, lots of *screens* all at once .. should be an adventure!
HostessJulie: every web page should have a head
Barb: oh, i thought that was "my name" hahah
HostessJulie: type ok if you are with me
Barb: ok
Janet: LOL Barb! ok
Tricia: Okay
HostessJulie: third line is your title
HostessJulie: type it in like this:
HostessJulie: <title> My Links Page </title>
HostessJulie: we are going to skip keywords right now, so we can get to the meat
Barb: ok
homeparentsADM: ok! this is neat
HostessJulie: the next line closes the head like this
HostessJulie: </head>
HostessJulie: Then we open the body of the page
HostessJulie: the next line defines your background color and the colors of your links on the page.
HostessJulie: like this:
HostessJulie: <body bgcolor="#FFFFFF" text="#000000" link="#FF0033" vlink="#330066" alink="#000000">
HostessJulie: just type that in and I'll explain it if you need me to
homeparentsADM: just wondering how you can find the codes for those colors?
HostessJulie: the example page has a link to a color chart
homeparentsADM: ah...ok, thanks Julie!
Tricia: okay... This seems so easy now ... or at least you make it seem easy.
Barb: what example page?
HostessJulie: http://www.mommy-mall.com/hna102198.htm
homeparentsADM: I need to link to that page Julie..it's excellent!
HostessJulie: ok lets go to the next line and I'll explain the body tag later if needed
HostessJulie: ok the next line is the heading of your page
HostessJulie: <h2> My Links Page </h2>
homeparentsADM: ok
HostessJulie: h2 gives you a large, but not obnoxious heading
homeparentsADM: h2 is the standard..right? I hate sites that use bigger headings..
HostessJulie: yes Barb, h2 is a good choice
Barb: yes, i can only stay for about ten more minutes, but i'd definitely like to do it again.
HostessJulie: ok lets add one link then and save this page, so you can see it
HostessJulie: the next line is a simple paragraph break
HostessJulie: <p>
HostessJulie: and the next line is will be a link
HostessJulie: <b> <a href="http://www.mommy-mall.com/hna">Home Not Alone</a></b>
HostessJulie: add that line
homeparentsADM: ok
HostessJulie: the next line will close our body
HostessJulie: </body>
HostessJulie: and the last line will close the page
HostessJulie: </html>
homeparentsADM: ok..done!
HostessJulie: once you have done that, you can save this file to your hard drive
HostessJulie: name it hnachat.htm
Janet: why htm and not html?
HostessJulie: either or
HostessJulie: it makes no difference here
Janet: what about for 'real' web pages? I always use html
HostessJulie: Janet, this is a real page, and the two names are interchangeable... you can use either extension
homeparentsADM: on my miningco site, they are all .htm except for the mainpage...
Janet: ok
Janet: I like consistency! :)
Barb: ok, i'm saved to the hard drive
HostessJulie: once you have saved the file, type the path into your browser and you can see it
HostessJulie: if it is on your c drive, you type
Barb: really?
HostessJulie: c:\hnachat.htm
HostessJulie: or if it's in a directory, type the whole directory
Janet: or you should be able to click on the file in Explorer and it will bring up your default browser to view it.
HostessJulie: Janet, that will work, too..
HostessJulie: you should have a plain white page with a heading and one link
Barb: on the browser line? c:\hnachat.htm????
HostessJulie: yes on the browserline
HostessJulie: just like you would type in an url
Barb: WOW .. it's there!!!
HostessJulie: hahaha cool!
HostessJulie: once you have done this basic page, you can use this to create other pages in the future, by adding links, changing the colors and the formatting, as you learn the commands
HostessJulie: we definitely have to do this again... so we can try other things... and do more
HostessJulie: definitely keep that example page though, it has some good resources
homeparentsADM: yeah, we do...I'll get in touch Julie, and we can add some more topics..this was surprisingly easy to create!
HostessJulie: it really is easy when you know the tags...
HostessJulie: then you are not limited by anything
homeparentsADM: ok, well, is that about it?
HostessJulie: Yea, the hour went fast
HostessJulie: I had more planned, but ran out of time
homeparentsADM: an hour goes by fast in chats
HostessJulie: it really does...

Explore Stay-at-Home Parents
About.com Special Features

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

Reclaim the morning and your sanity with these easy recipes, tips, and timesaving ideas. More >

  1. Home
  2. Parenting & Family
  3. Stay-at-Home Parents

©2009 About.com, a part of The New York Times Company.

All rights reserved.