# Element “object” is missing one or more of the following attributes: “data”, “type”.

> Canonical HTML version: https://rocketvalidator.com/html-validation/element-object-is-missing-one-or-more-of-the-following-attributes-data-type
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The `<object>` element embeds external resources such as images, videos, PDFs, or other media into a page. The `data` attribute specifies the URL of the resource, while the `type` attribute declares its MIME type (e.g., `"application/pdf"`, `"image/svg+xml"`, `"video/mp4"`). According to the HTML specification, the element must have at least one of these attributes present — without either, the element is meaningless because the browser cannot determine what to fetch or how to render it.

While the validator requires **at least one** of these attributes, best practice is to include **both**. Here's why:

- **Without `data`**, the browser has no resource to load.
- **Without `type`**, the browser must guess the content type from the server response, which can lead to incorrect rendering or security issues.
- **With both**, the browser knows exactly what to fetch and how to handle it before the resource even begins downloading, improving performance and reliability.

Including both attributes also benefits **accessibility**. Assistive technologies use the `type` attribute to determine how to present the content to users. Without it, screen readers and other tools may not be able to convey useful information about the embedded resource. You should also always provide fallback content inside the `<object>` element for browsers or devices that cannot render the embedded resource.

## Examples

### Missing both attributes (triggers the error)

```html
<object width="600" height="400">
  <p>Fallback content here.</p>
</object>
```

The validator reports this error because neither `data` nor `type` is present. The browser has no information about what this `<object>` should display.

### Missing `type` attribute (valid but not recommended)

```html
<object data="example.pdf" width="600" height="400">
  <p>Your browser does not support PDFs. <a href="example.pdf">Download the PDF</a>.</p>
</object>
```

This passes validation because `data` is present, but the browser must determine the content type on its own. Adding `type` is strongly recommended.

### Missing `data` attribute (valid but limited)

```html
<object type="application/pdf" width="600" height="400">
  <p>No PDF to display.</p>
</object>
```

This also passes validation since `type` is present, but without `data` there is no resource to load. This pattern is uncommon and generally not useful on its own.

### Correct: both attributes provided

```html
<object data="example.pdf" type="application/pdf" width="600" height="400">
  <p>Your browser does not support PDFs. <a href="example.pdf">Download the PDF</a>.</p>
</object>
```

### Correct: embedding an SVG image

```html
<object data="diagram.svg" type="image/svg+xml" width="300" height="200">
  <img src="diagram.png" alt="Architecture diagram showing the system components">
</object>
```

This example also demonstrates good fallback practice — if the browser cannot render the SVG via `<object>`, it falls back to a regular `<img>` element with descriptive `alt` text.

### Correct: embedding a video

```html
<object data="intro.mp4" type="video/mp4" width="640" height="360">
  <p>Your browser cannot play this video. <a href="intro.mp4">Download it instead</a>.</p>
</object>
```

## Quick reference of common MIME types

| Resource type | `type` value |
|---|---|
| PDF document | `application/pdf` |
| SVG image | `image/svg+xml` |
| MP4 video | `video/mp4` |
| HTML page | `text/html` |
| Flash (legacy) | `application/x-shockwave-flash` |

To resolve this validation error, ensure every `<object>` element includes at least a `data` or `type` attribute. For the best results across browsers and assistive technologies, always provide both along with meaningful fallback content inside the element.
