Case study
Zensteel Works: a brand and website for steel fabrication in two states
Techrethought designed and developed the website of Zensteel Works, a steel fabrication business with units in Chennai and Gujarat, and worked on its branding. The site sets out seven service lines on one page, shows the company's projects and registrations, and takes quote requests by phone, email or WhatsApp.
- Business
- Steel fabrication, Chennai + Gujarat
- Location
- Chennai, Tamil Nadu and Ahmedabad, Gujarat, India
- Industry
- Manufacturing
- What Techrethought did
- Branding
- Web design
Listen to this case study
5 min · The text on this page is the transcript.
01 · The brief
What does Zensteel Works do, and what did it need?
Zensteel Works fabricates and erects structural and industrial steel, from a head office in Chennai and a factory unit in Sanand, near Ahmedabad. It needed one identity across both units, and a website that shows the scope of its work and gives a buyer a direct way to ask for a quote.
The services are described for plants, warehouses and industrial buildings, and the pages close by asking visitors to send their drawings, requirements or specifications.
02 · Challenges
What did the site have to carry?
The site had to fit seven kinds of steel work, two locations and the registrations a buyer checks onto a few pages, without burying the way to ask for a quote.
Seven service lines
The work runs from structural steel and pipe racks to pre-engineered buildings, escalator and elevator works, and site maintenance. Each line needed its own description without splitting the site into a page per service.
Two units in two states
The head office is in Chennai and the factory unit is in Sanand, Gujarat. A visitor had to be able to find either one and get directions to it.
Registration in plain view
The company's MSME and GST registrations appear on the home page and in the footer of every page checked. A buyer can check them before getting in touch, without asking for them.
03 · What we built
What did we design for Zensteel Works?
Techrethought worked on the Zensteel Works brand, and designed and developed the website, which its footer credits to us.
- The ZS mark and wordmark
- We designed the identity the site carries: a ZS mark with a slate Z and an orange S, and the name set as ZENSTEEL in slate and WORKS in orange.
- Colour and type that follow the mark
- The site keeps to the colours of the mark, slate and white with orange reserved for actions, and sets its headings in tall condensed capitals.
- One page for every service
- The services page gives each of the seven lines its own section, then sets out a four-stage turnkey process and answers common questions.
- A company profile in sections
- The About page is divided into the profile, a message from the managing director, infrastructure, quality policy, and health, safety and environment, with a sub-menu that marks the section being read.
- A gallery of fabrication work
- The projects page shows fabrication and erection work in a grid of photographs, and each one opens larger on its own.
- Quote requests without a form
- Every page checked has a Get a Quote button in its header that opens the contact page's call, email and WhatsApp options. No page checked has an enquiry form: drawings and requirements go by email or WhatsApp.
04 · Services and tech
How is the site put together?
The site is a small set of static pages with its own fonts and one script, as its page source shows.
Services used
Seen in the page source
- HTML, CSS and JavaScript
- Every page is a static file sharing one stylesheet and one script, with no content management system.Page addresses such as services.html and projects.html; css/main.css and js/main.js on every page checked.
- Barlow and Barlow Condensed
- Body text and headings use Barlow and Barlow Condensed, served from the site itself.assets/fonts/barlow-400.woff2 and assets/fonts/barlow-condensed-700.woff2 preloaded in the head of every page checked.
- Native dialog lightbox
- Project photographs open larger in a lightbox built on the browser's own dialog element.The header comment in js/main.js lists a gallery lightbox on native <dialog>, skipped where the browser does not support it.
- Schema.org structured data
- Pages describe the company, its seven services and its common questions for search engines.JSON-LD with GeneralContractor, Service, FAQPage, ItemList and BreadcrumbList types across the home, services and inner pages.
- WhatsApp and Google Maps links
- Buttons open a WhatsApp chat with the business and each office's address in Google Maps.A wa.me link with the business number, and google.com/maps/search links with each address as the query, on contact.html.
05 · Outcome
What can someone with a fabrication project do there today?
Zensteel Works’ website is live at zensteelworks.com, and its footer credits Techrethought for designing and developing it.
What a visitor can do there
Read what each of the seven service lines covers, or jump to one from the home page.
Follow the four stages of a turnkey project, from design to commissioning, on the services page.
Look through photographs of fabrication and erection work on the projects page, each opening larger.
Read the company profile, the managing director's message, and its quality and safety policies.
Ask for a quote by phone, email or WhatsApp, and get directions to the Chennai office or the Sanand unit.
Check the company's MSME and GST registrations, and open its Udyam certificate.
Have a project like this in mind?
Tell us about your business and what the work needs to do, and we will suggest where to start.
Or call +91 88258 07825 or +91 93821 94201, or email [email protected].