If you are currently learning web design, you will encounter different terminologies. You don’t need to download a list of these words in PDF format. By the help of my idiot proof definition you’re good to go and embrace the the world of Web Development.
What is a browser? I’m surprised that many people still don’t know the actual meaning of a browser even they use it everyday. A browser is your Google Chrome, Safari, Firefox, and the legendary slowest and ugliest browser in the face of the planet, Internet Explorer aka Microsoft Edge.
You should be familiar to this. This is where all the desiging happens. This involves creating how your website will look like, choose fonts, color, images, etc. No coding yet. After using photoshop to design a website, get ready in coding it using HTML and CSS.
This is the programming language that browsers can understand. It’s easy to understand and one of the basic and easiest programming language. Every element in a website is made by HTML language. If you want to show a text in a browser you must wrap it around html tag. For example you want to add a paragraph, you need to wrap your text with <p> tag. Like <p>This is your paragraph</p> The output will be a paragraph saying “This is your paragraph”
This is the make up artist of HTML. It add style to the boring HTML. This includes font size, color, width, height, position, and more! You will work on CSS a lot if you want to become a front-end web developer. This is a bit complicated at first.
This refers to your computer. The one that you are using right now. Most web developers make their websites in the local computer first before uploading to a remote server.
This is where you upload your files online. This is what Web Hosting companies offer to you. Your files are not actually in the cloud with your guardian angel, it’s in the earth inside a warehouse somewhere. Everyone can access your files there using the internet.
This means File Transfer Protocol. But you will refer to this as a software to upload local files to the remote server. Filezilla is a legendary FTP software that most developers use.
At his point you can now create a working and very simple website. Now, let’s proceed to a more advanced terminologies for a dummy like you…
This is just a list of information in table format. This is stored in a server. For example: data of name, age, gender, location. Large websites use database to store all the information they needed. Image how big is the database of Facebook.
A programming language to give command to the database. Like adding, updating or removing data.
This is a programming language that can do a lot of things. It requires a server (local server will do). It is the middle man between the database and the HTML. Remember, you browser can only understand HTML and you need PHP to talk to Database and output the information as HTML. See the image below:
PHP can also tell you the date, time, do computations, and more. It understand logic and you can program it whatever you want. Like replacing a logo of a website from during Christmas eve.
Content Management System… What? ok it’s not clear. So you have a website that is shown to public, when a website uses CMS it also have an administrator page where you can update the information of a website like changing the logo, website theme, adding new articles, changing the layout and more. CMS is a framework of a website with ability to manage and modify different features. You can actually create a website using CMS without coding. But you still need to code if you want to customize the CMS features and functionality.
It’s simply a CSS framework for creating layout, grid, accordion, tab panel, navigation. You don’t have to create everything from scratch now because you can build website using frameworks and save a lot of time. But I still recommend learning how to build a website from scratch for beginners, it will make a guru someday. There a lot of alternatives to Bootstrap, what I’m using in this website is Zurb Foundation, its a runner up in CSS framework but I like its simplicity and neat features.
Tools that simply speed up the process
SASS and LESS
These are just CSS pre processors. Meaning you do the CSS coding in SASS and LESS files and a third party software will output a generated CSS file for you. If you want to learn which pre processors is better, just pick SASS.
A library of SASS and LESS shortcuts. I prefer bourbon but sometimes these are not useful. It’s better to have your own library that will fit your needs.
Uses to track the changes that you made in your files. This avoids creating files like homepage-old1.html, homepageold2.html, home-version23.html, and so on. You can also collaborate with your team and work on the same file without overwriting each others work.
It means free
Removing extra spaces in your codes to save file size and speed up the loading of your webiste
It’s like saving a database-like information in a file without a server.
The competitor of PHP
The science of making a website show up on top the results page of Google without using ads.