The Fundamentals of Web Development

The Fundamentals of Web Development

When it comes to web development, a lot of things can confuse people. It seems so complex with its never-ending loop.

The truth of the matter is every topic in the world has fundamentals which are guided by principles and topics that are relatively easier to understand.

Your business website, for instance, is your business's most important asset and this is where your content is housed online and website brings in thousands of dollars per year even though it cost very little to make.

Understanding what makes a website and how it's created is made easy when you understand the fundamentals of web development. We will be looking at the fundamentals and what makes each one tick.

1. Binary

This is what all data are made of. It believes data is composed of 1s and 0s. It's the summary of everything you see around you, everything uses a Binary system and it is the foundation of most everything you see around - from a computer, a website to your smartphone.

They all run on Binary. There is literally nothing in computer science as basic as a binary which is often used to refer to something that is simple. All the software and data found in computers are all built up from strings of zeroes and ones.

If you look closely at that picture you took with your wife or that new application you downloaded on your system, it will come back with an endless stream of 1s and 0s, like this: 01110010101111000101010... The engineers who worked in the early 1940s used to work at the binary level. If a computer didn't work as it should, they would naturally assume that someone must have replaced a 0 with a 1 somewhere and will have to try it all over again until it's corrected.

2. HTML

Next on the list is HTML. HTML means Hyper Text Markup Language. This is a web development language used for coding websites and it is quite easy to learn and simple to code in. It doesn't require a software to run it either. If you have the patience to write shortcodes and open a text file, you can start creating websites in HTML in minutes without doing much of anything.

Learning it can be a bit intimidating at the beginning but once you get a hang of it, everything becomes easier afterward. With HTML, content could be structured within a set of paragraphs, images or a list of bulleted points. It consists of a series of elements which you use to enclose different parts of content so it appears or behaves in a certain way online.

The enclosing tags can make a word or an image behave in a certain way. When it comes to the markup language - HTML, there are four major elements namely :

  • the opening tag
  • closing tag
  • content and
  • the element.

The opening tag is where we have the name of the element, wrapped in opening and closing angle brackets. This signifies the elements have begun to take effect.

The closing tag is similar to the opening tag but it doesn't include a forward slash before the element name.

Its job is to tell you where the element ends and that is where the paragraph is.

The content is the text

The element is the opening tag + the closing tag + the content

3. CSS

This refers to how your site is designed. CSS is short for Cascading Style Sheets and it is responsible for a site's visual design.

Having a basic understanding of CSS will go a long way in determining how good your website will look. While it's obviously not easy to do, it does take a bit of getting used to and an important fundamental to web development that you should know.

CSS is used to define the style of your web pages; layout, design, variations, and display for devices and other screen sizes. It solves a big problem for web developers. HTML was created to describe content but it doesn't contain tags for formatting a web page.

With HTML, it became a nightmare adding color attributes and fonts to large websites as it had to be done individually. With CSS, the style formatting was removed from the HTML page and stored as an external file called .css files. With this external style sheet file, you can change the look of a website by changing just one file.

4. Bug Catching

Running websites involves solving huge problems and finding solutions to them. When you run your code, it is normal to find errors in them. Chrome extensions and Browser Development Tools allows you to analyze a site's code to determine how it functions and it also allows you to catch errors in your own code that you might not be aware of. The most common tools are debugger's, console and code explorer.

Posted by Kara Tan

Kara Tan
Kara Tan is a cofounder of Altitude Labs, a full-service app design and development agency that specializes in data driven design and personalization.

Related Posts

Comments

comments powered by Disqus