Devo creare l'header del mio nuovo portale

pchs

Devo creare l'header del mio nuovo portale

Salve a tutti, finalmente credo di aver trovato un forum di utenti validi esperti

Dopo circa 10 mesi di utilizzo di mkportal come portale per il mio sito www.pchs.it ho deciso di dare uno svolta alla home del mio sito creandola da zero, anche percò a meno di 1 anno dovrei essere un Dott. Informatico per cui dovrei essere più che capace a realizzare un portale web da zero.

Il punto è che sono sempre stato abituato a modificare codice, ma mai ad iniziare da 0 per cui ora sono bloccato sulla prima fase che riguarda la realizzazione di un sito web: il layout o per meglio dire solo l'header in quanto l'intera struttura del sito gia l'ho buttata giu su un foglio.

Quali colori devo utilizzare per il mio header?
Cosa utilizzare come logo?
Quali colori scegliere?

L'header me lo immagino come una "striscia" orizzontale alta all'incirca 100px che abbia uno sfondo di qualche colore diverso dal bianco, un logo di medie dimensioni sulla sinistra (LOGO che non so come realizzare perchè non ne capisco nulla di grafica) ed una scritta o banner alla sua destra.

Qualcuno sarebbe in grado di dare un mano alla realizzazione di questa mia idea? Magari delucidandomi con qualche tutorial o quale esempio ?

Grazie mille!

giorgiotave

Ciao pchs,

ti sposto nel Forum Grafica dove potrai ricevere le risposte che cerchi

pchs

Eh si, hai ragione... io mi confusi a postare ... Grazie!

mirko.d.isidoro

Ciao pchs, di seguito di indico alcuni spunti da consultare per le domande che hai posto:

01. Riguardo la scelta dei colori:

Regole base: la grafica rgb e cmyk.
Alcune nozioni da conoscere.

Suggerimenti e risorse per la scelta dei colori per il web.
Una serie di 3 articoli che consigliano secondo il mio parere, come orientarsi per la scelta dei colori attraverso l'uso di tool on line e suggermineti personali.

Primo articolo: Utilizzo dei colori per il web;
Secondo articolo: I** colori per il web - buon senso e accessibilità**;
Terzo articolo: Suggerimenti per la scelta dei colori per il web;

02. Riguardo la realizzazione del logo:

Creare un logo: esperienze personali;
Ci si trova davanti al pc, con il “foglio bianco” del tuo programma di grafica preferito, pronti per iniziare:
e adesso?

Creare un logo: impatto grafico e originalità.
Alcuni punti che tengo in considerazione per la realizzazione di un logo.

Creare un logo: una scorciatoia mentale.
I simboli grafici attraverso le icone sono “scorciatoie mentali”, come la casa che rappresenta la famiglia o l’ombrello che raffigura un senso di protezione/riparo...

Se hai bisogno di font gratuiti da utilizzare per il tuo logo ti consiglio:

urbanfonts.com;
una vasta **raccolta di font gratuiti **suddivisi in ordine alfabetico ed in categorie.
recensione del sito.

[URL="www.dafont.com"]dafont.com;
Sono presenti (fino ad oggi) oltre 6000 font divisi per categorie e in ordine alfabetico, con una navigazione molto semplice ed intuitiva.
recensione del servizio.

Typetester.
Un’applicazione online che permette di confrontare diversi font su schermo, scegliendo varie impostazioni, dal colore alla spaziatura fra caratteri.
Recensione del sito.

03. Riguardo la scelta del layout (anche dell'header):
Se ti interessa avere delle ispirazioni puoi consultare anche i seguenti articoli:

Ispirazioni per web designer: webcreme.com

panoramica sul web design.

Altri consigli su dove trovare ispirazioni.
Una risorsa utile per trarre spunti e idee per la realizzazione di siti e/portali: joomlaform.com.

pchs

Mirko grazie per le tue segnalazioni. Praticamente ho letto tutte le pagine da te l9inkate e posso dire che ora ho le idee un pò più chiare rispetto a prima, specialmente sul campo font.

Praticamente vorrei un header 700 * 80 px che abbia uno sfondo celeste un pò scuso che vada a schiarire verso destra in un celeste molto chiaro (quasi bianco) con sopra la scritta/logo del mio sito sulla sinistra e magari un banner o un mio motto sulla destra.

Siccome vorrei che la mia home page sia leggerissima vorrei che solo la scritta sia caricata come immagine (in quanto ho intenzione di utilizzare qualche font particolare) mentre vorrei che l'effetto sfumatura sia fatto con css. E' possibile farlo? In che modo?

Grazie delle info!

mirko.d.isidoro

@pchs said:

Mirko grazie per le tue segnalazioni. Praticamente ho letto tutte le pagine da te l9inkate e posso dire che ora ho le idee un pò più chiare rispetto a prima, specialmente sul campo font.

Mi fa piacere che le informazioni presenti su blographik ti abbiano aiutato.

@pchs said:

Praticamente vorrei un header 700 * 80 px che abbia uno sfondo celeste un pò scuso che vada a schiarire verso destra in un celeste molto chiaro (quasi bianco) con sopra la scritta/logo del mio sito sulla sinistra e magari un banner o un mio motto sulla destra.

Siccome vorrei che la mia home page sia leggerissima vorrei che solo la scritta sia caricata come immagine (in quanto ho intenzione di utilizzare qualche font particolare) mentre vorrei che l'effetto sfumatura sia fatto con css. E' possibile farlo? In che modo?

Grazie delle info!

Tutto ciò che hai in mente si può realizzare tramite css.
Per il font come immagine hai già il materiale di cui ti ho parlato precedentemente.

Per l'effetto sfumatura puoi applicare allo sfondo un'immagine che viene caricata da un css.

Es.
Hai deciso di realizzare un header di 700 x 80, con sfumature che vanno dal celeste al bianco.
OK.
Ti consiglio di realizzare l'immagine di questo header con le dimensioni citate e richiamare il file tramite qualche riga di css.

Mettiamo che l'immagine che hai realizzato si chiami bg2.gif ed è presente nella cartella immagini sul tuo sito.

Di seguito il codice css per inserire l'immagine come sfondo all'interno del file esterno che potremo chiamare stile.css:

[INDENT]#header {
width: 700px;
margin: 0 auto;
height: 80px;
padding: 0;
background: url(immagini/bg2.gif) no-repeat;
}[/INDENT]

Una volta salvato il file css con questo codice inserisci una DIV all'interno della pagina xhtml come la seguente:

[INDENT]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<body>

</body>
</html>

[/INDENT]

Spero di essere stato abbastanza chiaro.

Fammi sapere se riesci a realizzare il tuo header.

Mik.

pchs

Grazie dei consigli, ma l'header gia l'avevo creato, più o meno come hai detto tu, ma con qualche piccola modifica per rendere i lati curvi. Naturalmente non sono riuscito minimamente a crearmi un loghetto per cui sto chiedendo un pò una mano in giro perchè dopo 3 ore passate davanti al pc a scegliere font ecc... non sono riuscito a combinare niente...

mirko.d.isidoro

Ok, ho notato che già altri ragazzi ti stanno dando una mano nella realizzazione del tuo logo.

Un consiglio: Se vuoi imparare ad usare programmi di grafica e vuoi ottenre dei buoni risultati devi realizzare lavori di tuo pugno...c'è anche più soddisfazione a

Per esperienza personale ti suggerisco di non fermarti alla realizzazione di un unico logo, prova a farne 3 completamente diversi l'uno dall'altro, poi scegli.

Mik.

pchs

Il punto è che non posso imparare i programmi di grafica perchè gia tra l'ultimo anno di università, la realizzazione di un nuovo sito completamente creato da zero, e il mantenimento del mio attuale sito www.pchs.it; + i lavori che faccio per alcune persone del mio paese, non avrei un briciolo di tempo per imparare anche i programmi di grafica...
Preferisco, nel tempo libero, concentrarmi completamente per approfondire la mia cultura nel campo di XHTML, CSS, PHP e SEO....

Mi farebbe anche piacere, se avresti un pò di tempo, di vedere anche un tuo loghetto...:P Ne sarei felice... sempre se hai tempo...

Grazie!

mirko.d.isidoro

@pchs said:

Il punto è che non posso imparare i programmi di grafica perchè gia tra l'ultimo anno di università, la realizzazione di un nuovo sito completamente creato da zero, e il mantenimento del mio attuale sito www.pchs.it; + i lavori che faccio per alcune persone del mio paese, non avrei un briciolo di tempo per imparare anche i programmi di grafica...
Preferisco, nel tempo libero, concentrarmi completamente per approfondire la mia cultura nel campo di XHTML, CSS, PHP e SEO....

Mi farebbe anche piacere, se avresti un pò di tempo, di vedere anche un tuo loghetto...:P Ne sarei felice... sempre se hai tempo...

Grazie!

Scusami pe il ritardo nella risposta ma come tu hai evidenziato il tempo è tiranno.

Se non vuoi smanettare con un programma di grafica posso consigliarti un sito che **realizza il tuo logo in 2 secondi **seguendo lo stile web 2.0.

Link: http://msig.info/web2.php

Non puoi ovviamente effettuare modifiche ma il risultato è gradevole.