Add page for HTTP Refresh header (#35709)

* Add page for HTTP Refresh header * Update files/en-us/web/http/headers/refresh/index.md Co-authored-by: Hamish Willee <hamishwillee@gmail.com> * Update files/en-us/web/http/headers/refresh/index.md * Apply suggestions from code review --------- Co-authored-by: Hamish Willee <hamishwillee@gmail.com>
mdn · Sep 3, 2024 · cbbe2e8 · cbbe2e8
1 parent e3676f9
commit cbbe2e8
Show file tree

Hide file tree

Showing 2 changed files with 94 additions and 18 deletions.
diff --git a/files/en-us/web/html/element/meta/index.md b/files/en-us/web/html/element/meta/index.md
@@ -29,40 +29,48 @@ This element includes the [global attributes](/en-US/docs/Web/HTML/Global_attrib
  - : This attribute contains the value for the [`http-equiv`](#http-equiv) or [`name`](#name) attribute, depending on which is used.
 - `http-equiv`
 
- - : Defines a pragma directive. The attribute is named `http-equiv(alent)` because all the allowed values are names of particular HTTP headers:
+ - : Defines a pragma directive. The attribute's name, short for `http-equivalent`, is because all the allowed values are names of particular HTTP headers:
 
  - `content-security-policy`
 
- Allows page authors to define a [content policy](/en-US/docs/Web/HTTP/Headers/Content-Security-Policy) for the current page. Content policies mostly specify allowed server origins and script endpoints which help guard against cross-site scripting attacks.
+ - : Allows page authors to define a [content policy](/en-US/docs/Web/HTTP/Headers/Content-Security-Policy) for the current page. Content policies mostly specify allowed server origins and script endpoints which help guard against cross-site scripting attacks.
+
+ Also see {{HTTPHeader("Content-Security-Policy")}}.
 
  - `content-type`
 
- Declares the [MIME type](/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types) and the document's character encoding. The `content` attribute must have the value `"text/html; charset=utf-8"` if specified. This is equivalent to a `<meta>` element with the [`charset`](#charset) attribute specified and carries the same restriction on placement within the document. **Note:** Can only be used in documents served with a `text/html` — not in documents served with an XML MIME type.
+ - : Declares the [MIME type](/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types) and the document's character encoding. The `content` attribute must have the value `"text/html; charset=utf-8"` if specified. This is equivalent to a `<meta>` element with the [`charset`](#charset) attribute specified and carries the same restriction on placement within the document. **Note:** Can only be used in documents served with a `text/html` — not in documents served with an XML MIME type.
+
+ Also see {{HTTPHeader("Content-Type")}}.
 
  - `default-style`
 
- Sets the name of the default [CSS style sheet](/en-US/docs/Web/CSS) set.
+ - : Sets the name of the default [CSS style sheet](/en-US/docs/Web/CSS) set.
 
  - `x-ua-compatible`
 
- If specified, the `content` attribute must have the value `"IE=edge"`. User agents are required to ignore this pragma.
+ - : If specified, the `content` attribute must have the value `"IE=edge"`. User agents are required to ignore this pragma.
+
+ - `refresh`
 
- - `refresh` This instruction specifies:
+  - : This instruction specifies:
 
- - The number of seconds until the page should be reloaded - only if the [`content`](#content) attribute contains a non-negative integer.
- - The number of seconds until the page should redirect to another - only if the [`content`](#content) attribute contains a non-negative integer followed by the string '`;url=`', and a valid URL.
+  - The number of seconds until the page should be reloaded - if the [`content`](#content) attribute's value is a non-negative integer.
+  - The number of seconds until the page should redirect to another - if the [`content`](#content) attribute's value is a non-negative integer followed by `;url=` and a valid URL.
 
- The timer starts when the page is _completely loaded_, which is after the {{domxref("Window/load_event", "load")}} and {{domxref("Window/pageshow_event", "pageshow")}} events have both fired.
+  The timer starts when the page is _completely loaded_, which is after the {{domxref("Window/load_event", "load")}} and {{domxref("Window/pageshow_event", "pageshow")}} events have both fired.
 
- > [!WARNING]
- >
- > Pages set with a `refresh` value run the risk of having the time interval being too short. People navigating with the aid of assistive technology such as a screen reader may be unable to read through and understand the page's content before being automatically redirected. The abrupt, unannounced updating of the page content may also be disorienting for people experiencing low vision conditions.
- >
- > - [MDN Understanding WCAG, Guideline 2.2 explanations](/en-US/docs/Web/Accessibility/Understanding_WCAG/Operable#guideline_2.2_—_enough_time_provide_users_enough_time_to_read_and_use_content)
- > - [MDN Understanding WCAG, Guideline 3.2 explanations](/en-US/docs/Web/Accessibility/Understanding_WCAG/Understandable#guideline_3.2_—_predictable_make_web_pages_appear_and_operate_in_predictable_ways)
- > - [Understanding Success Criterion 2.2.1 | W3C Understanding WCAG 2.0](https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-required-behaviors.html)
- > - [Understanding Success Criterion 2.2.4 | W3C Understanding WCAG 2.0](https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-postponed.html)
- > - [Understanding Success Criterion 3.2.5 | W3C Understanding WCAG 2.0](https://www.w3.org/TR/UNDERSTANDING-WCAG20/consistent-behavior-no-extreme-changes-context.html)
+ Also see {{HTTPHeader("Refresh")}}.
+
+ > [!WARNING]
+ >
+ > Pages set with a `refresh` value run the risk of having the time interval being too short. People navigating with the aid of assistive technology such as a screen reader may be unable to read through and understand the page's content before being automatically redirected. The abrupt, unannounced updating of the page content may also be disorienting for people experiencing low vision conditions.
+ >
+ > - [MDN Understanding WCAG, Guideline 2.2 explanations](/en-US/docs/Web/Accessibility/Understanding_WCAG/Operable#guideline_2.2_—_enough_time_provide_users_enough_time_to_read_and_use_content)
+ > - [MDN Understanding WCAG, Guideline 3.2 explanations](/en-US/docs/Web/Accessibility/Understanding_WCAG/Understandable#guideline_3.2_—_predictable_make_web_pages_appear_and_operate_in_predictable_ways)
+ > - [Understanding Success Criterion 2.2.1 | W3C Understanding WCAG 2.0](https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-required-behaviors.html)
+ > - [Understanding Success Criterion 2.2.4 | W3C Understanding WCAG 2.0](https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-postponed.html)
+ > - [Understanding Success Criterion 3.2.5 | W3C Understanding WCAG 2.0](https://www.w3.org/TR/UNDERSTANDING-WCAG20/consistent-behavior-no-extreme-changes-context.html)
 
 - `name`
 

diff --git a/files/en-us/web/http/headers/refresh/index.md b/files/en-us/web/http/headers/refresh/index.md
@@ -0,0 +1,68 @@
+---
+title: Refresh
+slug: Web/HTTP/Headers/Refresh
+page-type: http-header
+browser-compat: http.headers.Refresh
+---
+
+{{HTTPSidebar}}
+
+The **`Refresh`** response header directs a web browser to either refresh or redirect the page when a specified amount of time has passed after the page was fully loaded. It is exactly equivalent to using [`<meta http-equiv="refresh" content="...">`](/en-US/docs/Web/HTML/Element/meta#http-equiv) in HTML.
+
+> [!NOTE]
+> Even though it's present in the HTTP response, the `Refresh` header is still handled by the HTML loading machinery and happens after HTTP or JavaScript redirects. See [redirection order of precedence](/en-US/docs/Web/HTTP/Redirections#order_of_precedence) for more information.
+
+<table class="properties">
+ <tbody>
+ <tr>
+  <th scope="row">Header type</th>
+  <td>{{Glossary("Response header")}}</td>
+ </tr>
+ <tr>
+  <th scope="row">{{Glossary("Forbidden header name")}}</th>
+  <td>no</td>
+ </tr>
+ </tbody>
+</table>
+
+## Syntax
+
+```http
+Refresh: <time>
+Refresh: <time>, url=<url>
+Refresh: <time>; url=<url>
+```
+
+- `<time>`
+ - : A non-negative number of seconds after which to refresh the page. Fractional parts are recognized but ignored; you should only specify integers.
+- `<url>` {{optional_inline}}
+ - : If present, the browser will redirect to the specified URL instead of refreshing with the current URL. This URL can be quoted or unquoted. The `url=` prefix is case-insensitive and optional.
+
+## Examples
+
+This header will cause the browser to refresh the page 5 seconds after it is fully loaded (that is, after the {{domxref("Window/load_event", "load")}} event):
+
+```http
+Refresh: 5
+```
+
+This header will cause the browser to redirect to the homepage 5 seconds after the page is fully loaded:
+
+```http
+Refresh: 5; url=https://example.com/
+```
+
+See the [`http-equiv="refresh"`](/en-US/docs/Web/HTML/Element/meta#refresh) attribute in the HTML reference for important information about accessibility implications of automatic redirects.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{htmlelement("meta")}}
+- [Redirections in HTTP](/en-US/docs/Web/HTTP/Redirections)