Beginners Guide to Design a Website

Get a boost to the way you get your website up and running

Krishna Kotni
2 min readAug 14, 2021
Photo by Halacious on Unsplash

The Old Way of doing things

At times when I was both designing and coding the websites at the same time, I was told to better start to have a vision of how the website would look like, So I would draw a rough sketch of the website, not knowing how it turns up.

Then I would design the website using Html, CSS and Javascript (The traditional way of doing things). Yeah, It may not be the same as how I described the website on paper but that would give me an idea of where the components should be. This method saved a lot of time as designing with pencil is far more easier compared to the hassle one go through adjusting the padding and margin in CSS.

The Designing Solution

Solutions are made problems exist. The designing part is easy on paper but we don’t have an exact representation of the website. This problem has led to the evolution of softwares like -Adobe XD, Figma. My choice is figma as it is easy to use and web based application. Not to mention there is also a desktop app like AdobeXD. So the first part of designing a website in the modern world is to get a mock-up of the website on a software of your choice.

Photo by Christopher Gower on Unsplash

Lets Code!!

Hmm the traditional choices over here are Html, CSS and Javascript. These are fine for a small project but if you are working in an organisation or have a huge application to be made you can’t repeat the same code again and again. Hence there are solutions to rescue us from creating our own mini framework -ReactJS, AngularJS, Vue.js. I started learning ReactJS as it is more elegant and easy to get started. Components are created in React that are similar to functions in programming languages.

Learn ReactJS: https://scrimba.com/learn/learnreact.

Backend (Extra)

Things that are mentioned are used for the frontend (That means the code that will be sent to the client side to render the website), but we need some code running in the server to manage requests (like submitting a form). There are many option to get a backend server: Flask (Python), NodeJs (JavaScript), Django (Python), Spring Boot (Java), Ruby on Rails (Ruby).

--

--