Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/renoirb/htmlcsstherightway

A spinoff on the "the right way" idea to explain the HTML/CSS basics for the self-taught. Idea coming from https://github.com/h5bp/lazyweb-requests/issues/73
https://github.com/renoirb/htmlcsstherightway

Last synced: about 2 months ago
JSON representation

A spinoff on the "the right way" idea to explain the HTML/CSS basics for the self-taught. Idea coming from https://github.com/h5bp/lazyweb-requests/issues/73

Awesome Lists containing this project

README

        

# 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](https://github.com/renoirb/htmlcsstherightway/issues?milestone=1)
2. Thank you!

### Add to content
1. Fork and edit
2. Optionally install [Ruby](https://rvm.io/rvm/install/) with [Jekyll](https://github.com/mojombo/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

### 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](http://webplatform.org) 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](https://github.com/byrichardpowell/CSS-Style)
* [Roundarch Isobar, Front-end code standards & best practices](http://isobar-idev.github.com/code-standards/)
* [HTML5 - A technical specification for Web developers](http://developers.whatwg.org/)
* [PHP: The RightWay](http://phptherightway.com)
* [Javascript The RightWay](http://jstherightway.com)
* [Survive the Deep End: PHP Security](http://phpsecurity.readthedocs.org/)
* [JavaScript Patterns](http://shichuan.github.com/javascript-patterns/)
* [Principles of writing consistent (idiomatic) Javascript](https://github.com/rwldrn/idiomatic.js)

## Who

My name is [Renoir Boulanger](http://twitter.com/renoirb). 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](http://webplatform.org) 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](http://creativecommons.org/licenses/by-nc-sa/3.0/)