How to create a website?
How to build your website easily and simply, there are libraries html, css, php, javascript, jquery, web-graph.
author:

The HTML language.

HTML

The basics of HTML (Hypertext Markup Language) is a markup language for creating pages that are used to turn text documents into Web pages. The HTML language allows you to define the elements that create the structure of the pages of the site as headers (h1, h2, h3, h4, h5, h6, paragraphs a, and lists ul ol, various div blocks, etc. Elements of the site documents serve as mechanisms to add in the Web page of hypertext links on a site, interactive forms, and multimedia components: as audio and video, just pictures and images. HTML give at least, to display the document on the page. In the basics of HTML recently there have been advances, starts next cycle of creation of the basics of HTML, but on a higher interactive level, and in the layouts were created attributes that quite independently can revive many actions on objects when creating the site. Will be a break of the basics of HTML in voice control all actions on the site. All the functions for creating site will take over the machine and the HTML base will be transformed. What will happen, time will show, or rather is a breakthrough in this direction. You care about is, when you create your own website to learn HTML in this presentation.

HTML

The basics of HTML (Hypertext Markup Language) is a markup language for creating pages that are used to turn text documents into Web pages. The HTML language allows you to define the elements that create the structure of the pages of the site as headers (h1, h2, h3, h4, h5, h6, paragraphs a, and lists ul ol, various div blocks, etc. Elements of the site documents serve as mechanisms to add in the Web page of hypertext links on a site, interactive forms, and multimedia components: as audio and video, just pictures and images. HTML give at least, to display the document on the page. In the basics of HTML recently there have been advances, starts next cycle of creation of the basics of HTML, but on a higher interactive level, and in the layouts were created attributes that quite independently can revive many actions on objects when creating the site. Will be a break of the basics of HTML in voice control all actions on the site. All the functions for creating site will take over the machine and the HTML base will be transformed. What will happen, time will show, or rather is a breakthrough in this direction. You care about is, when you create your own website to learn HTML in this presentation.

When learning a language HTML remember that the HTML language is the basis of site building, it is necessary to know "by heart". At least a solid idea about what and where and what for it is written. Be a slow and thorough study is structured as a site page, what elements and how they are written, what attributes they have, what and where is invested know membrane of the document bases for the organization of the page. To memorize, so as not to strain. The devil is not so black as he is painted. Not much information is required to learn and take to write the first necessary codes to unblock your own website and correctly displaying all the information you place on Your pages.

The basics of marking the creation of the site. An XHTML document is a document in ASCII ( plain text) or Unicode. Recently, used UTF-8 ( although not dropped and the encoding of the Window-1215 or similar systems the message which is marked by tags indicating elements and other necessary ads. Element - is a structural component (for example, a paragraph p) < p>...< /p> or desired function (for example, line wrapping br) < br />. Element is any image denoted by the < img>tag. Will host a lot of useful information about other events and phenomena of the nature of the life of man is a part of formation and development.

Page Elements in HTML that will be needed to create a website. Items are indicated in the text by inserting a special enclosed HTML-tags. Most of the items using the following syntax: < controlname>content< /controlname>, such as < html>...< /html> or < div>...< /div>. The name element is specified in the start tag (also called the opening tag), and then in the end (or the closing tag, and in the latter case, before putting a slash (/). End-tag works like «disable» item. What enclosed in angle brackets in the browser or user agent does not appear. The item includes both content and its markup ( start and end tags). To verify this, you can click the right mouse button, then click in the same browser on the "Source code", in other on-line - View HTML-code and then you will see the contents of the pages in the HTML codes. For clarity, it should be noted that the code of the site is written in PHP code, You simply will not see in this case, you will only display the results of the scenarios. Now, You are a piece of the so-called cap on this page of the website:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
< html>
< head>
< meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
< meta name="copyright" content="All rights belong 
Vasiliev Oleg The Nikandrovich. Use of any material may 
only with permission of the author and when the source is acknowledged 
http://saitslide.ru/" />
< meta name="author" content="Oleg Vasiliev" />
< meta name="keywords" content="how to quit Smoking easy not to smoke 
your free to create a website page the word meaning boorish 
the language of faith is love human health" /> 
< meta name="description" content=" Site about how the basis of seven lines of PHP
and HTML code to create easily and quickly your own website from 
simple blocks." /> 
< script type="text/javascript" src="http://userapi.com/js/api/
openapi.js?49">< /script>

< title>HTML.< /title>
< link rel="stylesheet" href="../stylesheet/saitcss1.css" type="text/css">
< /head> 

In XHTML the names of elements and attributes must be in lowercase. Language HTML is not case-sensitive, which will form the program site. You first your website will create in HTML codes, because in HTML requirements are not so hard to write the elements of the site. Language layouts HTML codes in fact created for us citizens, so that they could be programmed so that the machine understood and accepted Your ideas during the development of the website.

In the HTML version 4.01 and above the end tag for some elements of the site is optional, and the browser determines the end item to the context. However, take for a rule to all tags which have their counterparts, to finish (or add a closing tag elements. This practice is most common in relation to the element p paragraph page. Most web browsers automatically ends the paragraph, when he meets a new start tag. In XHTML the use of end tag is required on site pages. Some elements have no content, since it is used as a simple Directive, such elements are empty. An example of such a site's element is the element is the image img. It forces the browser to include in the current page is an external image file. Other empty elements include a line-br, the horizontal rule hr and items that contain information about the document of the website and does not affect display materials, and meta-base. Look at the code, which has led just above the text, there are all clearly seen how to write a particular tag on the page of the site. In HTML 4.01, and below an empty elements just did not have a closing tag. In XML, the end tag is required for each item pages. Use the Convention that a slash is used inside tag, indicating the end, for example, < img/> < br/> and < hr/>. For backward compatibility, it is recommended to add a space before the slash on the pages of the website. A space is required if you are sending an XHTML document of the website, specifying the Content-Type header to text/html.

Attributes when writing HTML tags on the page. Attribute in HTML clarify or change the behavior of the sample element of the document on the page. Attributes are denoted pairs of attribute name and value added to an element's start tag ( end tags never contain attributes, how could it be otherwise, since all actions and enclosed between the beginning and ending tag on the page). The attribute names and valid values are declared in the DTD site. In other words, you can't create your own attributes to tags, because they are already established and recommended by the W3C vsemirnoi web.

You can add multiple attributes in a single opening tag. Attributes in HTML, if they exist, are specified after the tag name and are separated by one or more spaces on site pages. The order does not matter. The syntax of the element with the following attributes: < element atribut="value" atribut="value">content< /element>. Now, see, for example:

< img class="expando" 
src="http://www.rulez-t.info/uploads/posts/2009-03/1238098799_raduga_15.jpg"
height="530" width="580" vspace="15" hspace="40" alt="Raduga" 
title="Wants to look and admire." />

Most browsers cannot handle attribute values, if the length exceeds 1024 characters. The values may be case sensitive, especially if it is a file name or URL. In HTML 4.01, and below are allowed to use some values without the quotation marks, for example if the value is a single word containing only letters:

(a-z and A-Z), 
numbers (0-9), 
a dash (-), 
a dot (.), 
underscores (_) and
a colon (:)

It is Best to quote all values on the pages of the site, irrespective of the recommendations. Do not miss the closing quote, otherwise everything from the opening quote and until the next opening quotation marks that will be interpreted as part of value and will not be displayed in the browser. This is a simple mistake, a search which may take many hours of work on the site. There is a small secret when finding these errors: after mistakes, that is, the error displayed pages continues different color font changes, or the fat content of the letters change, i.e. when checked ( debug own programs in the current browser refer to such seemingly little things, okislenie color of the text after a certain character on the page). So You have made an error.

In principle, at present text editors have their own internal editor and find the error writing tags in a stage of writing the program. If such a simple syntax errors will tell You and will determine the place where there is a syntax error. Of course, the logical errors or errors associated with Your software solutions they can't find.

Nested elements. HTML elements can contain other elements. This is called nesting, so this option is used correctly, the entire element, including its layout of the pages, should be placed between the start and end tags of another element (parent) page of the website. Proper use of nesting is one of the criteria for well-formed document site. In this example, the items in the list li nested within element - an unordered list ul.

< ul>
< li>Draw l< /li>
< li>Draw 2< /li>
< /ul>

or look at what happens in practice:

< ul style="margin: 25px;">
< li>< a href="../strojsait/novichok.html">How to create a website?< /a>< /li>
< li>< a href="../strojsait/vvedenie1.html">How to write a page?< /a>< /li>
< li>< a href="../strojsait/nachalo.html">where to begin?< /a>< /li>
< li>< a href="../strojsait/saittag.html">Little about layouts, codes, styles< /a>< /li>
< li>< a href="../strojsait/saittag1.html">What is the structure of the page?< /a>< /li>
< li>< a href="../strojsait/saittag2.html">page Structure.< /a>< /li>
< li>< a href="../strojsait/saittag3.html">Block structure.< /a>< /li>
< li>< a href="../strojsait/saittag4.html">Method of the " child's curiosity."< /a>< /li>
< li>< a href="../strojsait/saittag5.html">Block structure in the codes PHP.< /a>< /li>
< li>< a href="../strojsait/saittag6.html">Look what we got.< /a>< /li>
< li>< a href="../strojsait/saittag7.html">Starting to decorate the page.< /a>< /li>
< /ul>

As you see, here in unordered lists < ul>...< /ul> nested list items < li>...< /li>, the items in the list in turn invested so-called hypertext link's < a>...< /a>.

Now this is an example of nesting in the form element form of ' questionnaire ' input with its attributes and call composed of buttons in a separate nested div element with id="obertka0:

< form action="opros.php" method="post"> 

< input type="text" name="text1" value="text1"> 
< input type="checkbox" name="box1" value="box1"> 
< input type="submit" name="submit1" value="Send-1 block> 

< input type="text" name="text2" value="text2"> 
< input type="checkbox" name="box2" value="box2"> 
< input type="submit" name="submit2" value="Send unit 2">

< input type="text" name="text3" value="text3"> 
< input type="checkbox" name="box3" value="box3"> 
< input type="submit" name="submit3" value="Send unit 3"> 

< input type="submit" name="all" value="Send"> 
< /form>

In this form prepared the necessary fields on the page, then interactively prepared another generalized form and sent to the server. Itself markup on the page of Your site will look based on the situation the task, let it be to say:

< div id="obertka0"> 

< div id="obertka1"> 
< input type="text" name="text1>
< input type="checkbox" name="chk1" value="1"> 
< input type="button" value="Save" onclick="ds('obertka1');"> 
< /div> 

< div id="obertka2"> 
< input type="text" name="text2">
< input type="checkbox" name="chk2" value="2"> 
< input type="button" value="Save" onclick="ds('obertka2');"> 
< /div> 

< div id="obertka3"> 
< input type="text" name="text3">
< input type="checkbox" name="chk3" value="3"> 
< input type="button" value="Save" onclick="ds('obertka3');"> 
< /div> 

< /div>

To Consider how it works this script program website makes no sense, especially codes of nedogona and finely decorated. Just look what a complex nested structures on the site can arise during the implementation of Your tasks in specific cases. Here are strictly observed the nesting of the elements one into another, as dolls are small dolls in a slightly larger etc.

A Common error in the HTML closing of the parent element of the site before the closing of the item that was invested into it (the child). This leads to a false ceiling elements and XHTML document site is ill-formed and could lead to errors in the layout of HTML documents on the website. The example incorrectly nested elements, because a strong element must be closed before the a (anchor). INCORRECT:

< a href="#"> Click < strong> here. < /a> < /strong>

There are other improper nesting of the elements - the inverse of the nesting of the elements. For example, when a hyperlink embedded in a paragraph p:

< a href="../strojsait/novichok.html">< p>How to create a website?< /p>< /a>

Although some browsers do not bresque can display correctly the recording of a program code of a site. But, as you cannot write, it is an incorrect entry-line program portal. The link is a must not contain a paragraph p, on the contrary, all references should only be in the paragraph on the page.

Information pages of your site, which the browsers ignore. Some of the information in the HTML document, including a layout of the pages, is ignored and has very little or no impact on performance when the site document appears in the browser or user agent. These include:

Returns < br /> pages in HTML.

Returns in the HTML document customers are treated as whitespace, which, as a rule, together with the other spaces.

The Text and elements in HTML are displayed continuously, until the text does not meet the element p or br. However, the line breaks on the page displayed if text is marked up as preformatted < RG>...< /pre> or, if in the stylesheet used the property of white-space: pre.

< pre>
< ul style="margin: 25px;">
< li>< a href="../strojsait/novichok.html">How to create a website?< /a>< /li>
< li>< a href="../strojsait/vvedenie1.html">How to write a page?< /a>< /li>
< li>< a href="../strojsait/nachalo.html">where to begin?< /a>< /li>
< li>< a href="../strojsait/saittag.html">Little about layouts, codes, styles< /a>< /li>
< li>< a href="../strojsait/saittag1.html">What is the structure of the page?< /a>< /li>
< li>< a href="../strojsait/saittag2.html">page Structure.< /a>< /li>
< li>< a href="../strojsait/saittag3.html">Block structure.< /a>< /li>
< li>< a href="../strojsait/saittag4.html">Method of the " child's curiosity."< /a>< /li>
< li>< a href="../strojsait/saittag5.html">Block structure in the codes PHP.< /a>< /li>
< li>< a href="../strojsait/saittag6.html">Look what we got.< /a>< /li>
< li>< a href="../strojsait/saittag7.html">Starting to decorate the page.< /a>< /li>
< /ul>
< /pre>

that's how you create a pre-formatted website.

The Tabs and multiple spaces in the HTML. If a user agent encounters a few consecutive space characters in the HTML of the site, it displays only one. Additional spaces on site pages you can add text using character entity ( ). But multiple spaces are displayed if the text pages marked as preformatted (pre) or if in the stylesheet used the property of white-space: pre. About it say on a separate page.

Extra spaces are not solve layout
words in context, just a sign of ignorance how does 
a browser. Just change the padding field or indent
the red line that seemed ready text crumbled.
If You are at the start typing will not enter any extra 
spaces, the problem itself is solved. 
What if the text appears in the form of abstracts, diplomas
etc. in the Internet?
Any text editor allows you to easily solve 
this type of problem. For example, Word allows not only to enter the excess, 
but quickly remove it. Extra spaces at the beginning of the string replace 
indents the red line. Instead of spaces in such cases, use 
menu in the Format | Paragraph, tab Indents and spacing» field
Indent | the First line is» select «Indent» and set the 
value - 1.27 see Remove extra spaces and tabs in the beginnings and 
the ends of lines, selecting the entire text and setting the center alignment - 
spaces will be removed. Next, set the desired alignment, for example 
on width.
How to remove the extra spaces in the text? 
The extra space is placed, because do not know about the inseparable space,
and try to add many gaps. Enter a non-breaking space,
using Ctrl+Shift+Spacebar, press and hold Ctrl, Shift, click 
a space and then release all keys. Almost as equal and inseparable 
the hyphen in combinations like «1», «a-1» - Ctrl+Shift+Hyphen.

a Little about tab and tabulation of the displayed text page of the site:

Horizontal tab (HT, TAB) used for leveling 
text horizontaltransform these positions are 
every 8 chars, in columns 1, 9, 17... In the languages of programmer
tion referred to as \t.

write: 
one→two→three→four
1→2→3→4
5→6→7→8
9→10→11→12
13→14→15 > 16

will receive:
one two three four
1 2 3 4
5 6 7 8
9 10 11 12
13 14 15 16

Also includes vertical tab (VT ID 0B16, 
now it is very seldom used.

Text editors tab stops can go every 2 or 4 characters. At will of the user, the Tab key is not вставляtn character-tab, but Imiterere tabulation, substituting a certain number of spaces.

In some recommendations writing code categorically prohibit the characters tabs. In other make use tabs, not spaces.

word processors put the tab positions in any places of the text and align the text on the page on either side of these positions (left, center, right side). When using the tabs sometimes implemented the numbering of formulae, definition lists, tables of contents.

Similar functionality at the tables. The text is aligned tab, cannot be lined in rows and columns. And at the tables of the text cannot go outside the cell.

Horizontal tab is displayed by the browser when it is used within a < pre> and < textarea>:

Two lines with a tab:

Today 2013 	 Indentation inside the string.
	 Today 2013 Tab in the beginning of the line.


The browser will display:

Two lines with a tab:

Today 2013 Tab inside the string.
 Today 2013 Tab in the beginning of the line.

Vertical tabs are not used ( or rarely, rarely).

Over the Tab key entrenched functions:

In text editors, word processors
enter a tab character, working with indentation.

In graphical interfaces - jump. Windows Tab 
switching between items in the current window, 
Alt + Tab switches between programs. Jump
in the opposite direction - Shift+ Tab

In the console interfaces (for example IOS, bash, Zsh), 
completion of the command.

In games show additional materials including
the number of the card level, the table of results job.

Empty elements R( paragraphs). Empty elements of paragraphs (< p>. . . < /p> or < p> ), without of text in them , are interpreted by most browsers as redundant and are displayed as one end of a paragraph. So You have to consider or not to take this into account when creating the site.

< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>

These lines to paragraphs simply will not be displayed.

Most browsers will display several items perevoda lines br multiple line breaks on the pages of the website. But big trouble when displaying pages in the website is not called.

An Unrecognized element on the page. The browser simply ignores any element on the website pages that the web browser doesn't understand or that was incorrectly specified on the website's pages. Depending on the item web browser that can lead to different results. Browsers typically display the item's content and layout as plain text, although some older browsers could display and to issue any error code.

the text of the comments pages in HTML. Browsers do not display the text enclosed between the special < ! - - and - -> , which are used to denote a comment. A comment is any text enclosed in these tags:for example:

< ! - - here I can leave any information - ->

Here is the text of the comment specifically highlighted in bold. The HTML layout of the pages, which is contained within a comment, not displayed, hence the comments pages of the site can be used for temporary hiding of the materials without their complete removal from the document of the site. But the comment is a very good way to leave links when creating your website. This saves nerves and most importantly saved time.

However, never and under no circumstances, even for one moment do not write as a comment on the site's pages, no personal data, whether it be numbers or passwords, whether addresses and surnames and the names and their relatives. So how easy it is to accidentally enter the site page in the web of the Internet, back out again You can never take it. So be very, very careful about leaving comments as personal data on the pages of your website ( well, in any scenario may not be doing it!)

The HTML documents are plain-text files. Can be used to create HTML documents any existing text editor. Hot would recommend to use as the tool of creation and layout of the site is best Adobe Dreamweaver CS6. There are many tools for creating a website, which makes the process of creating a Web site documents faster and more efficient. These tools are divided into two main categories: HTML editors and WYSIWYG tools (What You See Is What You Get - what you see is what you get). In principle, nowadays there are no problems with selecting text editor, i.e. a tool in a wide range of choice. Tools for Web development in HTML initially applied everywhere, that is, to create your website at this stage invented and introduced for webmasters many excellent tools clearance and pleasant interactive blotches on pages of Your site with the various plugins and functions, routines and scripts. And the most beautiful in these editors that they mostly apply for use free of charge. As for the so you can get updates to existing programs, as something to work with when creating your website there is one problem: that of all the variety of programs to choose?

The Editors, HTML/XHTML ( Tools for Web development in HTML). HTML editor is a text editor designed specifically for writing HTML pages. Tools for Web development in HTML require to know how to write HTML code manually, but they save time, because they contain references to such repetitive tasks, like setting the site documents, tables compile or styles to text pages. There are many simple HTML editors, and ka have already said, many of the proposed text editors available for free. Just type «HTML Editor». And You will give a lot of text editors. Choose what You like. With time you will understand what and why, what editor You need, but your opinion I expressed for Adobe Dreamweaver CS6, for me he is the best at this stage when creating Classicheskoye at home.

A WYSIWYG authoring tool. HTML WYSIWYG editors have graphical interfaces that raise the creation of the HTML pages on more than the high level of design and work with a word processor or page-layout program make nice and very fast. If You want to add an image, just drag an image from the desktop to the page of Your site. The tool creates all the HTML pages on the site, necessary for obtaining a graphical effect, i.e. writing program codes with you, editor takes and codes of programs will be instant created and written on the page of Your website as easily and simply create site page. Besides simple labels, styles and formats of the web site, many of these tools allow you to automate more complex tasks, such as creating cascading style sheets, add the JavaScript and PHP, functions of language jQuery and plugins from the library jQuery. Using WYSIWYG tools site gives the number advantages:

• They give essential economy of time
in comparison with writing code manually.
• They are well suited for the rapid creation
prototypes, can test 
design ideas on the fly.
• They offer a good starting point 
to create style sheets, scripts
JavaScript and other features.

To big drawback of such a super-duper editors tools for Web development in HTML) would apply not small price in cash to generate website.

Reiterate its opinion that said and advised the most popular and useful tool to create pages: Adobe Dreamweaver CS6 is the latest version at the moment. Powerful tools, the framework for the layout of the site pages and style sheets is unified under codes JavaScript and PHP supports many more languages and well-controlled and simple enough. Easy and simple to make copies of the pages of the site. Change the names and content on this page of the website, the entire application is copied: nice and fast.

Here, briefly review what possibilities in the design of the website is the editor:

Release details | Dreamweaver 12.1 | Creative Cloud 
Insert HTML5 video | Creative Cloud 
New features | Creative Cloud 
Import songs Edge Animate | Creative Cloud 
Preview and test web pages 
multiple devices | Creative Cloud
Search files by name and contents of | Mac OS |
Creative Cloud 
Adding fonts Edge and web fonts in the fonts list |
Creative Cloud 
Extended support for HTML5 elements of the form |
Creative Cloud 
Changes to insert options | Creative Cloud 
New features | Issue, Adobe Dreamweaver CS6
- February 2013 
Insert HTML5 audio | Creative Cloud 

New features New features CS6 
Guide to Dreamweaver CS5-CS6 (PDF, 8MB) 
New opportunities LATER 
The text in Arabic and Hebrew 
Tutorials for beginners Dreamweaver Acquaintance
with Dreamweaver - tutorials 

Improvements CSS3 support in the CSS styles panel (5.5) 
Customizing your workspace Dreamweaver CS5 
Optimization of the working environment for visual development 
The manage web sites Connecting to a remote server 
The settings dialog «Managing web sites» 
Set up a testing server 
Versioning and advanced settings 
Editing an existing remote web site 
CSS Advanced fluid layouts 
The page layout with CSS 
Add Spry effects 
The page layout in Dreamweaver CS6 
Change the page orientation for mobile devices 
(5.5 and later versions) 
Work with widget Panel menu Spry» 
Working with Photoshop and Dreamweaver 
Set the properties of the text in the property inspector 
Adding and editing images 
Return and extract files 
Get files from the server and place them on the server 
Hide files and folders on the Dreamweaver 
Managing files and folders 
Compare files for differences 
Roll back files (Contribute users) 
Linking and navigation and creating links and navigation 
Menu navigation 
Setup main menu Spry 
Linking to an external CSS style sheet 
Image maps 
Navigation bar 
Code generation, code Folding 
Code editing in Design view
                           Management of tag libraries 
Format CSS code 
Optimization and debugging code 
Mobile and multi-screen devices 
Packaging web applications as applications for 
mobile devices with PhoneGap Build 
Change the page orientation for mobile
devices (5.5 and later versions) 
Creating web applications for mobile devices
(LATER, CS6) 
Creating media requirements (5.5 and later versions) 
Create mobile pages using Dreamweaver LATER 
View check the availability of CSS rendering issues
in different browsers 
Select and view items in the document window 
Preview your pages by using the toolbar
multi-screen viewing 
View the interactive data 
Preview pages 
Creating a nested template 
Apply or remove the template from an existing document 
Create editable regions in the template 
Create a Dreamweaver template 
Create duplicate fields in templates 
The web application and the configuration form test the server 
Creating forms ColdFusion 
Adding custom server behavior 
Creating a page to delete a record 
Adding dynamic content to your pages 
Creating pages login 
Creating and editing a web site Business Catalyst
with Dreamweaver CS6 
Adobe TV
Working with Photoshop and Dreamweaver 
AIR extension for Dreamweaver 
Adding and editing images 
Creating link to a Word or Excel document 
Javascript Using built-in JavaScript 
Using JavaScript (General statement) 
Special features of Dreamweaver and special
opportunities 
Keyboard shortcuts
XML and XSLT 
Perform XSL transformations on the client 
No entity consisting of symbols, for XSLT 
Perform XSL transformations on the server

Now we can estimate the editor's capabilities ( tool for Web development in HTML) when creating Your site. Next go.

to Select items that are accurately and meaningfully describe the content of the document of the website You want to describe.

The Semantic markup website in HTML improves accessibility for a wide range of browser environments. If the material is a list, format it as a list. If you do not want to use the marks of the list, this is not a problem. You can use style sheets to change the view so that the list has acquired the desired look, whether this is the list without labeling or horizontal menu pages.

Every day more and better device handling, so this side, developers of castroites not left one.

Avoid using elements of the site only for your visual effect in your browser. For example, do not use long quote (blockquote) only to get indented in the text and not use a series of elements, br, or & nbsp;as an extra space on the pages of the website. You can use cascading style sheets (CSS) to create the desired effect in the view page of Your site. Of course, when the whole material nedogona studied and is not facing eyes, have difficult, but as nakaplivaetsya knowledge on the subject will be easier to place emphasis on structuring a website pages. Repeat again. If You have a picture of how You will create your site, and how it should be, then You will be easier when you design Your website, You will still find those items and learn symbols denoting Your selected items on the page. To arrange and link into one single structure sample items on the page as they say is a matter of technique.

Avoid using deprecated elements and attributes in HTML when forming your site. This is essentially the same, that is to say «use style sheets instead style HTML»since most of the elements and attributes have been deprecated in favor of the controls available in cascading style sheets CSS. Further on the pages of the website will each time is deprecated elements and attributes to them, so to Orient in this matter is not so difficult during the construction of your site. Will need some time to remember what elements are deprecated.

Create a valid, standards-compliant documents. Even if You use the HTML 4.01, it would be nice to follow the recommendations XHTML to obtain the appropriate standards valid item pages. Usually, when the pages of the website are tested for compliance with a particular browser, i.e. whether adequate reflected in this browser for one and identified compliance with the standards and recommendations of the W3C, i.e. the rules of the developers on the Internet.

Check the HTML code validation when creating Your site. To be absolutely sure, miss HTML through the tool checks for validity. For example, the extra spaces in the cells of tables and between them ( the td elements) can cause cavities in the table. Currently, the create table is no difficulty, and is not associated with any questions, because You will be at the table editor. You will need to first specify only the number of rows and the number of cells in the row( i.e. the number of columns), write the name of the table, specify the line width, the distance between cells and even some data to Refine and all! The table will be ready on the page. Adding newline between successive img elements will lead to the emergence of a space between the pictures on the website. Better to do a file on the website as it is possible more compact. All the gaps and spaces between elements now you can create through other instruments, in particular, styles and methods.

Use comments to highlight sections of markup, so you can quickly find on the pages of the site, as You already know these items are marked so: < ! - - ... - ->, instead of the points is the text of the comment. HTML documents can be long and complex. Adding comments to refer to parts of the document, customers can simplify your search to view and allow a site document compact, not adding extra spaces. And, in General, instead of a comment you can leave your appeared interesting idea, thought, whatever. BUT never leave the codes, passwords, only the information You need.

Use the right for naming files customers. Observe the following guidelines when creating website:

• Use the correct suffix for HTML-document .html or .htm.

• do not use spaces or special characters such as ?, %,#, etc. in the file names. It is better to be limited to letters, digits, the underscore (instead of a space, a dash and dot.

• In the names of site files on Your server can be case sensitive. The constant use of the characters in lowercase letters although not mandatory, will help to avoid confusion and facilitate remembering names during the design of the site. Produced automaticity and in the future will not be any problems with the testing site pages.

• Take the names of the files of the website as brief as possible. Additional symbols increase the file size of the document site. Many developers are using this method Russian names write documents in English letters, this is simply and easy to remember. Suppose a page is called: "Tools for Web development." as this page. Then her name in the HTML code, you can simply write: instrument.html . You see, it clearly and easy to remember and will not be superfluous during site creation. Well, of course, every itself the master and solves tasks proceeding from the current situation, so this page, I have called: saithtml2_1.html and there is no instrument.html . Anyway, I hope that the sense of it clear to You, and apply during site creation.

the Observance of these simple guidelines when creating a site saves a lot of time when debugging programs, or rather already written pages and subsequently facilitates the operation of Your site. Be careful in the beginning of creation and You will then pay off three times.

Before you start marking materials ( writing tags to display the page), you must define the global ( the General design of the web page) the structure of the (X)HTML document site. (X)HTML document site consists of three parts: the ads which version of HTML or XHTML pages, header, which contains information about the document customers, and the body of the pages containing materials. Not all documents of the site contain the body. Documents with frames consist of ads, title, and frameset (frameset), which is determined by the number and structure of frames pages of the website, although there is no picture and video materials without comment or sound happening on the page.

See the sample view of the structure of your future website:

html Root element of the document (X)HTML
Chapter Title
meta Metadata (information document)
title the title of the document
the body, the body of the document


Here is real lyrics dannogo website

The basic structure of the document site. The example shows the basic structure of an XHTML document customers, as defined in the XHTML 1.0 Recommendation. It forms the context for discussions on the future of the global structure of the document, website:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
< html>
< head>
< meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
< meta name="copyright" content="All rights belong Vasiliev
The Oleg Vasilievich. The use of any materials only 
with permission of the author and the source is acknowledged
http://www.azamatkepere.ru/ />
< meta name="author" content="Oleg Vasiliev" />
< meta name="keywords" content="how to quit Smoking easy not to smoke 
your free to create a website page the word meaning boorish 
the language of faith is love human health" /> 
< meta name="description" content=" Site about how the basis of seven lines of PHP 
and HTML code to create easily and quickly your own website from 
simple blocks." /> 
< meta name='Yandex-check' content='7ebe6e2080c9a848' /> 
< script type="text/javascript" src="http://userapi.com/js/api
/openapi.js?49">< /script>
< script type="text/javascript"> VK.init({apiId: 3010037, 
onlyWidgets: true});< /script>
< title>the structure of the document in HTML.< /title>
< link rel="stylesheet" href="../styles/sss1.css" type="text/css">
< /head>
< body> 

This example begins with the XML Declaration of the pages, which specifies the version of XML and the character encoding of the document site. The XML Declaration of the site pages is recommended for XHTML documents. However, it is not necessary, if the document encoding site UTF-8, as shown in the example.

Let's look at four major components (XHTML and HTML) site document.

The document type Declaration site in HTML.

 
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 

The document type Declaration site DOCTYPE tells the browser which DTD to use for parsing the document. In this example, the specified DTD HTML 4.01 Transitional.

The Root element: < html>...< /html>. html is the root element for all documents in HTML and XHTML.

The document Title of the site in HTML:

< head>
< title>The structure of the document in HTML.< /title>
< /head>

The head Element in HTML format, or header that contains information about the document, which is not considered part of the document site. The heading should include a descriptive title tag, otherwise the text of the website will not be recognized as valid. The document body website < body> document Contents of the website...< /body>. The body element in HTML contains the materials of the website of the document, i.e. the part of the web site, which appears in the browser window or reproduced in the speech browser. The body element (X)HTML document can consist of several paragraphs of text, one image, or from a complex combination of text, images, tables and multimedia objects of the site. Put here the material depends on You.

For examples far to go it is not necessary. Take this page of the site in HTML.


The basic structure of this page is such:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
< html>
< head>
< title>Demo.< /title>
< link rel="stylesheet" href="stylesheet/demo000.css" type="text/css">
< /head>
< body>
< div id="nav">< /div>
< table>
< tr>
< td id="tdleft">
< /td>
< td id="tdcenter">
< /td>
< td id="tdright">
< /td>
< /tr>
< /table>
< div id="up">< /div>
< /body>
< /html>

The basic structure of this page is a table of three columns
as you can see, it's written in HTML codes and the version of the DTD HTML 4.01.Transitional//EN".

In principle what You see as the structure of a web site - this is a real anti-example as it is not necessary to create the site structure. Here base or design of the site pages is a tabular representation that is not acceptable nor with what positions the site building, although it is present structure of the pages of my site. Now there are different opportunities devices page of the site is simple and light, which gives unlimited possibilities for creation of pages of the site and its amazing interactive design. About this, be sure to talk specifically and concretely. Now, although approximately like this:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
< html>
< head>
< title>Demo.< /title>
< link rel="stylesheet" href="stylesheet/demo000.css" type="text/css">
< /head>
< body>
< div id="nav">...< /div>
< div id="sidebar1">...< /div>
< div id="content">...< /div>
< div id="sidebar2">...< /div>
< div id="copy">...< /div>
< /body>
< /html>

To (X)HTML document pages of the website was recognized as valid (validity), or, simply speaking, read properly in all browsers on the network, it must begin with a document type Declaration page of your site, which indicates which version of HTML or XHTML is used in the document site. This is done using the DOCTYPE Declaration, which specifies the type definition of a site of the document's document type definition (DTD). DTD is a text document site, which lists all of the elements, attributes and rules for the use of specific markup languages.

Indicating the document type definition customers has always been a requirement for valid HTML documents. If no DOCTYPE Declaration is no set of rules by which you could hold the test brotherly pages. When designing HTML was fast and free, the DOCTYPE Declaration is usually dropped. However, now that the standards compliance has become one of the priority tasks in the community of Web developers, and also because there are many options DTD pages of the site authors, who create their own sites, we strongly recommend to use the DOCTYPE Declaration and inspect the site documents for validity. The DOCTYPE Declaration (or its absence) also translates browsers in different modes of operation.

One of the options DTD:

For HTML 4.01 and XHTML 1.0 is proposed three versions of the DTD:
• Strict);
• Interim (Transitional);
• Frameset (frameset).
 For XHTML 1.1, there is only one DTD. 

DTD Documents reside on the server and W3C 
have the URL unchanged.

Declaration < !DOCTYPE> (document TYPE) contains two methods for specifying information about the DTD pages - generally accepted the document ID of the site and the specific URL of the website, in case the browser does not recognize the ID of the site pages. Now look at the description and specific markup for each version of HTML and XHTML.

HTML 4.01 Strict. The Strict DTD removed all deprecated elements and attributes. If you are developing in accordance with the Strict DTD, use the following document type definition website:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/HTML4.01/strict.dtd>

HTML 4.01 Transitional. The transitional DTD includes all of the Strict DTD, as well as all deprecated elements and attributes page of the site. If Your site document includes some of the older elements of the site pages or their attributes, specify the DTD pages of the Transition period, using the following DOCTYPE Declaration page of your website:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN"
"http://www.w3.org/TR/HTML4.01/loose.dtd>

HTML 4.01 Frameset. If Your site document in the code of frames, i.e. uses for storage of materials of a site the frameset element instead of the body element of the web site, specify the Frameset DTD website pages. This DTD pages repeats version of the Transition period (i.e. it includes deprecated elements of pages and their attributes), and also includes some elements of pages of a site-specific frames. If the inside of the frames are displayed HTML page with the content of the site, then use the Frameset DTD pages do not need:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01Frameset//EN"
"http://www.w3.org/TR/HTML4.01/frameset.dtd>

XHTML 1.0 Strict. To same as HTML 4.01 Strict, but revised in accordance with syntax rules of XML:

< !DOCTYPE html PUBLIC "-//W3C//DTD1.0Strict//EN"
"http://www.w3.org/TR/xhtmll/DTD/xhtmll-strict.dtd>

XHTML 1.0 Transitional. To same as HTML 4.01 Transitional, but revised in accordance with syntax rules of XML:

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>

the XHTML 1.0 Frameset. To same as HTML 4.01 Frameset, but revised in accordance with syntax rules of XML pages:

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd>

XHTML 1.1. There is only one DTD site pages to XHTML 1.1. It omits all deprecated elements and attributes. Differences from XHTML 1.0 pages Strict following:

• The lang attribute is replaced by the xml: lang attribute.
» The name attribute for the elements a and
card replaced by the id attribute.
• Added a collection of items ruby. 

In principle, to understand the intricacies of a document type Declaration at the beginning of training in site creation is not worth it. Simply select from the above type of document that allows to apply and deprecated elements and attributes. Will not be any problems, because previously said that at this stage of development of Internet browsers display all kinds of items ( though there are extreme cases of non-compliance, but it is not fatal to Your website).

Note that the method known as switching on a DOCTYPE or the English-style ( DOCTYPE switching) uses the presence of the DOCTYPE Declaration and the contents of this announcement is to switch the display mode in multiple browsers. If the DOCTYPE Declaration, then it suggests that the author of this site knows that writes and observe some standards and rules, and acts according to the recommendations set out by the W3C. The browser will then follow solely on the basis of those laid down rules and standards. If you do not declare a DOCTYPE , it means that the browser is switched to the old well-worn standard, rather than the default display mode of the web site, so-called " compatibility mode", it will search for alternative routes, something, something, a link to fit - in short, it is necessary to You. About the third method, the announcement will not even mention, because study and do as does the entire world. Will be less problems and errors.

In XHTML and HTML root element of the site page is the html element, precisely, is called the root element In HTML is the < html > element, inside of which are the elements of the < body> and < head>. The very presence of the opening < html> tag and closing < /html> is optional and can be omitted, inside of which are the elements of the < body> and < head>. But it throw You out of my head and never, never do. Write and opening < html> and closing < /html> tags when creating a website, and will not have You never problems.

The Root element in the HTML html format. < html>...< /html>. The attributes of internationalization:

lang, xmlrlang, dir id="text" (XHTML)
xmlns="http: //www. w3. org/1999/xhtml"
version="-//W3C//DTD HTML 4 . 01 //EN" 
(Deprecated in HTML 4.01)

Not much to worry version of HTML 4.01 working fine and there are no reason to worry. I have this version and feel no problem, probably more advantages than disadvantages in the use of this version of the document type.

All the elements in the HTML contained in the root element (...< /html> pages (they say that they are descendants of the root element). Root < html>...< /html> as if wraps for all other elements, or simply a container. Being the root element of the site, the html element cannot have ancestors ( in other words, could not be contained inside another element).

In this example, the root element with XHTML document, website:

< html xmlns="http://www.w3.org/1999/xhtml" 
xml:lang="EN" lang="EN" >

Since this is an XHTML document, the html element is also used to specify an XML namespace, and language of the site. In HTML, the namespace is not used and the root element is written to the ugliness just < html>...< /html> and instead points is all content pages.

the HTML when creating the site. Since our Web world is, in HTML specifications take into account that the documents are published in different languages. It is therefore important to specify the language in which the document is written in the website (e.g., lang="EN"). In the XML language version is specified like this:

xml: lang="EN"

These attributes are placed in the root html element with ID namespace.

These tags < html>...< /html>, as already said, wraps page and give the browser a lot of information to read on the pages of the site.

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 
Transitional//EN" > 

The Header of every page of the site is a place where you can specify information about the document, important for users, browsers and search engines. Here are frequently placed the script in the language and JavaSript, and the jQuery library and embedded stylesheets. Here you can place all the information that is desirable and necessary to fully display Your page.

Below is a piece of code program real, existing site pages. You will see and appreciate. Of course, here it is written not all header tags page.

Here's a look at the title of this page is in HTML:

< head>
< meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
< meta name="author" content="Oleg Vasiliev" />
< meta name="keywords" content="how to quit Smoking easy not to smoke your 
to create free website page the word meaning boorish language of faith is love 
health man" /> 
< meta name="description" content=" Site about how the basis of seven lines of PHP and HTML
code to create easily and quickly your own website from simple blocks." /> 
< link rel="stylesheet" type="text/css" href="css/cssverticalmenu.css" />
< link rel="shortcut icon" href="http://saitslide/favicon.ico" 
type="image/x-icon" />
< title>document Title pages of the site.< /title>
< link rel="stylesheet" href="../stylesheet/saitcss1.css" type="text/css">
< script type="text/javascript" src="../js/jquery-1.9.0.min.js">< /script>
< script type="text/javascript" src="../js/open_external.js">< /script>
< script type="text/javascript">$(document).ready(function(){openExt();});< /script>
< /head>

Head in HTML: < head>...< /head>. The attributes of internationalization: lang, xml:lang, and dir id="text" (XHTML) profile="URLS". Every head element should include a title element, which contains a description of the document. The head element may also include any of the following elements in any order:

script
style
meta
link
object
isindex
base

The head Element is just a container for these elements of the website and does not have its own content. For a more precise view the contents of a header, some actual strings page has been removed. Look here for real,valid header page.

It is Recommended that HTML documents (and XHTML documents without the XML Declaration) also contained a meta element, which specifies the content type and character encoding of the document, although this element is not required, but without a meta element viability and development of website pages are doomed to failure. As you can see, there are a lot of < meta> and each < meta> tag specific content, and act differently.

The Name of the web site.

The Most important (and the only required header element is the title of the document (title), which contains a description of the material on the page. title:

< title>...< /title>

This element is required. Attributes Internationalization, lang, xml:lang, dir. Since HTML 4.01 item pages of the site title is optional, which means that any HTML document customers to test the validity must have a meaningful name in the header. The title appears in the title bar of the browser, outside normal window. The name must contain only ASCII characters (letters, numbers, and basic punctuation). < title> Title of the document.< /title>. The title is what appears in the list of «favorites» or «Bookmarks»button. Descriptive names are also a way to increase the availability of your site, as this is the first thing heard by the user in the use of the tool for screen readers. Search engines also use the names of many documents of the site. For this reason, it is important to create a meaningful and descriptive titles of web pages for all documents and to avoid indefinite names. Also have to be aware of the length of the name, so they can be displayed in the top line of the browser. Title page of the website should be concise and extremely briefly outlined. At this writing the title page of the website it catches the eye, easier to remember, and you yourself when making a site page, the probability of making an error less.

Other header elements in HTML. Other useful HTML elements that are placed in the head element are:

The base. This element defines the basic document location of the site, which serves as a reference for all the paths and links site. Base element can only be located in the document header on the page and this element must appear before any elements of external links. The base element browsers apply the specified base URL ( but not the current document page) to determine the relative URL. The element base used to specify the target frame for relative references in the document with frames. The basic element base is atributii

id="text"
href="URL" is mandatory
target="name"

Link in the HTML. This element defines the relationship between the current site document and another document. Although it can be used to designate such relations as the index, next, next and previous, previous, the link element in HTML is used to associate a document customers with an external style sheet. As represented by the < link> tag in the header can also be not once written for different purposes. The link element in HTML has a variety of attributes:

charset="naborshikova"
href="URL"
HRreflang="lang"
media="all|screen|print|handheld|projection|tty|tv|braille|aural"
rel="connection"
rev="connection"
target="name"
type="resource"

About the link element will write separately because a very important element of the header.

Script in HTML. Using this script element in the HTML in the header of the site, you can add JavaScript or VBScript and functions of the jQuery library, which gives a unique richness of Your page. This element always has to be written in a pair of < script>...< /script>is the container for the features and elements of the JavaScript language or library jQuery. It should always be placed after all the elements of the header before the closing < /head>.

The style Element in HTML. Another method of linking a style sheet to the HTML document is embedding it in the header using the style element. Though it is necessary to know that the application of a < style>...< /style> in the header or the body of the page of the website, it is not as basic. Usually stylistic elements submitted outside the pages of the site and placed in a separate file with the extension .css . But often used in the header and within content on a site's pages, so don't be surprised and use as bold as You feel the need for this item. As they say, porridge with butter will not spoil.

The meta Element in HTML. The meta element is used to specify information about the document of the site, such as keywords or descriptions that help search engines. Look up where the detail is shown and told about a meta element in HTML, because without this traditional element of Your site's pages are displayed Siro and dull without proper representation and advertisement. Please always use this meta element in HTML, if you like, chtoby site pages were read in the Internet.

so let's talk about the < meta />. Item pages in HTML meta has many applications, but it is mainly used to include information about a document customers, such as character encoding, date of creation of site pages, site author and copyright. And included tags, as You already know, in the page title of the website.

The meta Element in HTML is: < meta />. The attributes. Internationalization:

lang
xml: lang
dir id="text" (XHTML) 
content="text (Mandatory) 
http-equiv="text" 
name="text" 
scheme="text"

The Data included in the item pages on meta, can use the servers, Web browsers and search engines, but for the reader, they are invisible and are not displayed on the screens of visitors, although the source code in HTML, you can just read. This element should always be placed in the header element document head customers. In the document customers can use several elements of website pages with the < meta>. There are two types of elements pages in HTML meta that use either the element of pages of a site name, or an item pages of http-equiv. In any case, the required content attribute, which specifies the value (or values) named information or functionality of the site pages. The following example shows the syntax of both types of elements pages meta:

< meta http-equiv="name" content="required text" />
< meta name="name" content="required text" />

An http-equiv Attribute. The information contained in an http-equiv attribute is processed as if information came in the page headers of the HTTP response. Page headers of the HTTP contain information that the server sends to the browser just before sending the HTML document customers, for example the information about the type of data media type, and the other values in the pages of the site, affecting the performance of the browser. Therefore, an http-equiv attribute provides information that will be, depending on the descriptions, to change the method of document processing site browser. The HTTP header is not the same as the title element in the pages of the website, head of the HTML document. HTTP headers are out of text documents, HTML web, and adds the server. If a document is requested via an HTTP request, the HTTP header is appended to give the browser understand the type of document. Its content is not displayed. There are a large number of ready-made types of http-equiv. And about it we will talk when we start to learn the language of PHP code. Where we learn about requests for get and post. That is, all the time.

The name Attribute in HTML when you create a free website. Attribute Pasha is used for the insertion of hidden information about the document of the site, which is not the HTTP headers. For example:

< meta name="author" content="Vasilyev Oleg." /> 
< meta name="copyright" content="Created in 2012
Vasiliev Oleg." />

You can create your own elements of pages of a site name, or to use one of the given companies-manufacturers of search engines and web browsers for standardization.

Specifies the type of information and the encoding of characters in HTML. It is recommended (though not mandatory, but it is better to write - worse anyway)that the information type and character encoding was specified inside the (X)HTML documents, so that this information be stored in the document site. This is done by means of an element of website pages on meta, as shown in this example:

< meta http-equiv="content-type" content="text/html; 
charset=UTF-8" />

Parts are divided as follows: identification of the type of information; The type of information, media type, very similar to MIME types to use when sending attachments in e-mail, is another type of information that is sent in the HTTP header. For the HTML document type information is always the same as text/html. Quite simply. Character encoding. It is recommended, though not required, that the character encoding is mentioned in all documents of the website. In character encodings describes the actual set of glyphs or character forms used in the document site. Character sets are standardized: you can contact them using the standard rooms. The encoding must be specified at the server in the HTTP header. It can also be specified in the XML Declaration for XHTML documents of the site, in which encoding is used, different from the standard XML encoding is UTF-8 or UTF-16. In those cases when it is necessary to substitute or, on the contrary, confirm the specified server is (and if you are not using the XML Declaration), you can specify the encoding using the item pages metа. Certainly, everything will not be remembered, but something already know. In quietly and experience will be.

The use of an http-equiv attribute in HTML when creating the site. Here are a few of the fields of application of an http-equiv attribute: expires. Specifies the date and time after which the document customers will be deprecated. Web robots can use this information to delete expired documents site of the indexes of search engines. The format of time and date, a standard for HTTP headers, because it is assumed that the attribute http-equiv repeats the HTTP header field. < meta http-equiv="expires" content="Chet. 12 May 2001 10:52:00" />. As you can see, complexities no - clearly and specifically. Indicate the date and the rest without You everything is done.

Attribute of the content-language HTML. This value can be used to specify the language pages of the site on which the document is written customers. The browser can send the appropriate Accept-Language header, which will cause the server to choose a site document, written in an appropriate language. In the example for the browser indicates that the natural language of the document of the site is in French: < meta http-equiv="content-language" content="fr" />. This string as a matter of General education, You can never be needed, because once pointed at the prompt, type of documents and fairly.

Names in the meta search engines when you make your customers. Search engines offer to use the meta elements are few names in helping these search engines in the search pages. Please note that not all search engines use the metadata, but adding them to the document will not be hurt.

The description Attribute in HTML. Indicates a short, written in plain text description of the content of Web-pages, which is particularly useful if your document contains very little text, is a set of frames, or if at the top are large scripts. Search engines that recognize such descriptions can put them on the search results page. Some search engines use only the first 20 words of the description, so skip to main. < meta name="description" content="Site about as easy to create a website." />. And here it should be noted that it is necessary in a concentrated form to submit your content, more precisely the theme of Your site, otherwise search engines to Your site will be cool, but this is still the talk will take place later.

The keywords Attribute in HTML. You can specify the name and description of site document with a list of keywords, separated by commas. This will be useful for indexing site document, not just useful, but very important to single out the words that are supporting, through which passed the essence and the meaning of the content of the site theme. Note: the search system in the main cast keywords in meta due to the large amount of spam and deteriorating quality of this information. There is a greater tendency to move away from invisible metadata to the visible information in the materials of the Web site pages, but still the time of keywords is not over, so remember that it is always necessary when creating your website, for example: < meta name="keywords" content="website, easy, simple, page seo." />.

The author Attribute in HTML. Specifies the Web page author. < meta name="author" content="Oleg Vasiliev." />. Well, there's great tension does not occur, your last name rather You no other will not mix up.

Attribute copyright. Contains information on the protection of the copyright on the document, for example: < meta name="copyright" content="Created in 2012 Oleg Vasiliev." />. This attribute performs the function of protection of copyrights of saitostroitel. And in the understanding of the simple and clear.

The content Attribute in the HTML can take the following values: index (the default), noindex (prevents indexing), nofollow ('t give search engines follow links on the page), and none (same as «noindex, nofollow»). The advantage of using this attribute instead of the file robots.txt is that it can be applied to every page, at that time, as the file robot.txt if it is in the root directory of a website, is applied to the entire site. < meta name="robots" content="noindex, nofollow" />. That is, this record You prevent indexing pages. Then, later on this side of the question just a little touch on the problem and we'll reveal what.

The Attribute document-state of the document). The attribute document-state tag controls the frequency index and can take two values: static (static document and index it should only once) and dynamic (often izmeniaisya documents that you want to reindexmodule):

< meta name="document-state" content="static">

Attribute robots(process control indexing), this can be the following valentinakissi pages of Your website:

index - indexing this 
document (otherwise noindex)

follow - indexing of all documents 
if there are references in this HTML file 
(otherwise nofollow)

all- concurrent conditions index and follow

none - the simultaneous fulfillment of the conditions noindex and nofollow


< meta name="robots" content="index,nofollow">

the resource Attribute-type (resource type). For ordinary HTML documents is the meta tag resource-type is set equal to "document":

< meta name="resource-type" content="document">

The URL (the location of the main site). The base URL (not to be confused with base) shows the document in the queue indexing (not to include the "mirror"):

< meta name="url" which contained="http://saitslide.ru/">

Again, again, that the metadata has content that defines the view and behavior of the content on the page of Your site, or link, the document on the page to other documents, or transmits any information:

base 
command 
link 
meta 
noscript 
script
style 
title

All the elements on the page of Your site that loads a web page, javascript, css styles, Il any additional information that is not directly visible on the page it has some utility value, refer to the metadata.

The body of the document pages created by the body element comes after the document header of the website. Although the body of the document body in previous versions of HTML was optional in XHTML it is necessary and required writing tags as opening and closing. The contents of the document body body is what is displayed in the browser window or reproduced speech browser is between the body tags. In the body of the document body contains all that staring observe on the page of Your site. And on the page always see:

Text paragraphs p, blocks of text, different short
and long citations. 

Hyperlink-a, all the families of the links to the pictures, images;
access your music and video libraries.

Various lists ul, ol and nicely decorated
drop-down menu and content of different pages.

A table with appropriate contents napisannymi
schedules, technological processes, credit history,
and every other stories and events. 

All objects that whole blocks of news and information
repetitions. Here are a variety of libraries
and filing of the necessary data.

Fillable forms form, input and rich interactive
steps for online meetings and communication.

The body of the document body in HTML. < body>...< /body>. The attributes. Basic attributes, id, class, style, title. Internationalization: lang, xml:lang, dir. Internal events:

onload--------------- is used as a pointer that the web page ( the body of the document) fully loaded 
including text, images, stylesheets and external scripts.

onunload------------- is triggered when the page ( the body of the document) are not loaded on any 
the reason of closing the window (tab) browser.

onclick-------------- occurs when you click the left mouse button on the item page 
( in the body of the document).

ondblclick----------- occurs when you double-click the left mouse button on the item
( in the body of the document) .

onmousedown---------- event fires at the moment of pressing the button mouse
( in the body of the document).

onmouseup------------ event occurs when the mouse button is released while the pointer is 
within the element, to which are added the attribute onmouseup
( in the body of the document).

onmouseover---------- event starts when the cursor hovers over an element
which added to the onmouseover attribute. One of the most popular 
the attributes used to achieve different effects with images 
and other objects of a web page ( the body of the document).

onmousemove---------- event is used to determine the movement of the mouse cursor in any
towards the screen. This event is used to obtain various 
effects associated with the mouse: tooltip, 
dragging objects, etc ( in the body of the document).

onmouseout----------- event starts when the mouse pointer is outside the element, 
to add a parameter onmouseout ( in the body of the document).

onkeypress----------- event starts when the keyboard key is pressed and released
( in the body of the document).

onkey down----------- event starts when the user presses the keyboard
( any actions in the body of the document).

onkeyup-------------- an event occurs at the moment of release of a pressed key
( any actions in the body of the document).

About these features in HTML will not once and in detail, and in detail, with examples narrated when learning a language PHP codes and biblioteki jQuery when creating the site. Those who knows a little English, to understand the meaning of this or that event in the page body customers pressing this or that button or key in finding or not finding the item, simply and easily. At present it is hard to find someone as something not colliding with the English language.

The body element of the document body may include any combination of the block-level elements, inline elements and forms, except for certain tags standing in the page title of the website, type meta, link, title . It contains all the usual document elements ( p, h, div, br... enumerate here it is long). For visual browsers the body element of the site plays a role mailbox or, as is usually said, the container in which the posted materials( document elements) pages.

Acoustic user agents can play the contents of the body element of the document body site. One opening tag of the element body of the document body can contain many specific attributes, for example:

< body text="color" link="color" 
vlink="color" alink="color"> 

Of Course, at the present time, in the right way processing the submissions are style sheets, so all stylistic attributes of the body element of the document body officially deprecated and use is not encouraged, not only discouraged, but strongly advise you to use all sorts of attributes and properties of the body of the document in the tag body of the document. But if You as much torment itching with the desire to apply to the < body> the body of the document by any attribute or stylistic method, in this case, the crime will not be. But, still think before to write.

because on page a pair of < body>... < /body> in only one instance, and the application of the id just no use.

Header pages in HTML, indicated by the tags < h1>, < h2>, < h3> < h4> < h5> < h6> . Elements of the site pages < h1>...< /h1> ... < h6>...< /h6>; attributes ( id, class, style, title).

In the HTML syntax, there is a requirement that the headers in the correct structure page of the site was located in order( for example, h3 should not go before h2). Execution of this rule not only improves the availability of the website and its pages, but also helps to optimize the search engines( the information in the headers of the upper level gets higher weight), if this is running properly nested tags. It is recommended that consistently use the headings of pages of a site-wide site on all pages. Not to forget when creating your website. For example, to apply the header h2 all the article titles; h3 in the names of sections, etc. This page of the site here and read these pages nice and easy.

The Browsers typically display the headlines on the site in HTML bold smaller and smaller. The view header pages easily can be modified by using cascading style and get the results that You need. Earlier we identify in every HTML page title of the website, so you can easily order a sample of the stylistic elements of the site. Then you can at any time change the style discretion, simple and pleasant.

anyway, applying cascading style sheets (CSS) is a powerful tool for creating site.

Here you can see that the headers are usually act as fiducials programming Java Script or create plugins for jQuery in the course of creating the website. To define a sample of elements of pages of a site convenient and easy clinging consistently for the next title in the HTML codes.

Now, the title of this page: < h2 align="center">< a href="../strojsait/novichok.html" title="Go to main page">title of the page of the site.< /a>< /h2>. This title< h2>...< /h2> apply cascading style sheet. And to fully decorate according to Your taste. For example, use local style and receive the following:

page Headers site.

Enumerate the title on the sizes of the fonts. So the figure of 1 means that the title is written in big letters from the registry of titles, and figure 6 suggests the smaller font for letters of titles. And everything else between these figures accordingly.

Look here:

Header pages."

title of the page of the site."

title of the page of the site."

" the page Headings of the site."

the Headers of the web site."
the Headers of the web site."

So, the title gives the opportunity to quickly navigate to the page, on which there is a lot of information and the necessary material. Quickly he ran his eyes over the titles on the page, immediately determine what it is worth to stay. Proper use of heading tags will enable not only to the picture on the page ( you can achieve using any tags in conjunction with style sheets), but the confidence to find people with the limited opportunities they need materials that use voice browsers and devices read Braille. There are devices and plug-ins that allow you to quickly navigate the document. Search engines will be easier to work with the page of the site easier to highlight the main and secondary, which means more chances to get to the top. A clear logical and semantic structure of the document page of the site will step in to quality, clarity, clarity and accessibility of information, and any material.

Paragraph p of the form tag < p>...< /p>attributes ( id, class, style, title), paragraphs a - block elements, they always start on a new line and therefore consistent writing a few paragraphs p in one line gives You nothing. Each subsequent paragraph will still begin with a new wastewater. For block elements we have something to tell and to show, as in principle all of the tags on the pages of the site are essentially rectangular blocks. From this side, paragraph p as a block element has all the properties of the block.

Paragraphs p in HTML can contain text and inline elements, but they cannot contain other block elements of the site or almost unable, including other paragraphs, but contain links to easily and simply, sorted and unsorted lists etc. please Here it should be noted that as block a paragraph can contain other blocks, but scary is not recommended to put in a paragraph other blocks, in addition to the specified row, links, and lists. When not observing these rules, the representation of the elements of the document on the pages of Your website can get not as You thought. BUT, to experiment, You are always free and easy to verify. A little talk about that in Chapter web graphics and present it to the pages of the site.

So how paragraphs are block elements, they always start with a new line on the site. The text in the HTML is generated with alignment on the left side of the page ( left edge of the document) and not aligned to the right edge for languages reading is from left to right and Vice versa when changing the direction of reading text).

To change any of the default browser display in HTML, you can use the powerful CSS stylesheets. So as paragraphs block elements, using cascading style sheets CSS you can get different effects the display string. The appearance and hide, flashing, and paint in different colors, etc.. That is, do not create.

We Strongly recommend always in HTML at the end to write the closing tag < /p>in order to avoid errors when displaying pages. And there will not be any problems when displaying pages in different browsers. The desire to write a closing element tags for You will be habit and machine without errors later start PSAT codes of programs.

A Small example of paragraphs to this site:

< p>Paragraphs pages can contain text and inline elements
site pages, but they cannot contain other block elements of the site
or almost unable, including other paragraphs of the pages, but the links 
contain easily sorted and unsorted lists please
etc. A little talk about that in Chapter web graphics and present it to the 
the pages of the site.< /p>
< p>as a paragraph pages are block elements of the site, they 
always start with a new line on the site. Text pages
is formed with alignment on the left side of the page( left edge of the document) 
and without the right alignment for languages reading is from left 
right ( and Vice versa when changing the direction of reading text).< /p>
< p>To change any of the default browser to display pages 
customers can use powerful system stylesheets. So as paragraphs block e
a separate estimate, using cascading style sheets CSS you can get different 
effects the display string in web pages. The appearance and hide, flashing 
and paint in different colors etc. do not work.< /p>

Can say that without the paragraph tags page of the site would be fresh and beautiful. Yes and harmony of lines and sharp vertical lines and pleasant, and beautiful, when a paragraph is indented lines. The indentation is indented. Indent allocates and beautifully paragraph. And as you can see, the new line starts with a space from the beginning of the string. Now, this indentation easily set idiosyncratic way:

< p style="text-indent: 100">

Or style in any page of the site. As you can see, this paragraph has begun indented by 100 pixels to the right. And no need to use the insert infinite space characters to make the indent lines. You simply and easily set the indentation using cascading style sheets CSS . Within the context of a web page, it is possible through the dedicated external files with the extension .css.

Quote blockquote in HTML is used to obtain a long quotations ( want rows of indeterminate length of text within a document. Text marked with this tag, traditionally appears as aligned block indented left and right, about 40 pixels. Are complied with and the top and bottom spacing between rows.

Quotes blockquote in HTML. < blockquote>...< /blockquote> attribute ( id, class, style, title).

So, take a look universal attributes that are applied:

accesskey----------- Allows to make the access to the item
using the given key combination.

contenteditable----- indicates that the item is available for change 
by the user.
contextmenu--------- Sets the context menu for an item 
page.

class--------------- Specifies the name of the class, which allows you to link
on the page tag with styling.

dir----------------- Sets the direction and display text on the left 
to right or right to left when choosing letters.

id------------------ Specifies the name of the stylesheet ID for items
website pages.

hidden-------------- Hides the content of the element from viewing by visitors.

lang---------------- browser uses a parameter value for a correct 
displaying national symbols 
actual the value.

spellcheck---------- tells the browser to check or not the spelling and
grammar in the text of the page.

style--------------- Used to determine the style of an element using
cascading style CSS rules.

tabindex------------ Establishes the procedure receive focus when switching
between the elements Tab pages
site.

title Describes the contents--------------- item in popup 
the tooltip when the mouse on the item page.

in each case, for the different functions scripts his attributes. 

It is Desirable that the text in the HTML, included in the long quote, contained in the other block elements, such as paragraphs, headings, lists, etc.

So, the element fetch the < blockquote> is intended for separation of long quotes in HTML. Again, the text is usually displayed as aligned block indented left and right (approximately 40 pixels) - with space above and below. This page of the website get a much nicer and nicer, as you can see, without indents in the beginning of the line.

The cite Attribute is used to specify information about the source where you got the quote for website pages. In the HTML specification recommends that the blockquote elements is displayed in the form of text is indented on the pages of the site.

Quotes blockquote and in the HTML. < blockquote>...< /blockquote> attribute ( id, class, style, title). It is desirable that the text of the pages included in the long quote, contained in the other block elements of the web site, such as paragraphs, headings, lists, etc.
< blockquote> in HTML is intended for separation of long quotes. The text is usually displayed as aligned block indented left and right (approximately 40 pixels), and also with space above and below. This page of the website get a much nicer and nicer, as you can see, without indents in the beginning of the line.
The cite Attribute is used to specify information about the source where you got the quote for website pages. In the HTML specification is recommended that elements of the site pages blockquote displayed in the form of text is indented on the pages of the site.

Now, feel the difference between Absalom and tag a long quote < blockquote>...< /blockquote>well, just to compare.

Below is some special characters. Special characters can be applied everywhere where you will enjoy using,even if You think it is expedient special characters are used.

'	'	"	"	❝	❞	‹	›	〈	〉	«	»
́	…	—	¿	⁈	§	¶	°	℃	≈	≠	≅
±	×	÷	≤	≥	∞	ƒ	∫	∑	√	∛	∜
²	³	∠	∟	⊥	‰	α	β	γ	π	½	⅓
⅔	¼	¾	⅕	⅖	⅗	⅙	⅚	⅛	⅜	⅝	⅞
Ⅰ	Ⅱ	Ⅲ	Ⅳ	Ⅴ	Ⅵ	Ⅶ	Ⅷ	Ⅸ	Ⅹ	Ⅺ	Ⅻ
⒈	⒉	⒊	①	②	③	⓵	⓶	⓷	➊	➋	➌
✓	✔	✕	✖	☓	✗	✘	॥	▲	►	▼	◄
←	↑	→	↓	↖	↗	↘	↙	↔	↕	⟲	⟳
↰	↱	↲	↳	↴	↵	⇅	⇄	⤒	⇤	⇥	↹
⇦	⇧	⇨	⇩	⇔	⇳	☚	☛	☜	☝	☞	☟
♺	♲	♼	☐	☑	☒	▣	▩	○	●	◎	◉
♤	♧	♡	♢	♠	♣	♥	♦	♩	♪	♫	♬
♈	♉	♊	♋	♌	♍	♎	♏	♐	♑	♒	♓
♔	♕	♖	♗	♘	♙	♚	♛	♜	♝	♞	♟
✿	❀	❁	✳	❄	❅	❆	❉	✴	✶	✹	✺
☀	☾	☁	☂	☔	☃	☄	✈	⚓	⚕	⚖	⚒
⚔	♿	☕	♨	☘	✆	☎	☏	✉	〠	⌛	⌚
࿄	⎈	༽	➶	⌖	¢	€	£	¥	©	®	™
⌨	⎙	⎆	⎌	⏎	⎗	⎘	⌕	✁	✂	✃	✄
☆	★	✪	⚐	⚑	✑	✒	✐	✏	✎	✍	✌
⌂	♂	♀	⚤	❤	☹	☺	☻	ツ	㋛		
⚠	⚡	☢	☣	☠	☦	☩	☭	☪	☯	☮	☥

 	&&	< <>	>	""'

Sometimes when you enter text on site pages you want to store the location of letters and strings of characters on the page the same unchanged, i.e. the format of the text should be altered. In the HTML-code is such an operator, tag contributing to retain structure and content of the document on the page.

Preformatted text of the pre element in HTML. The item is indicated by the < pre>...< /pre> attribute ( id, class, style, title).

Preformatted text is used to save the empty seats on the page( spaces and line breaks) when the page is displayed by browsers. This is a very useful thing for the transfer of the scanned documents on the page while keeping everything as is, to display poems where spaces and alignment matter for the transmission of meaning of the work. Yes, in General, regardless of the content of the tag pre enables more efficient to create website pages.

A Pre-formatted text to HTML is unique in that it appears exactly as it appears in the HTMl source code, including all line breaks and spaces. Long lines of text remain unchanged and are not reformatted. The < pre > tag defines preformatted text. Pre-formatted text in a pre element is displayed with a font with a fixed width, and he saves spaces and line breaks.

Preformatted text 
it is used to save the empty seats
on the site page( spaces and line breaks) at 
display a preview image of the page browser. This is a very
a useful thing for the transfer of the scanned 
documents of the site pages , preserving
in this case, all as is , 
to display poems where spaces and exp
Avni van Oia have a value placed to convey meaning production 
[00]. Yes, imaging school, regardless of the substance of the text tag 
pre enables more efficient to create pages free site.


Now, so it will look a pre-formatted text, i.e. as 
we wanted to write and have written and the machine does not interfere in our 
ideas.


And so he is like:

< pre> 
Pre-formatted text page 
the website is used to save the empty places
on the site page( spaces and line breaks) at 
display a preview image of the page browser. This is a very
a useful thing for the transfer of the scanned 
documents of the site pages , preserving
in this case, all as is , 
to display poems where spaces and exp
Avni van Oia have value it is possible to transfer cm is La production 
[00]. Yes, imaging school, regardless of the substance of the text tag 
pre enables more efficient to create pages free site.


Now, he will look preformatted text, meaning as 
we wanted to write and have written and the machine does not interfere in our 
ideas.

< /pre>

it is envisaged that it should be displayed in a fixed width font to save the alignment character pages. Pre-formatted text can include any inline elements except the img, object, big, small, sub, sup, font, which could disrupt the alignment monospaced characters website pages. Although you can change the font and settings gaps using style sheets are not recommended, but using style sheets, you can now you can achieve extremely different views formatted text pages.

If earlier browsers display preformatted text in a mono-spaced format and nothing else, you now have a means to display text on the page at any time. You remain in the CSS just have to specify the font style of the text You would like to see in the display.

Elements phrases determine how to structure a text, make the text on the pages of the website to look pretty and beautiful. If the items add phrases in the document information about the structure of the text.

Here is a marvel even with a couple of easy elements ( tags) pages in HTML when creating your site.

the abbr Element in HTML the < abbr>...< /abbr> short form. Used with very frequent repetition of long phrases, or names of companies, organizations, or slogans. Kuzbassugol, Sibneft, Gazprom, etc.

The acronym Element in HTML the< acronym>...< /acronym> abbreviation. Using the first letters of expressions in abbreviated form, write the words. Usually, the first letters of the words in the form of < acronym> are in uppercase. You all know the USSR - Union of Soviet Socialist Republics, VAT - value added tax prices, USA - United States of America, PRC - people's Republic of China, and much more.

The cite Element in the HTML< cite>...< /cite> quote-reference edition ( shown in italics). Well, here explanation is not required, but say a few words about what this form is often used in combination of the < blockquote>this produces a very nice and decent.

< blockquote style="color: #F00; font-size: 18px">Proletarians of All Countries Unite!< br>< cite style="color: #000; font-size: 12px" >mark K. and F. Engels.< /cite>< /blockquote>

Proletarians of All Countries Unite!
K. Mark and F.Engels.

The dfn Element the < dfn>...< /dfn> definition or the occurrence of a prisoner in the definition term tag. In the document, when referred to a new term, it is highlighted in italics and gives its definition. When using a new term then on the page in the future, it is already known. The < dfn> is used to separate such terms when they are first appearance in the text. Browsers show the contents of the < dfn> using italics.

thethe dfn Element in HTML the< dfn>...< /dfn> definition or the occurrence of a prisoner in the definition term tag. In the document, when referred to a new term, it is highlighted in italics and gives its definition. When using a new term then on the page in the future, it is already known. The < dfn> is used to separate such terms when they are first appearance in the text. Browsers show the contents of the < dfn> using italics.

The code Element < code>...< /code> code. The < code> is used to display one or more lines of text that represents a code: variable names, keywords, text options, etc. Browsers usually have a value of < code> as monospaced text is a reduced size. About it it is desirable to know.

Thecode < code>...< /code> code. The < code> is used to display one or more lines of text that represents a code: variable names, keywords, text options, etc. Browsers usually have a value of < code> as monospaced text is a reduced size. About it it is desirable to know.

The kbd Element in the HTML< kbd>...< /kbd> abbreviation for the word "keyboard" (keyboard) and hereafter. the text entered by the user or to display text that the user should type on the keyboard (for example, when filling in the form, the password and the like). Text enclosed between the start and end tags is in bold monospaced font.

Element kbd < kbd>...< /kbd> abbreviation for the word "keyboard" (keyboard) and hereafter. the text entered by the user or to display text that the user should type on the keyboard (for example, when filling in the form, the password and the like). The text in the HTML contained between the start and end tags is in bold monospaced font.

Element samp < samp>...< /samp> sample output from the program, script, etc. These elements make out the text that appears between the start and end tags, as formula or program code. In this case the text is usually displayed monospaced font. Example: < samp> y=sin(x 6)+(x*4-n/1.25))^3 + 5 < /samp>

y=sin(x 6)+(x*4-n/1.25))^3 + 5

Element var < var>...< /var> is the name of a variable or argument programs. The tag is used to select variables. Browsers usually mark the text italic.

TheElement var HTML < var>...< /var> is the name of a variable or argument programs. The tag is used to select variables. Browsers usually mark the text italic.

The Designation of the selection.

The em Element in HTML; < em>...< /em>; meant selection, and now denotes emotional isolation, i.e. a word or phrase, pronounced differently.

In the em Element ; < em>...< /em>; meant selection, and now denotes emotional isolation, i.e. a word or phrase, uttered otherwise.

the < strong>...< /strong> in HTML are used to indicate selection; strong selection of a font.

Typically, browsers negates the deleted text and emphasizes the inserted text. Although older browsers can display remote or paste text in plain text does not distinguishing these text fragments. I emphasize again for more accurate knowledge of the actions of certain properties of functions that the operator can guarantee is only personal testing in different browsers. Because any properties of functions and plug-ins all the time, improved and updated.

Properties del, ins in HTML. < del>...< /del> < ins>...< /ins> attributes ( id, class, style, title) example: < del>reference< /del> reference < ins>CEO< /ins> CEO explanation of these items can be used in a title attribute with a brief description of the changes, for example, the < ins>CEO< /ins> CEO. The cite attribute way of adding links to the pages of the site to more detailed, the datetime attribute specifying the date and time modified( YYYY-year, MM-month, DD-day, hh-hour, mm-minute, ss-second. Anyway at the moment not all browsers want to do with attributes cite and datetime scripts that You write. Therefore, first how to write code for the pages of Your site, check whether feasible on this browser of Your command.

< pre style="color: #009">
< del title="Kasatonov Arkady Petrovich">Director< /del> 
< ins cite="new" datetime="YYYY,MM,DD" 
title="Ivan Petrovich Sidorov">CEO< /ins> 
< /pre>
< del title="Kasatonov Arkady Petrovich">Deputy Director 
< ins cite="new" datetime="YYYY,MM,DD" 
title="Ivan Petrovich Sidorov">Director General 

Look at the work of the operator insertion and removal; write Your favorite color blue red!

Here, sarkoy text and please, underline text, while the browser defeats the deleted text and emphasizes the inserted text.

Elements del, ins are used as markup changes in the pages of the site, and they represent part of the document customers that have been inserted or deleted( respectively). They can be useful for legal documents, and when editing it is necessary to track.

Elements del, ins are unusual HTML elements of the site, as they can be used to refer to as a block-level and inline elements. Elements del, ins may contain one or more words in a paragraph or one or more elements of the web site, such as paragraphs, lists and tables. If the elements pages del, ins are used as inline elements( i.e. inside element p), items del, ins cannot contain block elements, because it is invalid turns out the content of the paragraph. That is almost no restrictions. Just then only to take account of this recommendation when creating your site.

Universal div < div>...< /div>. attributes ( id, class, style, title); because the div is a block element, the content appears on a new line; the div element disclosed truly in conjunction with cascading style sheets CSS. Creating a div element and giving it the same name, You can apply styles to all of its content or to consider it as a field that you can place on the page to generate a new column of text pages. The div element is invoked in any script, applet, or other kind of treatment.

If you mark a section of text by a div element in HTML and assign it a name using the id and class attributes, then in fact we get a new HTML pages. Here, examples:

< div id="sidebar">
< ul>
< li>the First bundle.< /li>
< li>Second stack.< /li>
< li>the Third pack.< /li>
< /ul>
< /div>

This block element in HTML will be connected amazing setting pages of the site. Very versatile block element.

In the future, You will see that the page of the site is created from the so-called free posted items, in this case, div blocks. And for the left column, and for the center speaker and right speakers. And at that and the so-called footer is also created with a block element div. Of course, each block element should identificirebisa differently and different from the other block elements on the page. As have told You that this is achieved by the id attribute. And no difficulty in understanding that it is.

< body>
< div id="nav">....
< /div>
< div id="sidebar1">...
< /div>
< div id="content">...
< /div>
< div id="sidebar2">...
< /div>
< div id="copy">...
< /div>
< /body>

Now, You and a piece of program code during site creation
from a block div element that pokazyvaet as
is the structure of a web site.

Here is to use cascading style and in a way, You will design page.

Here is a simple example of using universal div tag. What is written up to this point we will turn in block the div element using cascading style sheets CSS will assign the size of this block, the background color of the font will be different and place in the center of the page of the website:

< style>#opiit { 
                 background-color: #CC9; 
				 color: #C00;
				 font-size: 9px;
				 margin: 20px auto 20px 50px;
				 padding: 30px 30px;
				 height: 700px;
				 width: 600px;
				 border: 7px #03C double;
				 overflow: scroll;
				 }
< /style>

Generic div element in HTML. Universal element with a div tag refers to a generic block-containers and applied in those cases where the need of block elements without additional properties. Using div tag is easy to align the text within this container using the align attribute.

Universal div < div>...< /div>. attributes ( id, class, style, title); because the div is a block element, the content appears on a new line; the div element disclosed truly in conjunction with cascading style sheets CSS. Creating a div element and giving it the same name, You can apply styles to all of its content or to consider it as a field that you can place on the page to generate a new column of text pages. The div element is invoked in any script, applet, or other kind of treatment.

If you mark a section of text by a div element in HTML and assign it a name using the id and class attributes, then in fact we get a new HTML pages. Here, examples:

< div id="sidebar">
< ul>
< li>the First bundle.< /li>
< li>Second stack.< /li>
< li>the Third pack.< /li>
< /ul>
< /div>

This block element in HTML will be connected amazing setting pages of the site. Very versatile block element.

In the future, You will see that the page of the site is created from the so-called free posted items, in this case, div blocks. And for the left column, and for the center speaker and right speakers. And at that and the so-called footer is also created with a block element div. Of course, each block element should identificirebisa differently and different from the other block elements on the page. As have told You that this is achieved by the id attribute. And no difficulty in understanding that it is.

< body>
< div id="nav">....
< /div>
< div id="sidebar1">...
< /div>
< div id="content">...
< /div>
< div id="sidebar2">...
< /div>
< div id="copy">...
< /div>
< /body>

Now, You and a piece of program code during site creation
from a block div element that pokazyvaet as
is the structure of a web site.

Here is to use cascading style and in a way, You will design page.

Here is a simple example of using universal div tag. What is written up to this point we will turn in block the div element using cascading style sheets CSS will assign the size of this block, the background color of the font will be different and place in the center of the page of the website:

As you can see, this page of the website Packed in the universal block with a div tag with the given parameters, which indicated earlier. Settings You can look in the style table.

Element pages span allows you to create your own elements; the difference is that the span is used for inlines and does not cause a line break. Useful span element in HTML (translated from English. - the area or range) does not belong to the elements of the logical or physical markup on the pages of the website. The span element is a means of organizing the contents of the document and is used to mark blocks of text with CSS styles.

Means it can be used for horizontal elements of the web site.

the < span> Element is considered a neutral element. The < span> element adds nothing to the content of the document on the pages of Your website. But, in conjunction with cascading style sheets (CSS), < span> will show some properties and can be used for the visible effects to individual blocks of text.

span < span>...< /span> attributes ( id, class, style, title)

This markup has many applications. Most often it is used to apply style sheets:

.dog {
display: inline;
} 

Opportunities span element in HTML when using the item ID id and class.

Here, see take any paragraph, let our first paragraph of the page and there is secreted by a span of some piece of text:

< p>This is a span Element in HTML allows < span id="ee">create your own elements; the difference is that the span is used for inlines and does not cause a line of site pages. So it can be used for horizontal items. The < span> element is considered a neutral element. The < span> element adds nothing to the content of the document NAC pages of Your site. But, in combination< /span> with cascading style sheets (CSS), < span> will show some properties and can be used for the visible effects to individual blocks of text on the pages of the site.< /p>

< style>
#ee {
background-color: #F9F;
color: #F00;
font-size: 16px;
}

< /style>

< span id="ee"> identificators id="ee" now, define some properties by using CSS styles, in this case, the crimson color and background with red text with a white linking lines. Here you can see the result. It turns out the span element simply outlines specific, i.e. You selected field text or item and allocates You naznachenie properties.

This is a span Element in HTML allows create your own elements; the difference is that the span is used for inlines and does not cause a line of site pages. So it can be used for horizontal items. The < span> element is considered a neutral element. The < span> element adds nothing to the content of the document NAC pages of Your site. But, in combination with cascading style sheets (CSS), < span> will show some properties and can be used for the visible effects to individual blocks of text on the pages of the site.

When using style properties to the < span id="ee"> and it turns out the selection of this part of the text of the first paragraph.

The most pleasant Thing is that when using the interactive JavaScript language and its application library jQuery plugin you can make this plot to revive and to show all the possibilities of the web creativity. Well, throughout his term.

Well, if one page of the site You highlight a few of these sites through the span element, do not forget for each highlighted area to assign a unique id for each span.

The id in the HTML. The id attribute is used in HTML to assign to the item specific and unique within the document name of the site. Used as a selector for a style sheet; anchor for links; access method element from a script; the name of the declared object element; for normal processing by user agents where the item as the data. And he can not give to another element of website pages with the same name, there can be two IDs with the same name within the same site document.

Thus, id ( unique in its kind word, different from the other words on this page) the ID of the element. That is on the same page id will be used only once. You can apply many times, no You it does not forbid, but there will be problems when using HTML anchors, and the use of the JavaScript language and its libraries jQuery. Try to assign one item two different id, You will see that only works rules from the first identificators id. You need this? And without this when creating pages of Your website will be a lot of problems.

Now, look. Give the name of the second paragraph on this page of the website id="vizov" and draw through the CSS CSS so:

< style>
#vizov {
background-color: #CCC;
color: # 966;
font-size: 16px;
}
< /style>

You see this result in HTML in the second paragraph. The style of the paragraph has only affected the paragraph, which was given the name id="vizov". But, other paragraphs were left without styling cascading style.

The class Attribute is used to group similar items. The same value of the class can have many elements of the web site, and it allows to handle them the same way on the site; can be used as a selector for a style sheet; for normal processing of user agents.

The class Identifier is very convenient when making the same elements on the pages of the website. It's not necessarily just the same elements that are not important elements can be of different types and levels. But, if they have the same class with the same name, the registration data elements will occur any scenario appointed cascading style sheets CSS.

Suppose we have a paragraph p, title h2, and some of the div element with sizes h pixels. And assign them class="equals". First let's write these elements and then using styles to format the text, background, etc.

< h2 class="is">Let it be this title.< /h2>
< p class="is">In this paragraph we will write just a few words. 
Just show how the class attribute.< /p>
< div class="is">block.< /div>

Let it be this title.

In this paragraph we will write just a few words. Just show how the class attribute.

block.
< style>

.ravno { 
background-color: #FC9;
border-color: #F33; 
color: #903;

}

div.ravno {
width: 150px;
height: 100px;
}
< style>

Thus, we can make up their own elements on the pages of the site, using IDs and classes class.

Before You, probably, the question arose of what is better to use when creating Your website or id or class. Here, definitely not say: to apply a class or apply id. To use it, and classes, and IDs, depending on front of the goal. Sometimes it is better to use the class, not to accidentally use the id on the same page several times. Where it is necessary to allocate a unique element is better to use id. In such cases, the allocation of a unique block of pages of writing anchors, as for the JavaScript and etc .

Unordered lists, and also their are block elements, so that each of them is shown starting in a new line on the site. Unordered lists are used to create a practical set of interconnected elements, the order of which is of no significance. In practice every list of examples, ideas and thoughts, all variants of the solutions can be appointed as unsorted Spaso ul. The perfect solution through unordered lists is used as elements of an unsorted list during navigation through the site, use the menu on the pages of the site.

Unordered lists (ul HTML < ul>...< /ul>attributes ( id, class, style, title)

Items unsorted list li < li>...< /li>attributes ( id, class, style, title)

The Syntax unordered list.


< ul>
< li>an Unordered lists (ul < /li>
< li>an Unordered lists (ul < /li>
< li>an Unordered lists (ul < /li>
< li>an Unordered lists (ul < /li>
< li>an Unordered lists (ul < /li>
< /ul>

Unordered lists in HTML used to create collections related to each other page elements site, the order of which is immaterial. In this category the most lists. Content ul element in HTML is limited to one or several points of the list pages - li. Paragraphs li list can contain a block or inline elements of the web site, as well as their combination. A good practice is to close all elements of the web site, regardless of the version of HTML.

The View for an unsorted list. By default, user agents in HTML insert a marker in front of each item li unsorted list. If left unsorted ul listed in HTML without styles (not to apply the stylesheet parameters), we can reliably receive a bulleted list is indented. However, this causes damage to the ease of use unordered lists. Using stylesheet parameters, you can make unordered list to look the way I want. You can change the form of tokens, using the property list-style-type ( this property has replaced the obsolete attribute type, the application of which is not encouraged). The property list-style-image allows you to use as a marker, the image specified by You. You can make lists displayed horizontally stretch in one line when creating a task bar or menu. You can even use unordered list as the basis for a rich graphical toolbar with the effects of simultaneous pressing of several keys, and all of this by using cascading style sheets CSS.

One thing Can be said that without an unordered list < ul> in HTML to imagine the creation of a fully functioning website is simply not possible practically to do it no one can, as without the usual links < a>. So we need them to create our free site.

Here, You practical side applications unsorted list ul when creating a drop-down menu on the page of Your website:

< ul id="verticalmenu" class="glossymenu">
< li>< a href="" class="kavak">Azamat кĕперĕ.< /a>
< ul>
< li>< a href="" class="kavak">Azamat кĕперĕ.< /a>< /li>
< li> < a href="" class="kavak">Adam.< /a>< /li>
< li>< a href="" class="kavak">Ataman Anki.< /a>< /li>
< /ul>
< li>< a href="" class="shupka">New look.< /a>
< ul>
< li>< a href=" class="shupka">Russian math and its consequences.< /a>< /li>
< li>< a href="" class="shupka">does it really work?< /a>< /li>
< li>< a href="" class="shupka">About the name Astarte.< /a>< /li>
< /ul>
< /li>
< li>< a href="" class="simes">the Gist of the illness.< /a>
< ul>
< li>< a href="" class="simes">the Gist of the illness.< /a>< /li>
< li>< a href="" class="simes">Essence disease.< /a>< /li>
< /ul>
< /li>
< li>< a href="" class="sara">Meditation.< /a>
< ul>
< li>< a href="" class="sara">Meditation.< /a>< /li>
< li>< a href="" class="sara">Health. The heart.< /a>< /li>
< li>< a href="" class="sara">Health. Village.< /a>< /li>
< /ul>
< /li>
< /ul>

So we are not just going to refer to unordered lists to study of language and PHP, JavaScript, jQuery.

Sorted lists pages in HTML. Ordered lists are used in case, if the order of the list items, for example, for a step-by-step instructions or list of notes pages. Sorted lists are defined by the ol element, and they should include one or more items li elements. Like all other lists, sorted lists and paragraphs are a block elements of the web site.

Sorted lists ol in HTML. < O1>...< /O1>. The attributes. Basic (id, class, style, title) internationalization. Sorted lists pages have the same basic structure as unordered lists (ul pages:

< ol>
< 1i>First name.< /li>
< li>Second name.< /li>
< li>the Third name.< /li>
< li>the Fourth title.< /li>
< li>the Fifth title.< /li>
< /O1>

By default, user agents automatically number the elements of the sorted list. In the source code to add numbering is not necessary. To change the numbering system using style sheets (list-style-type). The property list-style-type replaces the obsolete type attribute, which specifies the numbering system for the list of pages. While browsers are still accept and display the type attribute in the sorted list.

Outdated Values of the type attribute:

The type value Generated style Example sequence
1---------Arabic numerals------------------1,2, 3,4
But---------Letters in uppercase--------a, b, C, D
but---------Letters in lowercase---------a, b, C, d
I---------in uppercase--------------I, II, III, IV
i---------Roman numerals in case--------i, ii, iii, iv

Use the obsolete attribute start to denote the start of the list items from a particular number. The following example creates an ordered list that uses lower case letters and counting starts from 10:

< O1 type="a" start="10">
< li>First name.< /li>
< li>Second name.< /li>
< li>the Third name.< /li>
< li>the Fourth title.< /li>
< li>the Fifth title.< /li>
< /ol>
The resulting list of pages should look like
way («j» - tenth letter of the English alphabet):

j. The first name.
k. The second name.
1. The third name.
m. The fourth title.
n. Fifth title.

In principle, the use of this type of software is not the end of the specified example. For creativity here is where to turn.

In CSS there is an alternative to the start attribute - use properties counter-reset. Using attributes in sorted lists extend the programming possibilities for creating lists.

Basics markup. HTML or XHTML document is a document in ASCII ( plain text) or, more often referred to as Unicode. Usually, recently used UTF-8 ( although not dropped and the encoding of the Window-1215 or similar systems the message which is marked by tags( the so-called angular brackets and not only), indicating the elements and other necessary ads. Element - is a structural component (for example, a paragraph p) < p>...< /p> or desired function (for example, line wrapping br) < br />also, the element is any image denoted by the < img>tag, that's about these and many other items will be the next to go talk on the pages of this site. More will be posted lot of useful information about other events and phenomena of the nature of the life of man is a part of formation and development.

Page Elements in HTML, you will need to create Your website. Items are indicated in the text by inserting a special enclosed HTML-tags. Most of the items using the following syntax: < controlname>content< /controlname>, such as < html>...< /html> or < div>...< /div>. The name element is specified in the start tag (also called the opening tag), and then in the end (or the closing tag, and in the latter case, before putting a slash (/). End-tag works like «disable» item. Anything enclosed in angle brackets in the browser or user agent does not appear. It is important to note that the item includes both content and its markup (start and end tags). To verify this You can click the right mouse button, then click in the same browser on the "Source code", in other on-line - View HTML-code and You will see all the content pages of the site in HTML codes. For clarity, it should be noted that the code of the site is written in PHP code, You simply will not see in this case, only will display the results of these scenarios. Now, You are a piece of the so-called cap on this page of the website:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
< html>
< head>
< meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
< meta name="copyright" content="All rights belong 
Vasiliev Oleg The Nikandrovich. Use of any material may 
only with permission of the author and when the source is acknowledged 
http://saitslide.ru/" />
< meta name="author" content="Oleg Vasiliev" />
< meta name="keywords" content="how to quit Smoking easy not to smoke 
your free to create a website page the word meaning boorish 
the language of faith is love human health" /> 
< meta name="description" content=" Site about how the basis of seven lines of PHP
and HTML code to create easily and quickly your own website from 
simple blocks." /> 
< script type="text/javascript" src="http://userapi.com/js/api/
openapi.js?49">< /script>

< title>HTML.< /title>
< link rel="stylesheet" href="../stylesheet/saitcss1.css" type="text/css">
< /head> 

In XHTML all the names of elements and attributes must be in lowercase. Language HTML is not case-sensitive, which You will complete code on pages of a site. Most likely You first your website will create in HTML codes, because then the requirements are not so hard to write the elements of the site. Language layouts HTML codes in fact created for us ordinary people to be able to program their thoughts and to write code to get the machine to understand and embrace Your ideas during the development of your site.

In the HTML version 4.01 and high end tag for some elements of the site is optional, and the browser determines the end of the element of pages of context, but take for a rule to all tags which have their counterparts, to finish (or add a closing tag elements that will be present on the pages of Your website. This practice is most common in relation to the element p paragraph page. Most web browsers automatically ends the paragraph, when he meets a new start tag. In XHTML the use of end tag is required on site pages. Some elements have no content, since it is used as a simple Directive, such elements are empty. An example of such a site's element is the element is the image img. It forces the browser to include in the current page is an external image file. Other empty elements include a line-br, the horizontal rule hr and items that contain information about the document of the website and does not affect display materials, and meta-base. Look at the code, which You brought a little earlier in the text, there are all clearly seen how to write a particular tag on the page of the site. In HTML 4.01, and below an empty elements just did not have a closing tag. In XML, the end tag is required for each item pages. Use the Convention that a slash is used inside tag, indicating the end, for example, < img/> < br/> and < hr/>. For backward compatibility, it is recommended to add a space before the slash on the pages of the website. A space is required if you are sending an XHTML document of the website, specifying the Content-Type header to text/html.

Attributes when writing HTML tags on the page. Attribute in HTML clarify or change the behavior of the sample element of the document on the page. Attributes are denoted pairs of attribute name and value added to an element's start tag ( end tags never contain attributes, how could it be otherwise, since all actions and enclosed between the beginning and ending tag on the page). The attribute names and valid values are declared in the DTD site. In other words, you can't create your own attributes to tags, because they are already established and recommended by the W3C vsemirnoi web.

You can add multiple attributes in a single opening tag. Attributes in HTML, if they exist, are specified after the tag name and are separated by one or more spaces on site pages. The order does not matter. The syntax of the element with the following attributes: < element atribut="value" atribut="value">content< /element>. Now, see, for example:

< img class="expando" 
src="http://www.rulez-t.info/uploads/posts/2009-03/1238098799_raduga_15.jpg"
height="530" width="580" vspace="15" hspace="40" alt="Raduga" 
title="Wants to look and admire." />

Most browsers cannot handle attribute values, if the length exceeds 1024 characters. The values may be case sensitive, especially if it is a file name or URL. In HTML 4.01, and below are allowed to use some values without the quotation marks, for example if the value is a single word containing only letters:

(a-z and A-Z), 
numbers (0-9), 
a dash (-), 
a dot (.), 
underscores (_) and
a colon (:)

It is Best to quote all values on the pages of the site, irrespective of the recommendations. Do not miss the closing quote, otherwise everything from the opening quote and until the next opening quotation marks that will be interpreted as part of value and will not be displayed in the browser. This is a simple mistake, a search which may take many hours of work on the site. There is a small secret when finding these errors: after mistakes, that is, the error displayed pages continues different color font changes, or the fat content of the letters change, i.e. when checked ( debug own programs in the current browser refer to such seemingly little things, okislenie color of the text after a certain character on the page). So You have made an error.

In principle, at present text editors have their own internal editor and find the error writing tags in a stage of writing the program. If such a simple syntax errors will tell You and will determine the place where there is a syntax error. Of course, the logical errors or errors associated with Your software solutions they can't find.

Nested elements. HTML elements can contain other elements. This is called nesting, so this option is used correctly, the entire element, including its layout of the pages, should be placed between the start and end tags of another element (parent) page of the website. Proper use of nesting is one of the criteria for well-formed document site. In this example, the items in the list li nested within element - an unordered list ul.

< ul>
< li>Draw l< /li>
< li>Draw 2< /li>
< /ul>

or look at what happens in practice:

< ul style="margin: 25px;">
< li>< a href="../strojsait/novichok.html">How to create a website?< /a>< /li>
< li>< a href="../strojsait/vvedenie1.html">How to write a page?< /a>< /li>
< li>< a href="../strojsait/nachalo.html">where to begin?< /a>< /li>
< li>< a href="../strojsait/saittag.html">Little about layouts, codes, styles< /a>< /li>
< li>< a href="../strojsait/saittag1.html">What is the structure of the page?< /a>< /li>
< li>< a href="../strojsait/saittag2.html">page Structure.< /a>< /li>
< li>< a href="../strojsait/saittag3.html">Block structure.< /a>< /li>
< li>< a href="../strojsait/saittag4.html">Method of the " child's curiosity."< /a>< /li>
< li>< a href="../strojsait/saittag5.html">Block structure in the codes PHP.< /a>< /li>
< li>< a href="../strojsait/saittag6.html">Look what we got.< /a>< /li>
< li>< a href="../strojsait/saittag7.html">Start to decorate a page.< /a>< /li>
< /ul>

As you see, here in unordered lists < ul>...< /ul> nested list items < li>...< /li>, the items in the list in turn invested so-called hypertext link's < a>...< /a>.

Now this is an example of nesting in the form element form the so-called elements of a questionnaire input input with its attributes and call composed of buttons in a separate nested div element with id="obertka0:

< form action="opros.php" method="post"> 

< input type="text" name="text1" value="1"> 
< input type="checkbox" name="box1" value="box1"> 
< input type="submit" name="submit1" value="Send 1 block"> 

< input type="text" name="text2" value="text2"> 
< input type="checkbox" name="box2" value="box2"> 
< input type="submit" name="submit2" value="Send unit 2">

< input type="text" name="text3" value="text3"> 
< input type="checkbox" name="box3" value="box3"> 
< input type="submit" name="submit3" value="Send unit 3"> 

< input type="submit" name="all" value="Send"> 
< /form>

In this form prepared the necessary fields on the page, then in the interactive the regime is prepared another generalized form and sent to the server. Itself markup on the page of Your site will look based on the situation the task, let it be to say:

< div id="obertka0"> 

< div id="obertka1"> 
< input type="text" name="text1">
< input type="checkbox" name="chk1" value="1"> 
< input type="button" value="Save" onclick="ds('obertka1');"> 
< /div> 

< div id="obertka2"> 
< input type="text" name="text2">
< input type="checkbox" name="chk2" value="2"> 
< input type="button" value="Save" onclick="ds('obertka2');"> 
< /div> 

< div id="obertka3"> 
< input type="text" name="text3">
< input type="checkbox" name="chk3" value="3"> 
< input type="button" value="Save" onclick="ds('obertka3');"> 
< /div> 

< /div>

To Consider how it works this script program website makes no sense, especially codes of nedogona and finely decorated. Just look what a complex nested structures on the site can arise during the implementation of Your tasks in specific cases. Here are strictly observed the nesting of the elements one into another, as dolls are small dolls in a slightly larger etc.

A Common error in the HTML closing of the parent element of the site before the closing of the item that was invested into it (the child). This leads to a false ceiling elements and XHTML document site is ill-formed and could lead to errors in the layout of HTML documents on the website. The example incorrectly nested elements, because a strong element must be closed before the a (anchor). INCORRECT:

< a href="#"> Click < strong> here. < /a> < /strong>

There are other improper nesting of the elements - the inverse of the nesting of the elements. For example, when a hyperlink embedded in a paragraph p:

< a href="../strojsait/novichok.html">< p>How to create a website?< /p>< /a>

Although some browsers do not bresque can display correctly the recording of a program code of a site. But, as you cannot write, it is an incorrect entry-line program portal. The link is a must not contain a paragraph p, on the contrary, all references should only be in the paragraph on the page.

Information pages of your site, which the browsers ignore. Some of the information in the HTML document, including a layout of the pages, is ignored and has very little or no impact on performance when the site document appears in the browser or user agent. These include:

Returns < br /> pages in HTML.

Returns in the HTML document customers are treated as whitespace, which, as a rule, together with the other spaces.

The Text and elements in HTML are displayed continuously, until the text does not meet the element p or br. However, the line breaks on the page displayed if text is marked up as preformatted < RG>...< /pre> or, if in the stylesheet used the property of white-space: pre.

< pre>
< ul style="margin: 25px;">
< li>< a href="../strojsait/novichok.html">How to create a website?< /a>< /li>
< li>< a href="../strojsait/vvedenie1.html">How to write a page?< /a>< /li>
< li>< a href="../strojsait/nachalo.html">where to begin?< /a>< /li>
< li>< a href="../strojsait/saittag.html">Little about layouts, codes, styles< /a>< /li>
< li>< a href="../strojsait/saittag1.html">What is the structure of the page?< /a>< /li>
< li>< a href="../strojsait/saittag2.html">page Structure.< /a>< /li>
< li>< a href="../strojsait/saittag3.html">Block structure.< /a>< /li>
< li>< a href="../strojsait/saittag4.html">Method of the " child's curiosity."< /a>< /li>
< li>< a href="../strojsait/saittag5.html">Block structure in the codes PHP.< /a>< /li>
< li>< a href="../strojsait/saittag6.html">Look what we got.< /a>< /li>
< li>< a href="../strojsait/saittag7.html">Starting to decorate the page.< /a>< /li>
< /ul>
< /pre>

that's how you create a pre-formatted website.

The Tabs and multiple spaces in the HTML. If a user agent encounters a few consecutive space characters in the HTML of the site, it displays only one. Additional spaces on site pages you can add text using character entity ( ). But multiple spaces are displayed if the text pages marked as preformatted (pre) or if in the stylesheet used the property of white-space: pre. About it say on a separate page.

Extra spaces are not solve layout
words in context, just a sign of ignorance how does 
a browser. Just change the padding field or indent
the red line that seemed ready text crumbled.
If You are at the start typing will not enter any extra 
spaces, the problem itself is solved. 
What if the text appears in the form of abstracts, diplomas
etc. in the Internet?
Any text editor allows you to easily solve 
this type of problem. For example, Word allows not only to enter the excess, 
but quickly remove it. Extra spaces at the beginning of the string replace 
indents the red line. Instead of spaces in such cases, use 
menu in the Format | Paragraph, tab Indents and spacing» field
Indent | the First line is» select «Indent» and set the 
value - 1.27 see Remove extra spaces and tabs in the beginnings and 
the ends of lines, selecting the entire text and setting the center alignment - 
spaces will be removed. Next, set the desired alignment, for example 
on width.
How to remove the extra spaces in the text? 
The extra space is placed, because do not know about the inseparable space,
and try to add many gaps. Enter a non-breaking space,
using Ctrl+Shift+Spacebar, press and hold Ctrl, Shift, click 
a space and then release all keys. Almost as equal and inseparable 
the hyphen in combinations like «1», «a-1» - Ctrl+Shift+Hyphen.

A Little about tab and tabulation of the displayed text page of the site:

Horizontal tab (HT, TAB) used for leveling 
text horizontaltransform these positions are 
every 8 chars, in columns 1, 9, 17... In the languages of programmer
tion referred to as \t.

write: 
one→two→three→four
1→2→3→4
5→6→7→8
9→10→11→12
13→14→15 > 16

will receive:
one two three four
1 2 3 4
5 6 7 8
9 10 11 12
13 14 15 16

Also includes vertical tab (VT ID 0B16, 
now it is very seldom used.

Text editors tab stops can go every 2 or 4 characters. At will of the user, the Tab key is not вставляtn character-tab, but Imiterere tabulation, substituting a certain number of spaces.

In some recommendations writing code categorically prohibit the characters tabs. In other make use tabs, not spaces.

word processors put the tab positions in any places of the text and align the text on the page on either side of these positions (left, center, right side). When using the tabs sometimes implemented the numbering of formulae, definition lists, tables of contents.

Similar functionality at the tables. The text is aligned tab, cannot be lined in rows and columns. And at the tables of the text cannot go outside the cell.

Horizontal tab is displayed by the browser when it is used within a < pre> and < textarea>:

Two lines with a tab:

Today 2013 	 Indentation inside the string.
	 Today 2013 Tab in the beginning of the line.


The browser will display:

Two lines with a tab:

Today 2013 Tab inside the string.
 Today 2013 Tab in the beginning of the line.

Vertical tabs are not used ( or rarely, rarely).

Over the Tab key entrenched functions:

In text editors, word processors
enter a tab character, working with indentation.

In graphical interfaces - jump. Windows Tab 
switching between items in the current window, 
Alt + Tab switches between programs. Jump
in the opposite direction - Shift+ Tab

In the console interfaces (for example IOS, bash, Zsh), 
completion of the command.

In games show additional materials including
the number of the card level, the table of results job.

Empty elements R( paragraphs). Empty elements of paragraphs (< p>. . . < /p> or < p> ), without of text in them , are interpreted by most browsers as redundant and are displayed as one end of a paragraph. So You have to consider or not to take this into account when creating the site.

< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>
< p>< /p>

These lines to paragraphs simply will not be displayed.

Most browsers will display several items perevoda lines br multiple line breaks on the pages of the website. But big trouble when displaying pages in the website is not called.

An Unrecognized element on the page. The browser simply ignores any element on the website pages that the web browser doesn't understand or that was incorrectly specified on the website's pages. Depending on the item web browser that can lead to different results. Browsers typically display the item's content and layout as plain text, although some older browsers could display and to issue any error code.

the text of the comments pages in HTML. Browsers do not display the text enclosed between the special < ! - - and - -> , which are used to denote a comment. A comment is any text enclosed in these tags:for example:

< ! - - here I can leave any information - ->

Here is the text of the comment specifically highlighted in bold. The HTML layout of the pages, which is contained within a comment, not displayed, hence the comments pages of the site can be used for temporary hiding of the materials without their complete removal from the document of the site. But the comment is a very good way to leave links when creating your website. This saves nerves and most importantly saved time.

However, never and under no circumstances, even for one moment do not write as a comment on the site's pages, no personal data, whether it be numbers or passwords, whether addresses and surnames and the names and their relatives. So how easy it is to accidentally enter the site page in the web of the Internet, back out again You can never take it. So be very, very careful about leaving comments as personal data on the pages of your website ( well, in any scenario may not be doing it!)

Use the definitions for those lists that consist of pairs term definition.

which requires a definition lists in HTML?

Let's Say there is a need to post on the website a list of words (and unfamiliar trudnovospituemyh words that are rarely used terms or requiring a precise explanation), what they mean and how are written and executed. In short, we should chewed and fully clarify the essence and zatronuty topic. Then you can and should use definition lists.

Definition Lists can be created by using a < dl>...< /dl>. Within this list to highlight words (terms) use the < dt>...< /dt>, and their definitions, use the < dd>...< /dd>

In HTML closing tags < /dt> and < /dd> you can omit. Items marked by the tag < dt> how terms are displayed by browsers almost without indents. Items marked by the tag < dd> as definitions are displayed by browsers with a relatively large indentation, these tags are not labeled.

Once again and say that definition lists are indicated by the < dl> and the content of the < dl> is the number of terms (denoted by < dt>) and definitions (denoted by < dd>). The < dt> (term) in HTML can contain only inline materials of the web site, but the < dd> may include a block or inline elements. All three elements are used definition lists of pages that represent a block elements, and they default to begin with a new line.

Definition Lists dl in HTML. < dl>...< /dl>. The attributes. Basic (id, class, style, title), internationalization, compact event

List of definitions for selected dd. < dd>...< /dd>. The attributes. Basic (id, class, style, title), internationalization, events

List of allocations dt in HTML. < dt>...< /dt>. The attributes. Basic (id, class, style, title), internationalization, events

The markup Structure of definition lists are slightly different lists. The entire list is composed of elements dt and dd, contained in the member dl, as shown below:

< dl>
< dt>em< /dt>
< dd>denotes the selected text C.
Elements eat almost always
cursive.< /dd>
< dt>strong< /dt>
< dd>indicates strongly emphasized text.
 The strong elements almost always appear
bold.< /dd>
< dt>abbr< /dt>
< dd>denotes the short form.< /dd>
< dt>acronym< /dt>
< dd>denotes the abbreviation.< /dd>
< /dl>

em
denotes the selected text pages. Elements eat almost always cursive.
strong
indicates strongly emphasized text. The strong elements almost always appear bold.
abbr
denotes the short form.
acronym
denotes the abbreviation.

Now said it all several times. Although the use of this definition when creating your own free website rarely seen, and in extreme cases. But make will not, because so many sites and in different subjects that may page of the site will consist of only one definition lists.

We wrote - You read.

The Terms and definitions in HTML do not have to be for each other. In other words, it is permissible to enter the two term and specify one definition or to specify two or more definitions for the same term of your pages. Presentation of lists of definitions shall be controlled by the properties of style sheets. By default, user agents generally reflect the definitions are indented on the pages of the site.

Nested lists it is widely used to create a drop-down menu how to use cascading style sheets, as applets, JavaScript, and many plugins from Bibliotek JQuery. List items can be invested in other lists. For example, you can add unordered list in the definition list, or enter a numbered list, as paragraph unsorted list of pages. The example shows only one option:

< ol id="verticalmenu" class="glossymenu">
< li>< a href="" class="kavak">Essence of the word.< /a>
< ul>
< li>< a href="" class="kavak">Essence of the word.< /a>< /li>
< li> < a href="" class="kavak">Adam.< /a>< /li>
< li>< a href="" class="kavak">Ataman Anki.< /a>< /li>
< /ul>
< li>< a href="" class="shupka">New look.< /a>
< ul>
< li>< a href=" class="shupka">Russian math and its consequences.< /a>< /li>
< li>< a href="" class="shupka>Does it really work?< /a>< /li>
< li>< a href="" class="shupka">About the name Astarte.< /a>< /li>
< /ul>
< /li>
< li>< a href="" class="simes">the Gist of the illness.< /a>
< ul>
< li>< a href="" class="simes">the Gist of the illness.< /a>< /li>
< li>< a href="" class="simes">Essence disease.< /a>< /li>
< /ul>
< /li>
< li>< a href="" class="sara">Meditation.< /a>
< ul>
< li>< a href="" class="sara">Meditation.< /a>< /li>
< li>< a href="" class="sara">Health. The heart.< /a>< /li>
< li>< a href="" class="sara">Health. Village.< /a>< /li>
< /ul>
< /li>
< /ol>

Nested lists in HTML. Note: that the marking of the list was valid, the elements ul and ol should contain only the li elements. This means that a nested list must be contained within the list item (li) and cannot be a child of a ul element or O1. You need to cover all the elements that they have been invested properly and do not overlap. If you do not have styles unordered lists (ul invested in each other, the browser automatically displays different markers for different levels, usually first ellipse, then the circle, then the square. All nested ordered lists the default should be numbered in Arabic numerals (1, 2, 3, etc). To specify the system of markers for each level of nesting lists use style sheets.

Nested lists well clearly presented, if they are placed in a single line, so felt nesting, what and where to put it simpler versed:

< ol> < li> < ul> < li>< /li> < li>< li> < li>< /li> < /ul> < /li> < li>< /li> < li>< /li> < /ol>

We should not forget how many Windows that tags, You wrote, the same closing tags must write.

Most importantly, that the elements tags do not overlap each other. That is, You have opened an ordered list < ol> wrote for him two items < li>...< /li> < li>...< /li>; opened the third item in the sorted list < li> and began to invest here already ordered list < ul>; and immediately began writing paragraphs unsorted list ul, well, for example, three < li>...< /li> < li>...< /li> < li>...< /li>; and closed unordered list < /ul>; and immediately closed the outdoor item < /li> already sorted paragraph ul; then I can write some more items < li>...< /li> sorted list ol or just close the sorted list < /ol>.

Easy: make, have made, invested, was closed, closed, was closed. How do you want the algorithm, there can be different. But not prechistenite tags. That's the main thing.

There are (X)НТМL-elements, which are clearly designed for the presentation layer, that is, to create a structure of the web site, revealing the skeleton frame page. Sometimes called the physical styles. They form instructions relating to the size, thickness and style of the font used to display the item on the site. The preferred way to write instructions for submission are cascading style sheets, CSS, and as always this way is preferable.

Presentation inlines pages in HTML and their alternatives in style sheets in the following:

Item Description Alternative


b Bold Use 
the strong element, or use
the property font-weight:
font-weight: bold
big Large, Use the corresponding
the key word for the properties 
font-size to display
the text is somewhat larger
than the surrounding text:
font-size: the bigger
i Italics, Use
item eat or use
the font-style property:
font-style: italic
s 
(deprecated) Use Strikethrough text-decoration
to display text with crossing 
his line:
text-decoration: line-through
small Little Use a corresponding key
the word for the property font-size, 
to display text some 
smaller than the surrounding
text, font-size: smaller

strike
(deprecated) Use Strikethrough text-decoration
to display text with crossing
his line:
text-decoration: line-through
tt TTY, Use the property
font-family property to 
to choose a specific or
common monospaced
font:
font-family: Andale Mono, monospace;
u 
(obsolete) Underlined Use the property text-decoration,
to display text highlighting
his line:
text-decoration: underline;

It should be noted that the < b>...< /b> is deprecated, and is used instead of the < strong>...< /strong>although bad habits, I persistently apply obsolete tag b. But browsers yet without errors and execute this code HTML. On some servers, the machine these tags are converted into strong, but the use of these tags does not cause difficulties, especially in the table below all explained and disclosed.

Sub and sup Elements cause the selected text appears smaller size, and is also slightly lower ( sub)or higher ( sup) main text of your pages.

Sub. the < sub>...< /sub> attributes ( id, class, style, name). Unlike Superscript, subscript characters are located directly below the baseline.

Sup. the < sup>...< /sup> attributes ( id, class, style, name)

Podstrony and accented characters are rarely used, but they are usually needed for a colorful design of the website pages related to natural Sciences, or during preparation of the financial statements. Although now in the Arsenal of saitostroitel have monashee editors that allow you to insert whole blocks of mathematical, not only formulas. But knowledge is only power.

Here is an example of these properties in HTML:

< p>Podstrony and superscripts < sub>characters when creating website< /sub> are rarely used, but < sup>they typically required colorful< /sup> registration page of the website associated with the natural Sciences or during preparation of the financial statements. Although now in the Arsenal of saitostroitel have monashee editors that allow you to insert on the page of the website whole blocks of mathematical, not only formulas. But knowledge is only power.< /p>

Podstrony and superscripts characters when creating site are rarely used, but they typically required colorful registration page of the website associated with the natural Sciences or during preparation of the financial statements. Although now in the Arsenal of saitostroitel have monashee editors that allow you to insert on the page of the website whole blocks of mathematical, not only formulas. But knowledge is only power.

Line break.

Br in HTML. < br /> attributes ( id, class, style, name). Without this tag, it's just hard to imagine the creation and design of site pages as before, it was difficult to print without a carriage on writing machines.

Horizontal rule pages. Here, the tag I write because once this tag was introduced into use HTML codes.

Hr in HTML. < hr /> attributes ( id, class, style, name). So this tag is written. But the use of this tag is eroding because now we have a means of cascading style sheets, which forms an underline or overline achieve one of the parties, block of selected items. Similarly you create analogs of the horizontal ruler. So I will consider this tag anachronism in HTML code, look below for an example of such use.

So how to manage the item pages using style sheets, better not remove the style hr element from the document of the site and to specify the horizontal dividing lines pages using borders to the top or bottom edges of a concrete block-level elements of the web site, for example, for vernogo edge of the h2 element:

< h2 id="rubles">This is the title of the second level will show us the work
cascade stylesheets for overline.< /h2>
< style>
h2#rr { 
border-top: 1px solid #06C;
padding-top: 3em;
}
< /style> 

This is the title of the second level will show us the work of cascading style sheets for overline.

Here, You can see that over the title on the distance 3em made blue lines of 1 pixel. Easy and simple.

See some of the necessary characters website pages. They will always be needed when creating the site. In many cases, the design of the pages, but when the head is kept as the multiplication table of values for the main characters always feel more comfortable, and my work is moving much faster and more efficiently processed pages. Viewing a table, which I bring You, You will immediately offer several options for the use of character entities.

Character entities in HTML.

   Description  Entity  Decimal link  Hexadecimal link
   space Character   & nbsp;   & #160;   & #x00A0;
  &  the Ampersand   & amp;   & #038;   & #x26;
  <  Sign less   & lt;   & #060;   & #x3C;
  >  the greater than Sign   & gt;   & #062;   & #x3E;
   Apostrophe   & apos;   & #039;   & #x27;
 “  Left curly quotes   & ldquo;   & amp; #8220;   & #x201C;
 ”  Right curly quotes  & raquo;  & #8221;  & #x201D;
 ©  copyright Symbol  & copy  & #169  & #xA9
 ™  brand  & trade;  & #8482;  & x2122;
 £  Symbol pound  & pound;  & #163;  & xA3
 ¥  Symbol yen  & yen;  & #165;  & #xA5;
 ®  Registered trademark  & reg;  & #174;  & #xAE;

As you can see, entity references allow the inclusion of any string constants in the content element or attribute values. When this entity references and character references start with an ampersand, followed by the name of the entity and ending with a semicolon: & imacoxneri;.

And here is the link to the characters in HTML: & #код_символа_в_Unicode; in regular view in the international classification codes.

Well, and the character code can also be written in hexadecimal. In this case, before putting the symbol "x" & #x shestnadtsatiletnyaya; that table presents.

That is in understanding where to use the character entity on site pages You have no difficulties and therefore, it is especially will not stop. But, notice that here is just a small part of character entities need. To see all the symbols that are used on web pages, You will have to resort to the help resources.

Hypertext links a are a key element in making Your website attractive and very convenient for visitors. Adding hypertext links a, You make the pages of the site and related structured, directing it wherever You feel like and where will they find what they were looking for and hungered to find.

It is the ability to create hyperlinks to the pages of the site, leading from one document to another, made unique HTML markup language and is a cause or a factor of popularity and demand.

Links in HTML have a standard format that allows the browser to interpret hypertext links and perform the necessary functions (call processing methods) depending on the type of link. Links can point to another document, a special place of this document or perform other actions on Your website pages. Can request a file via FTP-Protocol, to display his browser via get and post requests, which can still talk in the study and PHP, and JavaScript programming languages. The URL can point to a special place in the absolute path, or indicate in the current document access path.

Element pages hypertext link, the so-called anchor in the HTML a looks as follows:

< a>...< /a> attributes ( id, class, style, title)

accesskey (quick symbol)
charset="naborshikova linked resource"
coords=coordinates x,y"
HRef=>"URL or an absolute or relative url links"
id, class="text or identity document"
hrefland="lang"
name="the link target name"
rel="link or reference types forward "
rev="link or reference types ago"
tabindex=number or position in order tab
target="text or target frame"
type="datatype or informative content type

In the HRef attribute specifies the path (URL) for the document online or offline location with whom You need to communicate. Text link pages marked up as follows: I < a href="link.html">link to You!

By default, most graphical browsers display the link text pages in blue with an underline, but this can be changed using cascading style sheets. Links-default image have a blue border, unless you change this setting using style properties border, or outdated border attribute of the img element of the web site.

HTML uses a URL (Uniform Resource Locator) to represent hypertext links and references to network services within the HTML document, that is, on the pages of Your website. The first part of the URL (before the colon) describes a method or access a network service. Other part of the URL (after :) interpreted( converted) depending on the method of access to the server. Two straight-through (//) slash after the colon (:) to indicate the name of the server name.

Once again to understand that the absolute URL of the site in HTML consists of the following components: the ID of the Protocol, hostname (machine name server) and a path to a specific file. If you are referring to documents on other servers, You should use the absolute URL of the web site. Below is an example links with the absolute URL of the website pages: < a href="http://saitslide.ru/index.html>...< /a>. Here as a Protocol name specified by http (standard Protocol for Web), domain name, host - saitslide.ru and the file path /index.html

In a relative URL to another document specified relative to the location of the current document site. The syntax is based on the structure of the ways an operating system. Pointing to another document on the site within your site (on the same server), you usually use the relative URL of the web site. For example, if I am currently working with a document novij.html (below shows the full path) http://saitslide.ru/novij.html and I want to put in this document is a document link adam.html that is in the same directory: http://saitslide.ru/adam.html I can use a relative URL of the file and write the following: < a href="adam.html">read this page< /a>.

But if I'm on the page novichok.html the absolute address of which is href="http://saitslide.ru/strojsait/novichok.html and put in a folder strojsait and correspondingly lower level than the page index.html that I want to refer to, then I would have to write the link to the page with the relative url of the page: < a href="../index.html">read this page< /a>.

As we have already mentioned the IDs, class is needed for more effective and quick browsing of the site during the sampling, page elements, and the application to them of any action () method cascading style sheets, CSS, or using a different kind of jQuery plug-ins or applets языкеJavaScript.

Attribute hrefland="lang" is intended to determine the type of language, which will display page of the site.

The coords Attribute="x,y" specifies the coordinate value horizontal x and vertical y as a function of guidance on site pages.

The target Attribute, the < a> tag defines how the new page opens up and accepts the following values:


target_self ----- document will open in the current window
target_parent --- in the frame of the parent of the current frame
target_top ------ in the main window of the whole frame structure
target_blank ---- document opens in a new window

No matter How it was, without a hypertext link in the HTML < a>...< /a> the existence of the World wide web, the Web of the Internet in this form would be impossible, if no such link. How easily we are transported from one corner of the Earth for a few moments through hypertext links. Probably not far off not only virtual page navigation billion websites in the World wide web - the Internet, it will be time physical transformations and migration not only energy, but also the transfer of matter as such. As they say, we'll see.

By default, the relative URL of the site pages is based on the current document. You can change this behavior by putting the base element in the document title head, explicitly specifying the base URL of web pages for all relative paths in the site document.

the base Property. the < base>...< /base>. Attributes: id="text"(only XHTML) href="url" (Required) target="name". Base element can only be in the header of the document head customers, and he must stand before any elements with external links to site pages. The browser uses the specified base URL (not the URL of the current document) to resolve relative URLS.

Internal site document.

By default, when you cite a page, the browser displays the upper part of this page. But You can also refer to a specific point on the page, which is a part. Link to document fragments is most often used for navigation purposes by creating a table of contents of the hyperlinks in the top part of a very long web pages. Users can look at all of the themes and quick access to those that interest them. when will You provide them with references. If present links at the bottom of the page, it would be best placement on the page also links to its beginning or at the table of contents. You can refer to the sections of other documents, if they have names. Communication with the specific paragraphs in the document like this: set the element name, and then create a link pointing to the token.

Name the slice.

In HTML there are two ways to indicate the document fragment: 1) by inserting an element - anchor and with the attribute name ( instead href) or 2) by adding an id attribute to any HTML element. Both methods form the token that later reference. In XHTML documents that they are well structured, to identify any fragments should use the id attribute. To ensure maximum backwards compatibility should be used in the hyperlink and both attributes and id, and the Pasha. In the example, a named anchor is used to allow users to jump directly to the section " pharmacy" for a web document apteka.html. First, the header is marked as a named anchor with the name id="apteka". Named anchors default does not stylistically processed ( i.e. they are not emphasized as an anchor with an href attribute). < a name="apteka.html" id="apteka">pharmacy Network of the city.< /a> The same fragment can be upgraded with the ID right in the h2 element < h2 id="apteka">pharmacy Network of the city.< h2>. The values of the name and id attributes must be unique within a document, that is, you cannot assign the same name to two elements.

The Link to the snippet.

The Second stage is to create the link to the snippet using a standard element-anchor and its href attribute. The fragment identifiers are placed at the end of the road and marked with the symbol #. To refer to the movie section "pharmacy" of " pharmacy Network of the city." from a document apteka.html you can use the following markup: < a href="#apteka">pharmacy Network of the city.< /a>

The Link to the snippet in the document.

You can create a reference to a named fragment of any document on the Web, using the full path, after which you need to specify the fragment identifier. Of course, fragment identifiers should already be available. To refer to section pharmacy from another document in the same directory, use the relative path: < a href="apteka.html#apteka">pharmacy Network of the city.< /a>

To link to a document fragment to another site, use an absolute URL: < a href="http://www.website.ru/document.html#fragment">...< /a> or other examples: < h2 align="center">< a href="../strojsait/novichok.html#rrd" title="Go to main page">Simple hypertext links.< /a>< /h2>

In the link element defines the relationship between the current document customers and other external document. This link is not the equivalent of a hypertext link, because it cannot be clicked with the mouse, or use a similar method aktivatsiyu portal. This link is placed in the header (the head element) document site. The document can have multiple link elements.

Link. < link />. The attributes. Basic (id, class, style, title) Internationalization, events

charset="Nearskyiv"
href="URL"
HReflang="kodanike"
media="all|screen|print|handheld|
projection|tty|tv|proj ection|
braille| aural"
rel="connection"
rev="connection"
target="name"
type="pecypc"

The Most important attributes are the href, which indicates the linked file, and rel, which describes the relationship of the source document to the target document. The rev attribute describes the feedback from the target document to the original. The variety of attributes makes the link element is very flexible. In the example shown in the type attribute as MIME data type of the linked document specifies a Cascading Style Sheet that is required in XHTML:

< head>
< link href="sedred.css" rel="stylesheet" type="text/css" />
< /head>

Note the use of the slash in HTML «/» at the end of the link element, which explicitly refers to XHTML empty element, and also on a space before the slash, left for compatibility with the version 4 browsers. Another area of application according to the HTML 4.01 specification is a link to an alternative version of the document in another language. The following example creates a link to the French version of the document:

< head>
< link rel="alternate" href="translations/french.html" 
type="text/html" hreflang="fr" />
< /head>

Using the values of the next and prev to the rel attribute, You can set the position of the site's document in the sequence of documents, as shown in the following example. This information may be used by browsers and other tools for creating navigation menus, tables of contents and other collection of references:

< head>
< title>Chapter 13: Creating links< /title> 
< link rel="prev" href="Chapter 12.html" />
< link rel="next" href="Chapter 14.html" />
< /head>

the following are valid values for rel and rev, as well as their applications. These attributes and values can be used in items a and link to denote a specific reference:

Is The Link


alternate Alternate version of the current document,
perhaps in another language or optimized 
under another display environment. It is part of
is used to switch stylesheets
stylesheet External cascading style sheet; used 
with the attribute type="text/css"
start the First document in a collection or series
next Next in the series of
prev Previous document in the series
contents 
(or toe) Document with a table of contents
index a Document with a subject index for
the current document
glossary Document containing a Glossary of terms
copyright Document containing information on the protection of
copyright for the current document
chapter Document that serves a Chapter in a collection of documents
section of the Document that serves as a section in the document collection
subsection Document used by subsection in the collection of documents
appendix Document used by the application
help the help Document
bookmark the Document that serves as a bookmark. As 
the bookmark name, you can use
the title attribute

The Challenges in the use attribute of the link element is not in HTML to stay separately that is why you do not see the point. Although it is necessary to notice that the link tag is always placed in the page header of the site before the closing < /head>tag, like so:

........................................................
< link rel="stylesheet" type="text/css" href="css/cssverticalenu.css" />
< link rel="shortcut icon" href="http://saitslide.ru/favicon.ico" type="image/x-icon" />
< title>Tables on pages of the site.< /title>
< link rel="stylesheet" href="../stylesheet/saitcss1.css" type="text/css">
< script type="text/javascript" src="js/cssverticalmenu.js">< /script>
< /head>
< body>

You can Still add that tag to link has a title attribute, which is used to create rss tapes or css < link href="http://domain/news.rss" rel="alternate" title="news" type="application/rss+xml" />

And all the rest is clear and easily accepted.

The Images and objects in HTML.

img Adding images
map Graphics card links
area Geometrical area, used as a map link
object Base media
param Specify the required values
for an object in the period of work
embed Embedding requiring 
the availability of plugins (non-standard)
noembed the Material displayed, if 
an embedded object is not supported
(non-standard)
the applet Add applet (obsolete)
iframe floating frame
containing external HTML document

The img tag in HTML. < img />. Attributes: Base (id, class, style, title), Internationalization, events.

alt="text (Mandatory)
ismap
height="number"
longdesc="URL"
lowsrc="URL"
name="text"
src="URL (Mandatory)
usemap="URL"
width="number"

The image Formats and their use in HTML.

Web image must be in one of three possible in Web formats: GIF, JPEG, or PNG. Moreover, the files must have the appropriate suffix .gif, .jpeg or .jpg and .png respectively, to the Web server can send the correct information in the Content-Type field image.gif, image.jpeg or image.png respectively, on which the browser recognizes the format of the image.

Inline images are used in several ways:

As a simple image pages. The image can be used on a Web page exactly as it is used in printed materials as a static image, providing additional information, such as company logo or illustration on the pages of the site.

As a link. The image can be used as a link to another document in the alternative text links.

As the graphic map. Graphical map(image map). Graphics card links - one image with several «hot spots»that serve as links to other documents. In the image, nothing special. This is a common inline image. Linkages with relevant URL establishes a special HTML markup of an index of links on the map files.

Images that are not part of the content and connected only with the appearance of the page, often placed as background images with CSS on the site. The image can be used as a background for any item (but not the body) with parameter style sheet background-image or label background, and we do not need to pave the» image background. Accommodation decorative images of the site solely using external style sheets, without including them in the structure of the document gives a number of advantages. This not only makes the document customers more accurate and accessible, it also makes it easier to make changes to the appearance of the site compared with the situation when the stylistic elements included in the content. The structure of site pages becomes available and very effective in terms of making changes just what we want to achieve, because we don't pick out the elements of the sample separately from each page of the site, but just put in a common container external file.

The Syntax of the img elements in HTML. Once again about the attributes applicable to the img element for changing it is displayed, but are mandatory only the src attribute specifies the URL of the image file, alt, and specifies alternate text for browsers that can't (or they were not allowed to display the image without this attribute. The basic syntax element-image img looks like this:

< img src="image url" а1t="alternative text" />
Attributes: id, class, style, title, lang, dir, events
src = URI graphic file)
alt = text (alternative lyrics)
longdesc = URI detailed description of image)
this attribute is not all brouzery read and occurs
many problems with the testing site pages.
name = CDATA (name image)
width = width of the image)
height = size (height of the image)
usemap = URI client-side image maps)
ismap = ismap (server-side image map)

Here we should note that the alt attribute is necessary not only because some browsers are capricious and not want to work when there is no alt attribute, but first of all the decoding of topics image in the form of inscriptions alt helps to quickly find large files directory with izobrajeniem. The URL specified in the src attribute can be absolute (to include the Protocol and domain) or a relative path, relative to the current document). If not to take into account the loss rate on the issuance of the page when a huge library database to your site, then, of course, an indication of the absolute location of a file with images helps to avoid some of the problems with exact address.

The default View in HTML. Because img is an inline element, it does not linefeed or the appearance of additional spaces on the page. By default, the bottom of the image is aligned to the baseline of the surrounding text. And it is sometimes useful to know for neat building structure of the web site. The alignment and positioning of the image can be changed using the rules of style sheets. It is a powerful tool for selecting elements of the web site, although used and there are also a number of deprecated attributes that control the appearance of the images of the pages, with which you can manage tags. About it should not be forgotten.

Let's Return and repeat about alternative text, because everything that is not done on the pages of the site is for the visitor and for his convenience when entering the page. There is no guarantee that the image will be displayed on the screen. It can be damaged or not found, or users can use text or speech browser that does not support images. If the image is not displayed, graphical browsers usually put in its place an icon missing image. Non-graphical browsers usually just write [image]. Any of these variants will be dead-end for the user, and part of the materials will be available and will it continue to linger on that site. The alt attribute allows you to specify a string of alternative text that will be displayed instead of the image if the image is unavailable. Non-graphical browsers will display this text instead of the image. In the HTML 4.01 specification declares that the alt attribute is a required attribute of the img elements (although the image and will appear in its absence). If you spend time writing an alternative text for images, make the page available for a large number of users and I repeat: easy to create your site.

The name Attribute in the HTML contains the name of the image, which can be referenced in stylesheets and scripts, and generally creating a sample of items on the pages of site. Recently the name attribute is maintained only for compatibility with older browsers, so much easier and safer to use instead the id attribute to identify the elements of your pages.

The width and height Attributes specify the size of the image horizontally and vertically, respectively, when displayed on site pages. The width and height attributes needed in the exact size of the image in pixels. Set the value of the width and height attributes allows the browser to allocate and to leave space for the image when you upload a document and make it faster otobrazheniyakh we still here, that many observers allocate space for the images on the basis of these attributes, even when they display not the image, and the alternative text alt. This can cause the alternative text will be visible not completely under the image little reserved, but the texts are sometimes huge). The allocation of images vertical height and horizontal width of a percentage from your browser causes unpredictable results and this is better not to remember.

The usemap Attribute sets and determines through the map element to client-side ImageMap. The value of the usemap should be the bookmark name specified by the name attribute of the corresponding element in the map, but talk about that on another page of the site.

The ismap Attribute specifies a server-side ImageMap. If an img element contains the attribute ismap , and the user clicks on the image, value and returns ismap the coordinates of the point clicked.

Here's an ordinary call image to the page via the img element: < img class="expando" src="http://www.rulez-t.info/uploads/posts/2009-03/1238098799_raduga_15.jpg" height="530" width="580" vspace="15" hspace="40" alt="Raduga" title="I Want to watch and enjoy the rainbow in the warm days of summer." />

Although the required attributes of the img element is only the src and alt attributes width and height are also common, because they speed up the display of pages. These attributes just specify the image size in pixels, for example: < img src="okno.gif" width="50" height="50" />. With this information, the browser can create the layout of the page before the images are downloaded. CSS properties width and height are preferable style attributes, and they also ensure that the page will be generated to obtain images. Without width and height of the page can be redrawn several times, the first time without images, and then when you receive each new image. It is worth spending some time and to include accurate information about the width and height in every img element. If the specified width and height values are different from the actual size of the image, the browser executes the image is scaled to fit the specified size. If you specify height and width values in percent, some modern browsers will change accordingly. Although this effect can be quite handy and can prevent unnecessary access to the graphic editor, in some browsers, such scaling can lead to pixelizarea, low-quality image. < img src="okno. .gif" width="50" height="50" /> < img src="okno. .gif" width="200" height="50" />. Decrease the size of the image means markup is bad practice, and apply it is strongly not recommended. In addition to the low quality of the resulting image, it forces the user to upload a file larger than necessary. Resize image means markup does not reduce the size of the file.

Deprecated attributes of the img element.

In Transitional DTD has a number of attributes that are considered obsolete because they control the presentation aspects of the image. Like most other deprecated attributes, they were replaced by more flexible properties of style sheets. If you are using a DTD XHTML Strict or XHTML 1.1, the use of any of these attributes will lead to the inadmissibility of the document site. Use them instead of the methods specified in the style sheet.

The vertical Alignment in HTML.

By default, the bottom edge of the image is aligned to the baseline of the surrounding text, but there are ways to change the vertical alignment. If you only use the HTML layout of the pages, the HTML 4.01 Recommendation for vertical alignment there is deprecated align attribute with the values top, middle, and bottom. Preferred CSS method to specify the vertical alignment is the property vertical-align, which you can use to change the alignment of the image relative to the base line or row height in which it is located. Valid values are top, text-top, bottom, text-bottom, middle, sub, super and baseline (the default), and the exact meaning of a length or a percentage.

The horizontal Alignment in HTML.

The align Attribute is also used to align the image on the left or right edge of the page, which uses the values left or right respectively. Feature align to the left or right edge is that in addition to placing the image field it allows for text wrapping around the image. This is called the flow around the image. The preferred method of «positioning of images (and any other component) relative to the left and right edge of its containing block is wrapped around the use of CSS float property.

If the text wraps around the image, browsers allow the text to come to the edge of the image. Usually it is better, if between the image and the surrounding text will be little space. In HTML this space is specified by using the attribute vspace and hspace img element.

Right-Aligned without text wrap in HTML.

If you use the attribute align=" right" to put the image at the right field, the text will automatically wrap around the image. If you want to move the image to the right without wrapping place the image in the paragraph (p), and then align the paragraph to the right edge. In CSS to align the item without text wrapping, apply the property text-align a block element that contains the image. The vspace attribute (vertical space, space vertically) contains the number of pixels of blank space above and below an aligned image. The empty space to the left and to the right is specified by using the hspace attribute (horizontal space, space horizontally). Note that the space is always added symmetrically (top and bottom or left and right) and there is the possibility of using these attributes to indicate the space with a specific part of the image (but can do it using cascading style sheets). Preferred CSS method to add white space around aligned image (or other inline object) pages of a website is simply an indication of the fields around it. Different margin property allows you to specify a different amount of empty space on each side of the streamlined image pages.

The Termination text wrap in HTML.

The Text automatically flows around the image (or other inline object), filling the space along its edges. To stop the flow and start a new line on the field (not the image), insert a line break br attribute clear < br clear=""/>. The clear attribute tells the browser where to put a new line on the site. There are three possible values: left, right and all. If the image is right-aligned, insert the < br clear="right" />, so the text was begun under the image at the right margin. If the image is left-aligned, use < br clear="left" />. The < br clear="all" /> begins the text below the image aligned to both fields, so this is the only value that you may need. Preferred CSS method to prevent the flow of text on the pages of the website is to use the clear property to the next element indicating the side where the text should begin under streamlined objects (left, right or both).

By default, when the document of the site is the picture link, most browsers will draw a frame thickness of 2 pixels around the image with the same color. Used for text links on the page (default is bright-dark blue). In most cases, this blue border is not too attractive, especially if it surrounds the image with a transparent edges. But this frame is very easy to turn it off using the border attribute. The border attribute specifies the width of the frame in pixels. If you specify a value of zero, the frame will be disabled: < a href="document.html">< img src="picture.gif" border="0" />< /a>. Of course, if the frame You like, You can also easily make their broad, specifying a higher value. Preferred CSS method to set the width of the border around all images of a document is to use one simple style rules from the border property: img {border: 0;}.

How to download images in HTML.

A Couple of simple practical methods, it is not obvious at the first look at the HTML-code of pages that can help you optimize your page loading and to improve response time. Try whenever possible to use images repeatedly. When the browser downloads the image file, it stores it in the disk cache (space for temporary storage of files on the hard disk). So, if he needs to re-display the page, it simply retrieves the local copy of the HTML file and image files without contacting a remote server. If you use the same image on a web page or site several times, the browser will first need to download this image only once. Each subsequent instance of this image will be retrieved from the cache that for a server means less traffic volume, and for the end user - better performance. The browser recognizes the image at full name and path to the file, and not just by name. So if you want to enjoy the benefits of caching, must make sure that each instance of the image refers to a single file on the server (not in different copies of the same file in different directories).

Links to large image.

Remember that when creating the design for the Web should always consider the load time of the files. Image consume especially a lot of traffic, so use them with caution.

Another type of images in the HTML associated with Web sites is that you can often see is the FAV icons (favicon) - small icons that appear next to the name or URL of the site in your favorites list, or on the navigation bar or the bookmarks browser interface using bookmarks. Recently icons elected favicon increasingly began to use to highlight your site from other sites in the registry search engines. These icons are not associated with (X)HTML markup images and they are created with the .ico extension .

Stands for the word favicon in HTML (abbr. from the English. For FAVorites ICON «icon for the selected works», from the name of a bookmark folder). Is displayed by the browser in the address bar before the URL of the page, as well as pictures near the tab, tabs, and other interface elements and this You can see by making a request in any browser.

To Make a favicon in HTML, you can in any editor. The main challenge will be to Express the essence of the site in the image 16x16 pixels or 32x32 pixels. If You have already created for your free website logo is a good, effective and beautiful, parabody already done.

As already wrote the favorites icon (favicon) should be saved in Windows format so and in the root directory of Your ayt( free or paid). This format allows you to save multiple images, as a rule, is used to store multiple versions of different size for each image. The icons displayed in the navigation panels browser or a favourite list, have a size of 16x16 pixels. Some designers also include in the file version, size 32 x 32 pixels, which can be used as a shortcut on the desktop. although now actively use and other larger image formats of an icon. After the creation of the icon is recommended to save it in PNG format (to be able to use transparency), and then convert to the format so . Saving the file, you should definitely give it a name favicon.ico, so it can be recognized by browsers that support these icons.

Setting the icon.

The easiest way to install the icon is simply put the favicon.ico file in the root directory of the website. Icons can be installed in other directories if you want to use different icons for different parts of the site. But is it worth zamorachivatsya and spread, especially essence of advertising is to attract attention to one specific fact. Although some browsers will be able to find these icons and generally without any markup and easily and simply load the icon with the name of the URL of the page of the site to display, for security can be included in the header of the document head site link elements with links to the icons used. You can use a relative URL, for example: /favicon.ico.

< link rel="shortcut icon" href="http://domain.tld/path/favicon.ico"
type="image/x-icon" />
< link rel="icon" href=" http://domain.tld/path/favicon.ico" 
type="image/x-icon" />

Once again emphasize the meaning of a FAV icon - icons as brighter and zapominaya to stand out from similar sites in the registry search engines to make Your website unique, original, beautiful and attractive to visitors of Your website. And it is not necessary to neglect such an opportunity of attracting customers to your website. Thus it is necessary to pass in a small image, the so-called icon in what Your site is about what and how You Express the content of your pages. This is Your label should create and build, because the brighter and priate the more politely will notice and will come to You even if the search engines give Your page through dozens of websites.

As I already wrote, there are a lot of generators for creating icons for Your website. Any modern editor adapted for demarcation of the rectangular area and a notch in the cells for convenience of drawing Your site logo. But if You do not hope for their artistic abilities, you have hundreds of sites offering icons for websites as free. and for a modest fee. It remains only to choose and install as before You explained. Good luck in your work.

Client graphics cards have three components:

• common image file (.gif, .jpeg or .png);
• map, marked with the map element, in which 
contains information about the coordinates and URLS
for each active region (described
the areas contained in the element IDA);
• the usemap attribute within the element image img,
that means, used map map.

Client graphics card map in HTML. < IDA>...< /Mar>. Attributes: Base (id, class, style, title), Internationalization, events. id="text" name="text".

The area in the HTML. < area />. Attributes: Base (id, class, style, title), Internationalization, events. alt=" text (Mandatory).

coords="value" href="url" nohref shape="rect|circle|poly|default" target="text". The coords attribute specifies the coordinates of some of the active region. The coords attribute value is a list of coordinates of points defining the active area and separated by commas. The coordinates are recorded in the form of a positive integer or at least non-negative numbers. The origin of coordinates is located in the upper left corner of the picture( as usual for many functions in jQuery), which correspond to the values of x=0, y=0.

For a region with rect value, given the coordinates of the top left and bottom right corners of the rectangle.

For a circle is written three numbers - coordinates of the center and the radius.

For a region with a value poly given the coordinates of the vertices of the polygon in the correct order.

For the field with a default value is not required to assign coordinates neither x nor y.

Each < area> tag defines one active area and a closing tag < /area> not mandatory. Operating zone area can intersect and overlap. Well, if one point is overlapped with a point at the same time, there will be realized the link, which is the first in the list of areas activation.

Use of the client's graphics cards gives a lot of advantages, and they are needed, because with the help of maps and images can bind hypertext links to different parts of the image. Use of the client's graphic cards give clearness and rapidity of movement through the site, because the user can understand the meaning of links on its graphical image. They are in the HTML document Autonomous and does not require access to the server. This means that you can test the graphics card on the local machine and create a demo version of a production site for distribution on CDs. It also reduces server load and improves the time of his answer. In addition, all information about the URL appears in the status bar when the user moves the mouse cursor in the active area (server-side image map shows only the coordinates). Complex polygons describes long lists of coordinates. Some browsers also support the nonstandard polygon attribute in HTML, equivalent to poly. < img src="orbit.gif" width="500" height="125" border="0" usemap="#spacey" />. The usemap attribute must be placed in an image item to indicate that the image is a graphics card that uses the element Mar named «spacey».

Now, You got that card images allow the user of Your website user-friendly interface to navigate to other pages for quick and easy search of information. To navigate to another page, you can simply select a spot on the image and click or press the key. Map-the image looks like an ordinary built-in image, but when the mouse cursor in one area or another in this image, you jump to other pages. On other pages of this site we will see and show what codes is possible. There are several options specify the boundaries of the areas that implement various links when using the portal client graphics cards.

As in the beginning noticed that the map image is a normal embedded image on a Web page can have any valid format (gif, jpg, png) file extensions image. Gif images can be used transparent color and about this you can read in Chapter Web Desir and its applications to create a free The website.

As it says on the client version you are using the graphical cards, controllers, but not on a server using the client version of maps and images allows you to put all of the configuration information of the map in an HTML document into which the image on the pages of free website. All work with configuration changes card-image is immediately on the site, concurrently with editing your HTML. It is permissible to save the configuration in a separate file and link to it and about it it is advisable not to forget to create your own free website. But some browser little in this respect, capricious and demand of the run and test when creating your website. As an example, the tag < img=picture.gif usemap=#restavrazija>. Here, stored in a file image picture.gif with the picture and name with the extension .gif is a reference( basic) for the map image. Describe the configuration of the hotspots located in the same file as the string of HTML code, and has for this example, the name restavrazija, that is, as earlier we spoke of was demand the usemap attribute.

Again, briefly, again, that the creation of maps-images requires two steps:

preparation of support image portal, 
on that in future will be set active area
for site navigation.

development of file - configuration, describes the geometrical 
the settings in the active regions, i.e. the coordinates of our images.

Preparing the reference image is the regular work on creation of normal images on the site. You can use any graphic editor, you can pick up any of finished and suitable in this case the image.

The Next step requires you to note the active area on the image and map hotspots appropriate addresses for links. Preparing the file schema is the most important and time-consuming step in creation of maps and images. In principle the manual method, the boundary active regions on the image or block images. Want to do so: when working in a graphics editor to emphasize certain points, to record their coordinates, then create a file describing the geometric parameters of the selected areas. Immediately seen in this approach, to talk about the speed of creating your website, however.

To automate the process of marking areas there are programs created and standardized for this case. In principle from each other a little different and all good things have their disadvantages.

Now, about this creates a reference image of themselves and client-side image maps to navigate Your site.

Elements in (X)HTML are embedded media objects, such as object. W3C recommends the use of this item for all kinds of media objects.

applet For Java appletov; in HTML 4.01 and XHTML 1.0 is deprecated.

There is a third, non-standard element for embedded media objects embed. For objects that depend on plug-ins; not included in the recommendation HTML.

The object Element in HTML.

According to the HTML 4.01 Recommendation, the element object is a universal means of accommodation of objects. It can be used to host different types of objects on a Web page, including applets, commercials, interactive objects (Flash), and even plain old image.

Object in the HTML. the < object>...< /object>. Attributes: Base {id, class, style, title), Internationalization, events archive="URLs" classid="URL" codebase="URL" codetype="tipod" data="URL" declare="declare" height="number" name="text" standby="message" tabindex="number" type="type" usemap="URL" width="number".

Param in HTML. < param />. The attributes. id="text" name="text (Mandatory) value="text" valuetype="data| ref Iobj ect"

The necessary Attributes to the object element in HTML, depend on the data type. An element may also contain several elements param that convey important information in the object when it is playing or is displayed. Not all projects require additional parameters. The conjunction of elements of the object and param allows authors to define three types of information:

The Implementation of object - executable code in HTML, run to display the object. It can be a tool or players needed to display an external file, or it can be the object itself, for example, a standalone applet-clock. Implementation is specified by using the classid attribute.

The data Display. In the data attribute specifies the URL for the data. In most cases this is an external file, such as a movie or a PDF file. According to the HTML 4.01 specification, the data attribute can also be used to specify the raw data directly in the object element.

Additional parameters required for an object at run time. Some embedded media objects require additional parameters that are used when the object is played or displayed. For example, placing a roller Windows Media authors are able to add a wide variety of controls, enable, and disable the autorun feature and use many other features specific to Windows Media Player. The runtime parameters are specified using the param elements inside the object.

The Authors do not necessarily indicate for all three types of information. For example, for a standalone applet will probably need to specify only the implementation. If you know that the browser has built-in functions display of the object (for example, a GIF image), you need only the data images and the description of the data type.

To get a General idea of how the object element, consider a simple example, in which the object element is used to host inline image:

< object data="zveti.gif» type=»image.gif>
Color photograph of Narcissus.
< /object>

Here in the data attribute in HTML, you specify the URL location of the embedded object (in this case, the image file), and the type attribute specifies that the data type is a GIF image. If the type attribute, the browser uses this information to determine how (and whether) to display the object. In the settings of the browser contains a list that defines how to handle each type of data, whether it is domestic support, the player that is implemented as a plug-in or an external helper application. If the type is not recognized, the browser will not be able to display the object. In this example, the browser can display GIF file without using special player. Although the syntax, you can add an image using the object element, there is a more common method is still the img element, because browsers lack support for the placement of images using the object element.

Directive implementation.

The object Element in HTML is also often used with the attribute сlassid, which specifies the implementation of the ActiveX control, a Java applet or Python-applet. The following example shows the object element is used for placement on the page is a Java applet. (Note that for the proper functioning of some applets need their location using the applet element.) < object classid="java:calendar.class" codetype="application/java" standby="loading Calendar..." width="200" height="150" title="basic calendar">...< /object>. A Java applet is invoked with the classid attribute. Additional codetype attribute defines the type of data that is downloaded classid. The browser can use the information in the attribute сodetype to not download information, the type of data which it does not. Additional standby attribute allows you to set the message displayed on the screen during loading the applet. For the correct operation of some media objects and applets that depend on plug-ins, you need to specify the width and height attributes to provide the possibility to read the documentation for the specified data type. A good practice is to specify the width and height attributes for each object element.

Add an alternate content.

If the browser determines that cannot display a specific object, then displays the contents of the object element. Alternative content can also be another element object. Authors can specify multiple levels of alternative content, investing in each other objects with different implementations. A user agent will view each element object until you find the object that will be able to display.

In the following example, taken from Recommendation for HTML 4.01, Python-applet placed on the page using the object element. If the browser can't handle the applet, as an alternate content offered MPEG-video. If you cannot display the video displays static GIF image, and, finally, if none, all the suggested does not work, it displays a text description:

< object title="The Earth as seen from space" 
classid="http://www. observer.mars/TheEarth.py>
< object data="TheEarth.mpeg" type="application/mpeg">
< object data="TheEarth.gif" type="image/gif">
The Earth as seen from space.
< /object>
< /object>
< /object>

Unfortunately, although most of observing standards and browsers interpret the object element correctly, the markup needed to realize the full capability of playback of media objects that are specific to the players, not browsers. For example, at the time of writing this book, QuickTime, implemented as a plugin, does not accept the parameters specified by the param elements, so for all functions other than the default playback, you want to use the custom item embed. Authors are encouraged wherever possible, to apply for media objects the object element in HTML and the embed element to use only in extreme cases.

Embed in the HTML. the < embed>...< /embed>. Attributes: align="left|right|top|bottom" height=" number " hidden="yes|no" name="text" palette=foreground|background" pluginspage="URL" src="URL (Mandatory) width="number". The src attribute is required; this tells the browser about the location of the currently playing media file. The type attribute specifies the data type. The browser uses the information about the type of data (or the suffix of the media) to find the appropriate plug-in to play or display the file. In order for the plugin to function properly, for some media types, you must specify the width and height in HTML (the element's dimensions plug-in in pixels. The optional attribute pluginspage indicates the URL of the page where the user can receive the information about necessary plug-in if it is not found on the client machine. The embed element using special attributes and values that are used for additional run-time options (the same parameters, indicated in items param object element). These attributes specific to each type of objects and plugin. (The attributes listed embed element apply to all embedded objects.)

Noembed. < noembed>< /noembed>Attribute: No.

In the example, the browser displays a GIF image, and a brief message instead of the media: < embed src="movies/vacation.mov" width="240" height="196" autoplay="false" plugins dximg src="vacation.gif> It seems you have no plugin. < /noembed>.

Use of the embed element. Although the embed element at the time of writing this book continues to be a widespread and is recommended for use by developers of multimedia formats such as Macromedia, Apple and ultimately the full functionality of the plugin can be achieved only via the object element.

Where to get applets? If you need a specialized applet for the site, it is best to hire a programmer who creates the applet in accordance with Your requirements. However, there are also a number of ready-applets that can be downloaded for free or for a fee of libraries in the Web.

Add the applet to a page in HTML.

There are two methods of adding applet on the Web page of the site: the object element, which is recommended in HTML 4.01, and better supported, but outdated applet element.

The applet. the < applet>...< /applet>. This element is deprecated. Attributes: Base (id, class, style, title, alt="text" archive="URLs" code="class (Mandatory) codebase="URL" height="number" name="text" object="text" width="number".

The W3C announced the applet element and all of its attributes are deprecated in favor of the object element. Despite this, the applet element may remain more viable option, because browser support for applets, built with the help of object elements, is not universal and it is difficult to find an approach that works in all browsers. In addition, some applets require the use of elements applet, so first read the documentation for the applet.

Add applet using the applet element. The applet element is a container for any number of elements,-parameters (param). Below is an example showing how may look the applet element for the game:

< applet codebase=class code="Wacky.class"
width="300" height="400"> 
< param name="Delay" value="250" />
< param name="Time" value="120" />
< param name="PlaySounds" value="YES" />
< /applet>

Element applet in the HTML contains a number of standard attributes:

Code; tells the browser how the applet will be used. Files applets have the suffix .class or .jar. This attribute is mandatory.

Codebase. This attribute tells the browser in which directory to look for applets. If the attributes are in the same directory as the page, the codebase attribute is optional.

Width, height in HTML. Specifies, in pixels, the size of the «window», occupied by the applet. These settings are required for the proper functioning of a Java applet.

Element applet in the HTML can also be used with many of the attributes used for images, for example, alt, to specify alternative text if the applet cannot be performed, style attributes, such as align (for positioning of the applet within the flow of text), and hspace/vspace (used in conjunction with the align).

Special parameters for an applet, you can specify any number of param elements (although these options may not be). The param element in HTML is always contains the name of the parameter name and its value. Settings define the specific settings and controls for a particular applet, so you need to follow the instructions on the settings that gives the programmer who wrote the applet.

Adding applets using the object element in HTML. You can add a simple standalone applet in your HTML document using the object element: < obj ect classid="applet.class" codebase="http://somedomain.com/ classes/"> Applet with useful feature should be there. < /object>. The classid attribute indicates the applet itself (for implementation). This attribute has the same function that the code attribute of the applet element, if you use Java applets. The classid attribute may not contain any information about the path, then the location of the class file specifies the codebase attribute. When using the object element for Java applets this element can contain a number of elements,-parameters (param)as the applet element.

Always think first if You need a job that will take You to load unnecessary problems. Then you jump to row (streamlined) frames pages. inline frames, which are marked with iframe . They allow you to embed one HTML document in another HTML document, viewing it in a frame, equipped with a scroll bar. The iframe element is placed in the document as an inline, like image:

Iframe HTML. the < iframe>...< /iframe>. Attributes: Base (id, class, style, title) :

frameborder="l|0"
height="number"
longdesc="URL"
"marginheight ="number"
marginwidth="number"
name="text
scrolling="yes|no|auto"
src="URL"
width="number"

But always remember that sometimes there are situations when the browser cannot determine the real URL of the page in HTML, because each frame has its address, and only it determines. And when the load on the main frame to a new page to return to the old is not so easy. And to work with bookmark it, because quite often, the browser displays the URL wrong page, which is located in the main frame.

Custom attributes. hspace="number" vspace="number". The iframe element is included in the DTD HTML 4.01 and XHTML 1.0 Transitional. It is also included in the DTD most widespread errors, although this element and is not associated with a set of frames. He supported browsers that comply with the standards. However, it is obsolete, and an alternative for him in Strict DTD is the object element, which in the type attribute is explicitly specified, text/html, and the attribute lists the date the URL of the external document. The iframe in the HTML locates external HTML document on the Web page of the website in a scrollable window. The src attribute specifies the URL of the external document. In the width and height attributes specify the size of the streamlined open.

The HTML table elements were created in order to give the authors the opportunity to present tabular data in rows and columns. Actually, it was, and items retain their original purpose. However, very soon designers, tired of Web pages displayed in one column occupies the whole width of the page, got the tables to manage the layout of pages. Anybody especially did not disturb, what is the use table of elements is wrong because no other alternatives. Currently, there is a strong alternative. Using cascading style sheets you can create pages from multiple columns, with complex layout, which previously could only be obtained with the help of tables and all this built-in editors for creating web pages, and the tables are one pressing of a key or the click of a mouse button. So only tables for layout, are becoming obsolete, but it does not mean that the table items should be discarded. In practice, the table still remain suitable solution for the present tabular data such as schedules, statistics, etc. Items tables:

table Create table
tr table Row
td table Cell
the th cell in the table header
caption Title of the table
links to other pages, you Specify the table header
tbody the table Body
tfoot table Borders
col Ad column
colgroup the Ad group column

The layout of the pages on the table are widely used in different branches of industry and economy, so you have developed different mechanisms of registration. Now here is the skeleton of the table of seventeen columns and fifteen rows, the table is created instantly with just one click. Previously, it would take at least half a day of intensive work and zatraceni nerves.

Here's a simple multicellular table.
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 
                                 

The HTML table elements in the beginning was created to represent tabular data in rows and columns. For a long time, and imagined the existence of tables in the classic view. But in view of the lack of effective structuring of the site and its division on the field( or columns), but occupies the whole width of the screen , got the tables to manage the layout of pages. And therefore produced a complicated layout, based on tables and managed to create masterpieces of site building.

If anybody was not very interested and didn't care what is in this form using tables in fundamentally wrong, because there was no choice and were not granted alternatives tabular layout.

With the appearance on the horizon cascading style sheets, and other tools for layout contents in columns, blocks, opportunities stratification and stratification of the pages, manifestations and hide items fetch pages, left or almost disappeared layout pages tablicni view.

However, such development of the Internet in no way detracts from the value of the tables in their original sense, because they still demand and need for any kind of view schedules of trains and flights, different kinds of statistics, the establishment of a database on the enterprises and the organizations necessary to create all kinds of online stores and more.

So begin studying tables as such in the classical sense, their basic structure and layout and gradual transition to methods of ensuring the availability of data tables for non-visual media.

Tables are divided into two basic categories: tables for layout pages and data tables. the so-called arrays of view. < /p>

Tables of data.

Tables of data where the information is organized into rows and columns are the primary applications table of HTML elements. In visual browsers( where all lined and Raschetno) the location of data in columns and rows enables users to immediately understand the relationship between table cells and the relevant headings of the pages, that is, everything is simple and clear: this is the name of the column - that is, the string value. These relationships can be lost for users who are unable to use visual representation, unless the author of the table does not consider the question of accessibility and will not provide the opportunity to see.. You can use tables to create a calendar plans, schedules, statistics, and other types of information. Please note that the «data» does not always mean «number»in table cells can be set to any value up to a string value and graphical representation of information, i.e. the table cells can contain any information, including numbers, text elements, and even images and multimedia( videos, movies, digital video).

Tables for layout, unlike a data table is used as the method of submission, to control the layout of the page. In HTML 4.01 Recommendation specifically States that this use of tables is not encouraged, but the professional community of Web developers condemned such use does not earlier than CSS has become a viable alternative. However, if to be fair unequivocal condemnation is not yet available. In the Web cannot pass, not to come across sites, and even on very serious sites, in which tables continue to be formed as a pickup, because, firstly, as usual, secondly, sometimes the result when tabling layout page of the site turns out it is more efficient and easier. In some sites the table are used as the elementary frame, the other for storage of materials used several layers of nested tables. The cell boundaries were expanded to reveal the table structure. Although still are at the stage of transition from the table design to design, fully CSS based (and of course, impeccable support his browser), some authors still decide to use tables to create the basic structure of the table columns. This can be done, although not perfect, using style sheets, and then the table markup will be minimal, and You will consider the issues of accessibility.

All the same tabular layout of the site pages is an anachronism is necessary to recognize and remember. Step on his own corn, and use a more modern tools layout pages of the site as a cascading style sheet (CSS plugins libraries, jQuery, codes of PHP programs and applets, JavaScript and other achievements.

Simply put, Web tables are composed of cells that contain the placed materials), arranged in rows. The HTML table model «is oriented on-line»because the lines are explicitly defined in the structure of the document, and the columns are only implied, although we can see a direct correlation rows from the columns that define values in lowercase cells. Anyway, let's, we will gradually move forward in understanding the classical view of tables.

The Rows and cells.

In the minimum elements to create the table is the tablefor the Declaration of the table.

The table tr in the HTML to declare a string table.

The table td in the HTML to create a table cell in the row or column definitions in the end, as we would all like to admit it.

The Main element of the table is a table tag in HTML. < table>...< /table>. Attributes: Base (id, class, style, title), Internationalization, Events border="number", although it is just the shell of a table or a so-called container without content.

The cellpadding Attribute = "number of pixels or%%.

Attribute се11sрасing="number of pixels or%%.

The frame Attribute = "void|above|below|hsides|lhs|rhs|vsides| box|border"

Attribute rules="all|cols|groups|none|rows"

The summary Attribute="text" width=number, percentage."

The Attribute width=number,percentage."

The Attribute is Deprecated attributes align="left| right|center"

Attribute bgcolor="#rrggbb" or "color name".

Custom attribute: height=number, percentage."

As shown on the previous pages, the knowledge of these characters when using modern editors with full of programs, the creation of the site is optional. But as they say: forewarned is forearmed.

Element, string tr. < tr>...< /tr>. Attributes: Base (id, class, style, title), Internationalization, Events

the Attribute align="left| center|right|justify|char"

Attribute сhаr="symbol"

Attribute charoff=length

Attribute valign="top|middle|bottom|baseline". Deprecated attributes

Attribute bgcolor="#rrggbb" or color name".

Element cell lines td. < td>...< /td>. Attributes: Base (id, class, style, title), Internationalization, Events

Attribute аbbr="text"

The Attribute align="left|right|center|justify|

Char symbol

The Attribute axis="text"

Char="symbol"

Attribute charof£="length"

Attribute соlspan="number"

The headers Attribute="reference to the id

The rowspan="number"

Attribute scope="row|col|rowgroup|colgroup"

Attribute valign="top|middle|bottom|baseline".

Deprecated attributes: Attribute bgcolor="#rrggbb" or color name"

Attribute height=pixels, percentage"

Attribute nowrap="nowrap"

The Attribute width=pixels, percentage."

Here is the structure of the table view, although there may
to be hundreds of lines and hundreds of columns, as in the visual presentation,
and non-visual representation:

< table>
< tr>
< td>cell l< /td>
< td>cell 2< /td>
< /tr>
< tr>
< td>cell 3< /td>
< td>cell 4< /td>
< /tr >
< /table>

The Entire table indicates the table element that does not have its own content, but serves as a container for one or more items-strings, tr. In this example, the table contains two lines. Each tr, in turn, contains two cells for data, indicated by the td elements. In cells is the real content. Table elements and tr are solely for the formation of the structure of the table. The table cell can contain any data that is displayed in the document, including formatted text, images, media objects, and even other tables. As mentioned earlier, the system tables in HTML is oriented on-line. Strings are referred to explicitly, but the number of columns only means, in relation to the number of cells in the longest line. In other words, if all lines contain three cells (three td element), then the table will have three columns. If one string contains four td element, and all the rest - in two, the browser will display a table consisting of four columns, adding empty cells to shorter lines. In HTML 4.01 proposed modernized standard system describe the structure of the tables in which the columns are marked explicitly.

The value of the < td > element is not explicitly specifies the number of columns in the table, although considered to represent the number of cells in a table row. Let it be so, all the more, we now know everything.

The data Cell in the table in HTML may occupy more than one «cell» grid formed rows and columns. You can «extend» the td element horizontally or vertically, using the colspan and rowspan attributes, respectively.

Merge cells in the different columns in HTML when creating a free site.

Attribute of the < td > colspan="2" causes the browser to display the cell «cell 1» so that it takes up horizontal space of two cells, «combining, thus, the two columns. Note that the string containing the merged cell now contains only one element td instead of two.


Here, an example of such Association:

< table>
< tr>
< td colspan="2">Cell l< /td>
< /tr>
< tr>
< td>Cell 3< /td>
< td>Cell 4< /td>
< /tr>
< /table>

If you set the colspan attribute to a value greater than the actual number of columns (for example, colspan="4" in this example), some browsers may add columns to the table and then may be lost alignment.

The rowspan Attribute in HTML, similar to colspan extends the cell so that it occupies the space of the cells in the rows, beneath it. Turn on the rowspan attribute in the line where you want to start a cell, and set the value equal to the number of cells that this cell should extend down. Browsers ignore rowspan, exceeding the size of the table. The number of rows may not exceed the number of elements tr. You can combine the colspan and rowspan, combining the cell horizontally and vertically.

Here's a table
                 
                 
                 
                 
                 
                 
                 

A basic table model of pages of a site also includes two elements that form description of contents page table of the site. Header cells of the table th, is used to describe the cells in the row or column that they face. The caption element is the title of the whole table.

The table Headings in HTML.

The header Cell pages marked with the th element, are used to designate important information or context for cells in the column or row that they face. The th element has the same list of attributes as the td element.

Th in HTML. th>...< /th>. Attributes: Base (id, class, style, title), Internationalization, Events abbr="text" align="left|right|center|justify|char axis="text" char="symbol" charоff="length" colspan="number" headers="link id" rowspan="number" scope="row|col|rowgroup|colgroup" valign="top|middle|bottom|baseline". Deprecated attributes: bgcolor="#rrggbb" or color name" height=pixels, percentage" nowrap="nowrap" width=pixels, percentage." In the table structure and markup header cells are placed in a tr element, as well as td:

< table>
< tr>< th>Planet< /th>Distance from Earth< /tr> 
< tr>< td>Venus< /td>pretty darn far< /td>
< /tr> < td>Neptune< /td>ridiculously far< /tr>
< /table>

User agents typically display the contents of a table headers in HTML differently from regular table cells (usually bold, aligned to center). However, it is easy to modify by using style sheets. However the difference between the th and td elements not only in terms of style. Table headings are important function associated with the creation of descriptive labels table cells for non-visual browsers. Elements headers should not be used in tables used for layout.

Title.

The caption Element in HTML forms the title or brief description of the table.

Caption in HTML. < caption>...< /caption>. Attributes: Base (id, class, style, title), and Internationalization. The events. Deprecated attributes align=top|bottom|left|right". The caption element must be immediately after the start tag of the element of the table, in front of all the other table elements. By default, the title is placed above the table. Its width depends on the width of the table. You can use the style property caption-side to move the title under the table. There is also deprecated align attribute in HTML, which does the same thing. The values left and right are not well supported, so the authors usually choose the option of placing captions above or below the table. Titles in HTML are a useful tool to ensure accessibility of tables.

A row Group in HTML.

In HTML and XHTML is determined by three elements to indicate the row groups, which allow you to separate line on the top of the table thead, the bottom of the table tfoot, and the body of the table tbody . Because these elements have a common syntax and attributes, you can combine them into a single element: thead, tbody, tfoot. < thead>...< /thead>, < tbody>...< /tbody> < tfoot>...< /tfoot>. Attributes: Basic (id, class, style, title), Internationalization, Events. align="left|right|center|justify| char="symbol" charoff="length" valign="top|middle|bottom|baseline". W3C has included elements to group rows in the HTML 4.0 Recommendation, as a way to create more meaningful markers, a method of increasing the availability and greater flexibility when using properties of style sheets. Row groups give big advantages of using data tables, but they should be avoided in the tables for layout.

The table Rows in HTML can be grouped in the upper part of the table thead, the bottom part of the table tfoot, and one or more bodies table tbody. The top and bottom of the group should contain information about the document. Also the upper and lower group can be printed on every page of a long table, split into several pages. The W3C recommends that tfoot element was in the markup before the tbody that the lower part it was possible to deduce on the screen before download all the rows of data (which can be a lot). Shown below is an example of the marking of a table with multiple rows:

< table>
< thead>
< tr>
< th>Employee< /th>
< th>Salary< /th>
< th>Start date< /th>
< /tr>
< /thead>
< tfoot>
< tr>
< td colspan="3">Compiled by D. Buster Boss< /td>
< /tr>
< /tfoot>
< tbody>
< tr>
< td>Wilma< /td>
< td>5, 000< /td>
< td>April 6< /td>
< /tr>
< tr>... more data cell...< /tr>
< tr>... more data cell...< /tr>
< /tbody>
< /table>

As mentioned earlier in this Chapter, table columns, simply refers to the number of cells in the longest line. However, in some situations it is desirable to define columns of data cells or groups of columns. Col elements (column, column) and colgroup (column group, the group of columns) allow authors to unite in a group of cells located in the column (or columns). Columns and column groups are very convenient. Their original purpose was to speed up the display of tables in the visual user agents. If you specify the width of each column, the user agent doesn't need to process the whole table and calculate the width of the column and table. Columns and column groups are also useful to apply attributes (such as width and align) to all the cells they contain. They can also be used for applying a limited number of features of style sheets. When using the scope attribute columns, and column groups can also create a convenient context for instruments with screen readers and other non-visual media. In CSS 2.1 Recommendation stated that by col and colgroup elements can only be applied following four stylistic properties: border, background, width, and visibility.

col. < col />. Attributes: Base (id, class, style, title), Internationalization, Events align="left| right|center|justify|char" char="symbol" charof£="length" sрап="number" valign="top|middle|bottom|baseline".

Colgroup. < colgroup>...< /colgroup>. Attributes: Base {id, class, style, title), Internationalization, Events align="left|right|center|justify|char" char="symbol" charoff=length sрап="number" valign="top|middle|bottom|baseline" width=pixels, percentage."

The col Element is used for marking of separate column or multiple columns, using the span attribute) or to apply the attribute values without real grouping columns, structural or logical. An empty element col is used only to apply attributes, or styles, columns, to which he refers.

The colgroup Element creates the logical group of columns. The number of columns in the group specified by the span attribute, or a total of col elements in the group (and their values span). Attributes such as width and align, if included in the colgroup element apply to all columns in the group. The colgroup elements and/or the col elements must appear in front of all the cells-row or group of rows. They are placed either immediately after the opening table tag, or immediately after the caption element, if present. In this example to the previous layout was added information about groups of columns:

< table>
< colgroup id="employinfo">
< col span="2" width="100" />
< col span="l" width="50" class="date" />
< /colgroup>
< thead>
< tr>< th>Employee< /th>
< th>Salary< /th>
< th>Start date< /th>
< /tr>
< /thead>
< tfoot>
< tr>
< td colspan="3">Compiled by D. Buster Boss< /td>
< /tr>
< /tfoot>
< tbody>
< tr>
< td>Wilma< /td>
< td>5, 000< /td>
< td>April 6< /td>
< /tr>
< tr>. . . yet the data cells. ..< /tr>
< tr>... more data cell...< /tr>
< /tbody>
< /table>

This colgroup element denotes three columns included in a single structural group. (In the table may be several groups of columns, but here, for simplicity, only one is used.) In colgroup the first col element defines two column (span="2"), each with a width of 100 pixels. The remaining col element has a width of 50 pixels. If all columns in a table must have the same width, the width can be specified in the colgroup element. The third column is indicated by a class attribute, which can later be referenced in a style property (i.e. background).

By default, the table's width is determined contained in the materials. You can explicitly specify the table width using the width attribute of the table element. In the HTML specification, there is no way to specify the height of the table. It is assumed that the height is automatically defined by the contents of the table. However, there are non-standard height attribute, which allows you to specify the minimum height of the table, which is well supported by browsers. You can control the width and height of the individual cells by using the width and height attributes of the td and th element. The values for height are minimal, and the cells can be moved apart to fit the contents. The width and height attributes for td and th element considered obsolete, but for the table element they are not considered obsolete. Properties style sheets still remain the preferred method of specifying the size of the table. CSS is an alternative. Use the width and height properties specify the size of the table elements. Height values are considered as minimum values, which may increase in accordance with the contents.

Borders in HTML.

The HTML table Element takes the following attributes that control the borders and rules relating to the cells and the entire table. All these attributes apply only to the table element. None of these attributes are deprecated, but the authors to draw borders around the table elements recommended to use CSS.

Border in HTML . Controls the width of the border around the table. The default is 1.

Frame in HTML. Defines side of the table on which to display frame. By default, the frame is drawn in the line in 3D style with shadow. In the frame attribute uses the following values: void (without frame), above (only the top face), below (only the lower edge), hsides (horizontal edge), lhs (left face), rhs (right side), vsides (vertical edge), box (four faces) and border (all four sides).

Rules in HTML. Specifies the line to appear between the table cells. One of the ways of the use of this attribute may be displaying the rulers only between certain sets of columns and rows specified by colgroup elements or elements for groups of rows (thead, tbody and tfoot). For rules attribute has the following values: all, cols, groups, none, and rows.

CSS-the alternative. Collection of CSS properties border allows you to specify the type (solid, dotted, dashed, and so on), color and border width around any table element. Using style sheets, you can use different boundaries for different faces tables, rows, and cells.

In HTML Attributes align and valign in HTML are used for horizontal and vertical (respectively) to align cell contents. Alignment can be specified for the following elements: td, th, tr, thead, tbody, tfoot, col, colgroup.

CSS alternatives. Authors can use to specify the vertical alignment of the contents table of elements (including the table element) property text-align. The property text-align can also be applied to any element in a table cell, substituting therefore the alignment options at the level of cells or rows. When centering on the vertical, the application of a property vertical-align elements td or th has the same effect as using the valign attribute. Property vertical-align applied to table cells that have the following values are valid: baseline, top, middle, and bottom.

Background in HTML.

In recommendations (X)HTML was deprecated the bgcolor attribute that is used to apply a background color to the cells, rows, and tables. Use to specify a background color or background image property stylesheets background.

Available tables.

The data is presented in the form of rows and columns is a very effective method to help to perceive the data in a visual environment. Sighted users can easily find in the row or column header cell, which describe the meaning and context data. Blind people and people with impaired vision are deprived of such opportunity. When using a screen reader or Braille device, you can read the contents of the cells in series (a process called Linearisation). In specification (X)HTML offers several mechanisms to improve the understanding of tabular data, even if the table is represented by a non-visual way.

The table Metadata.

The First step to ensuring the availability of tables in HTML is to create a table by using the caption element and the summary attribute.

The caption Element in HTML forms brief descriptive title for the table. Visual browsers display the contents of the item caption above or below the table, in accordance with the value of the attribute or the style properties. Using the summary attribute of the table element, you can create a longer description of the table. This attribute is similar to the alt attribute of the image. Unlike caption element the summary attribute is not displayed visual browsers. Such a description may allow users with visual impairments to better understand the content and the organization of a table than even the sighted users. This is partly eliminates the need to read the first few rows of the table to decide whether this table. Even though the summary allows you to create a long description, authors are encouraged to do the descriptions short and understandable, and to use them only when necessary.

The Most important element in creating the available data tables are the titles table th. Headers provide a description or context for data cells in rows or columns. Non-visual user agents may use the th element to describe each cell of the table. Although you can use styles to make the first row of the table td elements looked like the title (for example, using a bold font and frame with shadows), the td element itself is unable to perform the functions of the th element, and important information will be lost. By default, browsers display the headers in bold font and center the text in HTML, but can easily change its appearance using CSS properties. In any case, do not try to avoid td elements, simply because you don't like how the browser displays them by default.

When adding the align attribute in the HTML for the table element, the entire table is aligned on the width of the containing element, but this does not affect the alignment of the cell contents.

The horizontal Alignment.

The align Attribute in HTML accepts normal values left, right, center, and justify. By default text is aligned on the left margin for languages that read left to right. The align attribute can also use the char value that indicates that the content should be aligned to a specific character, such as a decimal point for column sums of money. The symbol, which is the alignment is specified char. In the attribute charoff specifies the offset distance to the first character alignment. Although it is a great idea modern browsers do not support the attribute char and charoff in HTML. The alignment options for the individual cells td or th always replace the parameters of the higher levels. The alignment specified in the elements inside the cell (for example, item e), substitute the alignment specified for the cell. If the table contains elements col or colgroup, options to align columns supersede any and all parameters listed for a row or group of rows.

The vertical Alignment when you create a free website in HTML.

The valign Attribute in the HTML used for the vertical positioning of the cell contents to the top (top) bottom (bottom) or center of the cells (middle). The value baseline valign attribute ensures that the first lines of all cells in the same row are using the same base line.

The Connection header with the data in HTML.

If the table structure becomes more complex, more markup clarifying the relationship between table headers and relevant data. The remaining missing element attributes th - scope and headers are used to logically linking headers with groups of data cells. The scope attribute of the th element is used for outdoor advertisement links between headers and rows, columns, row groups and column groups in which they are located (using the values of the row, column, rowgroup and colgroup, respectively). The scope attribute can be used in item-cell td, and then the contents of the attribute is used as the description for the remaining cells in the same row, column, row groups, or groups of columns. This is convenient for those cells that contain data, but are related in meaning to the other cells.

ID and headers in HTML.

The Scope a scope is a rectangle that encloses the above table cells. In very complex tables, headers spaced out or invested in each other, the relationship between the headers and the data they describe, you may not be able to describe a neat square. A header attribute is used to map cells with specific titles table by specifying the header names (id).

quit Smoking and drinking is not the problem-quickly and easily,simply no two not...

back to page     back    further    next

LIKED IT?
Share with your friends: