HOME | DD

detrans — Photoshop Web Layout Tutorial

Published: 2010-01-16 05:21:34 +0000 UTC; Views: 91131; Favourites: 1384; Downloads: 4175
Redirect to original
Description Professional Photoshop Web Layout Tutorial.

I call it: "silence tutorial" because of no time adding a description. Sorry about that...

But, observing the Photoshop tools and layers (effects), it is quiet obvious how it was done.

Result: [link]

Materials:
Background: [link]
Flower: [link]
Bee: [link]

Full-size: [link]

Enjoy, +fav and share.

...
Related content
Comments: 176

Fya-no-Hi [2011-02-15 10:40:35 +0000 UTC]

Are Text's layers and Gradient buttons's layers ( included their Style ) saved as .jpg to put in HTML file ?

👍: 0 ⏩: 1

detrans In reply to Fya-no-Hi [2011-02-16 14:27:49 +0000 UTC]

better in transparent .png (24)
for fonts you can use html font embedding/replacement:
cufon, @font face, sIFR etc.

👍: 0 ⏩: 1

Fya-no-Hi In reply to detrans [2011-02-17 12:12:23 +0000 UTC]

Oh, thank you ^^

👍: 0 ⏩: 1

detrans In reply to Fya-no-Hi [2011-02-17 12:28:18 +0000 UTC]

ur welcome

👍: 0 ⏩: 0

FrillyPinkMonster [2011-02-14 19:12:29 +0000 UTC]

This is awesome. The site looks so clean and professional plus the tutorial itself has some great hints.

👍: 0 ⏩: 1

detrans In reply to FrillyPinkMonster [2011-02-14 23:39:18 +0000 UTC]

thanks

👍: 0 ⏩: 0

DaRomano [2011-02-10 10:01:44 +0000 UTC]

Thanks a lot for sharing your knowledge

Really appreciated to find this

👍: 0 ⏩: 1

detrans In reply to DaRomano [2011-02-10 10:53:28 +0000 UTC]

I am glad you liked it,
check out this one too: [link]

👍: 0 ⏩: 1

DaRomano In reply to detrans [2011-02-10 11:18:19 +0000 UTC]

Well done, many thanks again

👍: 0 ⏩: 0

bobitalizuca [2011-02-06 17:44:09 +0000 UTC]

i try this but is not work

👍: 0 ⏩: 1

detrans In reply to bobitalizuca [2011-02-06 19:26:49 +0000 UTC]

doesn't work?

👍: 0 ⏩: 1

bobitalizuca In reply to detrans [2011-02-06 19:31:36 +0000 UTC]

yes is too hard for me y wish to start whit some easy

👍: 0 ⏩: 1

detrans In reply to bobitalizuca [2011-02-06 19:37:21 +0000 UTC]

[link]

👍: 0 ⏩: 1

bobitalizuca In reply to detrans [2011-02-27 07:47:24 +0000 UTC]

ty :*

👍: 0 ⏩: 0

jerrythemouz [2011-02-05 15:02:42 +0000 UTC]

Thanks! This is a very good tutorial. Good job!

👍: 0 ⏩: 1

detrans In reply to jerrythemouz [2011-02-06 08:22:31 +0000 UTC]

thanks

👍: 0 ⏩: 0

Shauncy [2011-01-27 02:29:16 +0000 UTC]

I'm a beginner with layouts ,but this helped guide me into making my own first layout. I did very well ,if I do say so myself. Thank you for this very well illustrated tutorial.

👍: 0 ⏩: 1

detrans In reply to Shauncy [2011-01-28 16:08:58 +0000 UTC]

I am glad it helped you...

👍: 0 ⏩: 0

Magableh In reply to ??? [2011-01-24 09:01:51 +0000 UTC]

amazing gd job

👍: 0 ⏩: 1

detrans In reply to Magableh [2011-01-28 16:09:47 +0000 UTC]

thanks

👍: 0 ⏩: 1

Magableh In reply to detrans [2011-01-29 08:05:52 +0000 UTC]

most welcome

👍: 0 ⏩: 0

MinMoon [2010-12-13 16:48:48 +0000 UTC]

so nice I love it

👍: 0 ⏩: 1

detrans In reply to MinMoon [2011-01-11 13:50:23 +0000 UTC]

thx

👍: 0 ⏩: 0

strawberryspider [2010-12-10 04:19:36 +0000 UTC]

Lovely tutorial! The select>gradient is something I use in drawing but for some reason I never thought of it for buttons etc. Ha! So that's a brilliant tip

👍: 0 ⏩: 1

detrans In reply to strawberryspider [2011-01-11 13:51:01 +0000 UTC]

am glad you like it

👍: 0 ⏩: 0

downsidaz [2010-11-27 19:54:57 +0000 UTC]

well done!

👍: 0 ⏩: 1

detrans In reply to downsidaz [2010-11-28 15:38:11 +0000 UTC]

thanks!

👍: 0 ⏩: 0

noisekick91 [2010-11-26 22:19:57 +0000 UTC]

never seen a goddamn nice masterpiece like this
sooo awesome!

👍: 0 ⏩: 1

detrans In reply to noisekick91 [2010-11-28 15:38:45 +0000 UTC]

thx again

👍: 0 ⏩: 1

noisekick91 In reply to detrans [2010-11-28 15:42:21 +0000 UTC]

extremely welcome

👍: 0 ⏩: 0

MissToofe [2010-11-08 10:20:25 +0000 UTC]

Good tutorial. I don't often see weblayout tutorials with a professional looking like this..please do more

👍: 0 ⏩: 1

detrans In reply to MissToofe [2010-11-11 18:10:38 +0000 UTC]

thanks, I will ... I will

👍: 0 ⏩: 0

FaustDesigns [2010-09-03 04:58:01 +0000 UTC]

Simple,Clean,Eye Catching great layout and nice tutorial

👍: 0 ⏩: 1

detrans In reply to FaustDesigns [2010-09-06 16:14:08 +0000 UTC]

thanks

👍: 0 ⏩: 1

FaustDesigns In reply to detrans [2010-09-07 08:58:26 +0000 UTC]

your welcome

👍: 0 ⏩: 0

gresmith [2010-08-20 18:22:52 +0000 UTC]

thank you !! i love u works..!

👍: 0 ⏩: 1

detrans In reply to gresmith [2010-08-27 07:01:20 +0000 UTC]

I am glad you like them

👍: 0 ⏩: 0

Pure-Flake [2010-08-20 15:57:48 +0000 UTC]

i freaking love you!! You inspired me! your gallery is just awesome x] and this tutorial made my day

👍: 0 ⏩: 0

Hanabiiro [2010-08-20 10:03:21 +0000 UTC]

Thank you so much for such stunning web-layout tutorial

👍: 0 ⏩: 1

detrans In reply to Hanabiiro [2010-08-27 07:20:47 +0000 UTC]

ur welcome

👍: 0 ⏩: 0

Killer-Flamingos [2010-07-06 06:25:20 +0000 UTC]

Quick and to the point, just how I like it.
Or at least that's the impression I got from this.

Thanks bro.

👍: 0 ⏩: 1

detrans In reply to Killer-Flamingos [2010-07-07 21:10:41 +0000 UTC]

ur welcome
I agree, I also like the as simple as possible tuts

👍: 0 ⏩: 0

yai-monster [2010-06-27 17:02:57 +0000 UTC]

thank u ..at last i found a easy to understand tutorial

👍: 0 ⏩: 1

detrans In reply to yai-monster [2010-06-29 17:54:16 +0000 UTC]

ur welcome

👍: 0 ⏩: 0

zee7 In reply to ??? [2010-06-09 21:49:56 +0000 UTC]

well described man, nice job

👍: 0 ⏩: 1

detrans In reply to zee7 [2010-06-11 13:41:47 +0000 UTC]

thankx

👍: 0 ⏩: 0

j4v4di In reply to ??? [2010-06-04 18:19:00 +0000 UTC]

Nice... !!!

👍: 0 ⏩: 1

detrans In reply to j4v4di [2010-06-04 19:13:24 +0000 UTC]

thx

👍: 0 ⏩: 0

Ton-K300 [2010-05-16 12:00:34 +0000 UTC]

Excellent!

👍: 0 ⏩: 0

Miztliyuma In reply to ??? [2010-05-12 18:51:35 +0000 UTC]

Woooow, Beautiful

👍: 0 ⏩: 0


| Next =>