#3: Converting a Photoshop Mockup (part 3 of 3)
* 11/12/2008 — 18 Comments *
I finish up the design in part three of this series on coverting an Adobe Photoshop website mockup into an actual HTML/CSS website. This one focuses on the main content area. I create the the columns including the “quick links” section. I also talk a little bit about typography.
Running time: 32 minutes
Direct Download: High Quality, Quicktime .M4V Format (AppleTV Ready)
Links from video:
Get the Flash Player to see this player.
Loading ...
Hey!!
THANKS!! good set of video tutorials!
but, the navigation never worked for me!! … well.. until i found this piece of code NOT METIONED in the videos, that fixed the bug right away
ul#nav li {
display: inline;
font-size: 1.3em;
}
I'm sending u screen caps to your gmail.
I'll apreciate further information about this, please…
THANX AGAIN, excellent work!!
Hi Chris!
Thanks a ton for making this tutorial. I learned more by watching this than I could by doing anything else. You saved me a lot of time and explained it all in a way that agrees with my thinking (this is not an easy task, mind you). Keep up the awesome work!
I can't tell you enough how helpful this set of tutorials have been!! Keep up the good work and thanks a lot Chris!
Hey Chris! Before I run off to try this out as soon as possible, I just want to take a moment to thank you for this wonderful tutorial. The presentation was superb. The content was to the point. And the explanation of each and every small thing really helped a lot. I’m sure any web design novice looking for some good pointers to start off would find this tutorial immensely helpful!
Thanks again!
Damn. Great tutorial. I agree 1000% with what everyone else has said and I can’t wait to try all of this out for myself. Thanks again. Really, well done.
I learned more from you in an hour than I have in 3 years of trying to figure stuff out myself. Truly excellent work, sir…
Manuel Minino!!!!!!! Thank you so much for your comment woow, i was having such a big problem with internet xploder because the nav kept falling down thank you so much for posting the bug fix..WOOW Appreciate it.
btw thanks for the vid i totally learned alot..appreciate it!
Thanks a lot my friend!!!
Now I’ll start seeing the other videos.
Very nice & detailed Tutorial very helpful for a newbie like me Pls Don’t stop the good work Good WIshes & Happy New Year
Great tutorials, Chris. Very interesting to listen and watch. By the way, I also enjoyed the baloons that kept popping up in the first part, kind of added some humorous squib to it. I really enjoy such stuff (ie the organisation=everything part). Anyways, really good tutorials, great site also.
Thanks!
Awesome tutorials! I’ve learned so much by watching you’re workflow with Textmate.
I also loved this part…at 25:14….”e9bc3d…..uh, ya”
Priceless man, loved it.
Great work, Chris. I’ve been hustling for a while trying to get my confidence going that web design is something worth pursuing in spare time. You did it for me. Keep it going. Thanks.
Thanks a lot for these amazing video’s! I also learned a lot! One question though: what if you would want this footer to always extend all the way to the bottom of the screen? Some people have those 30″ Apple screens and even with a lot of content, the footer would still not be at the bottom of the page. How would you solve that?
Awesome! Thank you very much.
Yup, your website is awesome! I want to become a web designer and am trying to learn on my own. I have been visiting your site on and off for about a month and am going to start a CSS-Tricks marathon! I’m going to watch every video you have and take notes! First series down…woohoo! BTW, my site is crazy right now because I am trying to design my own wordpress theme… disclaimed!
Nice straightforward presentation. Well done.
Thanks so much! so clear and learned enough to go build my own site! best video tutorial ive ever watched