What is Digg?Sponsored by Travelzoo
Take Advantage of Ridiculously Low Holiday Airfares view!
travelzoo.com - Flights $52 and up for Thanksgiving, Christmas & New Year. But move on it now.
66 Comments
- Chunandler, on 04/23/2009, -2/+35More like how to design a big picture that looks like a website.
- inactive, on 04/22/2009, -0/+23Next tutorial: Going from this design to CSS/XHTML?
- Vulphaestion, on 04/22/2009, -4/+22I for one am not a big fan of these types of tutorials since they don't give a tutorial on coding. D:
- bellasmom06, on 04/22/2009, -4/+21I have wanted to learn this forever, usually nod off when trying to read how. THANK YOU FOR EXPLAINING SO CLEARLY.
I NOMINATE YOU TO RE-WRITE THE TAX CODE - IrvineKinneas50, on 04/22/2009, -3/+18simpe and efficient
- PlancksCnst, on 04/23/2009, -1/+15Are you kidding me?
It teaches you how to make translucent boxes; and that's about it. There's nothing about design in any way. And it's certainly not a website: it's a graphic which looks like a website. And the comments here are ridiculous: obviously spam. - Bobby1978, on 04/23/2009, -2/+14Tutorials like these are completely worthless.
What did they teach a noob exactly? Download a bunch of pre-designed textures? Change a couple values? Do a couple color changes? This isn't a tutorial, it's an instruction manual. At the end of the day, the noob would've learnt absolutely nothing. Why not give them a few tips on theory and reasoning of why such is so and so is such?
Step 11 for example could've asked folks that sites like these, with a dark navigation bars, don't look particularly interesting. A common practice thus would be to give these locations some interesting elements - in this case an indented space. A good tutorial would've taught folks that indented spaces are typically darker than its surroundings, and further explained the reasoning for other peculiar effects and elements shown. A better tutorial would've given folks some options they can try out other than the one presented. Perhaps it could be double-indented, balloon-indented, and so on. But no.
Big fail. Buried. - Rantipole, on 04/23/2009, -2/+12If you're like me, that's the /easy/ part. I can code CSS/XHTML like a pro, but I can't make it look aesthetically pleasing to save my life. Thus, a guide like this is a big help for me, so I can learn some new techniques to getting from a blank slate to a sleek design.
- Heidenreich12, on 04/22/2009, -1/+10appreciate it.... I am more about writing about things that interest me, and taxes...well....you know my answer on that :)
- Heidenreich12, on 04/23/2009, -1/+10because linking to the creators website, and saying... "this is where i found a great photo" is not credit? I must be mistaken for what providing credit is these days.
- rnawky, on 04/23/2009, -2/+9If you're like me, you downloaded Photoshop and Dreamweaver off the pirate bay and you pretend like you know what you're doing but in reality you haven't a ***** clue. Thus, a guide like this gives me hope about actually trying to use Photoshop, but after 2 hours I end up with some rendered clouds, a bunch of random filters, and a ton of wasted time.
- akurashy, on 04/23/2009, -0/+6Doesn't matter if they give you a tutorial on how to code it to html/css blah blah. if you don't practice html and css you'll still be walking in circle
- inactive, on 04/23/2009, -0/+4it's the simpe things in life that make everything worthwhile.
- cawfee, on 04/22/2009, -4/+8I'm still more of a fan of hand-building your framework in CSS & HTML via good old Notepad / EditPad. Many one-colored areas and blocks that are images, divisioned up in Photoshop, can be reconstructed as element properties and DIVs in CSS. Loads a lot faster and is easier to change should an overall design overhaul become necessary.
The two approaches work great when used hand in hand though; and any website designer should have Photoshop or at least Paint.net handy. - TDDebug, on 04/22/2009, -0/+4It would be pretty pathetic and embarrassing if you spelled a "simpe" word incorrectly on the banner for your website.
- Jibberwalk, on 04/22/2009, -4/+8Tutorial for coding:
1.) Learn code.
2.) Code. - TimTheSloth, on 04/23/2009, -1/+5I've never seen a tutorial that was more simpe and efficient than this one. Especially step 10.
- CeruleanRed, on 04/23/2009, -0/+3For those who say this tutorial is useless, consider that many professional web designers present photoshop mockups, like this one, to clients or stakeholders prior to coding to help decide how the final product should look. In many cases, though surely not all, this practice saves a great deal of time and needless work. Useless? Not necessarily.
Coming from the programming side of things, I appreciate not having to hear the stakeholder say, "Oh... I didn't think it would look like *that*."
So, thanks for the article. :) - 2experts, on 06/26/2009, -0/+3Very nice tutorial, and very easy to follow.
- pbgswd, on 04/23/2009, -2/+5I have seen too many photoshop developers who dont have a clue that the files they are publishing aren't optimised for the web. They publish out at about 4 times the KB of what they should be. Before you deploy, go over your individual img files and reduce the file size to the limit of what it can be before it starts looking lossy or artifacting. Please dont bloat my websites with your heavy designs, or I will have to fix them all later. I will think you are stupid and dont give a ***** for not caring about it. Please, think of the bandwidth, think of the kittens......
- sholt, on 04/23/2009, -0/+3Well, sure, but that kind of tutorial would have made me think.
- omnibahumut, on 04/23/2009, -0/+3Man, where can I get a job making BS posts like this?
- Protonz, on 04/23/2009, -0/+3Don't forget the lens flare!
On second thought, please do... - wibambau, on 04/23/2009, -1/+3I'll go ahead and say I noticed how much 'go ahead' was used - 22 times to be exact. Feeling the need to go ahead and watch Office Space all of a sudden.
- WiretapStudios, on 04/23/2009, -0/+2kep it simpe stupd
- ivanmarsh, on 04/23/2009, -2/+4Only $700.00 U.S. to do something you can do with a free text editor and a free image program.
- sambapati87, on 04/23/2009, -0/+2Agreed. Every website starts with PSD mockup.
- syriusblack, on 04/23/2009, -0/+2Can someone link me to a good splicing tutorial. I did the .psd and it looks good, but I dont know Html, or CSS (which apparently is what is really needed here). so a good splicing tutorial would really help me out. Graphic design degree on the way, but it will be a while, this will hold me over.
- WiretapStudios, on 04/23/2009, -0/+2You're looking for Adobe Analshop CS4.
- pbgswd, on 05/01/2009, -0/+2keep going as you are, nobody uses photoshop to develop dynamic websites. Ive never seen anybody who uses photoshop actually understand how to design markup and optimal sized images.
- BldSugrSexMagik, on 04/22/2009, -14/+16Sweet tutorial! interesting backgrounds make websites more human, nice work.
- goglobalwebs, on 05/09/2009, -0/+1With these AWESOME online tutorials, there is no reason anymore to pay for graphic or web design classes, I'm tellin' ya.
Great stuff! - mrnathan, on 04/25/2009, -0/+1Thanks for that captain obvious.
"Photoshop developers" ?? Those who make photoshop?
Im a designer, is that a "photoshop developer"? If you're an actual web designer (not just some fanboy who got his cracked copy of PS) then believe me, bandwidth consideration is pretty important when it comes to slicing; hence the handy little PS tool, 'save for web and devices' and its extensive productivity advantages. - mrnathan, on 04/25/2009, -0/+1css/html isn't web design, that's web development.
Design != coding - mrnathan, on 04/25/2009, -0/+1Web design isn't just about making A) Efficient, or B) Aesthetically pleasing sites. Web design is about ease of use, persuasive and intuitive design; targeting the user base accurately and considering their specific needs on the site; an understanding of the web-user and cognitive psychology is essential in designing an effective site.
"The two approaches work great when used hand in hand though; and any website designer should have Photoshop or at least Paint.net handy."
I'm a web designer; I live in photoshop, that's how design works ... you design stuff. Coders code.
This tutorial is ok ... but its more of a beginners PS tutorial than anything else. - bmorris, on 04/23/2009, -0/+1Grammar is spelled with an a at the end.
- clinky, on 04/23/2009, -2/+3Seriously? The text would become text when the layout got coded, it's just a Photoshop mockup atm... I really liked this tutorial, it was clearly explained with a professional outcome.
- cJw314, on 04/23/2009, -0/+1Especially if said banner got on Digg or somesuch and thousands of people saw it and made fun of it. Oh, the horror! O.O
- mrnathan, on 04/25/2009, -0/+1She needs a new job, not a new course. I'm a professional web designer and earn the same as my PHP coding counterparts. And its not a case of what takes longer, both jobs require a lot of industry targeted knowledge and expertise (incidentally the time taken on a web project differs from project to project ... often sites I'm working on take longer to code than design).
But given the way you describe her situation I'm guessing she isn't a proper web designer anyway, just someone who designs websites at work ... if you know what I mean. If she's serious about coding then HTML/CSS is a must, as this is the framework for any web content ... and other than that PHP/MySQL is essential for most sites, with javascript being handy (but most JS is in the form of libraries now, so little coding knowledge is required).
Also ... "he's not telling." ... where does she work, a pre-school!? - TetchyTony, on 04/23/2009, -0/+1My daughter does nice webpages for clients at work in Photoshop, and resents the fact that the guy who turns them into *real* webpages takes much less time and gets paid much more. What course, or integrated product, should she consider? (he's not telling).
- mrnathan, on 04/25/2009, -0/+1What an odd statement.
- rhdesigns, on 04/22/2009, -5/+6Great tutorial with good detail.
- steelclash84, on 04/23/2009, -0/+1It can, but shouldn't.
- Heidenreich12, on 04/23/2009, -0/+1actually, i have to give you props.... nice find. If this tutorial was for grammer, it definitely would have gotten points off.
- FelixDrylock, on 04/22/2009, -1/+2I can't really design websites so I'm no expert, but I tried my hand at CSS/xhtml, and I think designing a website like this with those tools is the way to go.
- pbgswd, on 04/23/2009, -0/+1its easy to make a web page ***** by making the file sizes and bumf that go along with it much larger than needed. But if you only build for websites that only have 1 or 2 unique visits a month, I guess its not a problem for you. If you have 15,000 page views a day or whatever, your fat ***** is going to clog up the intertubes. If you want big image files in your layout, suit yourself. Most of your audience is going to leave before your precious bloated image files finish loading. If that is what you want, go ahead. Time to learn about optimizing media for the web, dont you think?
- mrnathan, on 04/25/2009, -0/+1I'm a web designer ... I don't code.
- ThatWebGeek, on 04/24/2009, -0/+1CSS xhtml, maybe a little javascript via jquery and mootools. No courses needed, only google and internet connection. ;)
- digg-dugg, on 04/24/2009, -0/+1Step 1. steal an image off deviant art... wtf
- mrnathan, on 04/25/2009, -0/+1It's not about making it look 'good'; it's about making it work well; it it works well, it'll look good. This is the difference between a graphic designer and a web-designer.
-
Show 51 - 67 of 67 discussions
© Digg Inc. 2009
— Content created and posted by Digg users is