3/01 – Personal Website

 This project was to create a personal website that is based on my personality and act as an online CV.


As research I viewed several webistes to gain an understanding of how it operates.

From viewing the websites, I saw that colour and layout are important factors when making the site. Colours are mostly used to depict a person’s personality, and the layout gives a viewer an understanding of their nature, from whether they are organised, friendly to creative to indoor or outdoor person.

Details for Website


  1. Nature
  2. Myth
  3. Books (fiction)
  4. Anime
  5. Music
  6. Drawing
  7. Snow
  8. Rain


  1. Tomatoes
  2. Violence


  1. Parkour
  2. Football
  3. Badminton
  4. Drawing


  1. Kind
  2. Reliable
  3. Punctual
  4. Calm-Relaxed
  5. Easily amused
  6. Trustworthy
  7. Adaptable


  1. Colour – Green
  2. Animal – Wolves
  3. Font – Old English Text MT
  4. Film Genre – Comedy/Action
  5. Book – The Night Angel Trilogy

I decided to simply stick to the basics, using Microsoft Office – Frontpage I decided to use wolves to depict my personality. Wolves are known to hunt in packs which shows I can work with others, they are loyal to their pack and spent most their time running as I enjoy. I also decided to use my paintings of wolves as part of my designs as it connects to me personaly, as my paintings fuse with an element of nature, it applies my likes and nature of my personality.

For the hyperlink buttons, I placed them on DogTags because I am always seen wearing mine wherever I go as well as represents a persons identity. I named my website S.T.A.I because it is a code my friends I use to live by – Study Train Adapt and Improve. I used Old English Text MT for my text as it is my favourite font, although it is old fashioned I believe it has a playful within the curve whilst still remaining disciplined.

My homepage, portfolio and profile pages contain my paintings as either a background layout or as a link.

I began by first asking my sister to introduce me to how to operate Forntpage and understand how to write the codex. I also researched several links to explain and obtain HTML Codes.

Links for tuturial & HTML Codes:-

  1. http://www.w3schools.com/default.asp
  2. http://www.wondershare.com/flash/html-photo-gallery.html
  3. http://www.quackit.com/html/codes/html_marquee_code.cfm
  4. http://www.scriptfx.com/
  5. http://www.smashingmagazine.com/2007/05/18/30-best-solutions-for-image-galleries-slideshows-lightboxes/

Icons for hyperlinks:-

Dogtag holds the icons for link to webpages.


Leaf link for different link within my Profile page

Website Pages:- Contains bugs – was unable to publish(working on fixing it)


Background depicts my love for nature as well as my personality as being calm and serene but also a tempo within the water shows my adaptability as a flow. The Wolf stands with pride, explains my characteristics as proud and loyal. It is in my favourite colour – Green – an illustrates my my kind and soothing nature. Chain & dogtag to show my identity as i always wear my chains.  


My contact page background depicts wolves howling to the moon as that is how wolve communicate with each. Although the moon is not relevant to the communication aspect between wolves, I am using the moon as a calling card.


The tree wolf on the page was to link up with the leaves. My initial idea was the have the leaves falling to contain my images from my gallery of work to show that the viewer is leafing through my portfolio in an illusionary sense however my lack of experience made my unable to complete this task.


The leaf wolf is again my personal painting but I added digital leaves to link to different aspects of my profile.

Profile Links

Short paragragh of how my friend views me

Icons of my favourite website and hyperlink to them.

Image of myself which appears when you click on the wolf’s eye.

And explosion of words that describe my personality as well my likes.


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

%d bloggers like this: