Do you want to Learn PSD to HTML from scratch by Designing the PSD Template and then Converting it into a Beautiful Modern Looking Responsive HTML/CSS Website ?
If your Answer is Yes, this Course is for you.
Welcome to this Awesome Course, where we are going to build a Cool Professional Modern Looking Responsive Portfolio Website with Cool Features.
Features of this Web Design Course :
-
Responsive Design Using Bootstrap 4
-
Non Rectangular Backgrounds (No images , only code with easy logical approach)
-
Attractive Hero Area with Particle Animation and Text Animation
-
CSS Animations
-
Awesome Unique Hover Effects
-
Filterable Portfolio Items
-
Custom Page Loader (our own)
-
Many Important Tips and Tricks to solve problems with easy approach which helps in growing problem solving skills in website designs
I am really excited and also feeling honored that I will walk you through all of these step by step
Every bit of code is explained in the course . And also if you need any help , I am always here to help you out .
After taking this course , you will have enormous confidence of Designing Portfolio Websites from scratch as you will be able to do both Designing and Coding and also you will be able to add more spice to your project by adding cool effects that are going to be covered here in this course !!! Thumbs up !!!
So are you ready to grow your confidence ?
Take your first step by taking a look at the full demo of the website that we are going to build in this course which is a free preview.
I am looking forward to see you inside the course 🙂
Designing PSD Template
Converting PSD to Responsive HTML/CSS
-
4Understanding Grid
-
5Download Bootstrap Grid PSD here
-
6Creating Color Swatch
-
7Header logo and Navigation
-
8Hero Area : Part1
-
9Hero Area : Part2
-
10About : Part1
-
11About : Part2
-
12Education Experience Skills : Part1
-
13Education Experience Skills : Part2
-
14Services : Part1
-
15Services : Part2
-
16Portfolio : Part1
-
17Portfolio : Part2
-
18Portfolio : Part3
-
19Testimonials : Part1
-
20Testimonials : Part2
-
21Blog : Part1
-
22Blog : Part2
-
23Contact : Part1
-
24Contact : Part2
-
25Footer
Spicing Up Our Website
-
26Creating Basic Files and Folders
-
27Creating HTML markup with necessary META tags
-
28Downloading and Using Jquery
-
29Downloading and Using Bootstrap4
-
30Google Font
-
31Reset CSS
-
32Using FontAwesome Icon Font in Project
-
33Respond Js
-
34Exporting and Optimizing Images : Part1
-
35Exporting and Optimizing Images : Part2
-
36Header Navigation and Logo Markup with Explanation
-
37Challenge - Styling Custom Bootstrap Navigation : Part1
-
38Challenge - Styling Custom Bootstrap Navigation : Part2
-
39Hero Area : Content MarkUp and Styling :part1
-
40Hero Area : Content MarkUp and Styling :part2
-
41Surprise Lecture : Secret to Non Rectangular Background - The Easy way
-
42Adding Particle Animation to Hero Area
-
43Animated Text
-
44Call to Action Button Hover Effect
-
45Fixed Header
-
46Fixed Header : Interesting Update : Unique solution for transprent Background
-
47About Section
-
48Education and Experience
-
49Skills : Part1
-
50Special CSS Trick to create arrow
-
51Animated Loader
-
52Cool Trick Solution for symmetrical top and bottom non-rectangular shape
-
53Trick to Create Underline Effect : 2 Ways Revealed
-
54Services Section : Markup and Styling
-
55Service Hover Effect
-
56Portfolio : HTML Markup
-
57Portfolio : Unique Hover Effect
-
58Portfolio : Plugin Initialization
-
59Portfolio : Adding Filterable Feature
-
60Finishing Up Portfolio Section
-
61Testimonial Part1
-
62Testimonial Part2
-
63Blog
-
64Contact Markup
-
65Contact Styling
-
66Footer
-
67Required Modification