A Personal Journey Through Web Development (Part I)

My personal journey through web development began sometime in 2002.  I came across a popular web hosting service called GeoCities whom, if I recall, were generously offering 15 megabytes of free web storage.

I had an idea, build a website for a video game I was very into at the time.  This website would contain all kinds of images, resources, animations, screenshots, information, a bulletin board, and anything else I could think up.

For months I dedicated my free time to this project.  I began to learn HTML and CSS, and even remember visiting Lissa Explains it All to learn some basics.  However, for all the time I spent on the project, I was making very little progress.  I was constantly going through multiple files and changing minor things because I was inlining all the CSS into the HTML.

In the end, I became overwhelmed with developing and producing all the necessary content.  I concluded the process was unrealistic to do and abandoned the project.  Aside from the odd high school class on the subject, my education in web development was over as well.

A new awakening

Jump forward a decade to the summer/fall of 2012 where I began to realize one incredible thing about myself: I wasn’t going anywhere in life.  Personally, financially, educationally, job opportunities, all of it was leading towards a dead end, or was otherwise non-existent.

After accepting this, I begun looking at the kinds of job that were available, especially in areas I had an interest in.  From my job search, I discovered there was a bit of a demand for web developers.

I enrolled in night classes at a community college that winter where I learned how to build a basic website if the year was 1995.  While perhaps not an absolute complete waste of time, I wouldn’t recommend that route to anyone wanting to get into web design and development.  The internet is a behemoth of free and up to date information, you’ll save both time and money.  I did take what I had learned from those months in school though, and began to develop a website to promote my web development accomplishments.

Preface

It has been many years since I laid eyes on these sites, I find it rather shocking.  From the sloppy and bloated coding, the abhorrent design, the padded buzz words in the content, it’s pretty embarrassing.  But hey, everyone has to start somewhere.

This post is an archive of my previous works and designs for this website.  I’ve made slight modifications to each version in order to present them correctly, otherwise all coding and designs have been left untouched.  It is by no means a showcase of my skills as a designer or developer, but as a historic guide from mindless beginnings to the humble present.

Version 1.0 / 1.1

The original.  The inception.  The dawn of things to come.  Version 1.0 has a few unused and/or broken php and html files in its directory.  I venture they were my attempt to get a working email form, as v1.1 omits a dropdown form.

Both have similar designs and functions, including a fixed header with quick jump navigation, a rotating banner, a grid showcasing work with thumbnails loading a Lightbox image, and links to the site if it exists.  There’s a brief about me with contact info, and coding acknowledgement to conclude the page.  Both sites use jQuery 1.10.2 for a Lightbox 2.6 script by Lokesh Dhakar.

Click to view Version 1.0

Click to view Version 1.1

Version 1.0 and 1.1 were last modified around March and April 2014 respectively.

One oh two point never?

I’m not sure why I labelled this v1.2.  Perhaps I never launched the earlier versions to a live server, or perhaps my inexperience was simply showing.  Regardless, this became a completely new site with a different design and stripped of almost all the original content.

The design is more minimal, with poor craftsmanship and more emphasis on the animation.  A blurb about me and links to my email and CodePen account is all of the content.  I began including HTML5 syntax, importing a unique font, and having media queries for responsiveness.

Click to view Version 1.2

Version 1.2 was last modified around July 2014.

The upgrade of sorts

Designated with a major number upgrade, version 2 begins again with nothing from the previous version(s).  The design comes from my fasciation with computer hacking, or my nostalgic remembrance of computers of the past.  I began to learn about front-end frameworks, and in this case was using Bootstrap v3.2.0 to build out the site.

The content continues to be pretty basic.  Large text for the header, a bullet point bio underneath, some links to my CodePen, web development blog, and emailing inquiry in the footer.  I also began to link to the previous designs starting with this version.

Click to view Version 2

Version 2 was last modified around September 2014.

Blinded by design

The site was getting to a point where there was very little if any actual content.  All I was doing was linking out to other accounts I had on other websites.  I knew what I wanted, but wasn’t sure how to go about fashioning it.

One day while sitting on a bus, we were driving pass an advertisement for a new condo.  It was just a graphic background with large text overlaying it, like a fancy and perhaps absurdly large business card.  It looked simple, and even better, seemed simple to duplicate.  So I set to work in photoshop to create a duplicate of what I remembered.

I abandoned the A.G. Skryp title in favour of my full name, with the large text taking centre stage and a best guess job title underneath.  Outgoing links to other accounts and previous theme version conclude the content.  There is no javascript or any framework, and the coding contains little unnecessary bloat.  Critiquing my work, it’s a good idea that’s executed poorly.

Click to view Version 3

Version 3 was last modified around September 2015.

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *