gitmyhub

frontend-guidelines

★ 9.1k updated 2y ago

Some HTML, CSS and JS best practices.

Frontend Guidelines is a readable style guide covering good habits and common mistakes in HTML, CSS, and JavaScript, aimed at front-end developers who want to write cleaner, more maintainable web code.

HTMLCSSJavaScriptsetup: easycomplexity 1/5

Frontend Guidelines is a written reference that describes good habits and common mistakes to avoid when writing HTML, CSS, and JavaScript for websites. It is not a piece of software you install or run; it is a readable document aimed at developers who want to write cleaner, more consistent front-end code.

The HTML section covers things like using the correct semantic tags instead of generic divs, keeping markup terse by dropping unnecessary attributes that modern browsers handle automatically, making pages accessible by labeling form controls and writing meaningful image alt text, and loading scripts in the right order so they do not slow down page rendering.

The CSS section is the longest part. It addresses how to write selectors that are easy to override later, why avoiding the "!important" override keyword keeps stylesheets maintainable, how to use CSS inheritance and shorthand properties to reduce duplication, and when to favor newer layout tools like Flexbox and Grid instead of absolute positioning. It also gives specific guidance on units, colors, animations, and vendor prefixes for older browser support.

The JavaScript portion (not fully visible in the provided excerpt) follows the same pattern of brief rules paired with short "bad" and "good" code examples that make the guidance concrete.

The repository is essentially a style guide written as a README. There is no build process, no package to install, and no application to run. Someone new to web development could read through it in an hour and immediately apply several of the suggestions to real projects.

Where it fits