Atek - IT Solutions and Technology HTML Template preview 1

Atek - IT Solutions and Technology HTML Template

bookmark

Atek is a set of static HTML templates designed for IT solutions and technical services, offering over 30 pre-built pages covering multiple business scenarios such as cloud computing, cybersecurity, software outsourcing, data analytics,...

HTML

Project Introduction

Atek is a set of static HTML templates designed for IT solutions and technical services, offering over 30 pre-built pages covering multiple business scenarios such as cloud computing, cybersecurity, software outsourcing, data analytics, and blockchain fintech. It is suitable for quickly building the official website of a tech company or consulting firm.

Tech Stack

  • Bootstrap 5 (responsive layout and grid system)
  • jQuery (interaction logic, scroll navigation, slideshows, etc.)
  • Font Awesome (icon font)
  • SASS (CSS preprocessing, defining variables and mixins)
  • Magnific Popup (image/video lightbox)
  • Swiper (carousel/slider)

Project Structure

text
atekhtml-10/
├── documentation/          # Official documentation
│   ├── index.html
│   ├── css/
│   └── images/
└── download-version/       # Actual template files
    ├── index.html          # Homepage (main template entry)
    ├── home-*.html         # 16 industry homepage variants
    ├── about*.html         # About page
    ├── blog*.html          # Blog page
    ├── contact*.html       # Contact page
    ├── cart.html           # Shopping cart
    ├── checkout.html       # Checkout
    ├── error.html          # 404 error page
    ├── mail.php            # Email processing
    └── assets/
        ├── css/style.css   # Main stylesheet (includes complete CSS index comments)
        └── js/main.js      # Interaction scripts (mobile menu, sticky header, scroll navigation, etc.)

Core File Description

  • download-version/index.html — Main homepage entry file, includes all CSS and JS resources
  • download-version/assets/js/main.js — Core interaction logic, including mobile menu, sticky navigation, single-page anchor scrolling, lightbox, and other features
  • download-version/assets/css/style.css — Main stylesheet, uses SASS variables to define theme color --theme-color: #0B59DB
  • download-version/mail.php — Contact form backend processing script
  • download-version/home-*.html — Industry homepage variants, categorized by field (AI, cloud computing, cybersecurity, etc.)
  • documentation/index.html — Official documentation, explains HTML structure, CSS composition, contact configuration, etc.

Quick Start

This project is a pure static template with no build steps required:

  1. Navigate to the atekhtml-10/download-version/ directory
  2. Open index.html directly in a browser to preview the full effect
  3. If a local server is needed (recommended), run the following command in that directory:
bash
npx serve .
# or
python -m http.server 8080

Usage Suggestions

  • All pages in the template share the CSS and JS under assets/; confirm file ownership before making modifications. Files with the same name in the download-version/ and documentation/ directories have different content, so do not confuse them
  • Industry homepage variants (e.g., home-ai-machine.html, home-cybersecurity.html) can be directly copied as new pages, replacing text and image assets as needed
  • For the contact form, deploy mail.php to a PHP-supported server, or replace it with another backend service to ensure the form submission functionality works correctly
help_outline

FAQ