Website Tour: My personal website

In my return to web design a few years ago, I came back with the goal of learning PHP which was something I always wanted to learn. With that goal, I also expanded my use of CSS and different HTML techniques to come out with a better looking final presentation, in most cases.

v1The first version of the website was kind of cheesy-looking but certainly better than the bland square tables I used to use before. After getting a hang of PHP and opening up the Electronics Engineering Toolbox website, I felt a redesign was in order.

v2_0The redesign came back using more techniques I was experimenting with. With some more CSS research, I could achieve rounded corners (which were done with graphics before) and shadows. With the PHP and MySQL knowledge from the EEToolbox, I built myself a simple blog system. Soon after, I added More Than Starlight to my web portfolio. The blog thing also got a little tired. The next version (numbered as 2.1) was moving toward a static portfolio. v2_1The site was stripped of the blog and it was back to mostly HTML as I got my fix of PHP working on the other two sites. Around the time of the redesign, I was midway through my electronics engineering training and I was starting to work on other projects. I wanted a place to gather and present them all so the next changes were made (version 2.5) to create a portfolio that expanded past my websites.

v2_5There were some more CSS and PHP techniques thrown in again. As you hovered over those four menu items seen in the screenshot above, the opacity of the image would change, thanks to CSS. All of the content was thrown into one file and the appropriate content was displayed using info from the link, grabbed by PHP. Otherwise, I would have created separated pages for everything, although there’s not much of a downside for a site this size. It was just because I could.

It’s always satisfying seeing a website grow in stages. Luckily for me, this was not the only site to do that. Next, we’ll be taking a look at the Electronics Engineering Toolbox. Stay tuned!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s