It seems like you are using an ad blocker. To enhance your experience and support our website, please consider:

  1. Signing in to disable ads on our site.
  2. Sign up if you don't have an account yet.
  3. Or, disable your ad blocker by doing this:
    • Click on the ad blocker icon in your browser's toolbar.
    • Select "Pause on this site" or a similar option for lancecourse.com.

Never start coding a website with code

One big mistake you can ever make is to start a website by coding it. After these years of creating various types of websites, I have come to realize that you can't do it that way.

enter image description here

Although there are different types of websites, each with its various goals, even the smallest website, when you want to create it with some attention, must go through some serious and meticulous process.

You can't start with code. Years back I used to do that same thing. All I needed is an idea, then I would jump to my black screen and start to spit out the code.

There are a whole lot of problems with such a practice. You blindly code the site, and the first issue with that is that the website will never be harmonious. A website is a set of little blocks nested under each other. The depth depends on how seriously you take the project.

It's, therefore, important to have a clear view of all these before tackling anything.

Another issue with it is that your decisions are never stable and sure. There are many ways to make one thing. However, choosing the one way to use is an important decision to always make when developing a website. When you start to make those decisions during the coding phase you don't take much time to see their interrelation and therefore know if that actually matches the ideal option.

This will always lead you to unorganized code and projects.

One bad trap you also fall into is the fever of perfection. Because you did not sit to decide how exactly you will create the site, you will tend not to know when exactly to stop. You will remain in a circle of decisions and opinions on how to make this and that, causing a serious waste of time.

To ensure an acceptable process of creating a website, I would suggest you go through a few steps such as:

Definition of goals

While this looks obvious, it's one of the trickiest things. Although your goals can be to have an e-commerce website, a blog, a company profile, a game website, and so on, it's the stage where you should think of how the final realization is going to be used and how it's going to serve you. It's the phase at which you must look at each piece of the system and define the reasons why it should be there or not, or what can it do or can't. The goals are the real and concise reasons behind each aspect of your system and the system itself as a whole. Missing any point here will always lead to a weak and erroneous system.

Study of feasibility

Goals are usually dreams, and in dreams anything is possible. You have to do a lot of research on each aspect of your goals to make sure you know how to make it and that it's a workable thing.

Project's business plan

Another helpful step you could go through is a business plan. Make sure of your monetization system before proceeding. I know all projects are not necessarily meant to make a profit. But, in case yours does, always take some time to get a clear idea of how the money comes in.

Team set up

The team setup is the phase where you define you human and other resources required to undertake the job. This phase should help you gather the right people and give each of their tasks. Even if you are alone, it's still interesting you take some time to define the exact tasks you have in hand.

Wireframing and content preparation

Now that you are set, you can touch the real work. Create scenarios to test your ideas and plans in a simulation world. Use the remarks and discoveries to improve your goals and plans.

Mockup, theme(colors, layout, typography) and content definition

After wireframing you now have an idea of how your project would look like. You can start mocking up its real face. Mock-ups are a kind of advanced view of your wireframes. This stage will help you complete your selection of colors, layout, typography, and your first content.

Write/gather final contents

Based on your new layout, you can go deep into your content definition. Now you should know how to write and structure it to match your theme and your goals. Here you need to take your time to weigh every little information and you should display it to your users.

Review layout based on content

Now return back to your layout and check how your content fits in. Match both to your goals and plans.

Coding

Now you can think of tying things together with your code.

Wrap up

While this is based on my personal experience, I still believe it can be very useful to anyone who wants to have an organized workflow. This can be applied to a small job as well as average projects. By manipulating this information or by playing with their order, I am quite sure you will come up with something unique and more appropriate to your own cases.

Thanks for reading, and kindly help me by sharing this article with your friends and colleagues.


Cover image credit to colorlib.com