Morris Fabrications Ltd

A concept website for a staircase and balustrade maker: a plan that draws itself, EXC2 on the first screen and an enquiry that writes the email.

Morris Fabrications Ltd is not my client and did not commission this website. I made the concept on my own initiative from the text and photos on their public website, so every fact on it is theirs.

Morris Fabrications Ltd is a family-run architectural metalwork company in Birmingham, established in 1980. It draws, makes and installs staircases, fire escapes, balustrades, balconies and steelwork across the UK. Main contractors are among its customers, and they arrive with a drawing and two questions: can you make and fit this, and do you have the paperwork the site will ask for?

What I found

I went through the site on 14 November 2026 on a 1440 px laptop and a 390 px phone:

The page has no mobile viewport tag, so a phone lays it out 1010 px wide and shrinks it to about 39 per cent. Their 14 px body text ends up around five pixels tall.
On the laptop, the first screen is the menu and six project photographs; what they do starts at the bottom edge.
EXC2, the proof of UKCA marking on their steelwork, appears once on the home page: at the end of a news item, about 1200 px down, in 14 px type.
Enquiries go through a general message form, with nowhere for the type of stair, sizes, finish or site, so the buyer writes it all out or rings.
The Jobs page says there are no current vacancies and asks anyone interested to get in touch, with no form.

First screen of the current Morris Fabrications website on a laptop: dark bar with logo, phone number and menu, a line of popular searches and a grid of six project photographs with red labels

Decisions

First screen: the product, the place and the certificate

The headline says what they make and where: "Staircases, balustrades and steelwork. Made in Birmingham, fitted across the UK." Beside it is their helical staircase at Staffordshire University, and below it four facts from their site: 1980, EXC2, Constructionline Gold and their own fitters. Over the corner of the photograph sits the plan of a helical stair, because they have an in-house draughtsman. It draws itself once, tread by tread, then stays still. The colour is the red from their logo, with anthracite and warm greys.

From drawing to handover

Their strongest argument is that the whole job stays under one roof, so it is one story in four steps: drawing, fabrication, finishing and installation. On the left the picture changes as you read, from a 3D model of their Manchester helical stair assembling itself to installation; on the right a red line fills beside the steps.

The process section: on the left, a steel beam being welded in their works, on the right step 02, fabrication in Birmingham, with the red progress line beside the steps

The enquiry sheet

The buyer picks one of seven items, then sizes, material, finish, supply only or with installation, site and date. The sheet fills in as they type, with notes from the Morris site for that choice, such as the 100 mm gap where children may use a balustrade, or grade 316 stainless steel outdoors. A progress bar counts the details; once all are in, the sheet says it is ready to send. The button opens a filled-in email to info@morrisfabrications.co.uk, and the buyer attaches the drawings.

The enquiry sheet for a helical staircase: 3600 mm floor to floor, 1200 mm wide, three floors, powder coated in RAL 9005, site in Leicester, marked ready to send

Work with us

The "Work with us" section says what their Jobs page says, that there are no vacancies right now, but offers a short application: area of work, experience, cards and tickets such as CSCS, SSSTS, PASMA and IPAF, and a driving licence. It also opens a finished email, with a reminder to attach a CV.

The Work with us section: on the left, a note that there are no vacancies right now and four reasons to work there, on the right a steel frame on a flatbed truck and the application form

The phone

On a phone the order is the same, with a smaller plan over the photograph. While the buyer fills in the form, a bar at the bottom shows the item, the details so far and a button to the sheet.

Three phone screens of the new website: the first screen with headline, photograph and plan, the staircases card, and the enquiry sheet for a frameless glass balustrade ready to send

First screen on a laptop, the current website on the left and the new concept on the right

How it's built

Static HTML, CSS and JavaScript, with no framework or animation library: CSS transitions and IntersectionObserver. A Python script generates the plan from geometry as inline SVG. Only JavaScript sets hidden starting states, so without it the page is fully visible; reduced motion turns animation off. Neither tool has a server; both leave through mailto. The photographs are theirs, resized and with dimensions set. The page is noindex, and the JSON-LD holds only details from their website.

What I would do next

With the company I would first check that the UKCA certificate, Constructionline Gold and CHAS are current, and whether they take general applications. A real project would add a form that takes drawings as attachments, editing of projects and vacancies without a developer, and redirects for the existing service pages.