What is Digg?Sponsored by HTC
You and You and You. view!
youtube.com - You don't need to get a phone. You need a phone that gets you.
57 Comments
- subigo, on 03/25/2009, -1/+31...because PSD to HTML tutorials are so hard to find on the Internet.
- 800266622, on 03/25/2009, -2/+25I think if you found this useful and you are on digg... god damnit... this place has changed
- woofers07, on 03/25/2009, -0/+16Slice it up into hundreds of GIFs with no searchable text whatsoever, that's the how real men do it
- judicar, on 03/25/2009, -5/+18wtf ever, nothing to see here, move along.
- PhrosTT, on 03/25/2009, -2/+15step 5... open your site in IE and realize it's *****.
step 6... add a conditional css import and try to ***** it. - inactive, on 03/25/2009, -1/+10Yes but it would require more work, so why would they care?
Also 24-bit pngs + transparency would be 32-bit pngs... - PhrosTT, on 03/25/2009, -1/+9no i was looking for a tutorial that only helps with one lame layout. this was perfect.
- TubaTechno, on 03/25/2009, -1/+9Yeah, for learning how to convert THAT design.
- Antialias, on 03/25/2009, -2/+9Maybe for a small site with 1 css file, but even then it is a good practice to keep them in sub directories. Believe me, when you start working on "real" sites you'll thank me.
- koanage, on 03/25/2009, -0/+6display: none
- sluggoo, on 03/25/2009, -1/+7Next up: We'll be showing you how to boil water using only a stove and a pot full of water. Thanks for tuning in.
- Biscuitz, on 03/25/2009, -2/+8Jeez. mean bunch here. Lol
- srg13, on 03/25/2009, -0/+6Name one browser that can render photoshop's file format...
- leamanc, on 03/25/2009, -1/+7Amen to that. Same for your "img" directory and any includes, .confs, etc.
- wpjmurray, on 03/25/2009, -4/+10This is the method you'd use if it was 2004. A better tutorial would use PNGs with 24-bit transparency (and workarounds for IE), CSS tricks to replace search engine friendly text elements with graphics, and Photoshop and Fireworks tricks for working with layers and transparency.
- WhoDoneIt, on 03/25/2009, -0/+5Please explain. What would YOU suggest, oh REAL graphic designer?
- boozedrinker, on 03/25/2009, -1/+6This is for those of you that actually think the web has been built the same way since 98....don't forget your hit counter and ICQ number!
- inactive, on 03/25/2009, -0/+5WTF, I use indesign for page layout and illustrator for text and some gradient meshes but I ALWAYS use photoshop for design work.
- inactive, on 03/25/2009, -3/+8what the hell? if you wanted this you could've just used Google, but i wasn't aware most people had to go directly from PSD -> XHTML...
- mikusd, on 03/25/2009, -0/+4How else would you do it? What would be the intermediary?
- scarz99, on 03/25/2009, -0/+4Try making a good graphic only using Illustrator. Yes, it's possible, but it's a bitch. Photoshop is much better.
- MtheoryX, on 03/25/2009, -0/+4Amen.
- centran, on 03/25/2009, -0/+3Not necessary for the very simple layout the tutorial used. I could see a case for the text/graphic switch trick for the title header but the website title would be already be placed in the head of the html so it isn't really necessary.
- inactive, on 03/26/2009, -0/+3I'm not a web developer but would like to dabble a bit, so this would potentially be right up my alley. But even a nub like me can tell that this tutorial is terrible, so does anyone want to recommend a better one for this sort of thing?
- Cole2026, on 03/25/2009, -3/+6How did this get to the front page? Buried.
- Pherdnut, on 04/17/2009, -0/+2ugh... yeah I know "their"
- Gamerman39, on 03/25/2009, -0/+2Wow.. Lots of bashing!
- flashcat7777, on 03/26/2009, -0/+2Knew that would happen >.<
- rkiga, on 03/25/2009, -0/+2What a crappy tutorial. If you're going to do it that way, might as well save yourself some trouble and use fireworks/dreamweaver to do it for you. Or, if you can follow that tutorial, you'll be better off just editing a template that actually looks decent.
I remember two years ago I took a web design class and the teacher was still teaching us how to slice up pictures, and make animated gif banners...
try the beginners tutorials here when you're ready to move on from fireworks: http://www.smashingmagazine.com/2007/01/26/tutoria ... - Pherdnut, on 04/17/2009, -0/+2Please stop calling it slicing. It makes the people who just cut 'em up and slap 'em into tables think they're way is current rather than horrifying.
Markup could be cut down a lot. I see a content div, a list for the navigation, the content image, and the paragraphs. You don't need anything else for that layout and the image and li elements are the only things that need to be floated. Learn to use background images. - anythingremains, on 03/28/2009, -0/+2Jesus, everyone's so angry over here. You'd think this is an article about Converting a PSD to Cannibalism or something.
- Pucciarelli, on 03/25/2009, -0/+2Anyone else think this was going to explain how to automatically convert PSD to HTML? This is just a tutorial on chopping an image.
- artey, on 03/25/2009, -0/+2But I personally prefer these tools to save time indenting the code manually. These organizers indent your code safely without breaking anything at all.
- toxicityj, on 03/25/2009, -0/+2I've worked on plenty of "real" sites with many css files and keeping them all in the root directory works fine for me. It's really not that difficult to keep track of where your CSS files are mixed in with your other files.
- theblt, on 03/25/2009, -0/+2Have you taken a look at Fireworks CS4? It's much better than you may have remembered. I'm not saying you could design an entire site without opening up Photoshop but it ain't your Macromedia Fireworks.
- artey, on 03/25/2009, -1/+3...for a few lines, yes, but not if the html and/or css is huge and complex.
- theblt, on 03/25/2009, -0/+2@artey No..you should be able to keep your XHTML and CSS clean, even if it's huge and complex. Web developers do it everyday.
- mikusd, on 03/25/2009, -0/+1Yeah, antialias is right. The tiny bit of time you save by not having to type ../ turns into wasted time scrolling through your directory tree looking for that elusive css file. I normally have my CSS parsed by php in the actual application, so it makes it even easier going from design -> application by having those files in a directory from the get-go (i can just dump them in place inside the framework)
I do agree though, there really is no substitute for experience in CSS/XHTML. I have friends who nag me constantly about their CSS quirks, and more often then not I guide them rather than just fix it for them. - listrophy, on 03/25/2009, -2/+3Ah, the nostalgia. Look at what Ron Paul, Anonymous, and MrBabyMan (posts by him and about him) have done my poor old digg. *sigh*
- pellejo, on 03/25/2009, -2/+3wow must of those steps are wrong...
- mikusd, on 03/25/2009, -1/+2or just keep it neat yourself...
- inactive, on 03/25/2009, -2/+3Making the images to construct the template. In this case you're making slices.
Plus, I don't know if it's just me but i tend to use Photoshop for basic layout and seeing how things look, not actual designing. - darkosh25, on 03/25/2009, -1/+2I'm from Croatia. :(
- Matt2k, on 03/25/2009, -2/+2Learning by example is a good way to learn a topic. Not everything should be in generalities.
- bwishey, on 03/25/2009, -2/+2Could they have picked a simpler layout?
- IvesMozart, on 03/25/2009, -4/+4WOW Massive CSS reset. You won't use 1/3 of all those tags LOL
- flashcat7777, on 03/25/2009, -3/+2And by "real men" I presume you mean freelancers.net members from Croatia.
- artey, on 03/25/2009, -4/+3..and use xhtml formatter (www.pseltd.com/xhtml_intro.aspx) and CSS organizer (www.styleneat.com) to keep things organized.
-
Show 51 - 59 of 59 discussions
© Digg Inc. 2009
— Content created and posted by Digg users is