• views: 4 143
• date: 27 February 2010
• posted by: analcafe

Introduction:

This is the start of a three-part series on building a website. This will be a real website for a musician friend of mine, who’s website I happen to ruin during a routine WordPress upgrade. In part 1, we start from absolute scratch in Photoshop, with just a few provided resources from the client. We design the homepage and skin for the site, according to new needs that the client has, the feel he wants to project, and keeping true to the tradition and history of the site.

In part 2 of this series, we begin the HTML/CSS conversion of the Photoshop mockup we created in part one. We start with a very skeletal project framework. Then we take a look at the Photoshop file layer organization. Then we start from the bottom up, creating the pieces we need from the Photoshop file and writing the HTML and CSS we need to get the job done. Much of the work isn’t actually “slicing” the Photoshop file, but looking closely at it and trying to mimic what is done there with correct markup and CSS techniques.

In part 3 of this series, we take the HTML and CSS that we have already created for this design, and convert it into a WordPress theme. We start with a completely “blank” WordPress theme, then take different parts of the HTML and put them where they need to be in the theme. We are careful to keep as much dynamic WordPress stuff in there as possible, for example, dynamically creating the menu, loading jQuery the smart way, and more.

Download HERE!:

Video 1: http://www.sharedzip.com/i7kz27cohtvj/VideoCast-71.m4v
Video 2: http://www.sharedzip.com/5vs3u7kriimv/VideoCast-72.m4v
Video 3: http://www.sharedzip.com/qho4uoc8a3xw/VideoCast-73.m4v

    Video 1
Video 2     Video 3
   

Forex Trading

Crypto Trading. 20 USD Bonus after KYC

We need your support!
Make a donation to help us stay online
        
Bitcoin (BTC)
bc1q08g9d22cxkawsjlf8etuek2pc9n2a3hs4cdrld
	
Bitcoin Cash (BCH)
qqvwexzhvgauxq2apgc4j0ewvcak6hh6lsnzmvtkem

Ethereum (ETH)
0xb55513D2c91A6e3c497621644ec99e206CDaf239

Litecoin (LTC)
ltc1qt6g2trfv9tjs4qj68sqc4uf0ukvc9jpnsyt59u

USDT (ERC20)
0xb55513D2c91A6e3c497621644ec99e206CDaf239

USDT (TRC20)
TYdPNrz7v1P9riWBWZ317oBgJueheGjATm

60 1 2 3 4 5

| Print version |

Posted by: curvax (27 February 2010 17:55) - Registered: --   |   ICQ: {icq} -------------------------   speed here http://uploading.com/files/45a57372

Posted by: behnam (27 February 2010 20:20) - Registered: --   |   ICQ: {icq} -------------------------   part1:http://vnfiles.ign.com/ects/css-tricks/VideoCast-71.flv part2:http://vnfiles.ign.com/ects/css-tricks/VideoCast-72.flv part3:http://vnfiles.ign.com/ects/css-tricks/VideoCast-73-test.mov

	Information
		Users of GUESTS are not allowed to comment this publication.