Aujourd'hui, les sites Web de qualité doivent avoir une belle apparence sur une grande variété de résolutions d'écran. Pour ce faire, il est nécessaire que les éléments de conception de page soient mis à l'échelle dans de larges limites. Cela s'applique principalement à l'en-tête du site.
Il est nécessaire
la possibilité de modifier le balisage des pages de la ressource
Instructions
Étape 1
L'utilisation d'un modèle approprié est une solution universelle qui vous permet non seulement d'étirer, mais également de compresser l'en-tête, ainsi que d'autres éléments de conception. Vous pouvez utiliser des modèles standards fournis par l'hébergement gratuit, ou distribués gratuitement sur Internet. Tout modèle nécessite une révision et une adaptation. Il est conseillé de changer tous les graphismes pour rendre le site unique. N'utilisez jamais une disposition standard. Laissez le balisage de la page - son "squelette" et sa "viande" - le contenu et les éléments de conception, remplacez-le par le vôtre. L'utilisation réfléchie des modèles vous permet de faire gagner du temps au développeur, qui peut être consacré à remplir le site d'informations ou à étendre les capacités du service.
Étape 2
Si la page est déjà composée, vous pouvez essayer d'étirer vous-même l'en-tête. Cela nécessite des connaissances de base en HTML et CSS. Si l'en-tête du site est conçu comme un seul fichier graphique, vous pouvez essayer de compresser et d'étirer son image en fonction de la largeur de la fenêtre. Cette méthode fonctionne bien si le facteur d'échelle est petit. S'il dépasse la largeur de l'image d'un quart ou plus, la qualité de l'image en souffrira. Les pixels individuels formant l'image deviendront visibles.
Étape 3
Pour que l'image reste de haute qualité, tout en occupant tout l'espace qui lui est alloué, il est nécessaire de la diviser en parties distinctes. C'est généralement le côté droit, gauche et centre. Il est souhaitable que l'image ait un fond de largeur solide, avec lequel il a été possible de combler les espaces qui se produisent entre les parties de l'en-tête. Les deux images qui forment les bords de l'en-tête doivent être fixées sur les côtés gauche et droit du conteneur. Enveloppez l'image centrale dans une balise. Créez l'espace restant avec une image d'arrière-plan d'un pixel de large.
Étape 4
Un autre moyen simple consiste à créer une image qui est intrinsèquement plus grande que le plus grand écran. L'image est définie comme arrière-plan au centre de la section d'en-tête. L'inconvénient est le "poids" important de l'image et, par conséquent, le long temps de chargement. La combinaison des méthodes ci-dessus évite la plupart des effets négatifs.