Introduction to HTML & CSS

In this lesson we will take a look at number systems, what they are and how they are used. We will focus on four systems that all programmers need to be familiar with. Usually, when we think of computers, we think of binary. But, computers use all of the number systems in this lesson for various functions.

To get started we will have a quick review of the decimal system which will help us understand the other three systems. We'll look a little at the power of 2 and why computers love binary. We will examine binary, octal and hex. We will learn how to convert between these number systems. Finally we'll take a look at using a programmer's calculator.

Definition: Number systems are a means of using symbols to count.
The number system we commonly use is the decimal system. It originated in India around the 5th century and has evolved through time. The symbols are technically called European Hindu-Arabic numerals, but we commonly refer to them as Arabic Numerals. The most common number system in the world today, by humans in everyday life anyway, is the decimal system. Which is a base 10 number system. This means the system uses 10 symbols to count. We'll learn more about a base shortly.

Do not confuse the decimal system, or any number system with the metric system, which is now called the International System of Units or the U.S. Customary System, which are not number systems, but actually systems or categories of weights and measurements. These systems of weights and measurements still use the decimal system to actually count. In other words, whether you are referring to meters, centimeters, grams or milligrams in the metric system or you are referring to feet, inches, ounces or pounds in the US system, you are still using the decimal or base 10 system.

This chart shows some of the evolution of Arabic Numerals and its symbols, going way back, before medieval times to India. Can anyone see any resemblance to Roman numerals? If we were to look even further back in time, can anyone think of why we might have started using a system based on only ten symbols?

Definition: Number systems have a base or radix which is the number of symbols that can be used without repeating.
There are many number systems, but we will focus on the four systems commonly used by programmers and software developers, which are; binary, octal, decimal and hexadecimal.

Base 2 or Binary is a number system consisting of 0 and 1, which is the basic or lowest level system which enables computers to function through the use of switches called transistors. Like a light switch that turns on a light, when a transistor has voltage going through it, it can represent a 1. When it is off, or has no current going through it, it can represent a 0. In computer terminology a 0 or a 1 is known as a bit. Eight bits make up a byte. Bytes can be used in combination to represent many things such as letters. The capital letter A, for instance is represented in Binary by the following number 01000001.

Base 8 or Octal – is a system consisting of the numbers 0 through 7 and is used in programming, especially lower level programming such as machine code or assembly language, because memory registers on a computer chip often consist of combinations of bytes, which are units of 8-bit combinations or groups of 8 symbols. That’s why you may have a 64-bit version of Windows, which handles memory more effectively than a 32-bit OS. 64-bits consists of 8 registers of 8 bits each. Base 10 or Decimal – consisting of the numbers 0 through 9 and programmers must use decimal to express everyday numerical values to humans.

And finally, Base 16 or Hexadecimal – is a system consisting of the symbols 0 through F. Yes that is the letter F. A good way to come up with more symbols would be to use symbols that are already familiar. More about that in a moment.

Are there any smaller number systems than binary? Yes! Unary is a numeral system consisting of only ones. 1, 11, 111, 1111. Can anyone think of a time when you might use a unary system? Like playing a card game? Are there any larger number systems than Hex? Yes! Babylonian numerals were wedge shaped marks in a soft clay tablet that would be left in the sun to dry and form a permanent record. They used a base 60 which may have originated in the degrees of a circle or in time (60 minutes in an hour).

A complete discussion of number systems is beyond the scope of this lesson. But, investigate on your own. You can start learning more about number systems by using the resource links at the top of this page.

When talking about or using different number systems together, we use a subscript notation to distinguish between them. Here is the decimal number 15 expressed in other number systems. Key points to remember: 1111₂, 17₈, 15₁₀, F₁₆ all represent the same counting value or numbers.

Terms such as ten, eleven, fifteen, twenty, one hundred, etc. are only used in the decimal system. In the other systems the numbers are spoken individually, such as 1 and 0 is one zero, 1 and 9 is one nine and 100 is one zero zero.

This is a simple conversion chart which we can use to help us see some interesting facts.
All number systems (except the unary system we looked at earlier) begin with 0.
All number systems when adding a new column begin with a 1 in that column followed by zeros.
Examples: 7 in base 8 is followed by 10. 77 in base 8 is followed by 100. In hex F is followed by 10 and FF is followed by 100.

This slide shows the main aspects of the decimal system. We will look at the other three number systems using the same format. All these number systems use the same method for counting and representing numbers. I hope the chart is somewhat self explanatory. The main thought is that when running out of symbols, you zero that column and start again in the next column to the left.

We will see how the 1s, 10s, 100s columns in decimal have the same function as the 1s, 8s, 64s columns in octal, the 1s, 16s, 256s columns in hex and, of course, the 1s, 2s, 4s columns of binary.

Computers love binary, primarily because they are made up of switches called transistors. These are microscopic switches that make computer chips work. Because they have only two states, on or off, binary is the perfect number system from them. A zero or a one is a single bit of data that a computer can hold in it's memory. Eight zeros or ones in a group is one byte of data.

To read a little more about transistors, check out Intel's, The Transistor, Explained.

Computers and electronics also use octal and hexadecimal for various other functions. Octal was used in many older computers, is still used in lower level machine code and in some programming languages.

The CPU (Central Processing Unit) is covered by a metal cap. Underneath that cap are, by today’s standards, billions of transistors. These transistors are etched in silicon As amazing as the transistor count is, it may be even more amazing that the clock speed at which they switch, which is currently in the area of over 3 GHz (thousand million). The reason that binary is so important to computers is because the basis of computing is the on/off state of the transistor.

As you examine each of the number system charts, notice the similarities between them. All these number systems work the same, but with different bases.

Binary is the primary number system of computers. Having only 2 digits to works with, it takes more columns or places to reach a higher number. Notice for the four number systems we are discussing, which one reaches the example number of 235 using less places?

As you can see from examining all the number system's charts, hex as the ability to represent numbers with less columns or places. So a rule to remember is, the more unique digits in a number system, the less columns or places are used the express the number.

Generally, hexadecimal is used in higher level programming languages. One application is in the representation of colors. Since computer monitors have the ability to represent millions of colors, hex is a good choice for that job. Hex is used extensively in HTML and CSS.

Here we can see that the hexadecimal number system can render the example number of 235 using only two columns or places. Always keep in mind though, binary is still doing all the heavy lifting (under the hood)!

Following this simple algorithm will enable the conversion of any decimal number to another number system. The key is dividing by the base of the system you are converting to. In the following slides, we will see how it works and practice doing some conversions

For all these slides, we will continue to use our example number of 235₁₀, using our base number designations in subscript to help us know which number system we are referring to. You can also state base 10 or base 2 after the number, which is also acceptable.
To convert 235₁₀ to binary, follow these steps:
1. Divide 235 by 2 (the binary base). The answer is 117 with a remainder of 1. So, 1 goes in the binary first (1s column) place.
2. Divide 117 by 2. The answer is 58 with a remainder of 1. That one goes in the 2s column.
3. Divide 58 by 2. The answer is 29 with a remainder of 0. The 0 goes in the next column.
4. Continue these steps until you reach the number that is smaller than the base. In this case it is 1. That is the last number.
Therefore, 235 base 10 is equal to 11101011 base 2.
Practice doing a few numbers on your own.

Converting decimal or base 10 to other number systems uses the same method.
For octal follow the same steps:
1. 235 divided by 8 equals 29 with a remainder of 3. 3 goes in the 1s or first column.
2. 29 divided by 8 equals 3 with a remainder of 5. So 5 goes in the 8s (second) column.
3. This leaves 3, which is smaller than 8 (the base), therefore that last number goes in the next column, which for Octal is the 64ths column.
Therefore, 235₁₀ is equal to 353₈.
We may also say 235 base 10 is equal to 353 base 8.
Practice doing a few numbers on your own.

1. 235 divided by 16 equals 14, with a remainder of 11. Eleven in Hex is B. So the first column is B.
2. 14 is less than 16 (the base). Sixteen in hex is E, which it the second column. So 235₁₀ is equal to EB₁₆.
On your own, try the decimal to hexadecimal conversion using the same method we have been using. I have included the number values for the hex symbols of A–F.
You may ask, “Why not just use the numbers?” Remember, that a rule of number systems is that they do not have repeating symbols for their values. The values for A through F are 10 through 15.
Also note, when speaking a hex number such a 10A17F, it is spoken as: one, zero, A, one, seven, F. There are no tens, teens, twenties, etc. in hex.
Do you notice that one of the advantages of a number system with a larger base?
Very large numbers can be represented with a smaller amount of symbols

Since converting from decimal involves dividing and subtracting, it makes sense that converting to decimal involves multiplying and adding. Basically, reversing the process
Let's start with Binary, which is probably the easiest. Remember that although we are using 235 as our example number, we "don't know" that number until we convert from either binary, octal or hex, in the next few slides.

Let's see if we can convert 11101011, base 2 in a decimal number. The result should be 235, our example number.
The bottom row, in this slide, shows the places; 1s column, 2s column, 4s column, etc. For every 1 you have, you add the value of that column or place.
Since this is binary, it is not very apparent, but you are not just adding the columns. You are actually multiplying each column or place value by 1 or 0. That’s why just adding all the columns gives you the decimal number.
Pretty easy, right? Something probably most people can’t do in their head, so you might need a pencil and paper.

Starting from the left, the first column or place number has a value of 128. Multiply the number by the place value, which is 128x1. Or 128.
The next place is the 64th place, so add 64x1 or 64.
Continue adding the number times the place value to the last column.
So 11101011₂ is equal to 235₁₀.

Now let's do the use the same method to convert the octal number 353 to decimal. Again, we are looking for the answer to be 235.
Use the conversion steps to do the example. Then do a few of your own.

For many, hexadecimal is a difficult number system due to the use of letters.
Here we are converting the hex number EB to decimal. To help you, I put the number values in parenthesis after the hex symbol.
If necessary use the explanation of hex slide, shown earlier in the lesson, to help you and try the example first, then a few of your own.

There are several reasons to know manual methods of number system conversion. This knowledge certainly helps us understand number systems in general and the specific number systems we are studying.
You may be ask to convert between number systems as part of a job interview, where they may not allow the use of a calculator. I personally had a job interview once where I was only allowed a blackboard and a piece of chalk to show programming knowledge.

There are also reasons not to do manual number conversions in everyday practice. On the next slides we will see how the Window's Calculator can do all this work for us, and with less chance of any mistakes. Also, very often the programming software you are using may be able to give you numbers already formatted in the number system necessary for what ever task you are doing. An example is, the ability of Microsoft's Visual Studio to properly format in the correct number system while typing in various programming languages.
All that being said, manually converting between number systems is still a great skill to have.

1. Open the Window's Calculator.
2. Click the menu in the upper left corner.
3. Choose "Programmer" from the list.
You can now type any decimal number and see its binary, octal and hex equivalent. You can also do any calculations and see the results in all four number systems.