El principi de "ser rebut per la roba" és cert no només per a les persones, sinó també per als llocs. El vestit del lloc és el seu disseny. I és el disseny el que determina la impressió que té el visitant en els primers segons de visualització del recurs. Aquesta impressió és especialment important perquè determina el seu comportament futur. El primer element de disseny que veu tot usuari que visita el lloc és la seva "capçalera". La tapa és la cara del recurs web. Per tant, tots els dissenyadors web novells volen primerament aprendre a crear capçaleres de llocs.
Necessari
- - accés a Internet;
- - navegador modern;
- - editor de gràfics ràster (GIMP, Photoshop);
- - opcional: editor de gràfics vectorials (CorelDraw);
- - opcional: entorn de modelatge 3D (Blender, 3DStudio);
- - opcional: full de paper, llapis o bolígraf.
Instruccions
Pas 1
Desenvolupeu un concepte per a la futura capçalera del lloc. L’ideal seria que el concepte es basés en la idea original. Quan falten idees, es pot obtenir inspiració analitzant bones solucions existents. Reflecteix el resultat de la investigació creativa en forma d’esbós en un tros de paper. L'esbós ha de reflectir l'estructura de la futura capçalera del lloc amb la indicació de llocs i zones "de goma" plens d'imatges. En aquesta etapa, és una bona idea pensar en un esquema de colors aproximat per al disseny de la capçalera.
Pas 2
Seleccioneu la mida de la capçalera. En realitat, val la pena definir clarament només un dels seus paràmetres: l'alçada. Com a regla general, l'alçada de les capçaleres del lloc és fixa i no depèn de la resolució lògica que afecti els paràmetres de visualització dels tipus de lletra. En altres paraules, heu de triar un valor per a l'alçada de la capçalera en píxels. En aquest cas, té sentit tenir en compte la possibilitat de col·locar banners o blocs de publicitat contextual a la capçalera. Pel que fa a l'amplada, haureu de determinar el valor mínim, ressaltant almenys una àrea de "goma" que permet adaptar la capçalera a diferents mides de la pàgina web.
Pas 3
Creeu una plantilla de capçalera en un editor de gràfics. En un document nou, afegiu una capa transparent a la qual arrossegarà l'esbós segons els paràmetres geomètrics seleccionats. L'altura de la capa ha de coincidir amb l'alçada de la capçalera. L'amplada es pot prendre com a arbitrària, però més gran que la mida mínima, deixant espai per a zones de "cautxú" horitzontals. "A la plantilla, designeu zones de mides fixes i variables, zones destinades a omplir-se d'imatges estàtiques, imatges de fons.
Pas 4
Cerqueu o creeu imatges estàtiques per col·locar-les a la plantilla de capçalera. El logotip i alguns elements únics es poden crear en un editor de vectors o entorns de modelatge 3D. És molt fàcil trobar imatges temàtiques en fotobancs gratuïts a Internet.
Pas 5
Inseriu el fons, el logotip i les imatges estàtiques a la plantilla de capçalera del lloc en un editor de gràfics. Afegiu el fons i cada imatge a una capa transparent independent. Organitzeu les capes de la millor manera. En moure imatges en capes, aconseguiu el seu disseny perfecte, corresponent a la plantilla creada anteriorment.
Pas 6
Deseu la imatge de capçalera resultant. Deseu el projecte de treball en el format natiu de l'editor gràfic. A continuació, deseu la imatge de capçalera aplanada en un format sense pèrdues (per exemple, PNG).
Pas 7
Creeu una plantilla de capçalera HTML si cal. Obriu la imatge aplanada a l’editor. Retalleu imatges que corresponguin a àrees de mida fixa. Dels llocs corresponents a les àrees de "goma", retalleu les imatges d'1 píxel d'ample. Deseu totes les imatges al disc. Dissenyeu la capçalera HTML mitjançant les imatges desades.
