Com Estirar Una Capçalera En Un Lloc Web

Taula de continguts:

Com Estirar Una Capçalera En Un Lloc Web
Com Estirar Una Capçalera En Un Lloc Web
Anonim

Avui en dia, els llocs web de qualitat han de tenir un bon aspecte en una gran varietat de resolucions de pantalla. Per fer-ho, és necessari que els elements de disseny de la pàgina s’escalin dins d’amplis límits. Això s'aplica principalment a la capçalera del lloc.

Com estirar una capçalera en un lloc web
Com estirar una capçalera en un lloc web

És necessari

la possibilitat de canviar el marcatge de les pàgines del recurs

Instruccions

Pas 1

L’ús d’una plantilla adequada és una solució universal que permet no només estirar, sinó també comprimir la capçalera, així com altres elements de disseny. Podeu utilitzar plantilles estàndard proporcionades per allotjament gratuït o distribuïdes lliurement a Internet. Qualsevol plantilla requereix revisió i adaptació. És recomanable canviar tots els gràfics per fer que el lloc sigui únic. No utilitzeu mai un disseny estàndard. Deixeu el marcatge de la pàgina: el seu "esquelet" i "carn": el contingut i els elements de disseny, substituïu-los pel vostre. Un ús reflexiu de les plantilles us permet estalviar temps del desenvolupador, que es pot dedicar a omplir el lloc d’informació o a ampliar les capacitats del servei.

Pas 2

Si la pàgina ja està composada, podeu provar d'estirar la capçalera vosaltres mateixos. Això requereix coneixements bàsics d’HTML i CSS. Si la capçalera del lloc està dissenyada com un únic fitxer gràfic, podeu provar de comprimir i estirar la imatge en funció de l'amplada de la finestra. Aquest mètode funciona bé si el factor d’escala és petit. Si supera l'amplada de la imatge un quart o més, la qualitat de la imatge es veurà afectada. Els píxels individuals que formen la imatge es faran visibles.

Pas 3

Perquè la imatge es mantingui d’alta qualitat, però al mateix temps ocupi tot l’espai que se li assigna, cal dividir-la en parts separades. Aquest sol ser el costat dret, esquerre i central. És desitjable que la imatge tingui un fons d’amplada sòlida, amb el qual sigui possible omplir els buits que sorgeixen entre les parts de la capçalera. Les dues imatges que formen les vores de la capçalera s’han d’adjuntar als costats esquerre i dret del contenidor. Emboliqueu la imatge central en una etiqueta. Pareu l’espai restant amb una imatge de fons d’un píxel d’amplada.

Pas 4

Una altra manera fàcil és crear una imatge que sigui intrínsecament més gran que la pantalla més gran. La imatge es defineix com a fons al centre de la secció de capçalera. L'inconvenient és el gran "pes" de la imatge i, com a resultat, el llarg temps de càrrega. La combinació dels mètodes anteriors evita la majoria dels efectes negatius.

Recomanat: