Langage de balisage hypertexte (Html)

World Wide Web, ou, qui est le même que le World Wide Web, WWW est le composant principal du réseau informatique mondial Internet. Né dans les années 60, Internet n'a longtemps été utilisé que par un cercle restreint de spécialistes pour échanger des informations par e-mail. Le réseau était contrôlé par le système d'exploitation UNIX - il convenait à des fins scientifiques, mais l'interface textuelle UNIX plutôt complexe "a considérablement limité la portée de l'utilisation des technologies de réseau. Ce langage est HTML (HyperText Markup Language).

L'auteur de HTML est Tim Berners-Lee, diplômé d'Oxford qui travaillait alors à Genève avec le Conseil Européen pour la Recherche Nucléaire (CERN) en tant que consultant logiciel. Le CERN est une organisation suffisamment grande, et donc, afin de mieux naviguer dans sa structure, de ne pas stocker en mémoire des données sur un grand nombre de projets, fonctionnaires, etc., Tim Berners-Lee a développé le programme Inquire pour son usage personnel, sur la base duquel quelques années plus tard une sorte d'espace d'information a été créé pour le laboratoire. Le programme Inquire a permis d'effectuer la recherche documentaire dite « non linéaire », c'est-à-dire passer d'un document à un autre sans se référer à la table des matières ou à l'ouvrage de référence.

Le langage HTML constitue la base de la technologie hypertexte. Un document hypertexte contient des hyperliens.

Un langage de balisage de document est un ensemble d'instructions spéciales appelées balises conçues pour former une structure dans des documents et pour définir des relations entre divers éléments de cette structure. Les balises de langue, ou, comme on les appelle parfois, les descripteurs de contrôle, dans de tels documents sont codées d'une certaine manière, se démarquent par rapport au contenu principal du document et servent d'instructions pour le programme qui affiche le contenu du document sur le client côté. Les premiers systèmes utilisaient les symboles "<” и “>», A l'intérieur desquels ont été placés les noms des instructions et leurs paramètres. Maintenant, cette façon de nommer les balises est standard.

L'utilisation de la décomposition hypertexte d'un document texte dans les systèmes d'information modernes est en grande partie due au fait que l'hypertexte vous permet de créer un mécanisme de visualisation non linéaire des informations. Dans de tels systèmes, les données ne sont pas présentées comme un flux continu d'informations textuelles, mais comme un ensemble de composants interconnectés, qui sont parcourus à l'aide d'hyperliens.

HTML n'est pas un langage de programmation approprié ; c'est un moyen de décrire la structure d'un document, son style et ses relations avec d'autres documents. Pour afficher les documents Web, des programmes spéciaux sont utilisés - les navigateurs (anglais: parcourir - 1) paître, cueillir les pousses; 2) lire, faire au hasard, par bribes.) En fait, les capacités des navigateurs sont beaucoup plus larges, mais pour l'instant nous nous limiterons à les définir comme un moyen de visualiser des documents Web. Ce sont les navigateurs auxquels Internet doit sa popularité.

3. Langage hypertexte HTML

L'hypertexte doit commencer par un mot et se terminer par un mot. Les mots entre crochets angulaires sont appelés balises en HTML et descripteurs en programmation. Presque toutes les balises HTML sont appariées - et ainsi de suite.

Les balises appariées mettent en évidence un certain fragment d'hypertexte - "titre", "corps", etc. La première balise commence le fragment et la seconde - le termine. Dans les descripteurs de fermeture, le nom est précédé d'un signe de fraction /.

Structure générale de l'hypertexte écrit en langage HTML :

hypertexte :: = corps du titre

titre :: = titre

titre :: = titre

corps :: = texte

Conformément aux règles du HTML, l'hypertexte doit avoir un "titre" et un "corps". En tant que publication, l'hypertexte peut et doit contenir des informations sur les auteurs et les titulaires de droits d'auteur (sites).

Le titre de l'hypertexte doit contenir le « titre », qui est affiché par les navigateurs sur la toute première ligne de l'écran de l'ordinateur. Le titre doit exprimer l'idée principale de la publication (page). L'hypertexte sans titre est comme un article sans titre.

Le "corps" de l'hypertexte doit contenir des textes, des tableaux, des photographies et des illustrations. La différence entre l'hypertexte électronique et le texte papier ordinaire réside dans l'inclusion d'hyperliens, sur lesquels un clic provoque le chargement d'un nouvel hypertexte.

Un exemple d'hypertexte et le résultat de son affichage par un navigateur sur un écran d'ordinateur :

Hypertexte : Résultat :

Le résultat du navigateur est le chargement et l'affichage sur l'écran de l'ordinateur de l'hypertexte stocké sur le site à l'adresse indiquée dans la fenêtre du navigateur. Si l'hypertexte est trop grand, le navigateur affiche des boutons poussoirs hypertexte à droite ou en bas de l'écran.

Les tailles des écrans d'ordinateur ont le spectre suivant. La taille minimale de l'écran est de 640 x 480 pixels. De plus, les tailles d'écran standard sont de 800 x 600, 1024 x 768 et 1280 x 1024 pixels. Par conséquent, vous pouvez regarder différemment sur différents écrans.

Structure générale des hypertextes et leur affichage sur un écran d'ordinateur :

Hypertexte : Résultat :

La partie texte peut être constituée de lignes et de paragraphes avec et sans en-tête, avec des listes, des tableaux et des menus.

le corps du texte

texte :: = titre (texte) |

liste (texte) |

tableau (texte) |

Les titres hypertextes sont formatés comme suit :

en-tête :: =

Titre

en-tête :: =

Titre

en-tête :: =

Titre

où les balises H2, ..., h6 définissent la taille des titres par rapport au corps du texte.

Les paragraphes en hypertexte commencent par un descripteur

hypertexte |

|

Les sauts de ligne et les paragraphes sont indiqués par la poignée ... La fin de paragraphe p> est facultative, mais elle est obligatoire lors de l'utilisation de paramètres dans le descripteur de paragraphe.

Le paramètre principal des paragraphes - aligner - alignement des textes sur l'écran de l'ordinateur. L'alignement des textes est effectué par les navigateurs automatiquement en fonction de la taille de l'écran de l'ordinateur :

align = centre-centre de l'écran :

aligner = de gauche à gauche ;

aligner = droite - vers la droite ;

aligner = justifier - plein écran.

Pour aligner les paragraphes, un seul style général doit être choisi, qui doit être appliqué à tout le monde dans tous les hypertextes du site.

Pour styliser l'hypertexte, HTML dispose d'un riche éventail de polices, de styles et de ressources. L'outil de conception le plus simple consiste à mettre en évidence les mots afin d'attirer l'attention des lecteurs du site sur des parties individuelles du texte.

Pour surligner des mots en hypertexte, vous pouvez utiliser des caractères gras ou soulignés avec les balises suivantes :

Grands caractères

caractère gras

italique je>

souligner

barré

petits caractères

La sélection de la police dans l'hypertexte est spécifiée par la balise : polices :: = police de texte>

Paramètres de police - leur taille et leur type. Les tailles de police sont définies par le paramètre size = size.

La taille est indiquée explicitement de 1 à 6, soit sous forme croissante +1, +2 ou décroissante - 1, - 2.

Le type de police est défini par le paramètre

visage = police

Ici, la police est l'une des polices standard : Times, Courier, etc.

La couleur de la police est spécifiée par le paramètre color = color, où color est la couleur du fragment hypertexte sélectionné. Par exemple - surligner du texte en rouge :

police de texte>

Noms standards des couleurs dans le langage НТМL :

rouge - rouge, vert - vert, bleu - bleu, noir-noir,

blanc - blanc, or - or, jaune-jaune, etc.

Pour la conception d'un hypertexte, il est préférable de prendre comme échantillon un bon livre ou un bon magazine publié par une maison d'édition professionnelle, ou le livre électronique, le journal ou le site Web de quelqu'un sur Internet.

Un style de conception uniforme est une propriété importante de toute publication dans des livres, des magazines et des sites Web. À l'avenir, il est préférable de respecter les normes et le style de conception acceptés pendant toute la période de création et de maintenance du site.

Des fragments d'hypertexte peuvent être placés sur un même site ou sur plusieurs sites voire sur plusieurs serveurs. Des liens hypertextes externes indiquent les noms des fichiers correspondants sur le site, le serveur ou sur Internet :

Forme générale des hyperliens externes :

où « adresse » est l'adresse de l'hypertexte au sein du site ou sur un autre serveur sur Internet.

Exemples d'hyperliens externes :

a) adresse du site Web sur Internet :

http://bak2.nagod.gu

b) adresse de la page sur le site :

http://bak2.nagod.gu/inrogl.html.

c) l'adresse de la page dans le dossier du site ;

http://bak2.nagod.gu/tests/test2.html.

essais 2a>

A l'aide du dispositif d'hyperliens sur les sites, le placement de tous les dessins, photographies et autres illustrations graphiques est organisé. Pour cela, tous les fichiers comportant des illustrations graphiques sont préenregistrés sur le site.

Les fichiers graphiques sont généralement situés sur des sites et dans un dossier séparé nommé image. Le chargement des illustrations sur les écrans des postes utilisateurs est réalisé par les navigateurs avec l'aide d'opérateurs :

La forme générale des opérateurs de chargement des illustrations graphiques :

La disposition des illustrations sur l'écran de l'ordinateur est définie par les paramètres d'alignement : align = left - le long du bord gauche, align = right - le long du bord droit de l'écran. Dans le même temps, le texte s'écoule autour de l'illustration, respectivement, à droite ou à l'aveugle.

Les illustrations peuvent être pressées vers le bord supérieur ou inférieur de l'écran, ce qui est défini par les paramètres : align = top - vers le bord supérieur, align = bottom - vers le bord inférieur de l'écran, ou alignées au milieu de l'écran - aligner = milieu.

Pour positionner les illustrations sur l'écran de l'ordinateur, leur largeur et leur hauteur peuvent être indiquées dans l'opérateur de chargement :

hauteur : = hauteur = "hauteur"

largeur : = largeur = "longueur"

Les tailles des illustrations sont définies par le nombre de points sur l'écran (en pixels) ou en pourcentage de la hauteur ou de la largeur de l'écran de l'ordinateur. Dans ce dernier cas, les illustrations auront des tailles différentes sur des écrans différents. Après avoir calculé l'emplacement des illustrations pour les écrans de tailles minimales, vous pouvez être sûr de leur placement sur des écrans de toute autre taille.

Les tailles des illustrations sont généralement choisies de manière à ce qu'elles soient visibles dans leur intégralité même sur des écrans d'ordinateur de taille minimale. Si la grue informatique est plus grande, les illustrations n'en occuperont qu'une partie.

Les listes hypertextes sont des listes avec numérotation ou surlignage des éléments de la liste. Tous les éléments commencent par des balises

... Les listes numérotées commencent par la balise

et terminer par la balise

... Les listes non numérotées sont délimitées par des balises.

Les listes hypertextes sont un outil pratique pour organiser les tables des matières dans les sites complexes et les hypertextes volumineux. Les éléments de ces listes sont les adresses des sections correspondantes des sites (chapitres, paragraphes des sections des livres électroniques et des bibliothèques).

Conclusion

HTML est un langage de balisage hypertexte.

Tous les fichiers placés doivent être en hypertexte, écrits au format HTML et avec des identifiants comme.html.

HTML est un langage de balisage hypertexte qui est stocké sur des serveurs Web et affiché par les navigateurs sur les écrans d'ordinateur. Le langage HTML définit les règles de description de l'hypertexte et de leur affichage sur les écrans d'ordinateur par les navigateurs.

Le développement du langage de balisage hypertexte a été considérablement influencé par deux facteurs : la recherche sur les interfaces des systèmes hypertextes et le désir de fournir un moyen simple et rapide de créer une base de données hypertexte distribuée sur un réseau.

Règles de base pour l'imbrication des éléments :

Les éléments ne doivent pas se chevaucher ;

Les éléments de bloc peuvent contenir des éléments de bloc et de texte imbriqués ;

Les éléments de texte peuvent contenir des éléments de texte imbriqués ;

Les éléments de texte ne peuvent pas contenir d'éléments de bloc imbriqués.

Strictement parlant, toutes les règles du langage HTML. peuvent être considérés uniquement comme des "souhaits". L'outil utilisé pour rendre le document Web fera de son mieux pour interpréter le balisage de la manière la plus raisonnable. Cependant, seul le strict respect des exigences de la spécification linguistique garantit la reproduction correcte du document.

Bibliographie

"Informatique économique" / Sous. éd. P.V. Konyukhovsky et D.N. Kolesova, Saint-Pétersbourg : Peter, 2000, 560s.

Kaimin VA, "Informatique", manuel, 4e éd. M. :, 2003-285s.

"Informatique", cours de base, 2e édition / Sous. éd. S.V. Simonovich, Saint-Pétersbourg : 2003, 640s.

Le balisage hypertexte est utilisé pour indiquer dans quelle partie de l'écran et comment le texte doit être affiché et comment les textes qui composent la base de données hypertexte sont liés les uns aux autres. À ces fins, des caractères de contrôle spéciaux sont introduits dans le texte. Le texte échappé est stocké dans un fichier texte brut en codes ASCII et peut être traité par presque n'importe quel éditeur de texte.

Le langage de balisage hypertexte HTML a été proposé par Tim Berners-Lee en 1989. Au moment de la création du HTML, il existait un standard pour le langage de balisage pour les documents imprimés - SGML (Standard Generalized Markup Language), qui a été pris comme base du HTML. Il a été supposé qu'une telle solution aiderait à utiliser les logiciels existants pour interpréter la nouvelle langue.

En tant qu'élément de la base de données hypertexte pour HTML, un fichier texte brut a été sélectionné, qui est stocké au moyen du système de fichiers de l'environnement d'exploitation.

Ainsi, une base de données hypertexte dans le concept WWW est un ensemble de fichiers texte écrits en HTML, qui définit :

Forme de présentation de l'information (balisage);

La structure des liens entre les fichiers (liens hypertextes). Cette approche suppose la présence d'un autre composant

technologie - interprète de langue. Dans le WWW, les fonctions de l'interpréteur sont réparties entre le serveur de base de données hypertexte et l'interface utilisateur. Le serveur, en plus d'accéder aux documents et de traiter les liens hypertextes, effectue également un traitement de prétraitement des documents, tandis que l'interface utilisateur interprète les constructions linguistiques associées à la présentation des informations.

En 1990. il y avait une version zéro de HTML 0.

La première version (HTML 1.0) visait à représenter le langage en tant que tel, où la description de ses capacités était plutôt de nature consultative.

Les prévisions sont l'épine dorsale de tout système de trading, donc des prévisions bien conçues peuvent vous rendre riche.

La deuxième version (HTML 2.0) a corrigé la pratique d'utiliser des constructions de langage et est devenue la norme pour la construction du WWW.

La version ++ de HTML ++ a introduit de nouvelles possibilités de présentation d'informations et de tableaux scientifiques, et d'amélioration du style de mise en page du texte et des images.

La troisième version (HTML 3.0) rationalise toutes les innovations et formalise l'interface utilisateur du système distribué hypertexte.

En 1996. une nouvelle version du langage est sortie : HTML 3.2, qui inclut des outils de création de tableaux, des constructions de langage Java, des images cliquables (situées sur la machine cliente) et de nouveaux types de formatage de texte.

HTML est un langage textuel dans lequel des instructions de formatage, appelées balises, sont intégrées au texte d'un document.

Le processus de création d'un document HTML consiste à inclure des balises à l'intérieur d'un texte non formaté qui porte une charge informationnelle.

Les balises HTML sont des séquences de caractères commençant par un signe inférieur à (<) и заканчивающиеся знаком “больше” (>).

La plupart des fonctions de formatage en HTML spécifient des styles logiques plutôt que physiques. Par exemple, les balises d'en-tête, qui indiquent généralement des lettres plus grandes, n'indiquent pas quelle taille utiliser. Le navigateur (qui agit comme un programme client) choisit une taille de texte plus grande pour les en-têtes. Cette approche permet de se débarrasser de la plate-forme - un document créé sur un Macintosh peut être utilisé par UNIX ou Windows. L'inconvénient est que le document est différent sur différentes plates-formes.

Les navigateurs WWW fonctionnent selon les règles suivantes lors de l'analyse de phrases HTML :

Les espaces et autres caractères « invisibles » sont ignorés ;

Toutes les balises peuvent être divisées en groupes : balises de base, balises de formatage, balises de structure, pointeurs, etc. ;

Les balises de mise en forme peuvent être écrites en lettres minuscules et/ou majuscules ;

La plupart des balises de formatage sont écrites par paires. Une balise d'ouverture active l'effet et une balise de fermeture le désactive. Une paire de balises est parfois appelée conteneur, car l'effet qu'elles activent et désactivent apparaît sur le texte qu'elles contiennent. Par exemple, pour indiquer qu'une chaîne doit être imprimée en caractères gras, on écrirait :< B >Cette ligne sera imprimée en gras

Le texte à l'intérieur d'une balise de fin est toujours précédé d'une barre oblique inverse. Parmi les balises HTML de base, les exceptions à cette règle sont :< BASE >(Informations de base),< BR >(fin de ligne),< HR >(règle horizontale), et< IMG >(image). Ces balises existent en un seul exemplaire.

Chaque document HTML a des balises de bordure :< HTML >et... Cette paire de balises contient toutes les autres balises de la page Web et tout le contenu informatif du document. En fait, ils déclarent que tout le contenu du conteneur est du code HTML. Étiqueter< HTML >doit être sur la première ligne du fichier, et la balise- dans ce dernier.

Chaque document HTML contient le titre du document et son corps.

Le titre du document identifie le document. Il devrait aller juste après la balise< HTML >et commencer par< HEAD >... Le titre se termine par une balise.

Le titre du document doit contenir le titre du document et son URL de base.

Le nom du document est situé entre les balises< TITLE >et... Il est utilisé par le navigateur et le serveur Web. Le nom ne doit pas dépasser 40 caractères. Le titre du document doit être informatif, refléter le contenu du document afin qu'il puisse être identifié. Le nom apparaît dans la barre de titre d'Internet Explorer, dans les listes d'historique et dans les favoris.

L'URL de base doit être entièrement qualifiée (absolue) et contenir le protocole, l'adresse Internet et le nom de fichier. C'est indiqué dans l'étiquette< BASE HREF = “базовый_URL”>... Toutes les autres URL du document peuvent être relatives à celle de base. Par exemple, si l'URL de base est : http://www.microsoft.com/products/office/word/datasheets.html et vous devez spécifier l'URL des fonctionnalités. html situé dans le répertoire /products/office/excel sur le même serveur, vous pouvez spécifier : ../excel/features. html au lieu de taper l'URL complète.

Symboles. ./ indique que vous souhaitez remonter d'un niveau de répertoire à partir de l'adresse de base.

Avoir une adresse de base facilite le transfert d'un document vers un autre serveur, car si toutes les autres URL du document sont relatives, seul le nom du serveur dans l'URL de base doit être modifié pendant le transfert.

Corps du document contient tout le texte contenant des informations et toutes les balises HTML utilisées pour formater le texte. Le corps du document commence immédiatement après le titre et est délimité par des balises< BODY >et.

Exemple de document HTML :

< TITLE >Nom du document

< BASE HREF = “базовый_URL” >

Les balises utilisées dans le corps du document vous permettent de spécifier les éléments de balisage de texte suivants :

Début de paragraphe et fin de ligne

Styles de titre

Styles physiques - Styles logiques

Symboles spéciaux.

Liens hypertextes se compose de deux parties : un pointeur et une URL. Un pointeur est un texte sur lequel l'utilisateur doit cliquer pour se déplacer quelque part. L'URL spécifie l'adresse à partir de laquelle le navigateur téléchargera le document lorsque l'utilisateur cliquera sur le pointeur.

Les pointeurs de texte dans les navigateurs graphiques sont généralement soulignés et surlignés en couleur. Dans les navigateurs de texte pur, ils sont en gras.

N'importe quel texte peut être utilisé comme index, quelles que soient sa taille et ses caractéristiques de mise en forme. Un index peut être composé de plusieurs lettres, mots ou même lignes de texte.

Format du pointeur :

< A HREF = “ URL ”>texte d'index ,

où est la lettre A dans la balise< A HREF >signifie ancre et HREF signifie Hypertext REFerence. Tout entre les balises< A HREF = “ URL ”>etest le texte d'index qui s'affiche en caractères soulignés ou gras.

D'autres codes de formatage peuvent être utilisés en conjonction avec des pointeurs hypertexte. Par exemple:

< A HREF = “ URL ”> < I > ou alors

< I > < A HREF = “ URL ”>Passons à une présentation plus détaillée

HTML est un langage pour décrire la structure des pages Web. Les pages créées avec celui-ci ne peuvent être visualisées qu'à l'aide de programmes spéciaux (navigateurs) installés sur les ordinateurs des utilisateurs.

• L'abréviation HTML signifie H oui T poste M arkup L langage (langage de balisage hypertexte).
• N'oubliez pas que ce n'est pas un langage de programmation, c'est un langage de balisage.
• HTML utilise Mots clés balisage pour décrire la structure de la page Web.

Mots clés:

Les balises HTML sont des mots-clés ou des caractères entre crochets angulaires, par exemple ,

,

etc. Il existe deux types de balises : jumelé et Célibataire(ils sont aussi appelés vides). Les balises appariées se composent d'une balise de début et de fin, par exemple :. Le "/" après le crochet angulaire indique que la balise se ferme. Les balises simples se composent uniquement d'une balise de début, par exemple :
... Les balises ne sont pas sensibles à la casse, elles peuvent donc être écrites en majuscules et en minuscules :

Signifie la même chose que

Les balises définissent où commence et se termine l'élément HTML.

À l'aide de balises, le navigateur reconnaît la structure et la signification de votre texte, par exemple, ils indiquent au navigateur quelle partie du texte est un titre, où commence un nouveau paragraphe, ce qu'il faut souligner et où placer l'image (image ). Après avoir reçu ces informations, le navigateur utilise ses règles par défaut intégrées sur la façon d'afficher chacun de ces éléments.

Remarque : Dans notre référence HTML, vous pouvez voir les styles par défaut pour toute balise qui vous intéresse.

Sans utiliser de balises HTML, le navigateur n'affichera qu'un flux de texte solide, sans retrait, en-tête, paragraphe, etc. Pour que ce soit plus clair, considérons cela plus en détail avec des exemples.

Voici à quoi ressemble une page en utilisant des balises pour le balisage :

Boissons dans notre café

Multifruit - 100 rub.

Une boisson fruitée à base de jus d'orange et d'ananas.

Cocktail au lait - 150r.

Crème glacée crémeuse mélangée à de la pulpe de fruits.

La même chose, mais sans utiliser de balises :

Boissons dans notre café Multifruit - 100 roubles. Une boisson fruitée à base de jus d'orange et d'ananas. Cocktail au lait - 150r. Crème glacée crémeuse mélangée à de la pulpe de fruits.

Nous continuons la série d'articles sur les bases des langages web et les évolutions dans ce domaine. Auparavant, nous avons couvert les bases du langage hypertexte HTML, ses fonctionnalités et ses méthodes de balisage de texte (balises).

Nous avons également appris que le langage HTML interagit étroitement avec des développements logiciels tels que les styles CSS et Javascript et pourquoi une telle coopération de langages est nécessaire. Aujourd'hui, nous allons examiner en détail la structure de construction de documents HTML5. La structure de bloc du document, sa structure est le sujet de l'article d'aujourd'hui. Mais vous devez d'abord comprendre ce qu'est HTML5.

Le langage de programmation HTML5 (de l'anglais HyperText Markup Language) est la cinquième version du langage. Comme toutes les versions précédentes, il est conçu pour construire la structure des documents et les présenter sur le réseau. La version HTML5 est actuellement en cours de développement. L'objectif poursuivi par la création de la cinquième version de HTML est d'améliorer le langage dans le domaine de son travail avec des documents multimédias (applications audio et vidéo).

Ajout de quelques innovations syntaxiques telles que

,

,