Tri-County FRC website
The website for our new FIRST Robotics team, hand-built in plain HTML and one stylesheet so any student on the team can read it, edit it, and keep it running.
- HTML
- CSS
- GitHub
- GitHub Issues

The problem
Two other student leaders and I are relaunching our school’s FIRST Robotics Competition team for the 2027 season. We started with no robot and no budget.
We were cold-emailing local companies for sponsorship, and a team with no web presence doesn’t look real. We needed a site. It also had to survive after I graduate, kept up by students who may never have written code.
The solution
A hand-built site in plain HTML and one CSS file. Open a page, change the text, push. Nothing to install.
I know how to build sites with frameworks. My portfolio and the HexaFlow site use Astro. I chose not to here, because a site that needs Node, a build step and a framework dies the day the person who understands it leaves.
How it works
Rules for the code
- Plain HTML pages and one stylesheet. Every page links the same
style.css. No framework, no build step. - No inline styles. All styling lives in that one file, so a color or font change happens in one place.
- Comments everywhere. Every section of the HTML says what it is and what it does, down to why the viewport tag is there. The colors at the top of the stylesheet are named and labelled (logo navy, logo gold, footer navy, the grey behind sections).
- A mobile menu in a few lines of JavaScript, written so a beginner can follow it.
Design
The design was inspired by FRC team 1538’s site (The Holy Cows): dark bands, huge condensed headings, a clean body font, small tag labels, outline buttons, and a dark title strip opening each section. The colors come from our logo, a navy and a gold. Headings are League Gothic and body text is Source Sans 3.
| Pages | Status |
|---|---|
| Home, about | Most built out |
| Sponsors, become a sponsor, members, seasons, news, calendar, join, resources, branding | Shared header and footer, ready to fill |
| 404 | Done |
I track the work as GitHub Issues with milestones, so the to-do list lives next to the code.
Content rules
Some of the most important decisions are things you can’t see, and they’d look like oversights without the reason:
- Roster names are first name and last initial. Most of the team are minors, the site is public and indexed, and FIRST’s youth protection guidance tells students not to publish last names.
- No dollar totals or fundraising goals. A sponsor who reads “we’re halfway there” often concludes we don’t need them.
- No stat counters. A rookie team showing “0 awards” advertises what it doesn’t have.
- We never claim the old team’s record. Our school had an FRC team, 3236, from 2010 to 2019. The site can tell the story of bringing robotics back, but claims none of 3236’s results or awards. The new team registers as a rookie.
My role
I built the site by hand and planned its pages and content rules. The team itself is led by me and two other student leaders. Name the other two leaders (first names only) and say who writes page content
Testing
Say how you check the site before pushing (phone widths, browsers, link checks)Results
- 12 pages sharing one header, footer and stylesheet.
- 27 commits so far, with the work tracked as issues.
- Zero dependencies: a new student needs a text editor and nothing else.
What I learned
Building for someone else to maintain changes every decision. The cleverest version of a page is usually the worst one to hand off. I’d rather have a slightly plainer site that a new student can edit on day one.
What’s next
Filling the pages that are set up but still empty, and turning on GitHub Pages so the site has a public link to put in sponsor emails.
Demo video
Demo video coming soon: A tour of the Tri-County FRC site on desktop and phone