Altida moves Class 1 detonators through Class 9 lithium freight. Every cargo move touches PDRM permits, Customs bonding and IMDG compliance paperwork, and the brief was a site that carries that weight without turning into a wall of documents.
Altida runs four distinct lines — magazine storage, escort, chartering and port-side consolidation — and a procurement buyer evaluating a hazmat carrier needs to find the right one fast, then find the compliance behind it. The site is structured around that: four service lines with their own architecture, not one generic 'services' page trying to hold all four.
Eight Southeast Asian trade lanes are listed with cargo type and frequency in a live register table rather than a static graphic, so the page can be updated as lanes change instead of re-exported from a designer's file each time.
Next to it sits an IMDG class permit matrix running Class 1.1 through Class 9, and a certification gallery for ISO 9001:2015 and ISO 45001:2018, served through Cloudinary so the certification marks stay sharp without slowing the page down.
The platform is built editorial-first on Next.js 16, with Lenis smooth scrolling and Framer Motion section reveals carrying the pacing rather than a stack of static blocks. The copy is written for a B2B procurement audience doing due diligence, not for a general audience — it names the permits and the classes rather than gesturing at 'full compliance'.
Schema.org JSON-LD structures the site for maritime-industry search, and the whole build is mobile-first, since a buyer's first look at a freight operator is as often a phone as a desktop.
Structure the site around the four lines of business before touching layout — a hazmat operator's credibility problem is precision, not decoration, and the information architecture is what carries that.