The International Thoracic Oncology Nursing Forum (ITONF) is an international organisation for those who are directly caring for people with lung cancer or mesothelioma in a nursing role.

We were tasked with revamping their website by Eventage, who we also worked with on the KJP Paediactric Respiratory Conference website. We have been designing and maintaining the KJPPRC site for around a decade and they are a valued client.

We worked closely with Eventage to port all the content across to a staging site, which functioned as a wireframe while we planned out how the pages needed to look, and what content needed to be included.

The ability to filter through past and upcoming events was a must-have. Using WordPress posts and the query loop, tabbed sections were built which made it easy for people to find the information they were looking for. An event plugin could have been used, but this is just as elegant as it gives us all the possibilities of an authored post with the query loop doing the sorting via categories and dates.

Rather than loading a new page each time, the pages were broken down into tabs. For example the “Education” page has tabs for webinars and events. Click/tapping on “More Details” takes the user into the appropriate event or webinar post. From there, they can visit the event or webinar and register away from the ITONF website.

The site needed to work well on mobile and tablets, and be fully responsive. Although I can’t say that we adopt a solely ‘mobile first ‘ approach we do work on all device sizes simultaneously to ensure the highest compatibility. The wireframe was built using GeneratePress, which is a design framework for WordPress. It’s light, fast and can either be used to create inline CSS or use classes set in a child theme. We prefer to mostly work with a child theme, as it’s impossible to break in the WordPress editor; CSS classes are applied in the block settings.

Page and block animations are done using CSS, which also leads to less stress on the website.

ITONF only had a access to a small, low res logo that we could find. So we also supplied a new, fully scaleable SVG logo, keeping it as close to the original as possible. Variations of this logo were created to use over light and dark content.