Creating a Website: From Start to Finish Part 1

Today, I’m launching my first ever screencast! Part 1 teaches you how to design a unique layout in Photoshop. This is a long screencast (about 55 minutes), so make sure you grab some snacks, and get to watching it!

I have noticed that video tutorials on making a website from scratch are extremely popular on websites such as Nettuts. Since my blog is brand spanking new, I decided to create a video series on this subject.

Please remember that this is my first screencast, so it may not be up to par with those found on other websites. Leave a comment to help me make the next videos better. I’m definitely going to improve in the following videos, so check back soon!

Running Time: 55:00

User Comments

  1. Didar

    July 21st

    Awsome vide0…please finish it all and plz show how to actually have it on the internet as a full functioning site.

  2. Dan

    July 28th

    Great tutorial but where did you get that awesome background wallpaper?? Would LOVE to have that!

  3. Apoorv

    July 28th

    Oh man, I totally forgot…there was this roundup of wallpapers of that kind in an article I found somewhere. If I find the link, I’ll let you know :)

  4. Dan

    July 28th

    If it’s 1920×1200, would you mind emailing it to me? Thanks :)

  5. Apoorv

    July 28th

    Alright, I found the roundup I was talking about; here it is http://www.hongkiat.com/blog/30-examples-tutorials-of-stunning-polar-panorama-photos/.

  6. Ronnie Roper

    August 2nd

    Great tutorial. I hope you don’t mind if I post a link on my blog to these. Think it’s a great resource.

  7. Apoorv

    August 2nd

    Thanks Ronnie! I don’t mind at all; all links are appreciated!

  8. supra

    August 3rd

    can i download this video ?

  9. supro

    August 3rd

    great, but i found some error in IE6 browser

  10. Apoorv

    August 3rd

    I don’t know how well this works, but you can try to download it from the blip.tv website (where I host it): http://blip.tv/file/get/ApoorvVaidya-CreatingAWebsiteFromStartToFinishPart1176.flv. If that doesn’t work, I’ll see if I can make it available as a podcast on iTunes or something.

    I haven’t compensated this website for IE6. Everybody’s giving it up; so am I :)

  11. DS

    August 3rd

    Very nice tutorial. Thank you!

  12. supro

    August 6th

    thz Apoorv

  13. MR HOLLYWOOD

    August 19th

    play it through to the end and then go to your C:\Documents and Settings\xxxxxxxxxxx\Local Settings\Temporary Internet Files and copy and past it in a selected folder.

  14. Face Off

    August 25th

    Need some one the show how the real website is made showing more than just html, CSS. Need to be more like build a complete website like showing example for building http://www.tutorialsgarden.com, affcros with using diffrent tedchniques. Other wise good job

  15. Apoorv

    August 25th

    How else is a “real” website made? If you could elaborate, I’d be happy to make a new screencast on it.

  16. alex

    August 27th

    I think Face Off means using PHP or ASP.NET, an JavaScript etc, to make it interactive and work with the server.

  17. Apoorv

    August 27th

    @alex @faceoff That’s way out of the scope of this tutorial, but if you check out this article, it will get you started in that direction.

  18. Catherine

    August 30th

    Why can’t I rewind this video? If I want to rewind, I have to refresh and start over!! :(

  19. Apoorv

    August 30th

    You can just click within the buffered part of the video to go back to a section you want to see again.

  20. Sizz

    September 6th

    Wicked wallpaper do you have an tutorial on how you made that?

  21. Apoorv

    September 6th

    I actually didn’t make the wallpaper, but you can download it from here: http://www.hongkiat.com/blog/30-examples-tutorials-of-stunning-polar-panorama-photos/.

  22. stron internetowych

    October 18th

    Nice tutorial. Thx a lot.

  23. Almostillmatic

    November 21st

    Ha, he’s using my favorite artist’s work as his wallpaper.

  24. necey

    November 25th

    the software your using, photoshop, what version is it and where can i download for free?

  25. Apoorv

    November 25th

    The version is CS4, and unfortunately it is not available for free. You can buy it for $700, I believe, from the Adobe website.

  26. John

    December 22nd

    Something cheaper is Photoshop Elements. Not as many features, however it does the job in most cases ;D

  27. Dennis

    February 1st

    how come you dont have any advertisers on your site. Can you use adwords or adsense on your site. Great tutorial.