Learn HTML and CSS the Right way

Overview

This is the GitHub Pages repository for the HTML CSS: The Right Way project.

• This website is a Jekyll project
• Each section and sub-section are a Markdown file in _posts/
• Sub-sections have isChild: true in their front matter
• The navigation and page structure are automatically generated

Spread the Word!

This is a collection of everything a frontend developer should know regarding best practices and guidelines.

It is meant for complete newbie to learn what is the result of other's experience and learn "the right way". Because the web changed so much, we should not do the same past mistakes again.

How to Contribute

Ask how to do something

1. Go to the issue tracker, suggest in "How do I..." milestone
2. Thank you!

Add to content

1. Fork and edit
2. Optionally install Ruby with Jekyll gem to preview locally
3. Submit pull request for consideration

Contributor Style Guide

1. Use English spelling (primary English repo only)
2. Use four (4) spaces to indent text; do not use tabs
3. Wrap all text to 120 characters

Where

http://htmlcsstherightway.org

Translations

Project is very new. You can fork and start translating.

To avoid fragmentation and reader confusion, please choose one of these options:

1. We link to your GitHub Pages fork with [username].github.com/htmlcsstherightway
2. We link to your GitHub Pages fork with a subdomain (e.g. "fr.htmlcsstherightway.com")

If you use a subdomain, enter the subdomain into the CNAME file, and ask us to setup DNS for you. If you do not use a subdomain, remove the CNAME file entirely else your fork will not build when pushed.

When your translation is ready, open an issue on the Issue Tracker to let us know.

Why

There's a lot of obsolete information about HTML and CSS and how to do websites, many are outdated, whereas other more current are either too deep into technicalities, only teaching specific details, or just in need to be found.

The idea is to teach how to do things, based on real world usage examples of how to do things in the current fashion.

The site is based on the "the right way" theme as it is an open-source reference which follows the "fork", "pull request"contribution model hosted on GitHub.

Goals

Provide a collection of hands-on set of examples to teach how to achieve goals and from time to time augument the existing/upcoming documentation of the new Web Platform Docs project.

And also:

1. Make an user-contributed, and reviewed, documentation site describing web development best-practices
2. Vulgarize concepts to teach newcomers
3. Link to other resources to deepen the knowledge

The target audience is people who wants to learn (or re-learn) with today's HTML+CSS+Javascript best practices to build a web that is future proof.

On the same idea

Sites that follows the "fork me" on github concept documenting best practices for web development:

• CSS Style
• Roundarch Isobar, Front-end code standards & best practices
• HTML5 - A technical specification for Web developers
• PHP: The RightWay
• Javascript The RightWay
• Survive the Deep End: PHP Security
• JavaScript Patterns
• Principles of writing consistent (idiomatic) Javascript

Who

My name is Renoir Boulanger. I am member of French Canadian (Québec) Web Standards geek. This project started prior my current position as an employee of the W3C in the developer relations and system team working full time for the Web Platform Docs project.

Everybody is welcome to contribute. Just edit a file in _posts/*.md and issue a pull request.

Collaborators

Your name here :)

License

Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License