First website launched

Recently I launched static educational website in netlify,https://pensive-ritchie-9b02db.netlify.app . it was my second project but first live project. Let me share some of my pitfalls, lessons learned and I will share some of the tools and resources that really helped me. While doing project i always thought I was on 1st gear but somehow i finised this project.i created 3 pages educational/personal website. 90% of project design I did it myself. I love a lot to listen suggestions, ideas and questions.

Step 1: I referred around 20 website to get rough ideas of website development but I took few ideas from them. I made the rough sketch of my project in Microsoft word(this is very bad idea and I didn`t knew any prototyping software). Firstly I wrote HTML code and inserted some images also in visual studio code. Mostly I was writing CSS articles in my website, so I referred css-tricks, w3schools, CSS and smashing magazine and tools as follows.

• Code editor : Visual Studio Code.
• Browsers used : google, brave.
• Prototyping ( writing rough ideas about project) :

   Microsoft word (very bad idea).
  

Step 2 : I designed icons and images in figma. And i also downloaded high quality images from pexels, unsplash, pixabay, and Freepik. I downloaded icons from Flaticon, Font Awesome, and google icons.

• Figma : graphic design.(https://www.figma.com/)
• Pexels(https://www.pexels.com/).
• pixabay (https://pixabay.com/).
• Unsplash (https://unsplash.com/).
• Flaticon (https://www.flaticon.com/).
• Font Awesome ( https://fontawesome.com/).
• Google icons ( https://material.io/)

Step 3 : In this step there was problem in responsive design. I joined around 10 web developers groups in facebook, dev.to, stack overflow so that I have a better platform in getting help. Finally project got completed. I took 140hours to complete the project.

step 4 : website hosting I freely used netlify(https://www.netlify.com/) to host my static website. And i did website testing in GTmetrix (https://gtmetrix.com/) and Google PageSpeed (https://developers.google.com/speed/pagespeed/insights/).

Mistakes : I think these are my mistakes and lesson I should learn from this project.

1. I spend lot of time to make website perfect but i failed. So best way is to refer some freely available templates and get ideas from them as a begginers. Include simple design and make website responsive. Some freely available website templates are.
   • https://html5up.net
   • https://startbootstrap.com
   • https://templated.co
   • https://freehtml5.co
   • https://www.zerotheme.com
   • https://www.styleout.com
   • https://www.htnl5xcss3.com
   • https://athemes.com
   • https://themewagon.com
   • https://html5up.net/future-imperfect

Get some design ideas:

• https://onepagelove.com/
• https://dribble.com/

1. Before actually start doing project, prepare prototype of the project. one of the best tool is figma(https://www.figma.com/), and using microsoft word for prototype is way out of topic. and GITHUB to upload the code. What I appreciate about this project :
   • The images(vector) I used are high quality and mostly I made myself.
   • Finally I succeeded but still there is room for improvement.*

Feedbacks and suggestions are kindly welcomed.https://pensive-ritchie-9b02db.netlify.app