Getting started with web design

A few years ago, people needed to have a physical office where customers would come by to shop or order an item they were interested in. Things have changed and today, at the comfort of your home, you can purchase an item you are interested in. Websites have made this possible, as there are millions of them today, competing for the top spot on the search engines such as Bing, Google, e.t.c.

Learning the web fundamentals, is not only critical for web designers and developers, but as well to any individual who wishes to run an eCommerce business in future.

In this article, I describe a little about the history of web development, the tools you need, and the building process.

Web Design v.s web development

You might have heard about web designers and web developers, and wondered, what’s the difference. Even though the two are totally different, the term web designer over time has been used interchangeably to mean both a developer and designer. However, when we talk of a web design, we refer to the aesthetic portion of the website and it’s usability. It is more of what the website will look like.

On the other hand, web development refers to the actual functionality of a website. This involves using web languages such as HTML, CSS and JavaScript for the frontend, and Python, PHP, e.t.c for the backend.

History of the web

In 1989, British scientist Tim Berners-Lee invented the WorldWideWeb (www). The web was then developed to meet the demands of information sharing between institutes and universities around the globe.

Then, the aim was to share information using hyperlinks thus the name hypertext markup language, that is interconnected links of text. HTML was then made the easiest language that anyone could possibly learn and that hasn’t changed. Even though we use the word code and coding in HTML, it isn’t a programming language, it is a markup language for the web.

The web was then consisting of texts and links without any layout or interactivity. Over time, Cascading Stylesheet (CSS) was invented for styling and displaying the content while JavaScript for interactivity.

Tools

A computer. You can still code using your phone, however, it is recommended you get a desktop or laptop.

Text editor. If you want to tabulate data, what do you do? Of course you won’t open a publisher for that, you need an excel for that. There are millions of text editors that you could possibly use, both offline and online. I’d suggest you download one of them and have it installed on your computer. Recommended text editors you can download include; Sublime Text ( I recommend you use this), Visual Studio Code ( Personally I use this for my projects) and Notepad ++. For online editors, Codepen, JS Bin, and Glitch( I love this, but you don’t have to). If you will be working online, you will have to create an account with the editor of your choice. There are millions of them out there, if you feel like trying something different, the internet is at your disposal.

Web browsers. You will need the browser to display your results/ outcome/ output. Personally, I love using Chrome. It really doesn’t matter what browser you are using as long as it isn’t Internet Explorer :).

Web Development Process

We will learn more about this in due time. For now, you need to know about the basics of web development. Web development involves the following processes:

1. Research/ Information Gathering
2. Planning
3. Design
4. Content Writing
5. Testing, Review and Launch
6. Maintenance

Unfortunately, these steps are skipped and that is why many have websites that are not converting. If a client isn’t willing to pay for all the 6 steps, no doubt the final website will be a mediocre as the budget. This is why, everyone needs to learn about web fundamentals.

Resources

1. MDN ( Mozilla Developer Network). This is your go to place, not only for learning web development, but other languages as well.
2. WWW3Schools.
3. Docs. When a programming language is developed, there is a detailed document with various terms, elements, functionalities, e.t.c.

If you have any questions, let me know in the comments.