Website Design Tutorial: Photoshop to HTML5 and CSS the Right Way – Part I

By | 30th August 2017
Website Design Tutorial: Photoshop to HTML5 and CSS the Right Way – Part I

Learn how to create a website from start to finish. We start designing our website in Photoshop using the 960.gs framework, eventually making our way to Notepad to put our designs to work.

Music by Dan-O at DanoSongs.com

I have already done a tutorial series on creating a website, but that was a very basic take on HTML and CSS.

No, I wasn’t sad or sick. I was lacking privacy today so I was trying to keep my voice down.
Video Rating: / 5

20 thoughts on “Website Design Tutorial: Photoshop to HTML5 and CSS the Right Way – Part I

  1. Adrien Limar

    There are many components to how to use photoshop. One place I discovered which succeeds in merging these is the Trevs Photo Blueprint (check it out on google) without a doubt the best plan that I have ever heard of. look at all the unbelievable information.

    Reply
  2. CalGaming

    how do i get the Psd to open up? it keeps giving me a blank page 🙁

    Reply
  3. Benjamin Ndlovu

    Hi There, good tutorial, but I can't get to make my div to be on a single line instead of underneath each other, I did follow all the steps, even when I insert "alpha & omega" still no change……please help!!!Website Design Tutorial: Photoshop to HTML5 and CSS the Right Way – Part I

    Reply
  4. ossama gomaa

    Hello
    March Madness!
    60% Off New Hosting Plans!

    Take some time away from your brackets for a sure slam dunk! Save 60% OFF all new hosting plans, Friday March 25th, from 12am to 11:59pm CST!

    This is one quick sale so don't miss this opportunity to pass on the savings. Thanks in advance for all your efforts.
    =====================================================================
    Coupon Code: MAR325
    Sale Begins: Friday, March 25th at 12:00am CST
    Sale Ends: Friday, March 25th at 11:59pm CST

    Reply
  5. Ely John Jumao-as

    i just wanted to ask for an advice. i used a 960 grid with 16 columns for a website design, but when i run it i can see an overlapping of the background. i wanted to adjust the size of it. what should be my command in CSS and where to insert it?

    Reply
  6. Joseph M Gomez

    @Lolly…the mos affordable PS Software is @ piratebay or kickass….lol

    Reply
  7. Larrys mlmtips

    It;s good to see others using Photoshop and make it look simple to work. Very valuable video here!

    Reply
  8. Another Games

    This seems more like a magazine page to me rather than a website.

    Reply

Leave a Reply