Here's my final edit for 'Dog'
Friday, 27 May 2011
Tuesday, 10 May 2011
Social networking, alt tags and linking to my online marketplace
As social networking is a key aspect of marketing i thought it imperitive that i link the site to my facebook and newly formed twitter account, something i did specially to link to the site and add another avenue for marketing and communication, when needed. These links are shown at the footer of each page, this way visitors can easily view/contact me through my facebook and twitter. I used the same photo of myself for my twitter as is on my hompage so it is obvious straight away to any visitors that they have come to the right place.
I added alt tags so that different aspects of the page are named when you hover your mouse over them. This will be helpful for relevant content if and when i come to optimise the site for google in future. According to the tutorials i used to help me build the site inserting alt tags is also considered 'good practice'.
Finally, as i already have an online marketplace (www.part-x.co.uk) i thought it would make sense to link both my personal portfolio and this site, and make it obvious they are owned by the same person. I have a link both on the home and portfolio page which can direct users to partx. This is to ensure i capitalise on all visitors to my portfolio in terms of marketing my online marketplace. It also shows potential employers that i have skills in aspects of business and marketing as well as the film aspect of my resume.
I added alt tags so that different aspects of the page are named when you hover your mouse over them. This will be helpful for relevant content if and when i come to optimise the site for google in future. According to the tutorials i used to help me build the site inserting alt tags is also considered 'good practice'.
Finally, as i already have an online marketplace (www.part-x.co.uk) i thought it would make sense to link both my personal portfolio and this site, and make it obvious they are owned by the same person. I have a link both on the home and portfolio page which can direct users to partx. This is to ensure i capitalise on all visitors to my portfolio in terms of marketing my online marketplace. It also shows potential employers that i have skills in aspects of business and marketing as well as the film aspect of my resume.
Google Maps
I wanted to integrate my website with google maps, primarily to make my site, and thus my image, more competitive in the short term. However i believe if i was to ever do free lance work in the future this would be beneficial for clients or anyone else wanting to find me. Although for the time being the address is set to my term time flat this can be easily changed to whatever premisis i decide to work from in future.
I found some open source code for both the enquiry form and google maps integration which was relatively simple to copy and paste into my page.
I found some open source code for both the enquiry form and google maps integration which was relatively simple to copy and paste into my page.
Open Source Code
I found a few different types of open source code which i could use to make my site a little more interactive, as this would serve as my professional site for the forseeable future i wanted to create a site good enough to create a positive first impression of my work, potentially for employers to use to gain an insight into what skills i have to offer.
I searched on google for a rotating banner so that the picture of me, which i photoshoped on to a brick wall earlier, would rotate continuously. This would give a sense of interactivity and allow the hompage to avoid looking static and stale. I found some code called jquery that would do the job so i inserted this into my CSS using the demo.
I searched on google for a rotating banner so that the picture of me, which i photoshoped on to a brick wall earlier, would rotate continuously. This would give a sense of interactivity and allow the hompage to avoid looking static and stale. I found some code called jquery that would do the job so i inserted this into my CSS using the demo.
Lightboxes
As i mentioned before i could have embedded my portfolio videos, or just made each video open in a new window, however i decided against this in order to continue with the clean minimal theme of the site. Instead i used lighboxes so when the screen shot of my worked is clicked on the video opens up in a centred, small window while the rest of the screen goes black.
In order to achieve this i used a lightbox called 'prettyphoto. This was simple to insert with their documentation and you can easily play youtube and vimeo video which was perfect for the nature of the work i wanted to present. Below is a link to what I used: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
In order to achieve this i used a lightbox called 'prettyphoto. This was simple to insert with their documentation and you can easily play youtube and vimeo video which was perfect for the nature of the work i wanted to present. Below is a link to what I used: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
The hard part-Divs and CSS code...
Once i had found my imagery and general theme for my site i went on to set up the divs, containatives and then the CSS code to instruct and route the divs. This was an arduous task and had me regularly confused, unable to work out why the site was not following the instructions i set out in the code. However after what has seemed like a very long time my about, portfolio and homepage are all done, which just leaves the contact page to complete.
I have kept the file structure as simple as possible keeping all html pages in the root folder and images, css in another folder.
Previous to setting up the divs and CSS i took screen shots of my two short films in order to resize and use later as i want to set up lightboxes for both of my videos, rather than just embedding a link.
I have kept the file structure as simple as possible keeping all html pages in the root folder and images, css in another folder.
Previous to setting up the divs and CSS i took screen shots of my two short films in order to resize and use later as i want to set up lightboxes for both of my videos, rather than just embedding a link.
Subscribe to:
Posts (Atom)