Skip to main content

Using Presets

There are some presets. It recommends specifying these because rules need to enable each.

Applying presets

Specify the extends property of the configuration like below:

"extends": ["markuplint:recommended"]

You can choose some base presets appropriately for your preference.

"extends": ["markuplint:html-standard", "markuplint:a11y"]

Base presets

  • markuplint:a11y
  • markuplint:html-standard
  • markuplint:performance
  • markuplint:rdfa
  • markuplint:security

See rulesets what each preset include those.

  • markuplint:recommended
  • markuplint:recommended-static-html
  • markuplint:recommended-react
  • markuplint:recommended-vue
  • markuplint:recommended-svelte

These recommended presets include all base presets. And each has specific rulesets except markuplint:recommended .

Rulesets of base presets

Must not duplicate IDBe able to avoid problems in assistive technologies from the viewpoint of machine readability.
Disallow accesskey attr
tabindex attr only -1 or 0
<label> should have control
Use landmark
No refer to no existent ID
Require accessible name
Require <h1>
Use <ul>
Conform to WAI-ARIA
Require <html lang>
Require <abbr title>
Require <track>
Require <video muted>
No merge cells
<summary> no contains interactive contentsThere is a case where an assistive technology can't access contents, or contents don't propagate a mouse event to <summary>.
Disallow autofocus attr to except in the dialog scopeDon't take away a focus to forced. However, the dialog element and its descendants allow it.
<search> requires search roleIt requires the role of an interim measure because some browsers or ATs are not supporting it yet.
No duplicate attrThe parser ignores all such duplicate occurrences of the attribute.
Use character reference
No use deprecated attrYou should not use deprecated attributes from the viewpoint of compatibility.
No use deprecated elementYou should not use deprecated elements from the viewpoint of compatibility.
Require doctypeIt has the effect of avoiding quirks mode.
No use ineffective attr
Allow only permitted contents
Need placeholder label option
Require the datetime attribute if the content of the time element is invalid
Specify required attr
Specify charset=UTF-8
No use <small> as subheadingsShould not use it in <h1>, <h2>, <h3>, <h4>, <h5>, and <h6>.
No use <caption> within <figure>When <table> is the only content in <figure> other than <figcaption>, <caption> should be omitted in favor of <figcaption>.
Require charset=UTF-8
Require defer attrShould load and parse scripts lazily to avoid render-blocking.
Require aspect-ratioRequire width and height attr with <img> to avoid Cumulative Layout Shift
Require async decoding imageRequire decoding=async with <img> to avoid render-blocking.
Require loading <iframe> lazilyRequire loading=lazy with <iframe> to avoid render-blocking that causes loading if its element is out of the viewport.
Allow property attr with <meta>Be able to use Open-Graph etc.

Ruleset of syntax specific presets

No hard coding IDThe component that hard-coded ID cannot mount to an app duplicated because the IDs must be unique in a document. Recommend to specify dynamic IDs to avoid doing that.
No omit end-tagRecommend to write an end-tag always because it is too difficult for a human decide an element is end-tag omittable.