Friday 19th of September 2008, 08:08:08 am
Making the current version of my personal homepage was, and I will not lie, fun. It's a mix of technologies that all work together to present what seems to be fairly straight forward and simple data. Which means that I did it right. If it looks ridiculously complicated, that would be lying about what the content is, and if it didn't make it to your browser in a meaningful way, then I would have failed in my programming.
This website combines several technologies: PHP, GD, SQLite, ECMAScript (known better as javascript or jscript, which are individual flavours of ECMAscript), (X)HTML and CSS. It also talks to Flickr to get the header image for the site. That part is quite nifty: Flickr has a special way of accessing its data so that you can then use that data to build website or application content. I use it in a fairly simple way: I poll my flickr account for the most recent photograph on it, and then do two things with that information. 1) I retrieve the "large" jpeg version of the image and crop it to fit in the header box using PHP and GD, and 2) I abstract the link to the actual flickr page that exists for that image so that when you click the header you will go to the correct page. I just thought that was fun to do, as exercise so to speak.
The website also has a "blog" like function to it, where I can post message that get timestamped and show up in "most recent first" order. This uses a database, for which I use SQLite. SQLite is a rather amusingly small SQL database system, where each database is just a file. You "connect" to a database by simply opening the file with SQLite and then you issue SQL commands as you would any other relational database. However, because I don't want to have to use a lot of manual database maintainance, whenever I look at my homepage I get a special set of navigation commands, which let me work with my "blog" to post new entries or edit/remove already posted ones. This uses javascript together with PHP to get the job done.
Then there is the matter of the nav menu itself. If you look at the page source, you will see the rather non-HTML element "navmenu", but javascript rewrites that tag into a set of divs instead, which means you see several navigation "boxes" instead of unknown elements.
Finally, everything is styled using CSS2, so that things look nice. CSS2 is used for one trick though, and that's the loading of the cropped flickr image in the header.