Peronal Hero Website
As my final assignment for a Web Authoring module I took during my postgraduate diploma in Interactive Digital Media , we were asked to plan, design and build a website using html and css. The website was to showcase the life or work of someone I consider a personal hero. The 2 deliverable for the site were a design document and a finished website.
As an avid golfer and golf fan, the personal hero that I choose for this assignment was Irish golfer Padraig Harrington. The aim of my website is to inform the user about Harrington’s life and provide the latest news on his career.
My first step in creating my site was taking a look at some other sites that I liked and taking some inspiration from them. Most of the inspiration I was looking for was in terms of layout and structure. I decided to keep my goals for my website realistic and achievable. I took ideas and elements from websites that I knew I could implement and began sketching some layouts on pieces of paper. A simple, clear, easy to navigate website is what I was hoping to achieve.
After I had a couple of layouts drawn by hand, I decided it was time to work on my site map to help me decide what content I would be using and how best to display it. Once the site map was complete, I could choose what layout I thought would work best for my content. I knew from the beginning that I would have plenty of images from throughout Harrington’s career to use on the site. I decided on a layout that would let me display lots of these images, particularly on the home page, to grab the user’s attention at first glance.
After this was complete I took all the information I had gathered so far and created a site mock up in Adobe XD.
Happy with the layout and colour scheme I began coding my site in html and css. Having previously used Bootstrap to create responsive mobile friendly websites, I was excited to implement grid and flex box, a new technique I had learned during the course, to build my site.
Visit the full website by clicking on the button below: