In the middle of September I added a redesigned version of my business website to the test server where I build things before anyone sees them. It installed cleanly, and I checked it: it looked right. Then I opened my other sites on the same server and every one of them was broken. No colors, no layout, plain text stacked down the page, and the header showing up twice. Two of those sites I had not touched at all.
Chasing the wrong clues
The symptoms were confusing. When a program asked for the pages directly, they came back fine, with the right titles and a normal "everything is OK" answer from the server. Only real web browsers showed the mess. That pointed at the network, the domain names, or the browser itself, and time went into those theories before the real cause turned up.
What actually happened
Websites get their look from a stylesheet, a file of design rules for colors, fonts and spacing. To keep things fast, the website platform I use combines the stylesheets of every site on the server into one shared bundle. The new design's stylesheet started with a single line asking for some web fonts, and that font address contained semicolons. The platform's bundler read a semicolon as "this line ends here" and cut the line in half, leaving a quote mark that never closed. A browser reading the bundle saw that open quote and treated everything after it as part of one long, broken piece of text. Every site sharing the bundle lost its design in one go.
I found it by opening the actual combined file the server was sending to browsers and reading it. The third line stopped in the middle of the font address.
The fix
I removed that line and loaded the fonts in a different way that does not go through the shared bundle, and only on the one site that needed them. Then I re-checked the combined file from start to end, confirmed it finished cleanly, and looked at all three sites again. When I rebuilt my site this month, the new design uses the fonts already on your device, so there is nothing to import at all.
What this means for you
- Shared parts fail together. A shared printer, a shared Wi-Fi password, one email account used by the whole office, one stylesheet for three websites: when that one piece breaks, everything that leans on it breaks at the same time.
- "It loads" is not the same as "it works." Look at what the people using it actually see, on a real device, before calling something done.
- When the symptoms point everywhere, go look at the thing itself. Reading the real file settled it.
If your website, shop page or booking form suddenly looks wrong and nobody changed anything, tell me what happened. That is exactly the kind of mystery I like to work through with you, in English or Spanish.