HTML Coding Basics<\/h3>\n
Before I dive in I'd like to give you some of the basics of HTML. The coding of HTML is based on 'tags' such as <B> would be a tag for bold. <\/strong>When you use an HTML tag you'll need to open the tag such as <B> and then after your selection you need to close it such as <\/B>. You'll see that it's the exact same entry but I use a slash when I'm closing the HTML tag.<\/p>\n I'm not going to get into the complete structure of a website because with today's WYSIWYG (What You See Is What You Get) editors the structure is created by the software so you just need to start designing. The two most common HTML editors are Macromedia Dreamweaver and Microsoft FrontPage. If you're familiar with Microsoft Word you may find FrontPage quite a bit easier plus FrontPage is so popular that it's easy for find professional templates that make making a website so much easier.<\/span><\/p>\n Ok, let's get down to some code. I'll give you the information that you need but occasionally you'll find a link that contains more detailed information on that specific tag such as tables and colors. You'll find that I have entered both the opening and closing tag for each.<\/p>\n New Paragraph: <p>\u00a0 <\/p><\/strong> - This is used for creating a new paragraph.<\/p>\n Line Break: <br> - <\/strong>You'll see that there isn't a closing tag because it's not required. Two line breaks are the equivalnt to using a <p> tag.<\/p>\n Bold: <b> <\/b> -<\/strong> The allows you to create bold text<\/strong>.<\/p>\n Italics: <i> <\/i> - <\/strong>This tag creates italic text<\/em>.<\/p>\n Underline: <u> <\/u> - <\/strong>This tag is used for underlined text<\/span>.<\/p>\n Font Color: <font color=\"red\"> <\/font> - <\/strong>This tag is used for changing text color<\/span>. Font: <font face=\"Century Gothic\"> <\/font - <\/strong>This tag allows you to change the font style<\/span>.<\/p>\n List: <li> <\/li> -<\/strong> This tag allows you to create a list such as<\/p>\n Centering text: <center> -<\/strong> There is no need to close this tag. It will center your text.<\/p>\n <\/p>\n A hyperlink is a clickable link from your website to another website. The code to use is:<\/p>\n <a href=\"https:\/\/www.websitespot.com\/articles\">Domain Name Registration<\/a><\/p>\n The link would appear as: Domain Name Registration<\/a><\/p>\n If you create a link but would like to open a new browser window once it's clicked you can simply add a little more code to accomplish this. I've highlighted the additional code below.<\/p>\n <a target=\"_blank\" <\/strong>href=\"https:\/\/www.websitespot.com\/articles\">Domain Name Registration<\/a><\/p>\n The link would appear as Domain Name Registration<\/a> but would open a new window when clicked.<\/p>\n If you'd like to add an email address to your website so that people can email you, you can create a hyperlink so that once the link is clicked it automatically opens the visitors default email program.<\/p>\n <a href=\"mailto:your@yourdomainname.com\"> Contact Us<\/a><\/p>\n The link would appear as: Contact Us<\/a><\/p>\n The most important area of making a website and creating the layout and look that you want is by far the area of tables. See, tables are what creates the basic layout of your website. For example, this website is made up of 5 main tables.<\/p>\n They are the header, which is the very top of the website. The left navigation, which is where all of the links are on the left hand side of this page. The footer, is at the very bottom of this page. The right navigation where I display relevant websites on the right hand side. Lastly there is the body, this is where I type all of the information on the website.<\/p>\n Without these tables it would be difficult to layout the site as I would like. Since this is such an important part of making a website I have created a specific page for tables. You can view the page by clicking here<\/a>.<\/p>\n When you make a website you'll definitely want to insert images. This makes your website more appealing and as they say, \"A picture says a thousand words\" so they can be very descriptive without having to type out a whole long description. Much like tables, images are a very important part of the process to make a website. Please visit my page on inserting images into a website<\/a> for detailed information.<\/p>\n Website scripts are scripts that you place on your website to accomplish just about anything that you'd like from shopping carts to forms. Most scripts are extremely easy to install and I haven't ever installed a script that didn't com with an in depth installation guide.<\/p>\n Read more on website scripts<\/a>.<\/p>\n Just a quick word on backgrounds, if you're going to add a background to your website do it in good taste. What looks good to you may not look good to majority of your visitors. Much like painting your house, what looks good to you may annoy your neighbors. The same holds true for backgrounds, just make sure that you're designing with your visitors in mind and not just yourself.<\/p>\n Inserting a background color is very simple. Just make sure you add it to to the inside of your <body> tag. The background color tag is as follows:<\/p>\n <body bgcolor=\"red\"><\/p>\n To determine the right color code you can visit our page on hexadecimal colors<\/a>.<\/p>\n Keeping with the idea of keeping the look pleasing to the eyes the background image tag is as follows:<\/p>\n <body background=\"images\/linear.gif\"><\/p>\n This is calling the background image from your images folder that you have uploaded to your web hosting<\/a> account.<\/p>\n Bullet points are great for separating a list in an easy to read format. The bullet point tag is as follows:<\/p>\n <ul> The code would appear as:<\/p>\n Bullet points are great for separating a list in an easy to read format. The bullet point tag is as follows:<\/p>\n <ul type=\"circle\"> The code would appear as:<\/p>\n Again we've run into a topic that requires it's own dedicated page because of the large number of options plus the importance of a form on a website. Please visit creating forms<\/a> for detailed information on creating an online form.<\/p>\nBasic HTML Tags<\/h3>\n
![\"dottedline\"](\"https:\/\/www.websitespot.com\/blog\/images\/dottedline.gif\")
<\/p>\n<\/p>\n<\/p>\n<\/p>\n<\/p>\n
\nRead more on hexadecimal colors<\/a>.<\/p>\n<\/p>\n<\/p>\n\n
<\/p>\nCreating Hyperlinks<\/h2>\n
Basic Hyperlinks<\/h3>\n
Creating Hyperlinks To Open In A New Window<\/h3>\n
Creating Email Hyperlinks<\/h3>\n
Creating Website Tables<\/h2>\n
Inserting Images Into A Website<\/h2>\n
Website Scripting<\/h2>\n
Adding A Background<\/h2>\n
Adding A Background Color<\/h3>\n
Adding A Background Image<\/h3>\n
Inserting Bullet Points<\/h2>\n
Inserting Bullet Points<\/h3>\n
\n<li> Item 1 <\/li>
\n<li> Item 2 <\/li>
\n<li> Item 3 <\/li>
\n<\/ul><\/p>\n\n
Inserting Circle Bullet Points<\/h3>\n
\n<li> Item 1 <\/li>
\n<li> Item 2 <\/li>
\n<li> Item 3 <\/li>
\n<\/ul><\/p>\n\n
Creating Forms<\/h2>\n
\n