After a few weeks of lovely toil, I finally finished my project for C2 Handcrafted Collections. This project was put on hiatus for so long—I took this project last year so that I can fund my wedding. As it turned out, what I thought would be just a two-month project ended up taking nine months to finish.
Well, that's not strictly true. It did not take nine months of work to finish. It actually only took three and a half weeks to finish. Rather, the project was shelved very often because I didn't have the capability to give what the client wanted last year, and when I did have the capability, I was already knee-deep in wedding preparations and an ill-advised 2nd stint in Storgedelphia. Let me explain.
When I first created the original C2 website almost four years ago from this writing, I was a webmaster and HTML coder that didn't have a place to host the website for free (since C2 was a small business and cannot affordt web space) except in Yahoo! Geocities. Furthermore, I was just learning HTML then (HTML 3.0, at that) and there were problems about cross-browser performance. JavaScript was a new and magical weapon at a time when glitzy web sites were the fad. So, with those limitations, I coded and created.
Of course, the main drawback of that old school approach to creating websites was that, if the content needed to be updated or revised, the webmaster had to actually delve into the code again and make revisions there. I didn't even want to think about revising the look at that time—it was impossible and difficult to do and would mean that I would have to start from scratch; that is, if I was foolhardy enough to actually take the job of revising the site. I guess I was feeling foolhardy.
One thing about a web site for a small business in the Philippines is that prices change very often, and often very dramatically. It came to the point that having a web site for them was just an empty boast. We have a website! Yeah, right... even if the information in it is old and obsolete. Now, the proprietor of C2 tried to get my old boss to do the updating. Even if he had HTML experience (which was even more limited now than what I had years ago) or even if he had the time (which he didn't, since he was too busy doing the "network" thing), I mean, he wasn't stupid. It was difficult for the original designer, let alone somebody trying to understand my very old and unsemantic code. I had, thanks to my earlier training in programming back in college, made the code as structured and as "commented" as I can without making the HTML file too large. Still, updating the site means I would have to edit each and every one of the web pages. My ex-boss passed it on to me and I accepted it because I thought it was easy money and I was feeling creative.
That is, until I met my hitherto indirect client.
Though unschooled in the creation of web pages, or maybe because of it, she said that she wanted an easy way of updating the site without having to hire a webmaster to do it for her. What? I said. She thinks she can enter the info or edit/update the info herself? Inwardly I laughed and tried to "educate" her; but she was adamant about having that capability. And, oh... adding more pictures. It was with a sinking heart that I found that she was serious and that she expects to get what she wants.
I knew much more about HTML, JavaScript and, my new toy, CSS by now to know that the project was remotely possible. Plus, I had created a very attractive wedding site for my brother in Geocities and I was feeling pretty formidable. But there was no way she can edit or update the contents in what she demands in as simple an interface as possible. It is, of course, possible to create such a site, but not in a free site like Yahoo! Geocities. I needed a server that will allow PHP code, or probably Perl Scripts that will allow her to enter a site, type/edit within a form and make the necessary adjustments. I thought that, in the meantime, I would create the "look" of the new site (it had to be a new site, the reasons of which will be clear later) before entering the "code". So, I did my research as well as I can, drafted a contract, put up a price, and started away...
... into nothingness. I can't find a free server, or a provider, or a host that will do it for me. I was also finding that learning PHP or Perl on your own is next to impossible if I have to work on other smaller, less ambitious jobs so that I can keep a roof over my head and food on my table. I can, of course, use frames, and the only type of text that she can edit are those that require the least amount of code, but that was a desperate move.
Finally, in all my researches, I came across these wonderful, very informative sites which have changed the way I look at creating sites: glish.com and A List Apart (or ALA for short). For the first time, I encountered elegant, speedy sites without all the Flash and glitz. It was there that I first truly learned the power of CSS—Cascading Style Sheets—for creating what I needed; actually, creating all of the web sites I would ever create. I also found that my knowledge was somewhat limited after all, and that most of my HTML is already obsolete or being phased out. Still, finding those sites was the first of some very important breakthroughs.
The second breakthrough actually should have happened months ago, specifically, around the month of January of 2004. My friend, Wulfgar, was keeping a blog at Tabulas and I became introduced to it because of something really tear-jerking post concerning my brother's wedding on the 3rd of January 2004. I had, of course, known about blogs before this, but had thought of them as the recourse of people who knew no HTML to set-up their own sites and is non-customizeable as far as visual design was concerned. As I said, it should have happened months ago, but I only read that particular post. Around August, I just wanted to relive some happiness by visiting that post again, then exploring his blog, and finally making the discovery that one can make limited customizations to the HTML code of the blog itself. Breakthrough number two: if I can just create one master template with the graphic design I wanted, then my client can just later on enter or edit her previous posts.
However, I found Tabulas too unwieldy and the URL just wasn't, well, domainish enough for me. I, instead, found the original Blogspot and found that, at that time, the templates can be customized. Besides, I apparently joined Blogger since March 2004 to detail the wedding preparations process.
I already had all I needed but, as I said, I took an ill-advised stint in that school to be its Computer Teacher again. There were a lot of other factors that contributed to my having to work harder than last time, involving a self-important individual and people with misplaced trust; but at least, in actually teaching the new XHTML I solidified my knowledge on it. I still can't claim to be proficient in coding without a manual, or doing more than just copying and modifiying CSS or JavaScript, but I had progressed to the point that I can teach students to create Blogs and later modify their templates using whatever knowledge they have.
In the meantime, of course, the project was not being done.
By November, I had resigned so that I can more fully concentrate on preparing for my wedding. My wife was in Australia at the time and I had to do a lot of the work myself. She was coming on the first week of December and things were coming to a head.
I got married on the 2nd Saturday of January 2005, went on a honeymoon, did a lot more odd jobs for about two more months as well as fixing a lot of the required paperwork to be able to follow my wife to Oz, before I finally officially started work on April Fools.
Basically, I had two templates that I could have easilly built the project around. Basically, it involved the use of a three-column layout, with a fluid middle column and a header and a footer. As I still am not an expert in CSS, I thought it would be faster if, instead of creating the basic template from scratch, I would instead make modifications on it. The two templates are from glish and from ALA. I experimented with both and decided upon the ALA method of using negative margins as the more flexible and modular layout.
I had been working on the code for about a week before I showed it to my wife. I had, until then, been basing the visual designs on the original graphics of the old site, and Ærynn wasn't happy with it and wanted it changed. Now, in the old days, changing "the look" of a site after a week's work of design was just too much to ask if you are on a deadline (I was, by the way, more than six months overdue; hehehehehe). But, thanks to the "magic" of stylesheets and semantic markup, all I did was, yes, change the stylesheet... until I hit upon a snag.
Apparently, with all the little modifications I was making to the original ALA template, simply changing the stylesheet wasn't a solution. Still, semantic markup still saved me, since it has made the structure of the page itself much more apparent to me. Using the new stylesheet, I eventually did start from scratch, creating my own markup and (oh, joy!) my own stylesheet. It was still based on what I learned from ALA, but at least it was not a carbon-copy anymore. Plus, I was able to create a separate stylesheet for when the page is printed out.
One reason I lagged so many months ago is that I had forgotten that form followed function and not the other way around. I had been trying to create the visuals first before dealing with PHP or whatever came later. That was wrong. One has to have the bones in place first before fleshing it out. With Blogger, I didn't need PHP to generate content and since the content is not destroyed even when I change the template, it was the best solution. Plus, it allowed me to design around function. The graphics, which took more than a week to set up, was just secondary.
A number of other tools helped me as well. I have already been using Mozilla Firefox for a while as an alternative to Internet Explorer, not because it was a safer browser than IE (which it is) but because ALA said that it was more web standards compliant than IE.
Of course, there was the lovely Firefox Web Developer Extension (which I downloaded from here) that made my life easier when it came to validating my code and experimenting with CSS.
No comments:
Post a Comment