ICITR 2026 - Conference Website

This is the official website for the 11th International Conference on Information Technology Research (ICITR 2026), hosted by the Faculty of Information Technology at the University of Moratuwa, Sri Lanka, and organized by the Information Technology Research Unit (ITRU). It is a production-grade, animated marketing and information site for an academic conference that has run since 2018 and spans eight technical tracks, from computer vision and machine learning to cyber security and the digital economy. The site was rebuilt from the real 2025 conference codebase, carrying forward all genuine content, logos, imagery, and figures, with the edition advanced to 2026.

This was a team project. The parts I personally designed, built, and owned were the entire main landing page, the full For Authors page and its data model, the security hardening of the contact API along with the cyber security track content, and the site's SEO and accessibility foundation. The description that follows covers the project as a whole and then the areas I was responsible for.

The site is built on Next.js with the App Router and React Server Components, written in TypeScript, and styled with Tailwind CSS using design tokens declared centrally, so every color, radius, and shadow is defined in one place. Headings are set in Space Grotesk and body text in Inter, both self-hosted through the framework's font pipeline, and all imagery is local and optimized to modern AVIF and WebP formats. Motion is expressed through scroll reveals, staggered entrances, hover effects, a countdown, and a gallery lightbox, every one of them gated on the visitor's reduced-motion preference, and site-wide smooth scrolling is applied and automatically disabled when motion is reduced. A key architectural decision is that all editable facts, including copy, links, dates, fees, and track details, live in single source-of-truth data files rather than being hardcoded across components, so the whole site can be rolled forward to a future edition by editing data in one place.

The main landing page, which I built, is composed of seven sections. A hero leads with the conference theme, a key-dates strip, and a live countdown to the opening day; an about section introduces the conference; a theme band features the headline theme statement; an animated statistics band counts up the edition number, the eight tracks, the years running since 2018, and the proceedings volumes; a tiered grid presents organizers, technical co-sponsors, and partners; a gallery shows thirteen real conference photographs in a lightbox; and a contact section posts to the email endpoint. The whole page is responsive and animated, with every effect respecting reduced-motion.

I also built the For Authors page end to end, together with the data model behind it. Its centerpiece is an interactive explorer for all eight technical tracks: on desktop a numbered list drives a sticky animated detail panel, while on mobile the same content collapses into accordion cards, with each track listing its in-scope subtopics. The page also presents the full 2026 timeline from the call for papers through to the conference days, an accordion of submission guidelines covering double-blind review, the review process, author responsibilities, camera-ready, withdrawal, presentation, and awards, local and foreign registration fee tables with bank and payment details, and a closing call to action to submit through Microsoft CMT.

Security was one of my areas, both as a technical track and in the code. I hardened the contact API so that every field is required, trimmed, and the email validated against a pattern before any processing; every user-supplied value is escaped before it is placed in the HTML email body, preventing cross-site scripting and HTML injection; and errors return generic, friendly messages to the client while real failures are logged only on the server, so nothing internal leaks. All SMTP credentials and the recipient address are kept server-side in environment variables and never exposed to the browser, the endpoint fails safe when they are not configured, and the sender address is fixed with the submitter's email set only as reply-to, so the From header cannot be spoofed. I also authored the cyber security track content, covering network and system security, cryptography, malware detection, threat intelligence, blockchain and distributed-ledger security, privacy-preserving technologies, and cyber risk assessment and management.

I owned the site's search and discoverability layer, implemented with the framework's metadata API. This includes global and per-page titles and descriptions, a title template, targeted keywords, canonical URLs, and complete Open Graph and Twitter card objects with a social preview image, alongside a robots file and an XML sitemap. It is backed by semantic, accessible HTML, with a skip-to-content link, a single main landmark, a correct heading hierarchy, a declared language, descriptive alt text, and ARIA on the interactive widgets, all of which serve screen-reader users and search ranking together.

The visual design is a light, premium-academic theme in deep navy and gold sampled from the university and IEEE branding, driven entirely by centralized design tokens, with neutral colors tuned so that small text clears WCAG AA contrast on every background it sits on. Accessibility runs throughout: focus-visible outlines, ARIA roles and labels on the tracks explorer, accordions, and lightbox, live regions for dynamic content, and complete reduced-motion support, paired with optimized images, self-hosted fonts, and server-rendered pages for a fast first paint.

The result is a fast, accessible, and search-optimized conference site that looks polished and academic while remaining easy to update for future editions. It gave me ownership of a real, public-facing product across front-end engineering, security, and SEO.