Ciao a tutti,
il mio sito sotto in firma (il primo) ha un layout "anzianotto" che vorrei modificare ed aggiornare. Vorrei fare una cosa semplice e più pulita, centrale, dovendo inserire molte informazioni (catalogo siti in lingua)...cosa mi potete consigliare? ho provato dei template ma non riesco a fare una cosa che mi piaccia veramente...
hai gia' fatto un giretto nei siti che raccolgono bei layout per vedere se c'e' qualcosa in particolare che t'attira?
hai gia' un'idea dei colori da usare? il logo attuale (scritta e capitello) e' il logo ufficiale dell'azienda e percio' d'uso obbligatorio o meno?
ho dato un'occhiata agli altri siti di stucchi (a proposito: complimenti! sei il primo in lista) e personalmente mi piace molto questo stile che trovo si distacchi nettamente dagli altri, piu' pesanti (ho dato un'occhiata giusto alla prima pagina)
Ciao, grazie per la risposta, ho vito i layout e sono molto belli, ma non creo si possano utilizzare, giusto? se si come si fa?
Il sito è molto ben posizionato, siamo primi in moltissime key ed il problema è proprio quello: la necessità di cambiare la grafica passa comunque per non buttare il forte lavoro sui contenuti che abbiamo fatto per avere quelle posizioni sulle serp. Allora ce lo teniamo così...
Ovvero, come cambiare la grafica, in maniera non devastante e senza perdere posizioni su google?
Premesso che non voglio utilizzare flash, il logo non va assolutamente cambiato e i coloti più o meno dovrebbero essere quelli utilizzati (rosso scuro, tonalità grigio). Il sito a cui ti riferisci in realtà è un sito di illuminotecnica (Stucchi è il nome dell'azienda), comunque conoscendo molto bene tutti gli altri siti concorrenti sul tema. Il punto è fare una cosa diversa, graficamente pulita, ma comunque con lo stesso stile...
no, assolutamente no! mi sono espressa male ioOriginariamente inviato da Lukros
Ciao, grazie per la risposta, ho vito i layout e sono molto belli, ma non creo si possano utilizzare, giusto? se si come si fa?
come in ogni cosa, anche nel web ci sono le mode e quando si e' a caccia di idee uno dei sistemi per farsele venire e' girare tra bei layout e vedere se qualcosa colpisce: puo' essere un abbinamento di colori, un logo posizionato in maniera particolare piuttosto che angoli arrotondati o luminescenze strane, cose cosi'
la grafica non ha nulla a che fare col resto, devi solo mantenere le pagine tali e quali come url e contenuti e sei a posto;Il sito è molto ben posizionato, siamo primi in moltissime key ed il problema è proprio quello: la necessità di cambiare la grafica passa comunque per non buttare il forte lavoro sui contenuti che abbiamo fatto per avere quelle posizioni sulle serp. Allora ce lo teniamo così...
se posso fare una piccola disgressione (piccola, visto che non e' l'argomento di questa sezione), opterei per esportare in un css esterno TUTTA la formattazione in modo da velocizzare la manutenzione del sito e il cambio di look (ribadisco che quest'ultimo non ha nulla a che vedere col posizionamento)
ops! occhiata troppo veloce, chiedo scusaIl sito a cui ti riferisci in realtà è un sito di illuminotecnica (Stucchi è il nome dell'azienda)
ad ogni modo al posto tuo proverei a partire dagli elementi che sei certo di voler tenere:
-colori (bordeaux e bianco/grigio/nero)
-logo con il capitello
-layout centrato
-...
sicuramente eliminerei la greca laterale e anche l'ovale... boh, ho provato a buttar giu' un'idea al volo:
hai fatto meglio tu in massimo 15 minuti che io 15 giorni!!! Incredibile
si l'idea poteva essere una cosa del genere, magari con il rosone sullo sfondo preso da uno nostro (ns. immagine). il colore di fondo ai lati volevo fare un celeste (altro colore aziendale) e fare una copsa pulita ma impattante, forse più chiara. La greca laterale è il mio incubo, sicuramente la toglierei.
Cosa significa esportare tutto in un css (il sito ha già un css) se ho capito bene devo fare comunque una cosa pagina per pagina.
botta di fortunaOriginariamente inviato da Lukros
hai fatto meglio tu in massimo 15 minuti che io 15 giorni!!! Incredibile
ovviamente si, io ho usato un'immagine di sxc.hu tanto per provaresi l'idea poteva essere una cosa del genere, magari con il rosone sullo sfondo preso da uno nostro (ns. immagine)
io eviterei di inserire ulteriori coloriil colore di fondo ai lati volevo fare un celeste (altro colore aziendale)
piu' chiara di quello, intendi? ti e' sufficiente schiarire il colore di sfondo (che cmq manterrei appunto sul grigio)... boh, forse non ho ben capito cosa intendie fare una cosa pulita ma impattante, forse più chiara.
direi proprio di si! oltre che esser vecchio stile la trovo graficamente molto pesanteLa greca laterale è il mio incubo, sicuramente la toglierei.
questo come dicevo esula dai fini di questa sezione, percio' per approfondimenti ti pregherei di aprire eventualmente un thread qui, ad ogni modo per darti un'idea, al momento stai formattando gli elementi direttamente nei tag, perdendo cosi' la praticita' dei css che consta soprattutto nel poter stravolgere completamente il layout di un sito anche di mille pagine senza toccarne neanche una, ma lavorando solo ed esclusivamente sul file.css esternoCosa significa esportare tutto in un css (il sito ha già un css) se ho capito bene devo fare comunque una cosa pagina per pagina.
diciamo che esportare tutto rende molto pratico e veloce apportare modifiche grafiche senza dover toccare pagina per pagina e ad esempio se il colore di sfondo ti pare scuro, lo puoi schiarire con un solo comando, se rifai l'header con il logo a dx anziche' a sx lo carichi una volta e sei a posto, cose del genere
ad ogni modo la prima cosa che devi fare e' simulare il layout nel programma di grafica che usi fino a quando trovi l'abbinamento giusto e solo in un secondo tempo ti dovrai preoccupare del codice, percio' per ora puoi lasciare da parte il problema
conosco i css, li utilizzo ma magari non al massimo delle potenzialità, comunque, come mi dici un problema per volta quindi per ora non ci pensodiciamo che esportare tutto rende molto pratico e veloce apportare modifiche grafiche senza dover toccare pagina per pagina e ad esempio se il colore di sfondo ti pare scuro, lo puoi schiarire con un solo comando, se rifai l'header con il logo a dx anziche' a sx lo carichi una volta e sei a posto, cose del genere
del layout che hai inviato ho qualche domanda: come l'hai fatto con psp? direttamente in html? dremw.? è fatto con le tabelle? posso scaricarlo??
insomma di solito come procedi nel fare un layout così? io fin ora ho utilizzato o template oppure direttamente con l'html aggiungendo le immagini. Come faccio a fare una cosa simile a quella che hai realizzato?
per i colori, farei delle tonalità più chiare di grigio. Il celeste mi piaceva come sfondo ma un celeste molto chiaro tipo metallizzato.
a: grazie!!!
fatto con paint shop pro, ma qualsiasi programma di grafica va bene: su ogni livello disponi un elemento in modo da comporre la grafica finale, nella fattispecie ho:Originariamente inviato da Lukros
conosco i css, li utilizzo ma magari non al massimo delle potenzialità, comunque, come mi dici un problema per volta quindi per ora non ci penso
del layout che hai inviato ho qualche domanda: come l'hai fatto con psp? direttamente in html? dremw.? è fatto con le tabelle? posso scaricarlo??
insomma di solito come procedi nel fare un layout così? io fin ora ho utilizzato o template oppure direttamente con l'html aggiungendo le immagini. Come faccio a fare una cosa simile a quella che hai realizzato?
per i colori, farei delle tonalità più chiare di grigio. Il celeste mi piaceva come sfondo ma un celeste molto chiaro tipo metallizzato.
a: grazie!!!
- aperto un nuovo file 900x600 pixel
- riempito di grigio #7e7e7e
- aggiunto un layer
- selezionato un rettangolo di 750x600 pixel
- riempito di bianco
- aggiunto un layer
- incollato il logo copiato dal sito
- con copiaeincolla ho aggiunto le righe mancanti in modo da farlo diventare un rettangolo di 750x250 pixel
- trovato un'immagine adeguata su www.sxc.hu
- aperta nel programma di grafica
- ridimensionata e portata a scala di grigi
- ho creato un nuovo layer nel lavoro per il sito e ci ho incollato l'immagine
- ne ho abbassato la trasparenza al 35%
- con lo strumento gomma impostato a 40 di opacita', 10 di durezza e 500 pixel di ampiezza l'ho sfumata sul lato sinistro
- aggiunto un ulteriore layer
- selezionata un'area di 750x60 pixel
- riempita dello stesso rosso del logo (recuperato con lo strumento contagocce)
- resa opaca al 70%
- per prova ho anche inserito due ulteriori livelli dove ho simulato l'indirizzo in alto (bordeaux) e il menu (in bianco), elementi che eliminero' prima di ritagliare le sezioni da usare nel sito, visto che usero' testi e non immagini
- selezionata nuovamente l'area bianca del secondo livello a salire e impostata l'ombra con i parametri: v=0 o=0 sfocatura/blur=5 colore=nero opacita'=100%
a questo punto il tuo layout e' pronto e lo puoi salvare nel formato proprietario del programma che usi
per ritagliarlo e prepararlo per il sito, procederai come segue:
- salvi il lavoro con un nuovo nome (allo scopo di poter ricominciare se t'incarti
- elimini i due div dell'indirizzo e del testo del menu
- appiattisci tutti i livelli in modo che diventino uno solo
- selezioni una prima selezione che comprenda tutto l'header fin sotto la striscia bordeaux che accogliera' il menu e larga qualche pixel in piu' in modo da comprendere parte e l'altra quelle due o tre righe sfumate dell'ombra
- copi e incolli in una nuova immagine
- salvi come "header.jpg" trovando il giusto equilibrio tra peso e definizione (eventualmente prova il formato gif e vedi se rende meglio)
- torni nel file di lavoro e selezioni una fascia subito sotto l'header che sara' bianca in mezzo e sfumata ai lati; non serve molto alta, puo' bastare benissimo di 10-20 pixel d'altezza tanto per capirci
- copi e incolli in una nuova immagine e salvi come sfondo.gif
una volta creata la struttura del template (la pagina base del sito che contiene tutti gli elementi comuni), userai sfondo.jpg per lo sfondo del div contenitore che sara' largo come l'immagine (5 pixel d'ombra + 750 pixel di parte bianca + 5 pixel d'ombra) e inserirai un ulteriore div a cui non darai ne' larghezza, ne' altezza e a cui imposterai come sfondo l'immagine header.jpg
all'interno della struttura potrai aggiungere tutti i div che vorrai per contenere l'intestazione con l'indirizzo, poi sotto il menu e a seguire tutto il resto
per il passaggio dal programma di grafica all'html (su div) di solito uso programmi testuali o al massimo il blocco note (soprattutto per il css) che mi permettono di controllare bene il codice; non so dirti quali siano i passaggi passo passo con dreamweaver, sorry
edit: volendo puoi tenere intera la parte sotto dell'immagine sfumata del rosone o quel che e' e farla finire nella parte bianca; in questo caso il file header.jpg sara' alto a sufficienza per contenere l'immagine, il resto rimane uguale
Grande!!!! ho stampato il tutorial (!) e passo passo ho faticosamente prodotto il file che allego...
ora alcune domande:
1. ti piace?
2 volevo ottimizzare il sito per 1024, come faccio?
3. ho provato a settare i paramentri della pagina in html ma non riesco: come mai mi dici di usare i div? non è meglio una table settata centrale? come si imposta lo sfondo ai div, table?
grazie ancora per l'aiuto.
ottimoOriginariamente inviato da Lukros
ho faticosamente prodotto il file che allego...
ora alcune domande:
1. ti piace?
diciamo che quello "stucchi" grande non mi appassiona, ma deve piacere a te
crei una grafica larga 900 anziche' 7502 volevo ottimizzare il sito per 1024, come faccio?
per curiosita': a fare?
io apprezzo molto l'impostazione 800x600, perche' i contenuti evitano di perdersi nella pagina e le righe evitano di essere troppo lunghe da leggere, ad ogni modo e' una scelta personale: allarga le misure sei a posto
ehm... questo esula dalla sezione; io uso i div perche' mi ci trovo molto bene, ma nulla ti impedisce di usare una tabella; lo sfondo lo imposti con i css; mettiamo che il div esterno si chiami <div id="contenitore"></div>, nel css metterai #contenitore {background: url(sfondo.gif) no-repeat top center;}3. ho provato a settare i paramentri della pagina in html ma non riesco: come mai mi dici di usare i div? non è meglio una table settata centrale? come si imposta lo sfondo ai div, table?
pero' qui stiamo parlando della grafica, percio' per ulteriori approfondimenti ti pregherei di aprire un thread nelle sezioni apposite: [x]html per div e tabelle e css per i fogli di stile
Permessi di invio
Rispondi quotando