html5-boilerplate README

HTML5 Boilerplate

HTML5 Boilerplate is a professional front-end template for building fast, robust, and adaptable web apps or sites.

This project is the product of over 10 years of iterative development and community knowledge. It does not impose a specific development philosophy or framework, so you're free to architect your code in the way that you want.

About This Repository

This repository is where HTML5-Boilerplate is authored. Some of the tools, files and processes that you see here are solely for the production of HTML5 Boilerplate and are not part of HTML5 Boilerplate. For one example, the gulpfile.mjs script is used to build the project. It's not part of the project itself.

The project we publish is represented by the contents of the /dist/ folder. Everything else in this repository is used to author the project.

Think of it this way, in the same way that you don't clone vuejs/core to create a Vue.js app, you don't need to clone this repository to start a new site or app based on HTML5 Boilerplate.

So, if you're looking for a quick start template to build a website or application, look at the options in the Quick Start section of this document.

If you want to help us improve HTML5 Boilerplate then you can start with the documentation here, which includes steps to clone this repo in order to get it set up for development.

Quick Start

Choose one of the following options:

Using the create-html5-boilerplate script, instantly fetch the latest npm published package (or any version available on npm) with npx, npm init or yarn create without having to install any dependencies. Running the following npx command installs the latest version into a folder called new-site
```
npx create-html5-boilerplate new-site
cd new-site
npm install
npm run start
```
Using our new Template Repository create a new GitHub repository based on the latest code from the main branch of HTML5 Boilerplate.
Install with npm: npm install html5-boilerplate or yarn: yarn add html5-boilerplate. The resulting node_modules/html5-boilerplate/dist folder represents the latest version of the project for end users. Depending on what you want to use and how you want to use it, you may have to copy and paste the contents of that folder into your project directory.
Download the latest stable release from here. This zip file is a snapshot of the dist folder. On Windows, Mac and from the file manager on Linux unzipping this folder will output to a folder named something like html5-boilerplate_v9.0.0. From the command-line, you will need to create a folder and unzip the contents into that folder.
```
mkdir html5-boilerplate
unzip html5-boilerplate*.zip -d html5-boilerplate
```

Features

A finely-tuned starter template: Reap the benefits of 10 years of analysis, research and experimentation by over 200 contributors.
Designed with progressive enhancement in mind.
Includes:
- Placeholder Open Graph elements and attributes.
- An example package.json file with WebPack commands built in to jumpstart application development.
- Placeholder CSS Media Queries.
- Useful CSS helper classes.
- Default print styles, performance optimized.
- "Delete-key friendly." Easy to strip out parts you don't need.
- Extensive documentation.

Browser Support

HTML5-Boilerplate supports the latest, stable releases of all major browsers.

Check the default configuration from Browserslist for more details on browsers and versions covered.

Documentation

Take a look at the documentation table of contents. This documentation is bundled with the project which makes it available for offline reading and provides a useful starting point for any documentation you want to write about your project.

Contributing

Hundreds of developers have helped to make the HTML5 Boilerplate. Anyone is welcome to contribute. However, if you decide to get involved, please take a moment to review the guidelines:

License

The code is available under the MIT license.

57.7K ·GitHub

Html5-boilerplate

这是什么？

HTML5 Boilerplate 是一个专业的前端模板，用于构建快速、稳健且易于适配的网页应用或网站。它经过十多年的打磨，有 200 多位贡献者参与其中。

这是我必须遵循的框架，还是只是一个起点？

它不是框架，也不规定任何开发理念。它是一个入门模板，包含占位文件和配置，你可以按需修改或删除。

我该如何用它开始一个新项目？

可以使用 npx、npm init 或 yarn create 运行 create-html5-boilerplate 脚本，立即生成一个文件夹；也可以使用 GitHub 模板仓库；可以通过 npm 或 yarn 将其作为包安装；还可以下载 dist 文件夹的最新 zip 发布包。

使用它需要 Node 或任何构建工具吗？

只使用输出内容不需要任何构建工具，发布的项目就是 /dist/ 文件夹中的静态内容。但如果要参与这个仓库本身的开发，则需要 Node（engines 字段要求 Node >=22）以及用于构建的 gulp。

我需要克隆整个仓库才能开始建站吗？

不需要。本仓库仅用于编写和构建模板本身，普通用户应选择 Quick Start 中的某种方式，而不是克隆它。

它能在旧版或不常见的浏览器中运行吗？

它支持所有主流浏览器的最新稳定版本，具体依据项目中包含的 Browserslist 配置。

模板开箱即带有哪些内容？

它附带占位用的 Open Graph meta 标签、一个包含 Webpack 命令的示例 package.json、占位用的 CSS 媒体查询、实用的 CSS 辅助类，以及经过性能优化的默认打印样式。

删除不需要的部分容易吗？

容易。README 将它描述为“删除友好”（delete-key friendly），意思是不需要的部分可以很轻松地去掉。

What are similar projects?

responsive-html-email-template, angular-seed, _s, LearnCS8-Resume, tachyons, Skeleton, WebFundamentals, Flat-UI

Which topics is it in?

progressive-web-app, web-application, starter-kit, cross-browser, front-end, static-site, html5, boilerplate, responsive, template, best-practices, css

Creator: h5bp
Size: 22.3 MB
Stars: 57.7K
Updated: CommitSep 14 Releasev9.0.1Apr 16
Age: 16y
Commits · 90 Days