Realizarea unui template simplu pentru un website cu adobe photoshop cs3 – tutorial video HD

In acest tutorial video, va prezentam cum se poate realiza sau modifica un template cu adobe photoshop cs3, care ne va folosii la crearea unui site

Acest tutorial video, va fi prezentat tot de un debutant la videotutorial.ro care se numeste Alex si care demonstreaza tuturor ca la varsta de numai 15 ani poate sa faca si lucruri foarte frumoase.

Alex, este un baiat talentat la web design si nu numai care ne demonstreaza noua tuturor ca un baiat de 15 ani alege sa-si petreaca timpul,facand lucruri deosebite cu ajutorul calculatorului si nu pierzandu-si timpul doar stand pe messenger sau sa joace counter

Acest tutorial video despre adobe photoshop cs3 poate parea dificil pentru unii dintre voi dar daca sunteti atenti si il urmariti pe Alex, puteti invata multe lucruri utile si interesante pe care le puteti folosii si cu alte ocazii.
de Chirigiu Alex


Get the Flash Player to see the wordTube Media Player.


Tutoriale similare

Comentarii

  1. Super tutorialul !!! Felicitari , dar cred ca ar trebui sa incerci sa ne arati si lucruri mai des folosite de oameni in Photoshop caci multora nu le trebuie template-uri pentru site-uri ci lucruri mai simple . Parerea mea este ca tutorialul de care ai pomenit ala cu cartea de vizita ar fi interesant . Sper sa mai faceti tutoriale despre Photoshop pentru ca nu stiu mare lucru despre el dar asi vrea sa invat !

    Un sfat ar fi sa incerci sa faci lucrurile mai incet in tutorial pentru ca tu esti la u nivel mai avansat si altii mai incepatori nici nu isi dau seama de multe lucruri pe care le arati .

  2. Foarte interesant tutorialul…dar prima data ar fi trebuit sa punetzi cateva notiuni de baza…dar e fff bun tutorialul….presupun ca stii sa lucrezi si in 3dsm;)) astept un tutorial…photoshopu’ cred k e cel mai tare program de grafica…parerea mea;)) la cat mai multe tutoriale:P Bafta in continuare….poate conving si eu un prieten olimpic pe tara la informatica sa faca un tutorial despre ceva care ii place lui si ne este folositor si noua!!

  3. O idee buna Smyley ! Va rog sa faceti si voi un tutorial despre Google Chrome , Ashampo sau BitDefender .

  4. nu mia placut cum ai axplicat

  5. Bravo maestre, respect ! 🙂
    Astept cu nerabdare tutorialu` cu cartea de vizita !

    P.s.: 1. cand mai faci tutoriale incearca sa lucrezi mai incet 😀
    2. legat de cum vorbesti/explici .. ia exemplu de la Cristi

  6. Pop Adrian a zis:

    Nu te grabii 🙂 aveti prea multe materiale pe aici la un moment dat no sa mai stie lumea ce sa faca

  7. Multumesc de critici si de aprecieri

    1.Vad ca multi vor sa vada un tutorial despre carti de vizita, o sa fie urmatorul
    2.Prezentarea PS-ului, sper sa fie uploud-ata pana maine pe site, exita deja
    3.O sa vorbesc si lucrez mai incet pe viitor
    4.Daca nu intelegeti ceva, dati-mi timecode de cand apare problema si o sa incerc sa va explic

  8. te felicit alex.si apropo incurajati-l nu-l criticati.(asa din prima)felicitari.

  9. @Alex: M-as lega eu si de tine…dar mai bine lasa…sau hai totusi sa ma iau,vorbeste mai tare,mai clar…mai rar,vvorbesti prea repede,la fel te misti prea repede,cred ca mai intai trebuiau prezentate notiuni de baza ale photoshopului abia apoi o chestie atat de avansata! Sincer n-am avut rabdare sa ma uit e prea lung tutorialul si nu prea sunt pasionat de web design.Oricum BUN VENIT IN ECHIPA VIDEOTUTORIAL.RO!!!

  10. Nu mi-a placut de nici un fel modul in care te-ai explicat,am vazut multe tutoriale foarte bune pe acest site explicate intr-un mod simplu,usor ,calm,pe intelesul tuturor,si aici ma refer la Cristi care apropo face o treaba de nota 10+.Imi pare rau ca esti la inceput si nu as vrea sa te supar sau sa te dezamagesc ,dar asta e parerea mea.

  11. boby_admin a zis:

    @gyony:
    gyony iti respect parerea dar hai sa ne gandim ce faceam noi la 15 ani
    Eu unul ma jucam ……..in nisip
    Hai sa-i incurajam ca nu e atat de usor cum pare sa faci un tutorial mai ales ca l-a facut destul de lung
    Sunt convins ca o sa se perfectioneze pentru ca are un potential foarte mare

  12. Felicitari si eu astept un videotutorial despre carti de vizita dar cu o introducere la material sa fie inteles si de cei cu cunostinte mai putine in domeniu cum face Cristi.

  13. @boby_admin: sau Cristi vedeti ca tutorialul tine 121 de minute,dupa ce ajunge cam pe la jumate reincepe iarasi tutorialul,cred ca la-ti montat gresit sau de 2 ori,si se ocupa spatiu degeaba,pt ca e un tutorial destul de lung! Puteti verifica,imediat ce ajunge cam pe la jumate reincepe iarasi tutorialul,practic e de 2 ori!

  14. boby_admin a zis:

    @Adrian:
    Da Adriane ai dreptate imi place ca esti foarte vigilent
    O sa rezolvam cat se poate de repede cred ca stiu care este problema

  15. @boby_admin: O sa-mi schimb nick-ul din Adrian in Vulturul Plesuv sau The Guardian :)) Am observat-o demult dar am crezut ca are 2 parti,am vazut eu ca tine prea mult…da am zis ca …o avea 2 parti si cand am derulat mai incolo de mijloc am realizat ca defapt se repeta,cuvintele,imaginile erau aceleasi! Ca o conlcuzie va iubesc si-mi pasa de voi de asta sunt vigilent,nu cred ca e vb de vigilenta ci mai degraba de un spirit de observatie ft dezvoltat 😛 Va salut!

  16. Util tutorialul, felicitari, cu ajutorul tau mai invat scurtaturile din taste :)) Sper sa realizezi si alt gen de tutoriale legate de photoshop si de ce nu de dw.
    O sugestie, poate ar trebui sa incetinesti putin ritmul, desi se presupune ca atunci cand deja ai auzit de photoshop, ai si notiuni despre el cat de cat.
    Bafta!

  17. Baieti ma ajutati si pe mine explixati-mi si mie cum pun avatar la cometurile pe care le fac ?

  18. Apasa pe GRAVATAR si fa ce itzi spune acolo;)

  19. andolis49 a zis:

    Felicitari pt. tutorial! Si la cat mai multe. A venit la tanc!
    Daca se poate as dori un tutorial cu mse poate urca un site joomla pe un subdomeniu gratuit .ro. Mie nu mi-a reusit pe lx.ro.
    Bafta!

  20. Multumesc Smyley am facut un cont si am pus o poza dar nu imi dau seama totusi cum se pun aici pe videotutorial .

  21. @Cosmin: Aici nu setezi nici o poza…pe contul de la gravatar iti incarci poza si o adresa de mail…insa aici cand pui cometariu vezi k iti cere si mailul,ei mailul care-l pui aici cand dai comentarii tre sa fie acelasi cu cel pe care l-ai pus si pe siteul gravatar

  22. Sper ca acum va merge

  23. Nu merge man am pus aceasi adresa dar tot degeaba

  24. Gata a mers ! Mersi mult pentru ajutor .

  25. Da se vede ca te pricepi dar un pic cam repede , mai rar prietene ca nu toti stiu photoshop, iar pentru unii ca mine care sunt la inceput esti ca complicat in explicare ctrl cutare ,,ctrl cutare . etc.
    Oricum e ceva de apreciat nu vba de varsta, dar ar fi mai util sa explici si pentru unii mai tzarani ca mine.
    Succes in continuare.

  26. beb3_mykk a zis:

    da e bine e destul de ok dar mai rar e loc de mai bine pt inceput e ok:D ai vana in tine:D

  27. @Katoxy: Daca voi nu stiti sa folositi tastatura nu e vina baiatului! Am mai spus-o si o mai spun daca nu ati avea mause ati muri cu PC-ul in fata! In toate programele CTRL+C face comanda copy,CTRL+V face comanda paste,CTRL+Z face comanda undo(adik un pas inapoi) CTRL+F face comanda find(gaseste,cauta) CTRL+X face comanda cut(taie) si tot asa…de ce aveti tastatura nu ca sa o folositi? Baiatu a folosit scurtaturi asta nu inseamna ca numa prin CTRL+C poti copia o imagine ci si din mause dar e bine sa invatati si scurtaturi,functiile si scurtaturile tastaturii! Comenzile cu CTRL nu sunt valabile numai in photoshop!! ci in toate aplicatiile! hot keyuri cum li se mai spune sau scurtaturi,cautati in Google si gasiti! Te-as sfatui sa urmaresti tutorialul despre copy paste scrie sus la search „cum se foloseste copy paste” sau „cum facem copy paste” sau pur si simplu „copy paste” scrie astea sus la search in dreapta paginii noastre dai enter si o sa gasesti! O sa razi si o sa spui k stii sa faci copy paste eu bat pariu ca nu stii toate modurile in care poti face copy paste! Cu ocazia tutorialului despre copy paste o sa inveti sa folosesti si tastatura pt a face copy paste si nu doar mauseul! scurtaturi,functii din tastatura care le poti folosi in orice program!

  28. Destul de reusit tutorialul oricum la 15 ani e de apreciat chestia asta pe care o face el. Parerea mea e ca photoshop-ul nu e cel mai simplu si usor de folosit program… are multe comenzi care pur si simplu te ametesc… Cum ai invatat tu photoshop-ul Alex? Bravo tie!!!

  29. O sa vorbesc mai rar, nu mi-am dat seama ca e prea repede, dar vor fi cam lungi tutorialele
    Andrei, de pe pe youtube, apoi pur si simplu scriam photosho tutorial pe google

  30. @Andrei: mai adaug la cele spuse de Alex ca tre sa stii si ceva engleza pt ca majoritatea tutorialelor sunt in engleza!

  31. as vrea sa faci un turorial despre cum sa faci un banner daca se poate si cu butoane.de cand ma chinui sa fac asa ceva si nu imi iese mai mult decat sa scriu un test si butoanele sa fie doar textul.deci te rog frumos sa faci ca am mare nevoie.

  32. Uitati aici 2 dintre creatiile mele

    1 http://img9.imageshack.us/img9/6523/videotutorial.jpg
    2 http://img159.imageshack.us/img159/9011/34558474.jpg

    Sunt facute de mine in GIMP un editor photo free care mie-mi place foarte mult!!

  33. Nu am inteles nimic???????? .Tutorialul nu are introducere si sfarsit.Tema abordata este foarte intersanta

  34. bv frumos totorial mici greseli dar e ok majoritatea au sarit cu gura …. k nu e bn prea rapid pt mn a fost ok pt alti prea repede adevarat dar u ala care critici la 15 ani ce faceai te jucai CS:)) k mn probbil deci respect

  35. Nicu, nu inteleg ce introducere trebuie la el. E un simplu site web. Cum sa nu aiba sfarsit? Tutorialul este dus pana la ultima acctiune.
    Am inteles ca am lucrat prea repede, la urmatorul oi lucra mai incet… de obicei lucrez mai repede si nu am realizat.

  36. @Alex: cred ca sa referit la faptul ca nu ai explicat ce este ala un template,la ce foloseste…ceea ce te-as ruga si eu sa faci in viitor,sa vb putin despre ce este,ce face,la ce va folosi ce ne vei prezenta,trebuie sa iei in calcul ca unii stau mai prost cu termenii astia englezesti gen template,brush,cut…undo etc. si acum pt domnu Nicu template inseamna in termeni babesti: tema,skin,modul in care va arata pagina web,fatada…cum schimbi skinurile la winamp sau yahoo messenger cam asa si la paginile web,poti schimba modul de incadrare in pagina,tema,culorile…daca am gresit in explicarea acestui termen rog chiar pe Alex sa ma corecteze! Template inseamna Sablon

  37. Adrian, ai avut dreptate, e o macheta web. Nu m-am gandit sa explic ce va urma, dar o voi face. Merci de idee.

  38. MRcrispy a zis:

    Wow, @Adrian imi place mult a 2-a poza, se cam vad pixelii 😛 dar este de inteles, este facuta in Gimp :),
    Cat despre photoshop, eu si multi altii inca mai avem mult danonino de mancat, poate puneti mai multe tutoriale Photoshop 🙂

  39. george21 a zis:

    Nu am inteles mai nimic pt ca nu stii sa explici coerent cum o face boby si cristi celalalt.Imi pare rau daca te simti jignit dar la urmatoarele videotutoriale fii mai explicit sa inteleaga toata lumea!!

  40. Nu ma simt jignit, in schimb nu vad de ce as fii mai explicit, cand vezi in fata ochilor ce se intampla.

  41. e simplu si frumos layout`ul.. 🙂 pacat ca e copiat. se putea copia mai rpd si mai bine cu un grid, dar e bun si asa. bafta in continuare

  42. De unde e’ copiat? Ala de pe care masuram dimensiuni era facut de mine, da’ daca filmam doar sursa nu stiu cati intelegeau ceva. Daca la-i vazut pe forumul de ps, din RO, uita-te la numele userului care l-a postat, la varsta… e pus de mine acolo.

  43. @Martzy: Incearca sa faci banner cu un program numit banner maker 7. L-am incercat zilele astea si mi-a placut e foarte usor de folosit si are comenzile clare… mult mai clare decat photoshop-ul

  44. radu32 a zis:

    Felicitari!Cam greu sa tin pasul cu tine…se vede ca ai lucrat mult cu programul.Sper sa mai faci si alte tutoriale despre web design.Sunt utile

  45. super tare .. nu sunt tocmai nou in domeniu dar unele lucruri nu le stiam..si totusi cred ca tutorialul e destul de bine facut numai ca pt cei care nu le prea au cu photoshopu nu prea inteleg mare lucru dar pt cei care stiu macar cele de baza e perfect

  46. Alex , nu am reusit nici pana acum sa-mi dau seama cum ai adus tu template-ul un pannel-ul din dreapta de unde ai inceput tutorialul. As fi multumita daca mi-ai spune cum se aduce in spatiul de lucru template-ul.
    Multumesc.

  47. Roxana

    Acuma am vazut posul si o sa iti raspund.

    Ca sa aduci o imagine sau orice format suportat de PS, poti sa apesi Ctrl+O sau la file Open File. Apoi ca sa fie editabil din panoul layer trebuie sa dai dublu click pe el si ok, dupa il poti modifica. Daca tot nu intelegi intra pe chat si vorbim acolo.

  48. Marfa tutorialul dar mai explicit te rog.

  49. Shumudik: Marfa tutorialul dar mai explicit te rog.

    Photoshop-ul nu se invata din tutoriale de web-design. Si dupa cum o sa constati si celalalt tutorial despre ps este facut tot in viteza, crezand ca lucrez destul de incet. Oricum asa cum am mai zis fiind gratis eu zic ca sunt foarte bune.

  50. salut ai putea face si un tutorial in care sa explici cum se foloseste silence tool si cum sa creem un site cu pozele taiate cu silence + css si html ! ?astept un msg sau un e-mail !

  51. Salut! Am un site facut in Photoshop dar habar nu am sa il inregistrez pe GOOGLE. NU stiu cum se introduc scripturi SEO si Sitemap. Pe site este explicatii doar pentru WordPress unde platforma accepta pluginuri de acest tip.

  52. Se cam grabeste cel care prezinta acest tutorial. Ar fi indicat sa arata detaliat cum o face Cristi. Multumesc.

  53. Alin-Lucian a zis:

    Daca fac un template si il salvez HTML, si`l fac ca si tine, pot sa`l modific cu limbajul html?

  54. daddylovesyamost a zis:

    dragut, desi existau metode mai simple de plagiat cu photoshopul..felicitari oricum pentru rabdare

  55. geambasu a zis:

    mai Alex, nu esti bun de profesor.explici ca si cum cunosc deja f.bine photoshop-ul si mi-au mai ramas cateva sa le invat de la tine. invata sa ai mai multa rabdare.si ce ai facut tu, cum se poate click-ui intr-o pagina web?
    il felicit pe cristi:D

  56. am vazut tutprialul cam acum 2 saptamani. e misto dar nu are finalul…

    am sa revin punctual.

    in alta ordine de idei: fa-l mai scurt. imparte-l in bucati de 15 min maxim.
    pt fiecare chestie pe care o faci faci un microturorial. cred ca cei care nu au habar de Photoshop [nici eu nu am] ar intelege mai usor.
    anyway felicitari pt ceea ce faci. keep going 🙂

  57. Tutorialul dureaza 60 de minute,dupa se repeta..
    Eu lucrez in Ps Css 3 de ceva timp si stiu multe lucruri,dar nu am facut niciodata template,deci pot spune ca am invatat ceva nou.Multumesc Alex!

  58. costelutz a zis:

    N-am inteles nimik sincer sa fiu nu jtiu cine ar intelege cv din tutorialul asta…

  59. totul e sa ai imaginatie si rendere cu butoane si imagini si ti-l faci,mai mult m-ar interesa CUM sa o codez pt wordpress??

  60. razvan: totul e sa ai imaginatie si rendere cu butoane si imagini si ti-l faci,mai mult m-ar interesa CUM sa o codez pt wordpress??  

    Razvan ae dreptate!Am invatat foarte multe despre web design din acest tutorial(chiar daca lucrez de mult timp in photoshop) dar foarte bine ar fi daca neati invata cum sa iseram codul in wordpress si totodata sa continuati acea serie de creare a unui site.Multumesc si va ofer sincerul meu respect.

  61. Ma scuzati pt unele greseli de scriere di cometariul anterior.

  62. imi pare rau dar nu prea am inteles mai nimic 🙁

  63. foarte priceput alex, nota 10 pentru el, insa pentru tutorial nu pot acorda mult deoarece alex nu face diferenta intre prezentarea rapida a unui soft si un tutorial, care se adreseaza de cele mai multe ori celor care nu stiu multe despre program. mai ales cand este vorba despre un program de calibrul celui prezentat. va felicit pentru intentie si pentru efort insa efectul acestui tutorial este minim. sper ca o luati ca sugestie si nu ca altceva. multumesc pentru toate tutorialele din care intr-adevar poti invata.

  64. multumesc pentru tutorial dar eficienta lui este aproape zero. te grabesti alex, nu arati decta clickuri si confunzi prezentarea rapida a unui soft complicat cu un videotutorial. in rest felicitari tutror celor de la videotutorial, multumesc pentru efort

  65. foarte bun tutorialul , chiamam reusit sa.mi fac un templates pe gustul meu, nu am mai lucrat cu photo shopul , insa te rog sa faci un tutorial despre ce urmeaza de aici in colo , cum putem edita textul din templates ,activare butoane etc

  66. Hi, felicitari pentru tutorial. Am realizat un template in photoshop, cunosc programul destul de bine, insa sunt nou in domeniul webdesign, si nu am inteles concret, dupa ce termin template, dau save for web devices.. cum fac legaturile dintre pagini, actiunea butoanelor, etc. Merge cu Dreamweaver?

  67. Pe cand un nou tutorial despre dreamweaver CS5?

  68. virgilmm1 a zis:

    Salut! Am un concurs si tr sa prezint si un filmulet(am ales Sony vegas) . Prima imagine vreau sa fie mai „speciala”- as dori sa o realizez in photoshop. Ma poate ajuta cineva ? Dc da, va rog contactati-ma id: gil_parazitii sau e-mail: virgilmm1@yahoo.com .Multumesc anticipat!

  69. Nu intelegi nimic din acest tutorial , pentru un tutorial nu este explicat bine , e prea repede . Oricum gj pentru efort

Spune-ți părerea

*

ArabicBulgarianChinese (Simplified)Chinese (Traditional)CroatianCzechDanishDutchEnglishEstonianFinnishFrenchGermanGreekHebrewHindiHungarianIndonesianItalianJapaneseKoreanLatvianLithuanianMalayNorwegianPolishPortugueseRomanianRussianSerbianSlovakSlovenianSpanishSwedishThaiTurkishUkrainianVietnamese