Quelques suggestions pour écrire des applications HTML hautes performances_HTML/Xhtml_Production de pages Web-tutoriel HTML-php.cn

Comment améliorer les performances d'une page Web ?

La plupart des développeurs optimiseront via JavaScript et les images, via la configuration du serveur, la compression et la fusion de fichiers - voire même l'ajustement du CSS (fusion de petites images).

Un mauvais HTML est toujours ignoré, même s'il a toujours été le langage central d'Internet.

Le HTML devient de plus en plus gros. La plupart des pages HTML des 100 meilleurs sites Web font environ 40 Ko. Amazon et Yahoo utilisent des milliers de pages HTML. Sur la page principale de youtube.com, il y a jusqu'à 3 500 éléments HTML.

Réduire la complexité du HTML et le nombre d'éléments sur une page n'améliore pas de manière significative le temps d'analyse - mais le HTML est un facteur essentiel dans la création de pages Web extrêmement rapides, s'adaptant à différents appareils et affectant le succès.
Dans cet article, vous apprendrez à écrire du HTML concis et propre, vous permettant de créer un site Web qui se charge rapidement et prend en charge plusieurs appareils, et qui sera facile à déboguer et à maintenir.

Il n'existe pas une seule façon d'écrire du code, en particulier du HTML. Ceci n’est qu’une expérience générale, mais ce n’est pas le seul bon choix.
HTML, CSS et JavaScript

HTML est un langage de balisage utilisé pour représenter la structure et le contenu.

HTML ne doit pas être utilisé pour afficher des styles et des styles. Ne mettez pas de texte dans les balises de titre (h1~h6) pour paraître « plus grand » ou n'utilisez pas d'éléments blockquotes uniquement pour l'indentation. Utilisez plutôt CSS pour modifier l’apparence et la disposition des éléments.

L'apparence par défaut des éléments HTML est obtenue grâce aux styles par défaut du navigateur : Firefox, Internet Explorer et Opera sont tous différents. Par exemple, dans Chrome, l'élément h1 est rendu par défaut à une taille de 32 pixels.

Trois principes de base :

Utilisez HTML pour exprimer la structure et CSS pour exprimer différents styles et thèmes. JavaScript pour répondre aux actions des utilisateurs.

Utilisez HTML, CSS si nécessaire et JavaScript si nécessaire. Par exemple : dans de nombreux cas, vous pouvez utiliser des formulaires HTML pour la validation et CSS ou SVG pour les animations.

Séparez CSS et JavaScript de votre code HTML. Les rendre mis en cache rend le code plus facile à déboguer. En production, CSS et JavaScript peuvent être réduits et fusionnés et doivent être inclus dans votre système de construction. Remarque* Voir le concours du système de construction (compilation) JavaScript
Structure du document

Utiliser le type de document HTML5 :

Code XML/HTMLCopier le contenu dans le presse-papiers

>
<html>
<tête>
<titre>Recettes : pesto titre>
tête>
<corps>
<h1>Pestoh1>
<p>Le pesto est bon !p>
corps>
html>

Citez le fichier CSS en haut de la page, comme dans l'élément head :

Code CSSCopier le contenu dans le presse-papiers

Ma recette de pesto
"/css/global.css"
> "css/local.css">
De cette façon, le navigateur peut précharger les styles avant d'analyser le HTML sans afficher une mise en page déroutante.
Placez JavaScript tout en bas de la page, avant la fermeture du corps. Cela améliorera le temps de rendu de la page car le navigateur peut restituer la page avant le chargement du JavaScript :

Code JavaScript