First website launched

Recently I launched static educational website in netlify,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.

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(netlify.com) to host my static website. And i did website testing in GTmetrix (gtmetrix.com) and Google PageSpeed (developers.google.com/speed/pagespeed/insig..).

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.

Get some design ideas:

  1. Before actually start doing project, prepare prototype of the project. one of the best tool is figma(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.net..