Olìmpo: il template xhtml/css per il tuo portfolio online
In quest’estate cosi afosa che ci siamo lasciati alle spalle (ma anche no!), per passare il tempo in un modo diverso dal solito (ah ah, bella questa!) mi sono detta: perché non preparare una bella risorsa free da rilasciare agli amici di YIW?
E soprattutto: perché non rilasciare una risorsa utile a tutti (o quasi) i web designer che vogliono progettare un loro portfolio online e per un motivo o per l’altro rimandano sempre? Perciò eccolo qui: Olìmpo, un template xhtml/css, minimal, essenziale, pulito come piace a voi.
Live Preview Olìmpo
DownloadOlìmpo è un template completamente ideato per un portfolio, per mettere in evidenza i vostri lavori in modo gradevole e semplice. La grafica è essenziale e ridotta ai minimi termini, primo per rendere il layout facilmente personalizzabile (se non sei un fan del minimal, aggiungi un’immagine in background, cambia i colori e avrai un effetto tutto nuovo! provare per credere) e secondo perché credo che in un portfolio efficace dovrebbero essere i lavori a parlare, e non una grafica eccessiva che può distrarre o apparire poco professionale.
Ma vediamo le caratteristiche del tema:
Struttura:
Il tema è allineato a sinistra, una soluzione originale, che ti dà la possibilità di giocare con un background d’effetto.
La parte superiore, contenente il logo e la barra di navigazione, è fissa e con una leggera trasparenza. La sidebar, posta sulla sinistra, è anch’essa fissa. Ovviamente potete modificare queste impostazioni agendo sul foglio di stile: la scelta di questo tipo di layout è prettamente personale…mi piaceva cosi, ecco tutto :)
Home page
In home page ho ipotizzato un piccolo testo di benvenuto sulla sinistra, giusto due righe per salutare e dire chi sei. Ho inoltre inserito alcuni progetti in evidenza: cliccando sul nome del progetto, la sezione destra della pagina scrollerà verticalmente con un effetto Javascript e metterà in primo piano il progetto selezionato. Per ogni progetto ho pensato di inserire un’immagine esplicativa, il titolo e qualche riga di descrizione.
About page
La pagina ‘about’ è pensata per descrivere chi sei, ciò che fai, i tuoi skills e le tue esperienze. Qua puoi inserire una tua foto e, nella sidebar, aggiungere una piccola testimonianza di qualche cliente soddisfatto (ti auguro di averne!) e i riferimenti ai social network.
Portfolio
Il portfolio è filterable, puoi cioè creare delle categorie da assegnare ai tuoi progetti e fare in modo che questi vengano cosi filtrati al click su una determinata categoria. All’hover sulle thumbnail viene mostrato il titolo del progetto, due righe di descrizione, e due icone che permettono la visualizzazione ingrandita dell’immagine (tramite prettybox) e l’inserimento di un link alla pagina di dettaglio del progetto.
In tale pagina potrai inserire tutti i dettagli sul progetto, senza limiti di spazio :) qua puoi essere prolisso quanto vuoi, anzi, tante più informazioni darai su ciò che fai e sul come lo fai, più possibilità avrai di convincere un ipotetico cliente che sei la persona che fa al caso suo.
Contatti
La pagina contatti contiene un modulo contatti funzionante, con controllo errori in Javascript: inserisci la tua e-mail ed è già pronto all’uso, semplice e veloce!
Conclusioni
Come in tutti i temi rilasciati da YIW, nello zip da scaricare troverai anche un manuale di supporto in pdf in cui è spiegato come personalizzare e modificare alcune sezioni del tema, cosa comunque consigliata solo a chi ha una buona base di xhtml/css.
Live Preview Olìmpo
DownloadLicenza e crediti
Il template è rilasciato sotto licenza Creative Commons Attribuzione 3.0; questo significa che sei libero di riprodurre, distribuire e modificare liberamente quest’opera.
Olìmpo by Your Inspiration Web is licensed under a Creative Commons Attribuzione 3.0 Unported License.
39 commenti
Trackback e pingback
-
./lsd - Liquid Sky Design | Graphic Design Studio
[...] potete vedere dalla grafica presentata su YIW nel relativo articolo, la struttura si presta alle modifiche piu’ audaci seppur… -
Land-of-web » Weekly Fresh Web Design Freebies – Vol. 8 (8-10-2011)
[...] 6. XHTML/CSS Portfolio [...] -
Бесплатные веб компоненты — выпуск 4 | webkladez - Полезные уроки для photoshop, wordpress, joomla
[...] CSS/XHTML шаблон для портфолио. 10. Набор тёмных веб [...]
Lavoro fantastico come sempre!
Ma grazie :)
Un ottimo lavoro come sempre, non c’è che dire. Complimenti!
Troppo buono :)
Ottimo lavoro. Nei giorni scorsi ho acquistato il suo fratellone Impero e ne sono rimasto pienamente soddisfatto (ormai è il terzo template made in YIW che acquisto, escludendo quelli free con cui “gioco”). I complimenti sono tanto d’obbligo quanto scontati :)
PS: Sono Apnea. Ho solo deciso di tornare a usare il nick che uso per “cazzeggiare” sulla rete ^_^
Grazie per la fiducia :) se acquisterai il quarto (che stiamo per pubblicare, ssssh) avrai diritto ad uno speciale premio fedeltà :D
Bello ed elegante. Complimenti. ;)
Grazie Pì :)
Come sempre, spacchi tutto, sei la mia female webdesigner preferita!
wow :)
Complimenti Sarah, molto elegante e semplice allo stesso tempo!
..proprio l’effetto che volevo :)
Brava Sara, un altro pezzo d’autore da mettere nelle risorse da utilizzare =)
P.S.: tutto bene? Passate bene le vacanze? Io ho fatto incetta dei nostri crostini =P
Ciao bedda :)
le vacanze…come sono già finite? io ancora devo iniziarle! :(
bellissimo davvero bellissimo :D
Grazie :) sono contenta che ti sia piaciuto!
Diciamo un modo “diverso” per passare l’estate?
Hai staccato la spina in modo proprio estremo a quanto vedo :D :D :D
Ottimo lavoro, complimenti
Già già, vacanze esotiche, io :D
Complimenti sara, ottimo lavoro e template ;)
Grazie Ciruzzo :)
Ho avuto modo di vederlo solo velocemente, ma wow!!!! Appena ho più tempo lo scarico e me lo “studio” :)
buono studio :)
Tutorial nuova grafica…troppi regali ragazzi…Sara è meraviglioso…un ottimo lavoro! Grazie per l’idea
Prego!
ps. A proposito di portfolio…ma tu quel famoso restyling quando lo farai? :D ti tengo d’occhio!
Bella l’idea dell’allineamento a sinistra per poter usare delle immagini di bg
Si, è tanto che ho questa fissa e non vedevo l’ora di metterla in pratica :D
Ottimo Template! complimenti. Ho però notato con IE7 che il layout è l’opposto di quello che si dovrebbe ottenere. La sidebar appare a destra, è solo un problema della versione 7 o anche sulle successive si verifica?
Grazie
Solo con la 7, perchè questo tema non è compatibile con IE7.
E’ compatibile con IE8 e IE9.
a me non funziona bene neanche con IE 8 :(
ad esempio, i menu sulla sinistra mi spariscono e la barra nera in alto non mi viene visualizzata.. IE incomincia a funzionare dalla 9 in poi
…a quanto pare ho smesso di rimandare la produzione del mio portfolio professionale….siete una meraviglia!
quanto mi piacciono le tue grafiche da 1 a 10? mmmm…almeno 15!
Grazie mille!!! Mi sono permesso di utilizzare il tuo layout per il mio portfolio e mi piacerebbe avere un tuo parere in merito… anche se è ancora in fase di perfezionamento…
http://www.alessandrovitali.it
Grazie ancora, splendido lavoro!
Innanzi tutto mi unisco al coro dei complimenti per l’ottimo utilissimo sito, ricco di informazioni importanti. Riguardo al template in questione invece, mi chiedevo se qualcuno di voi ha riscontrato problemi con il form dei contatti. A me personalmente non funziona: riempiendo i campi e cliccando su invio, non succede nulla……..
Qualche suggerimento?
Grazie..
Grazie mille!! Essendo alle prime armi mi è molto utile! Lo uso subito per il mio portfolio perchè è davvero pulito ed elegante!! Complimenti!
Sarah, fantastic work! i like it!
I only miss the next and previous button in the prettyPhoto lightbox. I dont understand why the css can´t load it?
Thank you!
Bellissimo, a mio modesto parere, questo è lo stile di un vero web designer. Grazie per aver condiviso il tuo lavoro