2、构建 Web 应用布局：从基础到优化

构建 Web 应用布局：从基础到优化

1. 创建基本布局

在开发 Web 应用时，构建一个良好的布局基础至关重要。我们的首要任务是为应用创建基本布局。应用的主布局文件位于 app/views/layouts/application.html.erb ，样式表位于 app/assets/stylesheets/application.css 。

在过去的 Ruby on Rails 版本中，我们使用 HTML4 和 XHTML，但 Rails 3 在创建新项目时会生成 HTML5 布局。HTML5 在支持它的浏览器上提供了额外的增强功能，在不支持的浏览器上也能优雅降级。

1.1 HTML5 与语义化标记

在编写 HTML 时，我们应该尝试添加尽可能多的语义化含义。过去，我们依赖 <div> 元素，它本身几乎没有语义含义。而 HTML5 引入了许多新的、更具语义化的 HTML 元素，用于整体页面结构，使我们的文档更具可读性。

以下是一些新的 HTML5 标签及其用途：
| 标签 | 用途 |
| — | — |
| <abbr> | 缩写或首字母缩写， title 属性包含完整拼写或含义 |
| <article> | 独特的项目，如杂志文章、博客文章或电商网站的商品 |
| <aside> | 类似于印刷杂志文章中的侧边栏，用于引用语、