March 24, 2010

I made a website.

That sentence is the best thing about this assignment: the challenge that building a website seemed to be and the knowledge that I have conquered it. It feels great! I chose to do assignment A (exhibition) simply because I am a visual person and I thought I’d enjoy making an online exhibition much more than making an online resource for an ‘issue’ or ‘event’.

I had a couple of ideas floating around when I began work on the exhibition; I considered making a page for my boyfriend’s band, making a webpage showing amazing architectural feats or a site full of portraits. I love portraits, probably because they’re so much fun to paint. I get so much out of them, so that is the one I went with in the end. Plus, everyone can relate to a portrait. Everyone can get something out of a portrait.

I can’t remember how the title ‘A Spectrum Of Emotion’ came to me. Maybe we’d been learning something about the colour or light spectrum. Anyway, once I thought of it, I was sure that it would work and I could picture how I wanted the site to turn out. (Another painting parallel…)

I decided to go with a really simple design for the website because I wanted it to come across as classy yet artistic, like those professional design sites that have very little junk on them. Similarly, I was very careful with the colour. I didn’t use black for the background because I think you should only use black when you have a really good reason for doing so. In most cases, a very dark grey works much better. I wanted the little text on the home page to have a silvery, transparent sort of a feel to it. Well, I wanted that for the whole site, so I made everything monochromatic except for the photographs.

I ran into several barriers in the creation of my website; the first one being the layout of the home page. Because I decided to make every letter in ‘A Spectrum Of Emotion’ a link, the computer no longer recognised it as several words and it was displayed as:

‘A S p e c t r u m O f E

m o t i o n’

To counter this issue, I tried inserting <p> tags and <br> tags and searched in vain for some sort of ‘<space>’ tag. Eventually I just inserted a ‘C’ in between the words and made them the background colour. For some reason this didn’t work for me and Sharon used her trickery to make it comply.

The battle for the title page was almost over. Thankfully, making the links not blue and underlined proved to be ridiculously easy so in the end, all was well.

Problem 2 was the preconceived idea that we had to put the websites online in order to submit them via a single URl, so I was being extremely careful to find all my portraits in The Creative Commons on Flickr and to not breach any licensing rules. Luckily, in one of our lectures, it was said that we didn’t actually have to put our websites online, that the focus was on our understanding of HTML and CSS. Henceforth, I chose to do my assignment with no intention of uploading it so that it was much easier to find amazing portraits . I am very supportive of copyright regulations so I made all the portraits I used links to their respective Flickr pages to pay homage to the photographers. If I did have to put this assignment online, I would have written to ask for permission or I would have continued to search the Creative Commons.

I was going to use a web dictionary and make all the definitions links to the source site as well, but I liked the definitions in ‘The Collins Concise Dictionary’ better, so I created a link  from the definitions to a a ‘source’ page simply showing the dictionary’s details.

The next, and thankfully last, issue I faced was getting around photographs that had ‘All Rights Reserved’. I tried the usual ‘Copy Image Address’ and it came up as a ‘Spaceball.gif’ which is basically a single pixel. I researched a little on the internet and was instructed to get the image address through ‘View Source’, which seems very obvious in hindsight. I tried this and it worked to an extent: the image showed up on my site, but at only the preview size. Michael gave me some ideas about getting past this; one of them was to check on Flickr for the ‘All Sizes’ button so I could view the image source for the largest image. Sadly this didn’t work for any of my photographs because none of the pages had the ‘All Sizes’ button active. But his second idea worked which was to resize the image through HTML, which I had previously tried but was let down by my inexperience. The only problem with this solution was that the enlarged photographs were very pixelated and I had to guess at the width and height that I was setting them at. It was only tonight that I found the solution – I stumbled across it just playing around. I was on Flickr and I clicked ‘Window’ then ‘Activity’ which brought up a huge list of everything on the site and the relative sizes of the files. I was easily able to spot the biggest JPG file and copy and paste the address into my HTML. Problem solved!

I had wondered if perhaps creating such a small exhibition would be an issue, but then I thought: how would I add extra portraits anyway? For one, I’m out of letters. For another, having more than one photograph per page would take away from the intensity of the portraits. So I decided to keep it a small collection with a basic layout and simple organisation.

A website I looked at when toying with the whole idea was the Dream & Dust exhibition by Sara Mobayen. She has one photo per page with a simple border and ‘previous’ and ‘next’ navigational buttons at the bottom of the page. Her portraits are beautiful and I was able to admire them to a much greater extent due to the unobtrusive background.

I looked up several other online photography exhibitions, but many of them were terribly designed and the creators could have used a few lessons in HTML. Others were well designed but too commercial – I suppose seeing as they’re paying to host a webpage, they’re going to try and make money out of it somehow, but I can’t help thinking it detracted from the beauty of the photographs. That’s the nature of the internet for independent websites, I suppose.

A big thanks to all the fantastic photographers, w3 schools, Collins dictionary, Sharon and Michael.

Anyway, I feel like I learnt a lot about HTML through creating this assignment and it is no longer a big, scary thing I know nothing about. Rather, it is a big, slightly less scary thing I know hardly anything about.


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 )

Google+ photo

You are commenting using your Google+ 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 )


Connecting to %s