HTML Tutorial

History of HTML
Hypertext markup language is a markup language that web browsers use to interpret and compose text, images and other material into visual or audible web pages. Default characteristics for every item of HTML markup are defined in the browser, and these characteristics can be altered or enhanced by the web page designer's additional use of CSS.
Tim berners Lee

After Vannevar Bush first proposed the basics of hypertext in 1945, it laid the foundation for Tim Berners-Lee and others to invent the World Wide Web, HTML (hypertext markup language), HTTP (HyperText Transfer Protocol) and URLs (Universal Resource Locators) in 1990. Definition of HTML
HTML stands for HyperText Markup Language, it is the authoring language used to create documents on the World Wide Web. HTML is used to define the structure and layout of a Web page, how a page looks and any special functions. HTML does this by using what are called tags that have attributes. For example means a paragraph break. As the viewer of a web page you don't see the HTML, it is hidden from your view, however, you do the results.
HTML Basics : INTRODUCTION

Webpages are written in HTML - a simple scripting language. HTML is short for HyperText Markup Language. * Hypertext is simply a piece of text that works as a link. * Markup Language is a way of writing layout information within documents. Basically an HTML document is a plain text file that contains text and nothing else. When a browser opens an HTML file, the browser will look for HTML codes in the text and use them to change the layout, insert images, or create links to other pages. Since HTML documents are just text files they can be written in even the simplest text editor. A more popular choice is to use a special HTML editor - maybe even one that puts focus on the visual result rather than the codes - a so-called WYSIWYG editor ("What You See Is What You Get").
Some of the most popular HTML editors, such as FrontPage or Dreamweaver will let you create pages more or less as you write documents in Word or whatever text editor you're using. However, there are some very good reasons to create your own pages - or parts of them by hand... It is possible to create webpages without knowing anything about the HTML source behind the page. There are excellent editors on the market that will take care of the HTML parts. All you need to do is layout the page. However, if you want to make it above average in webdesign, it is strongly recommended that you understand these tags. The most important benefits are:
You can use tags the editor does not support.
You can read the code of other people's pages, and "borrow" the cool effects.
You can do the work yourself, when the editor simply refuses to create the effects you want.
You can write your HTML by hand with almost any available text editor, including notepad that comes as a standard program with Windows. All you need to do is type in the code, then save the document, making sure to put an .html extension or an .htm extension to the file (for instance "mypage.html").
TAGS
Basically, a computer sees an "A" as simply an "A" - whether it is bold, italic, big or small. To tell the browser that an "A" should be bold we need to put a markup in front of the A. Such a markup is called a Tag. All HTML tags are enclosed in < and >.
Example: a piece of text as it appears on the screen. This is an example of bold text. HTML: the HTML for the above example: This is an example of bold text. As you can see, the start tag indicates that whatever follows should be written in bold. The corresponding end tag indicates that the browser should stop writing text in bold. PAGE STRUCTURE All normal webpages consist of a head and a body. Head Body * The head is used for text and tags that do not show directly on the page. * The body is used for text and tags that are shown directly on the page. Finally, all webpages have an <html> tag at the beginning and the end, telling the browser where the document starts and where it stops. The most basic code - the code you will use for any page you make, is shown below: <html> <head>  </head> <body>  </body> </html> HEAD SECTION The head section of the webpage includes all the stuff that does not show directly on the resulting page.
The <title> and </title> tags encapsulate the title of your page. The title is what shows in the top of your browser window when the page is loaded. Right now it should say something like "Basics - Html Tutorial" on top of the window containing this text. Another thing you will often see in the head section is metatags. Metatags are used for, among other things, to improve the rankings in search engines. Quite often the head section contains javascript which is a programming language for more complex HTML pages. Finally, more and more pages contain codes for cascading style sheets (CSS). CSS is a rather new technique for optimizing the layout of major websites. Since these aspects are way out of reach at this stage we will proceed with explaining the body section. BODY SECTION The body of the document contains all that can be seen when the user loads the page. In the rest of this tutorial you can learn in detail about all the different aspects of HTML, including: * Text o Formatting o Resizing o Layout o Listing * Links o To local pages o To pages at other sites o To bookmarks * Images o Inserting images (GIF and jpg)
o Adding a link to an image * Backgrounds o Colors o Images o Fixed Image * Tables * Frames * Forms * Metatags * Hexadecimal Colors The last page in this introduction will give you an overview of how to proceed with the HTML tutorial (and beyond). HTML Text : BASE FONT To specify the overall font for your page add the <basefont> tag at the beginning of the <body> section. Example: The page as it looks in the browser.
Hello! This is my page. All text looks the same since I only specified a basefont.
HTML: The code to produce the above example. <html> <head> <title>my page</title> </head> <body> <basefont face="arial, verdana, courier" size="4" color="green"> Hello! This is my page. All text looks the same since I only specified a basefont. </body>
</html> The color attribute selects the desired color for your text. The face attribute selects the desired font. Note: If you enter a list of fonts, like in the example, the browser will use the first font in the list available on the visitor's computer. The size attribute specifies the desired size, between 1 (smallest) and 7 (biggest). The tag will change the font. Example: How the output looks in the browser. Hello! This is my page. This local text looks different. This text looks like the first line. HTML: The code to produce the above example. <html> <head> <title>My Page</title> </head> <body> <basefont color="green" face="arial" size="4"> Hello! This is my page. This local text looks different. This text looks like the first line. </body> </html> The color attribute selects the desired color for your text. The face attribute selects the desired font. Note: If you enter a list of fonts, like in the example, the browser will use the first font in the list available on the visitor's computer.
TEXT LINKS The tags used to produce links are the <a> and </a>. The <a> tells where the link should start and the </a> indicates where the link ends. Everything between these two will work as a link. The target of the link is added to the <a> tag using the href="http://www.whateverpage.com" setting. The example below shows how to make the word here work as a link to yahoo. Click <a href="http://www.yahoo.com">here</a> to go to yahoo. You simply: * Specify the target in the <a href=" ">. * Then add the text that should work as a link.
Finally add an </a> tag to indicate where the link ends.
These are the tags for text formats:

text text text text text <blink>text</blink> <strike>text</strike> <tt>text</tt> <pre>text</pre> text text
writes text as bold writes text in italics writes underlined text lowers text and makes it smaller lifts text and makes it smaller guess yourself! (Note: Netscape only.) strikes a line through the text writes text as on a classic typewriter writes text exactly as it is, including spaces. usually makes text italic usually makes text bold
Note: The <blink> tag is only supported by Netscape browsers, and should be avoided. These are the tags for changing the font size.
<big>text</big> text <h1>
increase the size by one decrease the size by one writes text in biggest heading writes text in smallest heading writes text in smallest fontsize. (8 pt) writes text in biggest fontsize (36 pt)
text</h1>
<h6>text</h6> text 
text

The and <big> tags are special in that they can be repeated. If you want to increase the font size with a factor two, then you could do it like this: bla bla bla <big><big>whatever</big></big> bla bla bla
Note: While the font tag lets you specify font attributes in plain HTML, you really should look into the tutorial on CSS to learn how to get full, flexible and much more advanced control of your text.

HTML Tutorial

Hochgeladen von

Dokumentinformationen

Originalbeschreibung:

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

HTML Tutorial

Hochgeladen von

Copyright:

Verfügbare Formate

History of HTML

Tim berners Lee

HTML Basics : INTRODUCTION

You can use tags the editor does not support.

Finally add an </a> tag to indicate where the link ends.

These are the tags for text formats:

<h6>text</h6> <font size="1">text</font> <font size="7">

Das könnte Ihnen auch gefallen