A professional static website for Cipher Automate - AI automation and workflow solutions.
- Responsive Design: Works perfectly on desktop, tablet, and mobile devices
- Modern UI: Clean, professional design with gradient effects and smooth animations
- SEO Optimized: Proper meta tags and semantic HTML structure
- Fast Loading: Optimized CSS and JavaScript with no external dependencies
- Contact Form: Fully functional contact form using Formspree
- Accessibility: ARIA labels and keyboard navigation support
/
├── index.html # Homepage
├── about.html # About page
├── services.html # Services page
├── projects.html # Projects portfolio
├── blog.html # Blog listing page
├── contact.html # Contact page with form
├── assets/
│ ├── css/
│ │ └── style.css # Main stylesheet
│ ├── js/
│ │ └── script.js # Main JavaScript file
│ └── images/
│ └── company logo.png # Company logo
Download all files and maintain the folder structure as shown above.
Place your company logo.png file in the assets/images/ directory.
To enable the contact form:
- Go to Formspree.io and create a free account
- Create a new form and copy your form ID
- Open
contact.htmland replaceYOUR_FORMSPREE_IDwith your actual form ID:
<form class="contact-form" action="https://formspree.io/f/YOUR_FORMSPREE_ID" method="POST">Example:
<form class="contact-form" action="https://formspree.io/f/mbjpzgqr" method="POST">Edit the social media links in the footer of all HTML files:
- LinkedIn: Replace
https://linkedin.comwith your LinkedIn profile URL - GitHub: Replace
https://github.comwith your GitHub profile URL - Email: Update
contact@cipherautomate.comwith your actual email
- Create a new repository on GitHub
- Push all files to the repository:
git init
git add .
git commit -m "Initial commit"
git branch -M main
git remote add origin https://github.com/YOUR_USERNAME/YOUR_REPO.git
git push -u origin main- Go to repository Settings → Pages
- Select branch:
main, folder:/ (root) - Click Save
- Your site will be live at:
https://YOUR_USERNAME.github.io/YOUR_REPO/
Edit CSS variables in assets/css/style.css:
:root {
--blue-400: #60a5fa;
--blue-500: #3b82f6;
--purple-400: #c084fc;
--purple-600: #9333ea;
--gray-300: #d1d5db;
--gray-400: #9ca3af;
--gray-800: #1f2937;
--gray-900: #111827;
--black: #000000;
}Update the text content in each HTML file to match your business information.
The site uses Google's Inter font. To change fonts, update the Google Fonts link in the <head> section of each HTML file.
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
- Mobile browsers (iOS Safari, Chrome Mobile)
- No jQuery or heavy frameworks - Pure vanilla JavaScript
- Optimized CSS - Minimal and efficient styles
- Fast loading - No external dependencies except Google Fonts
- Lazy loading - Images load only when needed
To test the website locally:
- Option 1: Using Python
# Python 3
python -m http.server 8000
# Python 2
python -m SimpleHTTPServer 8000- Option 2: Using Node.js
npx http-server- Option 3: Using VS Code Install the "Live Server" extension and click "Go Live"
Then open http://localhost:8000 in your browser.
Before going live, test your contact form:
- Fill out all required fields
- Submit the form
- Check your Formspree dashboard to confirm the submission
- Verify you receive email notifications
- Logo Path: Ensure your logo file is named exactly
company logo.pngor update all references in HTML files - Formspree ID: Don't forget to replace
YOUR_FORMSPREE_IDincontact.html - Social Links: Update all social media links before going live
- Email Address: Update the contact email in all HTML files
Before deploying, make sure you have:
- Added your logo to
assets/images/company logo.png - Replaced Formspree form ID in
contact.html - Updated LinkedIn URL in all HTML files
- Updated GitHub URL in all HTML files
- Updated email address in all HTML files
- Tested the contact form
- Tested on mobile devices
- Checked all internal links work
- Download all files and create the folder structure
- Add your logo to
assets/images/ - Set up Formspree and update the form ID
- Update social links in footer sections
- Test locally using Python or Live Server
- Deploy to GitHub Pages following the instructions above
This project is for Cipher Automate. All rights reserved.
For issues or questions, contact: cipherautomate@gmail.com
Built with ❤️ for Cipher Automate
Decrypting Complexity. Automating Success.