HTML Basics
HTML Basics

Learn HTMLAre You Feeling A Bit Lost When Someone Mentions Those Four Letters, HTML? Well It Is Actually Very Easy To Learn And Understand. We Will Cover How To Set Up A Simple Page, How To Format Text, Insert Images, And Insert Links. Lets Start By Explaining What It Is Exactly.When You Visit A Page, You See Columns, Images, Links And Different Colours. This Has All Been Written By Someone (or Someone Used A Program To Write It). And It Is Written In HTML. All Web Pages Are Sent To Your Browser (such As Internet Explorer Or Firefox) As HTML. HTML Is The Easiest Computer Language To Learn. Now, When You Write A Formal Letter To Someone, There Are Things You Add At The Start And End Aren't There (such As At The Start Their Address, The Date, And At The End Your Name And Signature). Between These Items You Write The Body Of The Letter. Well, In Some Ways, The Basics Of HTML Is Very Similar.Let Me Just Give You An Example Of A Simple Page. This Would Display The Words Welcome In The Browser (the Numbers In Bold Are Not Part Of The Code They Are Just Line Numbers So We Know What We Are Talking About Later On).1 Html2head3titleSite Titletitle4head56body7Welcome8body9htmlAll Tags Start And End. A Start Tag Looks Like Xxx And And Ending Tag For It Would Look Like Xxx. There Are Many Tags - U...u For Underline, B...b For Bold Etc.If We Go Back To The Letter Example, You Normally Write Your Address, The Date, Their Address Etc At The Top. Well This Is What The First Four Lines Are Like. The First Line, Html (note, In Html, It Doesn't Normally Matter If It Is Upper Or Lower Case. In Some Technologies Such As Xhtml It Does, But For Now It Doesn't Matter) Just Declares That Between That Html Tag As It Is Known, And The Ending Html Tag On Line 9 (notice The Back Slash, Indicating It Has Ended) It Has Html Within It.The Head Contains Information That Isn't Directly Displayed By Your Browser. The Title Tag Contains The Title Of The Page, Which Is Shown At The Top Of Your Browser. Other Things Such As Keywords Go Into Your Head Tag, But Thats A Bit More Advanced.You Should Put All Your Content Within The Body Tag That You Want The User To See Inside The Main Part Of Their Browser.bTo Do LinksbA Link Is Something That Lets You Click On It, And It Will Request A New Page. You Use The Anchor Tag For This:a Hrefhttp:www.techneek.co.ukCLICK HERE ADo You See How That Would Work? It Would Display The Words CLICK HERE, And That Links To Http:www.techneek.co.uk. This Tag, The A ... Tag Has An Example Of An Attribute To It The Href. Almost All Attributes Have A " ". It Is Basically Like Saying, I Have An Anchor Tag. I Want To Make It Link To Something. To Tell It To Link To Something, You Need To Put Hrefyourlink. Remember When Ending This Tag (a), You Don't Need To Put In The Href. It Is Always Just A.bBold, Italic, UnderlinebThese Are Really Simple You Probably Already Know Them. B Bold Text B For Bold, U Underline U Or I Italic IbSpaces In HTMLbSpaces To Some Extent Don't Matter. I Could Write This Line:a Hrefhttp:www.example.comexample.comaas:a Hrefhttp:www.techneek.co.uk Example Link AIn HTML, Any Multiplies Of A Space - ' ' Just Show Up As One. To Display More Than One You Need To Type Nbsp;.bImagesbImages Are Really Simple. It Is Just Img Srcyourimagelink. You Don't Even Need An Ending Tag (no Img Tag!). If You Want To Specify The Heightwidth, Use Height120 Width400;img Srcyourimagelink.jpg Height99 Width89Incase The Image Can't Be Loaded For Yoru User, You Should Give An Alternative Text. This Is Also Good For People Who Find It Hard To See On The Screen. To Do This, Add Alta Description Of Your Image. I Would Personally Recommend No More Than 6 Words.img Srcyouimagelink.jpg Width200 Height100 AltView Of A BeachIt Is Recommended That The Only Image Types You Use Are Gifs (.gif), Jpegs (.jpg), Or Portable Network Graphic (.png). Try And Keep The File Sizes Down, Some Users Are On Very Slow Speeds.So There You Are, You Should Be Able To Make A Page Now. Open Up Notepad, Paste This Template In:htmlheadtitleYour First Webpagetitleheadbody... Your Content Goes Here, Such As A Href"http:www.techneek.co.uk"Computer Techneeka! ...bodyhtmlAnd Replace The "..." Bits With Your Content. Save It As A .htm Or .html File (it Makes No Difference What You Choose) And Open It In Your Browser.Here Is An Example Simple Web Page Using Everything We Have Covererd So Far:htmlheadtitleHello!!titleheadbodybiHello!i Welcome To Umyu Page! Click On The Image To Go To Http:www.techneek.co.ukb A Hrefhttp:www.techneek.co.ukimg Srcexampleimage.jpg AltTechneek.co.uk Image Height400 Width400abodyhtmlNow You Are Ready To Go Further. I Recommend That You Search For Things On Your Favourite Search Engine, Such As:paragraph HTML Taghr Html TagCenter Html Tagbasic CSS Tutorialuploading Webpage OR Website Tutorial ServerHave Fun!Ashley Baker Is The Owner Of TechNeek - A Computer Hardware Component News And Reviews Site. If You Need A Review Of A Computer Related Matter, Get Down To Http:www.techneek.co.uk!