H comme Hébergement, HTML5 (code html exemple)

H comme Hébergement, HTML5 (code html exemple). Définition par WASI, agence de création de site internet à Montauban. La 1iere partie concerne l’hébergement d’un site internet. Tandis que la 2ieme et 3ieme partie de cette page concerne le langage HTML et HTML5 avec des exemples de code HTML et des exemples HTML5. Pour finir, la 4ieme partie concernera les Doctype en HTML et HTML5.

Hébergement Internet ou Hébergement Web

L’hébergement Internet (ou hébergement Web) est ce qui permet de stocker votre code informatique. Et donc ce qui va permettre aux internautes de consulter votre site internet. Imaginez une maison et son terrain, l’hébergement est le terrain et la maison est le code informatique. Les hébergeurs (OVH, Gandi, WASI, … ) hébergent votre code informatique.

Comment choisir l’hébergement web ?

Puisque c’est une notion importante pour le référencement et pour votre site internet, je pense qu’il ne faut pas négliger cette étape dans la création de votre site internet. En effet, pour que le site web soit performant, vous devez vous assurer d’un hébergement solide et fiable. Au contraire, un hébergement de mauvaise qualité vous promet piratage et instabilité. Voire même serveur surchargé. C’est à dire un site internet inaccessible.

Quelles solutions d’hébergement web choisir ?

Ainsi, le choix de votre hébergement web pèse dans la balance. Aujourd’hui il existe beaucoup de solutions d’hébergement. Finalement, pratiquement autant que d’hébergeurs !

En bref, les hébergeurs classiques sont OVH, O2Switch et Gandi. Chacun offre des services différents. En ce qui concerne les types d’hébergement. On peut les classer en 4 catégories :

• L’hébergement sur serveur mutualisé. En réalité il s’agit d’hébergement partagé. Autrement dit sur un serveur, on partage l’espace disque. Bien entendu chacun a son répertoire, et ne peut accéder au répertoire de l’autre. Souvent pour un site vitrine sur WordPress cette solution convient très bien.
• L’hébergement VPS. Comme Virtual Private Server ou Serveur Privé Virtuel. En fait il s’agit d’un serveur virtuel. En particulier il offre plus de possibilités qu’un hébergement mutualisé. Mais moins de possibilités qu’un serveur dédié. Par exemple il permet un meilleur contrôle de son espace disque. C’est la raison pour laquelle on choisira cette solution web.
• L’hébergement sur un serveur dédié. Cette solution s’adresse aux sites internet haut de gamme. C’est à dire d’une part avec un grand nombre de pages ou d’articles. D’autre part, avec un trafic assez élevé. Le serveur vous sera entièrement dédié. Autrement dit, seul votre site internet (ou votre logiciel web) sera hébergé sur ce serveur.
• L’hébergement Cloud. En réalité, il s’agit d’une solution accessible sur internet. Indifféremment des serveurs.

Point de vigilance pour choisir son hébergement web

Vous devez choisir votre hébergement web en fonction des services qu’il offre. En effet, vous serez particulièrement vigilant à l’espace disque acheté. Mais aussi le trafic permis. C’est à dire la capacité à traiter rapidement l’information. Pour finir, le nombre et la taille de la base de données.

Quoiqu’il en soit, ne négligez pas non plus l’aspect sécurité. Sans oublier les sauvegardes et capacités de restauration de votre développement web ou site internet.

Hébergement exemple

Par exemple, parmi les plus connus on peut citer ces hébergement web : OVH, O2Switch et Gandi.

HTML

HTML est l’acronyme désignant le langage informatique permettant de créer des pages web. Il signifie « HyperText Markup Language » ou le langage de balise hypertexte. Ce langage informatique permet en particulier d’insérer des liens hypertextes, d’où le nom du langage. Il peut être complété par d’autres langages (java, javascript, …) pour offrir des fonctionnalités avancées et rendre votre site plus dynamique et surtout beaucoup plus joli 🙂

Comment créer un site web html ?

Voici comment créer un site web html :

1. Tout d’abord, vous achetez un nom de domaine, par exemple chez O2Switch ou chez OVH (voir le chapitre plus haut à propos de l’hébergement web).
2. Ensuite avec FTP Filezilla vous accédez à l’hébergement associé au nom de domaine.
3. Ici, deux solutions : la plus simple est de transférer un CMS type WordPress. Auquel cas vous devez configurer le fichier wp-config.php pour permettre au code HTML d’accéder à la base de données. Dès lors, vous pouvez vous connecter à votre site avec par exemple cette URL :

4. http://nom-de-domaine.fr/wp-admin

5. L’autre solution est de transférer directement vos fichiers statiques HTML, CSS et JS sur l’hébergement web. Bien entendu il faudra que votre code HTML, CSS et JS soient liés et structurés (cf. chapitre suivant).
6. Dans tous les cas, vous accèderez au site de cette façon :

7. http://nom-de-domaine.fr/

Quels logiciels pour coder en HTML ?

Pour développer en HTML, il est tout à fait possible d’utiliser des logiciels de traitement de texte. En particulier notepad++. Bien entendu on peut aussi utiliser des logiciels simples comme le Blocnote sous Windows. Ou encore TextEdit sous Mac. Finalement KEdit sous KDE.

En revanche, n’utilisez pas un logiciel de traitement de texte avancé. Comme par exemple Microsoft Word ou OpenOffice. En effet, ils ajoutent des données (métadonnées plus exactement) qui vont détourner (poluer!) votre code HTML.

Ensuite, vous enregistrez votre fichier sur votre ordinateur avec l’extension .html ou .htm. Pour finir, il vous suffira d’ouvrir ce fichier dans un navigateur web pour voir votre exemple de code HTML s’afficher.

Les navigateurs web sont Google Chrome, Firefox, Safari, etc.

Code HTML : un exemple général 

Alors voici un exemple de code HTML basique qui peut servir de base à la création d’un site web :

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Ma page de test</title>
  </head>
  <body>
    <img src="" alt="Mon image de test">
  </body>
</html> 

Dans cet exemple de code pour la création de sites web, nous spécifions quel est le type de document et aussi nous indiquons à l’ordinateur que contient la tête du site (« <head> ») et que contient son corps (« <body> »). Un peu comme pour nous, les balises contenues dans la tête ne se voient pas sur le site, comme nos idées ou nos opinions sont invisibles. Par contre les balises contenues dans le corps du site vont former sa structure et son apparence. Ainsi dans notre exemple, le site fera apparaitre une image, insérée par la balise <img>.

Code HTML exemple : les balises

Bien sûr, nous pourrons ajouter des titres avec les balises <h1>, <h2>, et <h3>, et des liens vers une autre page du site comme par exemple la page  » développeur wordpress à Montauban  » ou vers un lien externe grâce à la balise <a>.

En ce qui concerne les balises des titres :

Les balises <h1>, <h2>, et <h3> sont utilisées pour les titres de la page. On dit aussi que les h1 sont des titres de premier niveau. Quant aux h2, ce sont des titres de second niveau. Vous l’aurez compris les h3 sont des titres de troisième niveau. Et etc jusqu’à la balise titre h6.

<h1>Est le titre principal de la page.</h1>

Ainsi, les balises <h2>, <h3>, … servent pour les sous-titres de la page.

En ce qui concerne les balises des liens ou hyperliens :

On dit link en anglais. Pour faire un lien d’une page à une autre on utilise cette balise. Il s’agit de la balise <a>. Comme par exemple un lien vers le site WASI. Pour faire cela voici le code que l’on utiliserait :

<a href="https://www.wasi.fr>Lien vers le site wasi</a>

<!DOCTYPE html>

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>
  <h1>This is a Heading</h1>
  <p>This is a paragraph.</p>
</body>

</html>

Doctype en HTML

Qu’est-ce que <! DOCTYPE HTML en HTML?

Dans les documents plus anciens (HTML 4 ou XHTML) que le HTML5, la déclaration est plus compliquée car la déclaration doit faire référence à une DTD (Document Type Définition).

Est-ce <! DOCTYPE HTML une balise ?

Doctype en HTML4

HTML 4.01:

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

Doctype en XHTML 1.1

XHTML 1.1:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<!DOCTYPE html>

Contactez WASI pour des informations pour la créer un site web sur Montauban (code html exemple). Ou pour un devis pour la création de site internet à Montauban dans le Tarn et Garonne et départements voisins :  Caussade, Septfonds, Castelsarrasin, Bioule, etc. Par une expert wordpress Toulouse.