inartistic (John ⋄ Yama) (inartistic) wrote,
inartistic (John ⋄ Yama)
inartistic

  • Mood:

148: Developer's Diary 23

Back in July I started a post series detailing my work in trying to develop a large scale UNDER CODE fansite. The posts were purely for myself, and so I kept them private. I think I'll pick up the series again, but this time I'll keep the posts public—not because they're interesting, but because I'm no longer afraid to publicize my failure.

September 23rd... Clearly I stopped updating this diary, but I didn't stop my work!! I put up an α version of the site, then did a soft re-launch as weloveucp.com (although I still like my original idea of underco.de [and in fact I bought that one as well]). And now I'm working on the β version!

---

The nature of my work has changed, since I sort of haphazardly decided to upload the site and publicize it. It was certainly a mess when I made its existence known, but I cleaned it up over several rapid iterations so that the very basic functions worked (“worked”) well enough for temporary public use.

However, because of this brash decision to speed up development time (and pressure), my work necessarily moved away from a planned, one-size-fits-all approach toward a fit-the-moment approach. And in some ways, it's an improvement; in hindsight I realize that, although centralization is good (and in some very future version of the site I will probably try to recapture it), absolute centralization is impossible and, furthermore, probably does a disservice to the project.

So now I move forward no longer relying on form.php for every little thing and coding new SQL queries when I need to, and so on. However, I am still using the same page framework that I came up with very early on: index of the main directory points toward index.php of the php directory, which itself houses the layout template and points toward the index of whatever folder is currently being called by the URL query. This is coupled with a chdir(). This makes calling files from various folders exceedingly easy, and I've had no trouble with it yet.

On the subject of departures, just within the past week or so I've been focusing on redoing the layout. On one hand, I'd planned to do so since I launched the α, since it was coded quickly for only a handful of browsers. On the other hand, I was also becoming frustrated with the inflexibility of it all—I would forever be stuck with two columns, whether that was best for the particular page or not.

So I first set out to make a grid—my first—which is something that I've sort of resisted in all my years of webdesign. I never really understood the purpose of a grid; it seemed that people used them to make sure the visual edges in a page lined up, but I already have an acute awareness of concept and so didn't see any purpose in using a grid. As it turns out, the grid is the solution to the rigid column structure that was bothering me.

My grid is based on a 1000px layout, but is fluid if that main value is changed. Its general structure is a row-specifying div and a column-specifying div within that. The column specifier sets the number of columns (or, in cases of unequal width, specifies which number of columns the widths are to be based on and then, essentially, the colspan of those columns, ex. c3-AAB to indicate two columns, the first of which is 2/3rds width). Finally, styles will be applied to the immediate children of that div, whatever they may be.

Creating and using a grid is a departure for me in many ways. First, as I said, I never saw any use for a “grid” before now, so just exploring that avenue was something new. And second, more importantly, the grid requires the use of many extra divs with many classes, which is 100% against the philosophy I've always taken when coding. It's long been my personal aim to use as few empty or otherwise redundant divs as possible, to use descriptive elements (article) wherever possible, and furthermore to do so without the use of classes or ids. Although I still admire that philosophy, it ultimately seems to create more problems than solutions with a website so large. So, for now at least, I suppose I'm getting myself reacquainted with the million-class waters.

So I think that's all of the big stuff. Now to quickly go over something specific:

---

Tonight I worked on adding a tweet button to the entries. I used the default button code from twitter and first struggled with getting that to work—in the end, it seems that, for the twitter button code, I should leave the & as & (rather than writing out & as I would normally do in links).

From there, I wanted to style the button so that it wouldn't clash so much with the layout—easier said than done. Eventually I settled on creating a button of my own; I knew I could structure the tweet link myself, so the only issue was getting the number of previous tweets to display (not essential, but I really wanted it). It turns out there's a really easy method to do so (even though twitter docs say it's impossible) using json to get a file. Turns out... my shared server doesn't allow file gets. So that was a dead end.

What I ended up doing was placing the twitter button iframe (which is automatically added by their script, or else I wouldn't use it) within a span. That span is styled so that only the speech bubble with the tweet count is shown; that span is then placed beside the homemade tweet link, all of which is within another span that takes on the styling of the entry footer links. At the end of the day, it's not exactly what I wanted, but I'm pretty proud that I stuck with it and worked something out. And hey—it almost looks better with the default speech bubble!

---

Well I think that's all. I just wanted to record a bit of that struggle I had today... and I'd like to start up this series again, just for my own sake of looking back at it later. I'm proud of myself for not giving up on this giant project (even though the full featured site has been placed on the backburner in favor of building a good blog...).
Tags: webdesign
  • Post a new comment

    Error

    default userpic
  • 3 comments