Semantic HTML and Views Using Meaningful Tags

Learn how to create views in our Rails application through the application of HTML tags.

Now that we’ve learned about some sustainable routing practices, let’s move on to what is usually the bulk of the work in any Rails view: HTML templates.

HTML templates feel messy, even on a small scale, and the way CSS and JavaScript interact with the view can be tricky to manage. Even though we can decouple HTML templates and manage their complexity with layouts and partials, it’s not quite the same as managing Ruby code, so the entire endeavor often feels awkward at best. This chapter will help us get a hold of this complexity. It boils down to these guidelines:

  • Mark up all content and controls using semantic HTML; use div and span to solve layout and styling problems.

  • Build templates around the controller’s resource as a single instance variable.

  • Extract shared components into partials.

  • ERB is fine.

Remember, these are guidelines. It’s ok to bend these rules as long as we have a good reason and understand the reason for their existence. Let’s start with the HTML itself.

Get hands-on with 1200+ tech skills courses.