Thursday, December 6, 2012

What is a blog?

A blog, as we have seen, is the collaboration of HTML, Javascript, PHP, AdobeReader, and who knows how many other Internet languages. It's a whole world of coding and script which you, as the blogger, unwittingly control through HTML-run cute little buttons and interfaces. Little do you realize the presence of the mass skeletal framework of the blog which knows how to write and re-write itself, thanks to Blogger.

Blogger is our real machine, which helps connect it's tools for HTML drafting with the internet with your laptop. It helps you upload pictures, enables you to write blog posts, and let's you publish on the Internet and connect to other websites - and thus other people. You can add multiple authors to it, which is why the idea of "class blogs" became so popular. It's an easy, fast way to communicate.

Beyond the computer scripting of the blog, a blog also a product of years of human ingenuity. I mean, if you Google "blog," this is what turns up:



It doesn't even mention the actual underlying coding of a blog, or the physical location of it. It emphasizes only the human component. Although it's an important component, we saw previously that it's not the only one.

Beginning with the creation of the Internet, a blog's homeland (although it's actually made through fiber optic cables and massive physical servers located in warehouses across the country), it moved into more and more complicated ways of creating webpages. I still remember what webpages looked like back in the day. There were something like this.

Yup. It's George R.R. Martin's official website.

Anyways. It is the product of a cultural value system that wanted greater and bigger things, as well as faster ways to communicate. It stems from a desire to express oneself. While I'm sure humans have always had a desire to share and craft their lives and personalities to other people, the creation of the blog is not only a direct result of that but also the fuel for that desire. We are now seeing people's personal lives on the Internet in concentrations never before seen. Prior to the Internet, I'm not sure how people connected and crafted virtual personalities.

Such complicated blogs and websites as this are a good example. Feministing.com is one of the most intricately created blogs. Anyone is free to register and become an author. You can post anything you'd like, but it'll most likely be about feminist news and musings. The blog has a system of editors, and as such, is a kind of newspaper generated by its editors as well as by the general public. So, really, a blog is a product of the human desire to connect and share information, as well as craft a personality. But is also changes information, and it blends different genres and social rules together to create something new  a new component of the Internet and a new "self". I can be a self-made journalist and end up famous on blogs. Or, I can post pictures of my cat and gain a following of people who enjoy cat humor. Or, I could just be  one of those people who trolls and rants about things no one reads about. It's all up to me - and the people reading me.

Now, although there is this sense of newness, blogs are actually beginning to form informal rules, especially if you want your blog read and recognized. You have to launch a blog, for example, with at least 3-5 posts. Readers think you're lazy or "too new" if they see only one post. If you want to gain readers, post and comment on the blogs of people who write similar things. If they like what you say about them, they will likely search out your blog and read about you. If they like your blog there, they might link it in one of their posts and thereby encourage their readers to go to your blog. There are rules for advertising, rules for copyright (since, interestingly enough, your blog is actually a copyrighted publishing platform. You can be punished for plagiarizing someone's blog, and a quick Google search of your posts can quickly uncover culprits), and social rules of engagement. For example, "trolling" is going to other blogs (or any website that enables comments) and spewing hateful or idiosyncratic posts on those blogs. These people try to polarize discussion, gain control and attention. The best way to deal with them is to block them, delete them, and report them; they have no place in cyber-universe.

Just as we enforce social rules of communication in real life, so we do it on the blog, which then reflects and enforces those values back onto us.

I love writing blogs. I have creative space with lots of fun tools and gadgets to do all kinds of things. I find that I feel more like myself when I am writing, and a blog is a fascinating tool to conduct my personality onto the cybernet.

A blog is a wondrous piece of technology. It's both an extension of ourselves and our values as well as a self-reflective mechanism for changing those values.

******

I'm also not the only one writing a blog about a blog. ;-)


Sharing is Caring...Or Maybe Just An Obsession


HTML:

To all appearances, making a blog seems easy. It’s been made easy by our constant drive for greater and greater conveniency, quickness, sharpness, as if we want to be made sharp and quick by our own technologies.

I click to blogger.



I click on new blog. I choose a template. I can go to the links on the side and, with a mere few clicks, I have a template for my blog complete with a picture of me and my profile description. I have a gadget (or widget) ready at the bottom.






But as I move into the real meat of the blog, I realize that the blog’s simplicity is only a mere façade. There is a vast HTML and Javascript framework which build into each other to create, creating connections, supervising the correct flow and appearance of information that we so desperately crave. Every detail is diagrammed into endless minutiae of equal signs, formulas, numbers, and hashtags. HTML, separate from Javascript, saves information regarding formatting and appearance.

Because I couldn’t explain it better myself, I found an apt definition of HTML (and how it’s different from Javascript from Christopher Heng:

In the same way, web pages are simply strings of words put in a special format that web browsers are able to display. While the format of Word documents is simply called "Word format" (or "doc format"), loosely speaking, one might say that web pages are formatted using "HTML". Take the paragraph of text in the box below for example:

This is an example paragraph to illustrate what HTML is, for the purpose of explaining common terms like HTML, JavaScript and PHP.
If you were to peek into the raw code for the above words, you will see the following:

This is an example paragraph to illustrate what HTML is, for the purpose of <a href="http://www.thesitewizard.com/html-tutorial/what-is-html.shtml">explaining common terms like HTML, JavaScript and PHP</a>.

So, for example, this Georgia font is able to look like this because of the following coding:

"<div dir="ltr" style="text-align: left;" trbidi="on">
<b><span style="font-size: 12pt;"><span style="font-family: Georgia, Times New Roman, serif;">So,
for example, this Georgia font is able to look like this because of the
following coding</span></span></b></div>"

Something like that...

Everything on this post, switched to HTML, looks like that. Even the bar across the top, telling us how to format the font, insert links, movies, pictures - everything is running to the Shakespearean play written in the background coding of this blog.

Humanity:

As a culture, easier access of technology has led to easier access of information, which has created the wave of pushes and pulls by way of giving and taking information. I write this blog to give information to those hungry to seek it; when did this cultural phenomenon arise? How did it grow to such a degree? Perhaps people have always been doing this. Aristotle's books were just lecture notes, after all. 

But going further...How do we codify information so that we can relate it? How can we make information - mere, unintelligible script - into an appearance of text onto a webpage to be viewed on computers by humans? When can we have enough information?

How can we push further and further towards Gatsby's green light, an unattainable desire we so obsessively pursue?



Linking

If you want to learn more, you can click here to get to Mr. Heng's website.

Linking, in this fashion, is just more HTML script. It formats the blue or red or black font different from the font color of the rest of the text, as well as underlines it.
The linking, while you might think is something like Javascript which can do fun things like widgets, is in fact also HTML. We can see another brilliantly written explanation from our friend, Mr. Heng:

Notice that it is more or less like the text given earlier, except that there is additional information embedded. For example, the portion that says <a href="http://www.thesitewizard.com/html-tutorial/what-is-html.shtml"> (which I placed in a different font above to make it easier to spot) tells the web browser that what follows, until </a> is reached, is to be regarded as a link pointing at the web address http://www.thesitewizard.com/html-tutorial/what-is-html.shtml

HTML is an instruction manual that your internet interface, and your textual links as well as pictures, can't live without. It won't even exist. For example, here is the HTML for the first image I used:


"<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgt0DUYlbZzDOgUlm0aYbyd_bDc8rt1fD43-1Dr581CrwFxRHo_FxHeGao1oj0wtxiJfLymnqJELPYU1UJn48gig22rDuJQ9K47DrKa5HBR_UgUzT1bf2FS5IkpkOtb2kZi1WRyuwg5I0M/s1600/Fullscreen+capture+1252012+111132+PM+-+Copy+(2).bmp" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgt0DUYlbZzDOgUlm0aYbyd_bDc8rt1fD43-1Dr581CrwFxRHo_FxHeGao1oj0wtxiJfLymnqJELPYU1UJn48gig22rDuJQ9K47DrKa5HBR_UgUzT1bf2FS5IkpkOtb2kZi1WRyuwg5I0M/s400/Fullscreen+capture+1252012+111132+PM+-+Copy+(2).bmp" width="400" /></a></div>
<br /></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">"


Upon deleting it, my screen capture was gone, erased from the instruction manual like it had never been there.

What was just a way to remember information about size, shape, font, and appearance also now functions as a way of giving directions to the internet. HTML isn’t just the paint on the road, or the medians or the width and number of lanes – HTML is the road itself, leading in infinite numbers of textual links all over the interwebs. This is how one can go “Wikisurfing” or “blog-hopping,” accumulating the greedy amounts of information we seem to uselessly need in this age of information. HTML is our essential enabler, feeding our addiction to greater and greater amounts of information.

Javascript:

It's close cousin, more insidious, with the "hard drugs," is Javascript or PHP. It's a programming language, which is different thatn HTML script. It can't make things look pretty. But it can add what is called a "web widget"or gadget, which is basically anything that is a more complicated operation. Christopher Heng explains again: 

"If you want your web pages to do different things depending on the situation, you will need a programming language. For example, some websites want to provide a membership facility where people can log into the site, and access certain information. Other sites provide a feedback form so that visitors can contact them. All these things require facilities that a simple document format cannot do.

JavaScriptPHP and Perl are three of the most commonly-used programming languages on the Internet. They are used by websites to carry out more complicated operations.
Programs written in JavaScript run in the web browser itself, so if your website has a JavaScript program, the program will be automatically fetched by your visitor's browser and executed on his/her computer."

This definition is broad, expansive beyond simple definitions. It is basically anything fun with linking, but beyond the capability of HTML. I can add Google Apps, for example, or a stock ticker on my blog. I can add Twitter and Facebook (as I have done here).



Blogger has nearly 30 different widgets, with a vast array of functions. Javascript creates playgrounds of information for us, allowing us to both break free from simplistic HTML and do more things, but seducing us with a sexier version that only feeds our desire for information further than ever. 

***********

Interestingly enough, Mr. Heng must have added protective measures to the HTML coding on his website. He made it so that nobody could actually copy and paste any of his material - you can only link to his page. I can't identify the HTML protective script, so I am going to have to just take you to the website.




To All Looks and Appearances


This is the real heart of the template – the colors, the background pattern, the “color” that makes the template what it is. HTML script gives it the red vibrancy of the background, and the same-ish color to the various component parts (posts, bio, fonts for everything). I could go to settings and template to change appearances – colors for fonts, colors for links, sizes for everything – in mere seconds.

But what fun is that? I took a look at the heart and soul of the blog.



This message came up as I clicked “Edit HTML”.



Apparently, they don’t want juveniles screwing up their hard work and ending up with a blog that has been chopped to pieces. I tried chopping it to pieces, actually.







I took out one, itty bitty little “>” sign,




and this is what my “Preview” showed me:




The internet didn't know what to do with itself. It had a meltdown and couldn't show me anything.

After clearing changes, I took out the entire first section, which I identified as a distinct section because all the scripts started with “variable name” and "group description" in it. Here is the part I took out:

“/* Variable definitions
   ====================
   <Variable name="keycolor" description="Main Color" type="color" default="#66bbdd" value="#882222"/>

   <Group description="Page Text" selector="body">
     <Variable name="body.font" description="Font" type="font"
         default="normal normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="body.text.color" description="Text Color" type="color" default="#222222" value="#fff5ee"/>
   </Group>

   <Group description="Backgrounds" selector=".body-fauxcolumns-outer">
     <Variable name="body.background.color" description="Outer Background" type="color" default="#66bbdd" value="#882222"/>
     <Variable name="content.background.color" description="Main Background" type="color" default="#ffffff" value="#882222"/>
     <Variable name="header.background.color" description="Header Background" type="color" default="transparent" value="transparent"/>
   </Group>

   <Group description="Links" selector=".main-outer">
     <Variable name="link.color" description="Link Color" type="color" default="#2288bb" value="#ffffcc"/>
     <Variable name="link.visited.color" description="Visited Color" type="color" default="#888888" value="#ddbb99"/>
     <Variable name="link.hover.color" description="Hover Color" type="color" default="#33aaff" value="#ffffff"/>
   </Group>

   <Group description="Blog Title" selector=".header h1">
     <Variable name="header.font" description="Font" type="font"
         default="normal normal 60px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 60px Georgia, Utopia, 'Palatino Linotype', Palatino, serif"/>
     <Variable name="header.text.color" description="Title Color" type="color" default="#3399bb"  value="#ffffff"/>
   </Group>

   <Group description="Blog Description" selector=".header .description">
     <Variable name="description.text.color" description="Description Color" type="color"
         default="#777777"  value="#ffffff"/>
   </Group>

   <Group description="Tabs Text" selector=".tabs-inner .widget li a">
     <Variable name="tabs.font" description="Font" type="font"
         default="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="tabs.text.color" description="Text Color" type="color" default="#999999" value="#ffffcc"/>
     <Variable name="tabs.selected.text.color" description="Selected Color" type="color" default="#000000" value="#ffffff"/>
   </Group>

   <Group description="Tabs Background" selector=".tabs-outer .PageList">
     <Variable name="tabs.background.color" description="Background Color" type="color" default="#f5f5f5" value="#662222"/>
     <Variable name="tabs.selected.background.color" description="Selected Color" type="color" default="#eeeeee" value="#552222"/>
   </Group>

   <Group description="Post Title" selector="h3.post-title, .comments h4">
     <Variable name="post.title.font" description="Font" type="font"
         default="normal normal 22px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 22px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
   </Group>

   <Group description="Date Header" selector=".date-header">
     <Variable name="date.header.color" description="Text Color" type="color"
         default="$(body.text.color)" value="$(body.text.color)"/>
     <Variable name="date.header.background.color" description="Background Color" type="color"
         default="transparent" value="transparent"/>
   </Group>

   <Group description="Post Footer" selector=".post-footer">
     <Variable name="post.footer.text.color" description="Text Color" type="color" default="#666666" value="#eeddcc"/>
     <Variable name="post.footer.background.color" description="Background Color" type="color"
         default="#f9f9f9" value="#772222"/>
     <Variable name="post.footer.border.color" description="Shadow Color" type="color" default="#eeeeee" value="transparent"/>
   </Group>

   <Group description="Gadgets" selector="h2">
     <Variable name="widget.title.font" description="Title Font" type="font"
        default="normal bold 11px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal bold 11px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="widget.title.text.color" description="Title Color" type="color" default="#000000" value="#ffffff"/>
     <Variable name="widget.alternate.text.color" description="Alternate Color" type="color" default="#999999" value="#999999"/>
   </Group>

   <Group description="Images" selector=".main-inner">
     <Variable name="image.background.color" description="Background Color" type="color" default="#ffffff" value="#ffffff"/>
     <Variable name="image.border.color" description="Border Color" type="color" default="#eeeeee" value="#660000"/>
     <Variable name="image.text.color" description="Caption Text Color" type="color" default="$(body.text.color)" value="#333333"/>
   </Group>

   <Group description="Accents" selector=".content-inner">
     <Variable name="body.rule.color" description="Separator Line Color" type="color" default="#eeeeee" value="#772222"/>
     <Variable name="tabs.border.color" description="Tabs Border Color" type="color" default="$(body.rule.color)" value="$(body.rule.color)"/>
   </Group>”

I had no idea what it would do, but I felt safe being able to undo my changes. Here is what it looked like before the changes:




Here is what it looked after the changes:




Pretty cool, huh? HTML is a stud. It is both a product of our desire to design and make beautiful every object of our creation as well as a method which feeds our desire to make things beautiful. We extrapolate our desire for creativity into this seemingly innocuous (and confusing) sequence of numbers, letters, “<” symbols, = signs, and $ signs. It’s one of the most complicated things I have ever seen, and it dictates the rules by which the Internet lives – to all looks and appearances.


********

Interestingly enough, after I posted this, this is what my blog looked like:


It looks like I need to adjust the template a little bit so I can make room for my images. This is the first time something like this has ever happened to me, and I am not sure how to correct the error. I hope it isn't because I've been messing too much with the internal skeleton of the blog. I probably missed a quotation mark somewhere, and now there isn't enough room.


I went to "Adjust Widths":


And I fixed the issue. =)