
Install google fonts and font awesome on your machine, then download, extract, and copy roboto and font awesome into the fonts folder to prepare assets for PSD to HTML.
design and align the recent blog post section, manage margins, grid spacing, and typography to create a clean, responsive blog layout for a psd to html portfolio site.
Style a custom bootstrap navigation for a psd to html portfolio site by adding a header background on scroll, refining colors, spacing, hover and active underlines, and bold logo.
Style the hero area by applying margins, borders, and colors to cta and portfolio elements, convert anchors to inline blocks, and implement hover effects and a fixed header with particles.
Download or link a text animation plugin via CDN or local files and apply it to your main heading, configuring type speed and back delay.
Explore a unique scroll-driven fix for a transparent fixed header in a responsive portfolio site. Learn how a breakpoint under 992px and a class toggle control the header background.
Build an interactive skills section with animated progress bars for web development using HTML, CSS, and JavaScript, and learn to structure a responsive 8:6 layout with data-progress and waypoint-triggered animations.
Discover a css trick to create an arrow with borders. Set an element to zero size and use selective transparent borders and a colored top to form a triangle.
Implement an animated loader and scrolling progress with the Waypoints library, configuring 70% offset, and correctly targeting elements for a PSD to HTML portfolio site.
Apply a service hover effect that darkens the background, switches text to white, lightens the paragraph to #ddd, and flips and scales the icon with a smooth transform.
Create a responsive testimonials section for a PSD to HTML portfolio site, detailing header and testimonial items with images, names, and centered text styling.
Adjust styles to make the PSD to HTML portfolio template look good across all screen widths, using bootstrap responsiveness and breakpoints like 992px for blog, services, and about sections.
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 :)