ZIP Archive
Definition
A ZIP archive is a container format that packs a directory tree into one file with the extension .zip and the media type application/zip. Each entry keeps its own name, path, size and compression, which is why a single file inside a large archive can be read without decompressing the rest. Almost every operating system creates and opens them without extra software. Hosting treats a .zip in one of two ways. Left alone, it is a download: the visitor clicks and receives the whole bundle. Unpacked on upload, it disappears as a file and its contents become the site — the HTML, CSS, images and fonts are served at their own addresses, exactly as a folder upload would produce.
Why It Matters
The two uses fail in opposite directions. Publish a site as a download and visitors get a .zip they have no idea what to do with. Unpack a bundle of client deliverables and you have scattered 60 loose files across an address that was meant to hand over one tidy package. The other habit worth forming is checking what is inside before you upload: a 200 MB archive that is 190 MB of a nested .git folder and a node_modules tree wastes an upload limit on files nobody will ever request. Zipping also buys less than people expect on media — JPEGs, PNGs and MP4s are already compressed, so an archive of photos is typically within a few per cent of the original size.
How It Works
A ZIP file keeps its index, the central directory, at the end rather than the start, listing every entry with its offset into the file. A host that unpacks archives reads that directory, then writes each entry out as an object at its recorded relative path. What it looks for next is an index.html at the top level of the archive; if the tree was zipped from outside the folder, everything sits one level down inside a wrapper directory and the entry point is missed, which is the usual cause of a blank page after an apparently successful upload. Served rather than unpacked, the response carries application/zip and a Content-Disposition attachment header with the file name, so every browser saves it instead of trying to display it. Compression is per entry, using deflate by default, so mixed archives shrink only where the text is.
Real-World Example
A studio exports a portfolio from its site generator, zips the contents of the build folder — not the folder itself — and drops the 8 MB archive into 99helpers. It unpacks, finds index.html at the root, and the site is live at studio-work.99helpers.site within seconds. The same studio sends finished client assets the other way: a 40 MB zip of logos and typefaces published as a plain download, so the client gets one file rather than a page of links.
Common Mistakes
- ✕Zipping the folder instead of its contents — the site then lives one directory down, the entry point is not found at the root, and the address shows nothing
- ✕Shipping the archive with .DS_Store, __MACOSX or a node_modules tree inside, which inflates the upload and, if unpacked, publishes files you never meant to expose
- ✕Expecting compression to solve a size problem for photos or video, when those formats are already compressed and the archive saves almost nothing
- ✕Using a password-protected archive as a way to protect a download — many devices, especially phones, simply cannot open one
Related Terms
Folder Upload
Sending a whole directory to a host in one go, with its internal structure intact, rather than picking files one at a time. Every file arrives at the same place in the tree it started in.
Download Link
A download link is an address that makes the browser save a file to disk instead of displaying it in a tab. The behaviour comes from a header on the response or an attribute on the anchor tag, not from anything inside the file.
Content-Disposition
Content-Disposition is an HTTP response header that tells the browser whether to show a file in the window or save it to disk, and what name to suggest when it saves. It is how one URL can either open a PDF in a tab or start a download.
index.html
index.html is the file a web server returns when a visitor asks for a folder rather than a named file. It is the default document for the site root and for every directory inside it.
Static Site
A static site is a website made of finished files — HTML, CSS, JavaScript, images — that are sent to the browser exactly as they are stored. Nothing is assembled on the server when a visitor arrives.
Put a file online in seconds
Drop in a document, an image, a page or a whole static website and share the link — free, with no build step and no server to set up.
Host a file free →