# A “link” element with a “rel” attribute that contains the value “preload” must have an “as” attribute.
> Canonical HTML version: https://rocketvalidator.com/html-validation/a-link-element-with-a-rel-attribute-that-contains-the-value-preload-must-have-an-as-attribute
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)
The `preload` value of the `` element's `rel` attribute lets you declare fetch requests in the HTML ``, telling the browser to start loading critical resources early in the page lifecycle—before the main rendering machinery kicks in. This can significantly improve performance by ensuring key assets are available sooner and are less likely to block rendering.
However, a preload hint is incomplete without the `as` attribute. The `as` attribute tells the browser *what kind* of resource is being fetched. This matters for several important reasons:
- **Request prioritization:** Browsers assign different priorities to different resource types. A stylesheet is typically higher priority than an image. Without `as`, the browser cannot apply the correct priority, and the preloaded resource may be fetched with a low default priority, undermining the purpose of preloading.
- **Content Security Policy (CSP):** CSP rules are applied based on resource type (e.g., `script-src`, `style-src`). Without knowing the type, the browser cannot enforce the appropriate policy.
- **Correct `Accept` header:** The `as` value determines which `Accept` header the browser sends with the request. For example, an image request sends a different `Accept` header than a script request. An incorrect or missing header could lead to unexpected responses from the server.
- **Cache matching:** When the resource is later requested by a `