1s and 0s, that's all that's there
At ev'ry web site, even AIR
The Internet, and ev'rywhere
Your data, stored that way
No more, just only 0 and 1
Like switch "turned on", you're having fun [1]
A "turn-off?" Gee, there's nothing - none
A bummer of a date! ;-)
I've looked at bits ffom both sides now
They're "on" or "off", but still, somehow
They show us pictures, "paper, wall-" [2]
It's really not hard. How?
Enthrall:
Mac™ or Windows:™? Such a deal!
It turns those bits to something real
Binary code; words, pics, reveal
So we can work and play
In C-PU, just 1 and 0 [3]
On Web they pass, as packets flow [4]
And if you care, we'll let you know
Just how they got that way
We've grouped eight "bits" and they're "bytes" now [5]
Just 1s and 0s, and yet somehow
Are colors' fusions formed by small --
-- Bytes, combinations of --
-- Them all [6]
Cheers and beers: programming crowd
Whose languages re-move the shroud
Vi-deos that sing out loud
Are cooked from bytes that way!
In C-PU, this doesn't change
Nor mem'ry, hard drive; sounding strange? [7]
Those "bits" just all get rearranged
(We did that just today!)
You've looked at puters' insides now
At bits and bytes, and golly, wow!
When of confusion, mind should stall
Just think of this lil' song:
Recall
[1] Think of a light switch in your living room. Turn it on = current flows. Turn it off = no current.
Your computer's core components are just billions of switches. If a current flows, that's read as a "1". If no current, (guess!), that's a "0".
Hence, "binary" (base 2) digits, because there are only two digits, 0 and 1.
If you contract BInary digiT, you get "Bit". (or is it "Binary digIT" - or "Binary dIgiT" -- TT can never remember. No matter. ;-)
[2] I. e., desktop "wallpaper" (background) -- *how* it does that is explained below.
[3] "CPU" = Central Processing Unit, or simply "Processor'. The brains of the outfit.
[4] You can't send colors or words over a wire, either. Nothing flows through the Internet except our old friends, 0 and 1, in their disguises, "electical charge" or "no charge here". They're grouped into "packets" so they have a better chance of staying together (and to add meaning, destination, source, and other stuff for some other parody some other time - NOT. "whew")
FUN THING TO DO:
(In Windows) Right-click the "connection" icon in the lower right. That will look like two computer screens (only one, if your connection is wireless.) Click "Status". Where it says "Packets" about 2/3 of the way down, you can actually watch the number of packets sent and received changing as you read this.
[5]
Bits (binary digits) are grouped into sets of eight, called "bytes". So a "byte" is eight bits. Like, say, 01001100 is one byte (eight bits).
One reason: One bit gives two choices, 0 and 1, right? Two bits give four choices (2 x 2): 00, 01, 10, 11. ....
Eight bits therefore give 256 choices (2 x 2 x 2 x 2 x 2 x 2 x 2 x 2, or if you remember any algebra, "2 to the eigth power", commonly written on the web as 2^8).
With 256 possible combinations, we can cover all upper and lower case letters of the alphabet, numbers 0-9, punctuation, @#$% etc,. and still have some left over for other uses. So one "byte" can translate to one character, whether letter, number, whatever. Makin' any sense here?
Aw, heck, let's just DO IT!
Copy the following, exactly: (select, Edit > Copy)
01001001 01110011 01101110 00100111 01110100 00100000 01110100 01101000 01101001 01110011 00100000 01100110 01110101 01101110 00111111
Go to the "Binary-Text Converter" link in the outtro. (We've been asked not to put off-site links inside parodies, though of course plugging yours or someone else's song here at AIR is heartily encouraged, LOL). Paste into the box and click the "Convert from binary to text" button, then click "Convert". Eureka!
Note that you can also click "Convert from text to binary", enter any text you like (keep it clean, boys and girls ;), and get the binary code for it. You could send secret messages to your friends that way, but they wouldn't be very secret to a lot of people -- including you now, right?
WOW! We now know how words are displayed on our screen, sent through the Internet, and displayed on the screen at the other end! But what about graphics?
[6]
OK, but how do bits turn into colors, for pics and videos, etc. -- or even for your desktop "wallpaper"? Like so:
Remember when you were in kindergarten, with a box of crayons? If you made a yellow stripe, then went over it with a blue crayon, it turned green. And if you mixed red and blue, you got purple. Etc. Red, yellow, and blue are the "primary colors" of crayons.
For reasons not important here, the primary colors in a computer display are red, green, and blue. Your screen is composed of tiny dots called "pixels" (for "picture element"). TT's screen has a little over a million pixels (1280 pixels wide by 800 pixels high).
*Each" pixel is fed three bytes: one for how much red, one for how much blue, and one for how much green, mixed appropriately to produce the desired color. So we have 256 possible degrees of red, from 00000000 (no red at all) to 11111111 (the most red possible). Same with green and blue.
So a set of bytes for a single pixel might look like this:
10100011 01001011 11000101
That's such a lovely shade of violet!
Want to make up your own color bytes and see how they come out? Or take any given color, and find the corresponding bytes? Of course you do!
But first, a slight digression is necessary. Web site designers, the most famous example being ChuckyG of course, would get very tired of staring at those endless groups of 1s and 0s. (Aren't you? ;) And they're hard to read.
Soooo.... we take advantage of the fact that 2 x 2 x 2 x 2 = 16 (or algebraically, 2^4 = 16.) If we use base 16, called "hexadecimal", or "hex" for short, then one hex character takes the place of four binary characters. This also saves space -- 1/4 as much space used.
But how to express numbers up to 16 in one character? Easy: 0, 1, 2 .... 8, 9, A, B, C, D, E, F, where A=10, B=11, ... F=15. Simple, no?
Since a byte is *eight* bits, and a hex character is four bits, we need two hex characters to make a byte, ryte? (ha, ha)
ONE DO-IT-YOURSELF IS WORTH A THOUSAND WORDS:
Even if you don't own a scientific calculator, you have one in your computer. We DK where it is in Mac, but in Windows, click Start, click Run, and type "calc" without the quotes. Hit "enter". Voila!
If it appears as a small square with no ABCDEF, click View, then click "Scientific". See the A-F in the bottom row now?
OK, fun time. Let's take the first color byte above, 10100011. Click "Bin" (binary) in the calculator's upper left. Click the 1 and 0 keys to enter that byte value. Or, even easier, copy it from here, and on the calculator, click Edit > Paste. (That *was* easier, wasn't it? ... bits = blindness) Now click "Dec" (decimal) and what do you get? 163, right? So our color has 163 degrees of red out of a possible 0-255. 256 choices, but geeks count starting from zero, because they're weird. And because zero is a possibility. See for yourself: Go back to "bin", hit "C" (clear), click 11111111, and click "dec". 255, right? ;)
But we said, "hex". Going back to our red color byte above, you could re-copy the binary byte, or the decimal number 163 that we already got. (**Make sure the calc is set to "bin" or "dec" or "hex" BEFORE entering that particular type of value.**) Now click "hex" (for hexadecimal.)
Ta-da! A3, right? So our color has a red hex value of A3.
Repeat this process with the other two bytes above, for green and blue. Try it before looking at the answers.
You should get for the second byte (green) 75 in dec and 4B in hex
For the third byte (blue), how about 197 in decimal and C5 in hex?
The decimal numbers are actually irrelevant here, but since it's what we're most comfortable with, it gives a familiar frame of reference - on our scale of 0-255 for "redness", "greenness" and "blueness". (If humans had only one finger on each hand, we'd have been using binary from the gitgo -- TT.)
PAYOFF TIME:
Let's see that pretty color! Go to thei link in the outro, [6].
Where it says, " Generate Your Own Custom Hex Colors", go down to the color box, and in the 'hex'" box, replace the # with our three sets of hex characters, *without spaces*, like so:
A34BC5
(Bingo!;)
Click the "Swatch" box on the right. Is that not a pretty shade of violet, or what?
Notice that the decimal equivalents are also there. You can enter any decimal values you like, and it will produce the color as well as convert it to the hex equivalent in that box.
Fun! But remember, practice "safe hex"!
REAL WORLD:
Web site designers may or may not want to spend time making up custom colors, especially with only (256 x 256 x 256 =) 16,777,216 possible colors.
It's easier to choose from a pre-made chart that gives you the value you need to enter in your code, like the one linked in the outtro, [7]. ChuckyG or you can just look through the colors, pick one you like, and use the hex values to the left of it as you specify font color, background color, etc.
REMINDER; To paint your desktop, or to display a still image (picture) or a web page, *each* pixel needs a color value. For video, each pixel must be repainted for every frame of the video. Aren't these things *fast*? :-)
[7]
OK, but how and where are these stored and processed in our computers?
Your "hard drive" is just a disk with billions of individual spots on it, each of which either has an electromagnetic charge on it, or does not. You already know what those mean. When new information is stored there, it"s "written" in these charges and non-charges, It's read the same way.
Since a magnetic charge, like a magnet, is more or less permanent, your hard drive keeps everything on it even when the computer is off.
The processor (CPU), as mentioned, is the brains of the outfit, reading bits from the hard drive (or flash drive or CD or DVD or Internet or whatever) and manipulating them according to instructions. ("Programs", "processes" "routines" etc.) And sending them to the display gizmos so that they show on your screen when appropriate.
To do that, it will store both data and instructions in a more temporary "memory" known as RAM (Random-Access Memory), writing 1s and 0s in various places, manipulating them, and retrieving them as needed, then removing them from RAM when it is done with those particular bits -- or when the computer is turned off. No power, no RAM.
Have you ever remembered a phone number just long enough to call it, then forgotten it? Or written it down, and thrown it away after making the call? That would be like your own RAM -- short-term memory -- while your address and phone book for permanent storage would be like your hard drive -- you can still add new ones or delete old ones, but other than that, the hard drive and your phone book keep all their data. Make sense?
So, at the computer's core -- the most important components: HD, CPU, RAM -- *only* bits are being thrown around. Programmers invent programming languages that convert these into code to make your operating system (Windows, Mac, etc.) and your programs (Word processing, anti-virus and firewall, and, of course, the browser itself). And these operating systems and programs do those conversions to text and graphic display, as we saw and did above.
And there you have it.
(And now you can better understand a parody someone once wrote,
"I Am Binary-Modal, Sexa-Octal Hexadecimal") [on-site plug=1 (allowed)] ;)