I didn’t have a huge amount of time to work on the site this weekend so I decided to tackle some simpler sections.
I started with the footer. I think this can be a really important part of a website. Often, if I find a website overly cluttered or with a lot of submenus, I will go straight to the footer to see if I can find what I’m looking for. Since this site is a portfolio, the layout should be simple with all information readily available. A simple footer compliments this so I have kept it minimal. I included key external links, a download link for my CV, and to aid in finding any specific info, a search bar.
Since I had set up the download link for my CV to the footer and still had some time, I wanted to attempt to get the CV page up and running. Initially I used the file block which allows the file to be displayed inline. I liked the simplicity of this but unfortunately, this solution does not work well on mobile and tablets. Considering the increasing use of mobiles and tablets in people’s daily workflows, I believe it’s important to factor this into the website design process. It can also cause some accessibility issues as although screen readers are intended to work with inline PDFs, there can be compatibility issues.Whilst I could offer a download link to view it externally as a pdf, I wanted a more integrated solution.
There are plugins available that aim to solve this problem but for now, I want to try to minimise plugin use. Excessive plugins can cause performance issues and at this stage in development when I don’t know my eventual needs, I’m keen to avoid relying on a plugin if I can find a native solution.
Two solutions I could see were to use WordPress text blocks or a custom html block to build my cv directly on the page. These both share the same disadvantage – rather than simply uploading a new file if there any changes to my CV, they will have to be manually implemented. A CV isn’t so regularly updated that this is a huge issue but it is certainly less convenient. I decided to use a custom HTML block because I can quickly convert my cv to html and insert it whole as opposed to going through individual text based blocks to make changes.
I’m happy with the result. It displays well on all screen sizes, resizes without causing layout changes, is accessible to screen readers, and text is kept an appropriate size. I also added a download button at the bottom. Whilst the download link is available in the footer, I think having it directly below the CV as well is a little more intuitive if someone was looking for an option. It has the added benefit of providing a backup viewing method, in case there are ever any issues with how the html displays.
Leave a Reply