PSD to HTML & CSS Made Easy - For Absolute Beginners
3.4 (4 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
26 students enrolled
Wishlisted Wishlist

Please confirm that you want to add PSD to HTML & CSS Made Easy - For Absolute Beginners to your Wishlist.

Add to Wishlist

PSD to HTML & CSS Made Easy - For Absolute Beginners

In this course I will teach you how to design a basic website in Photoshop and code into HTML & CSS step by step.
3.4 (4 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
26 students enrolled
Created by Mr Kashif Iqbal
Last updated 9/2015
English
Current price: $10 Original price: $20 Discount: 50% off
1 day left at this price!
30-Day Money-Back Guarantee
Includes:
  • 3.5 hours on-demand video
  • 2 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Design Websites In Photoshop
  • Code In HTML
  • Code In CSS
  • Convert PSD To HTML & CSS
View Curriculum
Requirements
  • Basic knowledge of Computer
  • Web Browser
  • Must have text editor (Notepad++ is free)
  • Basic knowledge of HTML & CSS but not required
  • Basic knowledge of Photoshop but not required
Description

A complete beginner level and easy to understand web designer course for absolute beginners. It gives you detailed explanation & practical examples on how to design a website in Photoshop and convert it into HTML & CSS.

I'm designing for the web since 2011 and I'm very excited to teach you how I design and code websites.

What will you exactly learn from this course?

  • Make web designs using Photoshop
  • How to code in HTML
  • How to code in CSS
  • How to convert PSD to HTML & CSS.

Where to go after finishing this course ?

After finishing this course I'll explain what you need to do to get better and better and what you need to have so you can get clients and jobs.

Who is the target audience?
  • Someone who is new to web design
  • someone who is new to web development
  • Someone who is totally beginner in web design & development
  • Someone who just getting started in web industry
Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 24 Lectures Collapse All 24 Lectures 03:17:36
+
Course Introduction
3 Lectures 10:51

I welcome you to this course and thank you for joining. In this lecture we'll talk about what we are going to learn and I'll show you the completed projects.

Preview 02:21

In this lecture, I explained what you need to know and need to do before you join this course.

Preview 06:26

In this lecture, I show you how to download course files.

Course Files
02:04
+
Designing A Website In Photoshop
7 Lectures 56:08
Websites To Get Inspiration
1 page

In this lecture, I'll teach you how to setup 960 grid system.

Preparing The Canvas And 960 Grid System
02:52

In this lecture, I'll teach you how to design a simple navigation.

Preview 07:47

In this section, I'll teach you how to design a billboard

Designing Billboard
11:53

In this section, I'll teach you how to design three boxes.

Designing Three Boxes
10:57

In this lecture, I'll teach you how to design a footer section.

Designing The Footer
16:36

In this section, I teach you how to clean up the messy PSD file so you can hand to developers without any problem.

Cleaning Up The PSD File
06:03
+
Converting PSD Into HTML & CSS
11 Lectures 01:57:19

Welcome to the coding section. In this lecture,I'll teach you how to prepare your files and folders before coding the PSD file.

Preview 06:35

In this lecture, I'll teach you how to add css reset code to your style sheet to clear default formating from your browser.

Adding the CSS Reset & Basic Markup
10:23

In this lecture, I'll teach you how to code navigation bar.

Coding The Navigation Bar Part 1
12:18

In this lecture, I'll teach you how to code navigation bar.

Coding The Navigation Bar Part 2
07:29

In this lecture, I'll teach you how to code the billboard section.

Preview 08:50

In this lecture, I'll teach you how to code the billboard section.

Coding The Billboard Section Part 2
10:49

In this lecture, I'll teach you how to code the three boxes.

Coding The Three Boxes Part 1
15:29

In this lecture, I'll teach you how to code the three boxes.

Coding The Three Boxes Part 2
13:20

In this lecture, I'll teach you how to code the footer section.

Coding The Footer Section Part 1
10:31

In this lecture, I'll teach you how to code the footer section.

Coding The Footer Section Part 2
10:21

Course files are included in this lecture. In this lecture we'll check for errors and we'll clean up the code.

Final Check And Clean Up
11:14
+
Review
3 Lectures 10:18

In this lecture, we'll review what we've learned so far.

Final Review What We've Learned In This Course
03:01

The Following Assignments You Need To Complete
2 pages

In this lecture, I'll give you some tips what to do next.

What Next ?
07:17
About the Instructor
Mr Kashif Iqbal
4.0 Average rating
375 Reviews
12,893 Students
6 Courses
Teacher, Blogger, Designer and developer.

Hello, I'm a designer, blogger, teacher and a developer. I'm creating and designing websites over 5 years now and I am so passionate to teach this knowledge to other people. I believe technology made this world a amazing place to live and we are lucky to be around this time and we must now miss this amazing technology.