EASY HTML FOR ABSOLUTE BEGINNERS You will need to be able to see your HTML work on the Internet so you need to use notepad. When you have completed your work, using notepad, you must file it as an .html file ie mypage.html - if you don't do this, the browser will not be able to read your work. If it is to be your homepage on your website then you must file it as index.html with no additions to it. To be able to see your creation - go to your browser bar at the top of your screen and click on: File > Open > Browse (at this point you should see "File name:" which is blank and "Files of type: HTML files") then locate your mypage.html file (it will not show the .html) - Click on it and open. Your browser will open your file and reveal your work. You now have your page on the Internet for viewing and also your notepad with the coding. From hereon when you make changes in your notepad you must file it every time and then hit 'refresh' on your browser to update your page. TAGS and the rules: Tags are these things: < > Inside these tags is where you insert your commands and attributes. An HTML rule is IF YOU OPEN IT CLOSE IT, like this: using the / symbol to close your tags. This is the code for font color: <FONT COLOR="#FF0033"> for red </FONT> <FONT COLOR="#3300FF"> for blue </FONT> <FONT COLOR="#339900"> for green </FONT> <FONT COLOR="#000000"> for black </FONT> Alternatively you can create color codes like this: <FONT COLOR="red"> for red </FONT> <FONT COLOR="blue"> for blue </FONT> <FONT COLOR="green"> for green </FONT> <FONT COLOR="black"> for black </FONT> This is the code for font size: <FONT SIZE="7"> huge </FONT> <FONT SIZE="5"> medum </FONT> <FONT SIZE="3"> normal </FONT> Alternatively: <FONT SIZE="+7"> huge </FONT> <FONT SIZE="+5"> medum </FONT> <FONT SIZE="+3"> normal </FONT> Or: <FONT SIZE="-3"> teeny </FONT> <FONT SIZE="-2"> very small </FONT> <FONT SIZE="-1"> small </FONT> Font sizes you can use are: 7 6 5 4 3 2 1 or +1 +2 +3 +4 +5 +6 +7 or -1 -2 -3 -4 -5 -6 -7 This is the code for font styles: <FONT FACE="arial"> arial </FONT> <FONT FACE="helvetica"> helvetica </FONT> <FONT FACE="sans-serif"> sans-serif </FONT> Font Combinations: Color - Style - Size: <FONT COLOR="#3300FF" FACE="sans-serif" SIZE="1"> blue sans-serif size 1 </FONT> <FONT COLOR="#FF0033" FACE="arial" SIZE="4"> red arial size 4 </FONT> <FONT COLOR="#339900" FACE="helvetica" SIZE="5"> Green helvetica size 5 </FONT> This is the code for bold text / underline text / italic text: <B>Bold text</B> You can use the bold <B>anywhere in </B> your text <U>Underlined text</U> You can use the underline <U> anywhere in </U> your text <I>Italic text</I> You can use the italic text <I> anywhere in </I> your text A combination of text using all 3 attributes: You can use the <B> bold attribute to emphasise a particular word </B> anywhere in your text <U> or use the underline attribute to emphasise side headings </U> <I> and use the italic attribute to emphasise ie phrases or quotes etc </I> as long as you make sure to close the tags. The Line Break is a simple but very important code: The line break is a simple code: <BR> You have to use this code every time so that your browser knows when to start a new line. <BR> Just as you see here <BR> Dont forget to <BR> use this code <BR> when starting a new line <BR> Centering text on your page can be quite effective: <CENTER> Good For Headings and/or images </CENTER> You may want your heading or title to the left or right of the page: <DIV ALIGN="LEFT"> Text to the left </DIV> <DIV ALIGN="RIGHT"> Text to the right </DIV> An alternative to <CENTER> center text </CENTER> is <DIV ALIGN="CENTER"> Text centered </DIV> The <P> paragraph </P> is used to donate a new paragraph to which you can also use the 'align' attribute. <P ALIGN="LEFT"> left formatted paragraph </P> <P ALIGN="RIGHT"> right formatted paragraph </P> <P ALIGN="CENTER"> centered formatted paragraph </P> So now your wondering how to do a rule or line. Well it's dead easy, just like this: 1. <HR> 2. <HR WIDTH="100"> 3. <HR WIDTH="200"> 4. <HR SIZE="5" WIDTH="300"> 5. <HR SIZE="500" COLOR="#FF0033"> 6. <HR WIDTH="500" NOSHADE> One last thing - the <BR> and the <HR> tags do NOT have closing tags. Inserting Images: <IMG SRC="http://www.yourdomain.com/images/flowers.jpg" WIDTH="175" HEIGHT="160" ALT="flowers"> Inserting images with a link: <A HREF="http://www.yourdomain.com" TARGET="_blank"><IMG SRC="http://www.yourdomain.com/images/flowers.jpg" WIDTH="175" HEIGHT="160" ALT="flowers"></A> Inserting Links: <A HREF="http://www.yourdomain.com" TARGET="_blank"> My website </A> This is just for starters. Hope this helps you. If you want something slightly more advanced ie using tables, then click here to learn more. ~Jan~
Wow Jeweleffects I have no knowledge of html but your instructions are so clear and precise I am going to have to give it a try. Thank you for all your help. Gloria
If you have any problems just put a posting about it here, I or someone else will try to help you out. ~Jan~
Hi Jan! Thanks for starting this group. While I don't understand a syllable of what you wrote below, I can tell it is carefully written with the rank beginner in mind, so hopefully I'll be able to penetrate its mystery!
Hi Jan! And hello to any other helpful eyes out there..... As I re-read the "Easy HTML for Absolute Beginners" I recognize that the code to change the color of text looks very similar to that given me by Yahoo to change selected text color on our website. Do you think that the code you have included below for other things might work on our website, if I were inclined to write something in italics? Thanks very much! Elaine
Yes it will work Elaine. ~Jan~
Thanks Jan!!!
Or, should I say......<FONT COLOR="red">Thanks, Jan!!</FONT>
hmmm, that didn't work. Do I need to use the "go advanced" button?
HTML does not work in here or on the forums pearly but you got the right idea ~Jan~
