Front End Best Practices

gistfile1.txt

1. Write semantic and accessible HTML5
Goals:
+ Avoid div soup/code bloat
+ Accessibiity
+ Improve SEO

a/ Semantic aka has meaning 
http://html5doctor.com/downloads/h5d-sectioning-flowchart.pdf
b/ Content models:
https://www.w3.org/TR/2011/WD-html5-20110525/content-models.html#kinds-of-content
c/ Document Outlines and headings
https://gsnedders.html5.org/outliner/
d/ ADA: tradeoffs like no faux elements
2. Workflow
3. Style Guide
a/ Naming Conventions:
b/ Consistent Formatting with EditorConfig
c/ LSG: Fabrikator
d/ Comments and Documentation


4. Modular CSS:
BEM
5. Tools:
a/ Atom:
+ Plugins: Emmet
b/ Sublime
c/ EditorConfig: define and maintain consistent coding styles btw IDEs

6. Testing:
a/ Regression Testing:
+ Tools: PhantomCSS
+ How to: use with style guide