Why Host on S3?
Hosting a static website on Amazon S3 is one of the most cost-effective and reliable ways to serve HTML, CSS, JavaScript, and image files on the web. S3 static website hosting is highly scalable (it handles traffic spikes automatically), globally available, and for most small-to-medium sites, the cost is just a few cents per month.
This tutorial walks you through the entire setup process — from creating your bucket to making your site publicly accessible.
Prerequisites
- An AWS account (free tier is sufficient)
- A static website ready to deploy (HTML/CSS/JS files)
- Basic familiarity with the AWS Management Console
Step 1: Create an S3 Bucket
- Sign in to the AWS Management Console and navigate to S3.
- Click "Create bucket".
- Enter a bucket name — if you're using a custom domain, name the bucket to match your domain (e.g.,
www.yoursite.com). - Select your preferred AWS Region (choose one close to your primary audience).
- Under "Block Public Access settings", uncheck "Block all public access" — this is required for a public website. Acknowledge the warning.
- Leave other settings as default and click "Create bucket".
Step 2: Enable Static Website Hosting
- Click on your newly created bucket to open it.
- Go to the "Properties" tab.
- Scroll to "Static website hosting" and click "Edit".
- Select "Enable".
- Set Index document to
index.html. - Optionally, set an Error document (e.g.,
404.html). - Click "Save changes". S3 will display a Bucket website endpoint URL — save this URL.
Step 3: Upload Your Website Files
- Go to the "Objects" tab in your bucket.
- Click "Upload" and add all your website files and folders.
- Click "Upload" to confirm. Make sure
index.htmlis at the root level of the bucket.
Step 4: Set a Bucket Policy for Public Access
Your bucket needs a policy that allows anyone to read your files. Go to the "Permissions" tab, click "Bucket Policy", and paste the following policy (replace YOUR-BUCKET-NAME with your actual bucket name):
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::YOUR-BUCKET-NAME/*"
}
]
}
Click "Save changes".
Step 5: Test Your Website
Visit the Bucket website endpoint URL you saved in Step 2. You should see your website live! The URL format looks like: http://your-bucket-name.s3-website-us-east-1.amazonaws.com
Optional: Connect a Custom Domain with CloudFront
For production use, you'll want to add a custom domain and HTTPS. Here's the high-level process:
- Create an AWS CloudFront distribution pointing to your S3 bucket endpoint as the origin.
- Request a free SSL certificate via AWS Certificate Manager (ACM).
- Attach the certificate to your CloudFront distribution.
- Update your domain's DNS records (via Route 53 or your registrar) to point to the CloudFront distribution.
CloudFront also acts as a CDN — caching your content at edge locations worldwide for faster load times globally.
Cost Considerations
S3 static hosting costs are based on storage used and requests made. For a typical small website, monthly costs are very low. Using CloudFront in front of S3 can actually reduce your S3 request costs by caching content at the edge, while also improving performance.