Eileen Fitzgerald School of Speech & Drama

The Making of my First Website

This website was for a drama school that I attended in my youth. Knowing the client beforehand and the school itself was important in understanding how the company worked and the values it wanted to incorporate into the website. Aimed at parents and children ranging from 5 - 20 years of age, we wanted to create a website that was dramatic and fun to the eye and appealling to potential students of the school.

The client has an extremely impressive reputation in the area and so attracting business wasn't their main use of the website. The primary role of the website was to be source for information on the school and to have a "home-base" on the internet.

At the time of building this website, I had been revising HTML, CSS and Javascript for 6 months through various online resources.

Notes Upon Reflection

The black background- a big no-no for UX!

Although I had known the rule to never use the "real" black, (#000000), I still went ahead and used a shade of black for the backdrop of the content website-wide, breaking a principle of UX regarding readability. This was a discussion I had between myself and the client, and some feedback we received. It was something the client really liked and wanted to keep given the "dramatic" feel it contributed, and so we went against popular opinion and kept it anyway.

Hosting on Github Pages

Hosting on Github Pages at the time was ideal for me as I entered the world of the web. It allowed a sufficient level of security given that no sensitive data was being dealt with throughout the website, as well as enough bandwidth to manage the traffic that I could estimate from their Facebook page statistics.

The Process
Functional Requirements
  • Defining the purpose of the website and what it should be used for
  • Look at target audience and what they need from the website
  • Define the flow between pages and information to be displayed
  • Discuss overall desire of look and feel of website
  • Outline the primary and secondary brand colours
  • Look at examples of other websites in the industry
  • Produce a first draft on Figma
  • Look for and decide on the best UI framework for the website
  • Gather feedback on the layout and design
Building the Website
  • Coding the prototype into a fully functional website
  • Github private repository is established and shared with the client for transparency and progress
  • Feedback and communication is frequent so changes and ideas can be made early on in the process
  • Client is invited to test out the website and share with a select few to gain further insight and UX feedback
  • Cross-device and cross-browser testing is carried out to ensure compatibility and optimisation
  • Performance testing is completed to ensure that loading times are efficient and that media materials are optimised
  • Keywords are strategically placed throughout the website using font styles and high-ranking heading tags
  • Title, description and keyword metadata is filled out appropriately
  • Linking the webpage to the company Facebook and Instagram pages for greater credibility
Hosting & Security
  • Client wanted an inexpensive hosting option and I chose Github Pages given how local the company was based and the estimated traffic
  • Domain name was secured and set up on Github Pages
  • Use of HTTPS through Github Pages to ensure better security and encryption
Post Launch
  • Google Analytics is inserted into the website to track user activity and gain further insight if needed
  • Further feedback may be given should any unexpected behaviour occur
  • Content and media updates are welcomed whenever necessary to help the SEO and, of course, the users of the website!

. . . so get in touch!

I'm currently looking to work in a team role but I'm available for any freelance projects! I focus on SEO and UX when working with any clients one-to-one :]