CONTENTS
Learn About Some of the Methods for Creating Your Own HTML Document
BACKGROUNDS FOR A WEBPAGE
ADD GRAPHICS, PICTURE, IMAGE TO BACKBGROUND OF THE WEB PAGE
CHANGE COLOR OF TEXT ON YOUR WEB PAGE
Adding a Few Links
Web page design Tables
CHANGE COLOR OF TEXT ON YOUR WEB PAGE
Adding a Few Links
Web page design Tables
Obtain Web Space and Web address
Extra information The Basics How do I add a video to my blog or web page?
First of all, visit your favorite webpage and see what you like on it. Look at what the designer of the page has done to impress you, and keep it in mind when planning your own site.
I am going to show you how to construct a simple personal page, which will
demonstrate the essential features of web authoring,
Learn About Some of the Methods for Creating Your Own HTML Document
There are several ways to create HTML documents. First of all, you can type in HTML code instructions and content yourself, using atext-editing program. Simple text editors are included with all Microsoft Windows operating systems (WordPad and Notepad), and on the Mac (SimpleText). These are basically stripped-down word processors that your computer already has.
Definition of HTML:
I will be using this method, raw HTML code. I will also be coding our HTML by hand because: 1) it will help you to better understand how web pages work; 2) you will then know how to edit pages, no matter how they were created; and 3) some browsers may not recognize all of the features an application might add to a web page. Think of it like learning to drive on a stick shift--learning the tough way first gives you the skills to drive any car in the future.
tt's really easy to build your first Web page. There are only a few HTML tags you need to learn. Difficulty: Easy
Tags definition - an html code or instruction that is contained with an opening < and a > brackets. Some tags are considered open. They consist of just the brackets and the code. Closed tags have both an opening tag "<code>" and a closing tag, "</code>". Please note the "/" as it is required to show this is a closing tag.
Here's How:
1. Open a text editor like word pad (on all computers free) to a blank page.
2. Write the html tag <html>
3. Write the head of your document <head>
4. Write your title <title> Put your title here </title>
5. Close the head of your document </head>
6. Open the body of your document <body>
7. Give your page a heading <h1> heading goes here </h1>
8. Write your page contents
First of all, visit your favorite webpage and see what you like on it. Look at what the designer of the page has done to impress you, and keep it in mind when planning your own site.
I am going to show you how to construct a simple personal page, which will
demonstrate the essential features of web authoring,
Learn About Some of the Methods for Creating Your Own HTML Document
There are several ways to create HTML documents. First of all, you can type in HTML code instructions and content yourself, using atext-editing program. Simple text editors are included with all Microsoft Windows operating systems (WordPad and Notepad), and on the Mac (SimpleText). These are basically stripped-down word processors that your computer already has.
Definition of HTML:
Short for HyperText Markup Language, the authoring language used to create documents on the World Wide Web. HTML defines the structure and layout of a Web document by using a variety of tags and attributes. The correct structure for an HTML document starts with <HTML><HEAD>(enter here what document is about)<BODY> and ends with </BODY></HTML>. All the information you'd like to include in your Web page fits in between the <BODY> and </BODY> tags.
There are hundreds of other tags used to format and layout the information in a Web page. Tags are also used to specify hypertext links. These allow Web developers to direct users to other Web pages with only a click of the mouse on either an image or word(s).
There are hundreds of other tags used to format and layout the information in a Web page. Tags are also used to specify hypertext links. These allow Web developers to direct users to other Web pages with only a click of the mouse on either an image or word(s).
I will be using this method, raw HTML code. I will also be coding our HTML by hand because: 1) it will help you to better understand how web pages work; 2) you will then know how to edit pages, no matter how they were created; and 3) some browsers may not recognize all of the features an application might add to a web page. Think of it like learning to drive on a stick shift--learning the tough way first gives you the skills to drive any car in the future.
tt's really easy to build your first Web page. There are only a few HTML tags you need to learn. Difficulty: Easy
Tags definition - an html code or instruction that is contained with an opening < and a > brackets. Some tags are considered open. They consist of just the brackets and the code. Closed tags have both an opening tag "<code>" and a closing tag, "</code>". Please note the "/" as it is required to show this is a closing tag.
Here's How:
1. Open a text editor like word pad (on all computers free) to a blank page.
2. Write the html tag <html>
3. Write the head of your document <head>
4. Write your title <title> Put your title here </title>
5. Close the head of your document </head>
6. Open the body of your document <body>
7. Give your page a heading <h1> heading goes here </h1>
8. Write your page contents
9. Separate paragraphs with the p tag <p>
10. Close the body of your page </body>
11. Close the html </html>
12. Save the file as file.html
13. Open the file.html file in your Web browser.
Tips:
1. Use any text editor to write your page.(such as word pad on every computer free)
2. Write your HTML tags in lowercase - this conforms to the current standard.
3. Review the page in your browser off your hard drive before uploading it to your server.
Video to assist you Website design Basics and Beginnings To learn more on
video see the attached dvd on your computer or click this link at YouTube
http://www.youtube.com/watch?v=GOfhmzNLWzY
BACKGROUNDS FOR A WEBPAGEAre you board with your background being white? Here's How:
1. Inside the body tag add the bgcolor tag and a color: <body bgcolor="#rrggbb" or color name>
2. For example, blue would look like this <body bgcolor="#ooooff"> or<body bgcolor="blue">
Tips: Get a list of color codes to find the one you want.
10. Close the body of your page </body>
11. Close the html </html>
12. Save the file as file.html
13. Open the file.html file in your Web browser.
Tips:
1. Use any text editor to write your page.(such as word pad on every computer free)
2. Write your HTML tags in lowercase - this conforms to the current standard.
3. Review the page in your browser off your hard drive before uploading it to your server.
Video to assist you Website design Basics and Beginnings To learn more on
video see the attached dvd on your computer or click this link at YouTube
http://www.youtube.com/watch?v=GOfhmzNLWzY
BACKGROUNDS FOR A WEBPAGEAre you board with your background being white? Here's How:
1. Inside the body tag add the bgcolor tag and a color: <body bgcolor="#rrggbb" or color name>
2. For example, blue would look like this <body bgcolor="#ooooff"> or<body bgcolor="blue">
Tips: Get a list of color codes to find the one you want.
ADD GRAPHICS, PICTURE, IMAGE TO BACKBGROUND OF THE WEB PAGEDo you want more than just a color in the background of your Web pages? Then
find out how to add your favorite graphic, picture, or image behind your
words. Here's How:
1. Inside the body tag add the "background" tag and the url of the image.
2. The code will look like this: <body background=http://sitename.com/image.gif>
3. Replace "http://sitename.com/image.gif" with the URL of the image that you want to use.
Tips: You must first have an image online to do this.
CHANGE COLOR OF TEXT ON YOUR WEB PAGE
find out how to add your favorite graphic, picture, or image behind your
words. Here's How:
1. Inside the body tag add the "background" tag and the url of the image.
2. The code will look like this: <body background=http://sitename.com/image.gif>
3. Replace "http://sitename.com/image.gif" with the URL of the image that you want to use.
Tips: You must first have an image online to do this.
CHANGE COLOR OF TEXT ON YOUR WEB PAGE
If you want your text to stand out with other colors than just black or the standard for the browser find out how to do it here.
Here's How:
Here's How:
1. Inside the body tag add the "text" tag and the color code or color name.
2. The code for blue text would look like this: <body text="#ooooff"> or <body text="blue">
3. Replace the code or color name with the color you want.
Tips:. Get a list of color codes to find the one you want.
2. The code for blue text would look like this: <body text="#ooooff"> or <body text="blue">
3. Replace the code or color name with the color you want.
Tips:. Get a list of color codes to find the one you want.
Video to assist you Colors, Fonts, Backgrounds Website Design To learn more on video see the attached dvd on your computer or click this link at YouTube HTML Tutorial 2 - Colors, Fonts, Backgrounds Website Design
http://www.youtube.com/watch?v=eUsuuxo3nYo&feature=list_related&playnext=1&list=SPE1228E63B09ABF5E
HTML Tutorial 3 - Adding Images & Backgrounds To Your HTML Website
http://www.youtube.com/watch?v=ouumT9LoMLk&feature=fvwrel
Adding a Few LinksAnchors are special destination points within a document, allowing you to add links to different parts of the document, such as separate sections, a table of contents, or the top of the page. I will now add an anchor at the top of the page, along with a link at the bottom to bring us back up to the top of the page:
<A NAME= "top_of_page"></A> [Creates and names an anchor; we're putting this one at the top of the page]
http://www.youtube.com/watch?v=eUsuuxo3nYo&feature=list_related&playnext=1&list=SPE1228E63B09ABF5E
HTML Tutorial 3 - Adding Images & Backgrounds To Your HTML Website
http://www.youtube.com/watch?v=ouumT9LoMLk&feature=fvwrel
Adding a Few LinksAnchors are special destination points within a document, allowing you to add links to different parts of the document, such as separate sections, a table of contents, or the top of the page. I will now add an anchor at the top of the page, along with a link at the bottom to bring us back up to the top of the page:
<A NAME= "top_of_page"></A> [Creates and names an anchor; we're putting this one at the top of the page]
<A HREF="#top_of_page">To Top of Page</A> [Creates a link that, when clicked, will jump the user back up to our anchor, at the top of the page]
In addition, we'll add a link to the email address of the page's author (that would be you):
<A HREF="mailto:howdy@yahoo.com"> Rob Jones</A>
When a visitor clicks on this link, her browser will activate her default email application and open a new blank message. The message will
already be addressed to you, and the user will only have to fill in her message and hit the "send" icon or command.
You may also want to add a list of your favorite links, if your page is intended to reflect your hobbies or interests. To add just one of our favorite links:
<A HREF="http://contactsgovtph.blogspot.com/">Visit the CIA Homepage for Kids!</A>
Video to assist you To learn more on video see the attached dvd on your computer or click
In addition, we'll add a link to the email address of the page's author (that would be you):
<A HREF="mailto:howdy@yahoo.com"> Rob Jones</A>
When a visitor clicks on this link, her browser will activate her default email application and open a new blank message. The message will
already be addressed to you, and the user will only have to fill in her message and hit the "send" icon or command.
You may also want to add a list of your favorite links, if your page is intended to reflect your hobbies or interests. To add just one of our favorite links:
<A HREF="http://contactsgovtph.blogspot.com/">Visit the CIA Homepage for Kids!</A>
Video to assist you To learn more on video see the attached dvd on your computer or click
HTML Tutorial 5 - Links & Menu Bars - Website Design Tutorial
http://www.youtube.com/watch?v=sdlLk0xsuow&feature=fvwrel
Web page design Tables
Tables are like drawn boxes on a web page and are used to control the width of material presented on a Web page. Table width can be specified in either percent or pixels. Specifying table width in percent will cause the table size to change depending on what the viewer's screen size is. This means that on some screens the page layout will be very narrow, on others it will be extremely wide. This telescoping effect can be very helpful when a design must fill a screen so that there are no blank areas.
Table - tables are similiar to a spreadsheet display in that each contains columns and rows. Tables must be defined with an opening tag of <TABLE> with the closing tag of </TABLE>
http://www.youtube.com/watch?v=sdlLk0xsuow&feature=fvwrel
Web page design Tables
Tables are like drawn boxes on a web page and are used to control the width of material presented on a Web page. Table width can be specified in either percent or pixels. Specifying table width in percent will cause the table size to change depending on what the viewer's screen size is. This means that on some screens the page layout will be very narrow, on others it will be extremely wide. This telescoping effect can be very helpful when a design must fill a screen so that there are no blank areas.
Table - tables are similiar to a spreadsheet display in that each contains columns and rows. Tables must be defined with an opening tag of <TABLE> with the closing tag of </TABLE>
Table Data - this is the individual cell or data that will be displayed by the browser. To define the cell use: <TD>, Data to be displayed </TD>
Table Row - This tag defines the row element of the table. Each row that is displayed will use the following tags: <TR>, closing tag </TR>
Video to assist you HTML Tutorial 4 - HTML Website Tables & Layouts Tutorial
To learn more on video see the attached dvd on your computer or click this
link at YouTube http://www.youtube.com/watch?v=tXjoR0IayMA&feature=fvwrel
After completing work, Save by going to "save as", put a filename with an .html extension (such as "testfile.html")and choose "all files" or "txt"
under file type.
Obtain Web Space and Web addressTo make your web page available to the world, you'll need to upload it to a web server. Your school or business may offer you web space at a low price or for free. If not, you will have to use a commercial provider. Your Internet Service Provider (ISP) may already offer adequate web space for you. Finally, several commercial sites, like Yahoo! GeoCities, offer free space (and web-building tools) for users in exchange for allowing advertising on their pages. This can be an affordable option for web publishers who aren't afraid of a few banner ads..
Fortunately, you don't need to have server space to create an HTML document on your own computer, or even to email it to your friends, enemies and everybody who's ever been foolish enough to give you his email address. Both Mozilla Firefox and Internet Explorer will let you open an HTML document directly from your hard drive. We'll talk about this later, when you check out our sample page.
Web Address Definition: An address string containing the access protocol, domain name, and file or resource path which is normally used to specify the address of a web page, image, or other document on the Internet. This is just like a house address you must know the street and the number to find the house and this is also true on the web you need a full address to locate the web page you uploaded. Plus you also need a place to store it so the web address can be attached to the location so it can be found, This is like a cell phone storage. But you can use the cell phone with different sims just like your web address can be moved to new computers that will store it for you.
To learn more on video see the attached dvd on your computer or click this
link at YouTube http://www.youtube.com/watch?v=tXjoR0IayMA&feature=fvwrel
After completing work, Save by going to "save as", put a filename with an .html extension (such as "testfile.html")and choose "all files" or "txt"
under file type.
Obtain Web Space and Web addressTo make your web page available to the world, you'll need to upload it to a web server. Your school or business may offer you web space at a low price or for free. If not, you will have to use a commercial provider. Your Internet Service Provider (ISP) may already offer adequate web space for you. Finally, several commercial sites, like Yahoo! GeoCities, offer free space (and web-building tools) for users in exchange for allowing advertising on their pages. This can be an affordable option for web publishers who aren't afraid of a few banner ads..
Fortunately, you don't need to have server space to create an HTML document on your own computer, or even to email it to your friends, enemies and everybody who's ever been foolish enough to give you his email address. Both Mozilla Firefox and Internet Explorer will let you open an HTML document directly from your hard drive. We'll talk about this later, when you check out our sample page.
Web Address Definition: An address string containing the access protocol, domain name, and file or resource path which is normally used to specify the address of a web page, image, or other document on the Internet. This is just like a house address you must know the street and the number to find the house and this is also true on the web you need a full address to locate the web page you uploaded. Plus you also need a place to store it so the web address can be attached to the location so it can be found, This is like a cell phone storage. But you can use the cell phone with different sims just like your web address can be moved to new computers that will store it for you.
Video to assist you . To learn more on video see the attached dvd on your computer or click
HTML Tutorial 6 - Putting Your Website Online - Website Design Tutorial
http://www.youtube.com/watch?v=DvBrOpU0TeE&feature=fvwrel
How To Get A Free Website Address & Domain
http://www.youtube.com/watch?v=7blEI4c7lmI&feature=watch_response
dot.tk? Is Free And Has No Ads! http://www.freedomain.co.nr/
com/370693.html http://www.000webhost.com/
Host your webpage here
Google Sites
HTML Tutorial 6 - Putting Your Website Online - Website Design Tutorial
http://www.youtube.com/watch?v=DvBrOpU0TeE&feature=fvwrel
How To Get A Free Website Address & Domain
http://www.youtube.com/watch?v=7blEI4c7lmI&feature=watch_response
dot.tk? Is Free And Has No Ads! http://www.freedomain.co.nr/
com/370693.html http://www.000webhost.com/
Host your webpage here
Google Sites
free website hosting https://www.mediafire.com/register.php
http://www.youtube.com/watch?v=OaKvo18N18o
http://www.youtube.com/watch?v=OaKvo18N18o
Extra information The Basics How do I add a video to my blog or web page?You'll need to edit the HTML of your blog entry or page-this should be relatively straightforward. In Blogger, for example, just click the "Edit HTML" tab.Next, go to the video that you want, and look for the 'Embed' box in the "About This Video" section. Copying the HTML code that's there into your website will create an embedded player; the video will play within your site when the user clicks on the 'Play' button.
You can resize the player by editing the object width="425" and height="350" fields at both the beginning and end of the embedded player code. Make sure that the sizes you choose have the same ratio as the default numbers, so that the video doesn't get stretched-just multiply the width by 0.8235 to get the height.
Convert video to FLV format step by step
YouTube Videos
Placing videos from YouTube is the easiest method...This is the simplest of all methods. This way, you can embed videos in your
web page with no code knowledge whatsoever. Also, you do not need to host the video yourself.
1 Go to YouTube at youtube.com.
2 Search for the video which you want to include, or upload your own.
3 Find the embed option on the page, or, if you are watching this YouTube video on a website other than youtube.com, (in other words, if it is already embedded) the option will appear at the end of the video.
4 Copy the code supplied to the clipboard. (Right Click > Copy or Ctrl > C for Windows users)
5Paste the code into your webpage where you want the video to appear. (Right Click > Paste or Ctrl > V for Windows users)
3 Find the embed option on the page, or, if you are watching this YouTube video on a website other than youtube.com, (in other words, if it is already embedded) the option will appear at the end of the video.
4 Copy the code supplied to the clipboard. (Right Click > Copy or Ctrl > C for Windows users)
5Paste the code into your webpage where you want the video to appear. (Right Click > Paste or Ctrl > V for Windows users)
Video to assist you . To learn more on video see the attached dvd on your computer or click
Embed YouTube Video(s) Secret's Revealed!
To do slideshows just add music and photos online at http://www.kizoa.com/ free
Or http://www.picturetrail.com/
Log into YouTube and visit the Upload page of the website. Select the "Upload" button and choose your video from those on your computer. Press "Enter" and wait until the slideshow finishes uploading, which may take several minutes. Watch your finished slideshow and use the links and codes on the page to share your slideshow.
Great with detailed information. It is really very helpful for us.
ReplyDeleteVillage Talkies a top-quality professional corporate video production company in Bangalore and also best explainer video company in Bangalore & animation video makers in Bangalore, Chennai, India & Maryland, Baltimore, USA provides Corporate & Brand films, Promotional, Marketing videos & Training videos, Product demo videos, Employee videos, Product video explainers, eLearning videos, 2d Animation, 3d Animation, Motion Graphics, Whiteboard Explainer videos Client Testimonial Videos, Video Presentation and more for all start-ups, industries, and corporate companies. From scripting to corporate video production services, explainer & 3d, 2d animation video production , our solutions are customized to your budget, timeline, and to meet the company goals and objectives.
As a best video production company in Bangalore, we produce quality and creative videos to our clients.