Portfolio Website Design with HTML and CSS [ Complete Web Design Course ]
Vijay Thapa Vijay Thapa
39.8K subscribers
7,676 views
0

 Published On Jul 2, 2021

☕️ Buy me a Coffee - https://www.buymeacoffee.com/vijaythapa
🔴 Support - https://bit.ly/support-vijay-thapa [ PayPal ]

Learn WEB DESIGN by making a complete Responsive Personal Portfolio website project using HTML and CSS.

Download Images - https://bit.ly/download-image-portfol...

Reason Behind the use of Blue Color and Design Principles followed to create this project
https://www.vijaythapa.com.np/2021/07...

Previous Web Design Course -    • Complete Website Design Course [ Rest...  

Read these for Better Designs
---------------------------------------------------
#webdesigncourse #html #css

Design Principles - https://www.vijaythapa.com.np/2020/01...

Color Psychology - https://www.vijaythapa.com.np/2020/01...
======================================================================


In this course you will learn to create beautiful Responsive website using HTML and CSS only. We won't be using any frameworks.
Instead, we will use media queries to make it responsive (mobile ready).

Once you're comfortable on web designing using HTML and CSS only, using frameworks like Bootstrap will be so easy. It'll be like a piece of a cake.

By the end of the course, you'll design fully responsive personal portfolio website.


Table of Contents
===============
00:22 - Recap
01:34 - Idea Mapping
02:30 - Structuring
13:18 - Styling
13:51 - Designing NavBar
35:05 - Designing About Section
56:35 - Designing Projects Section
01:16:02- Designing Skills Section (Progress Bar)
01:29:12 - Designing Blogs Section
01:37:42 - Designing Footer
01:53:01 - Making Responsive


To complete any web design project, I divide the complete process in 4 different stages

1. Idea Mapping
------------------------------
In this stage, I listen to the clients and gather as much information (requirements) from them as possible.
Then, based on the information I do research. Look at some web designs on Pinterest and Behance.

  / vijaythapa  
https://www.behance.net/vijaythapa

Then I make rough sketch (wireframe) of the web page on paper with pen or pencil.

And then design it (UI) using softwares like Photoshop or Sketch.


2. Structuring
------------------------
In this stage, First I divide the conceptual web page design into different sections.

Then, Add HTML elements on each sections based on their requirements.


3. Styling
-----------------
In this stage, we make our structured web page more beautiful or presentable using CSS.

The web page will get its real colors, space, images, etc.


4. Making Mobile Ready
------------------------------------------
By this time, our web page is well designed and presentable.

The only thing left is, to make it responsive or mobile ready.

To make it beautifully viewable on any different sizes, we will use media query to make it responsive.
==========================================================


JOIN MY COMMUNITY !
--------------------------------------
💬 TELEGRAM: https://t.me/vijaythapayoutube
📸 INSTAGRAM:   / vijaythapa.code  
👥 FACEBOOK:   / thevijaythapa  
💼 LINKED IN:   / vijaythapa  
🐦 TWITTER:   / thevijaythapa  

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

show more

Share/Embed