Fix typos and pseudo-typos 5 (mdn#36246)

* Fix typos and pseudo-typos 5

* Update index.md

Co-authored-by: Estelle Weyl <[email protected]>

---------

Co-authored-by: Estelle Weyl <[email protected]>

files/en-us/web/events/index.md

@@ -487,7 +487,7 @@ This topic provides an index to the main _sorts_ of events you might be interest
           <a href="/en-US/docs/Web/API/MouseEvent">computer mouse</a>.
         </p>
         <p>
-          Used to notify when the mouse is clicked, doubleclicked, up and down
+          Used to notify when the mouse is clicked, double-clicked, up and down
           events, right-click, movement in and out of an element, text
           selection, etc.
         </p>

files/en-us/web/guide/css/getting_started/challenge_solutions/index.md

@@ -15,7 +15,7 @@ The challenges on page [Why use CSS](/en-US/docs/Learn/CSS/First_steps/How_CSS_w
 - Challenge
   - : Without looking up a reference, find five more color names that work in your stylesheet.
 - Solution
-  - : CSS supports common color names like `orange`, `yellow`, `blue`, `green`, or `black`. It also supports some more exotic color names like `chartreuse`, `fuschia`, or `burlywood`. See [CSS Color value](/en-US/docs/Web/CSS/color_value) for a complete list as well as other ways of specifying colors.
+  - : CSS supports common color names like `orange`, `yellow`, `blue`, `green`, or `black`. It also supports some more exotic color names like `chartreuse`, `fuchsia`, or `burlywood`. See [CSS Color value](/en-US/docs/Web/CSS/color_value) for a complete list as well as other ways of specifying colors.
 
 ## How CSS works
 
@@ -199,11 +199,11 @@ The challenges on page [Lists](/en-US/docs/Learn/CSS/Styling_text/Styling_lists)
     ```css
     /* numbered headings */
     body {
-      counter-reset: headnum;
+      counter-reset: head-num;
     }
     h3::before {
-      content: "(" counter(headnum, upper-latin) ") ";
-      counter-increment: headnum;
+      content: "(" counter(head-num, upper-latin) ") ";
+      counter-increment: head-num;
     }
     ```
 

files/en-us/web/html/attributes/disabled/index.md

@@ -64,12 +64,12 @@ When form controls are disabled, many browsers will display them in a lighter, g
   <legend>Checkboxes</legend>
   <p>
     <label>
-      <input type="checkbox" name="chbox" value="regular" /> Regular
+      <input type="checkbox" name="ch-box" value="regular" /> Regular
     </label>
   </p>
   <p>
     <label>
-      <input type="checkbox" name="chbox" value="disabled" disabled /> disabled
+      <input type="checkbox" name="ch-box" value="disabled" disabled /> disabled
     </label>
   </p>
 </fieldset>

files/en-us/web/html/element/audio/index.md

@@ -319,6 +319,8 @@ The `<audio>` element doesn't directly support WebVTT. You will have to find a l
 
 In addition to spoken dialog, subtitles and transcripts should also identify music and sound effects that communicate important information. This includes emotion and tone. For example, in the WebVTT below, note the use of square brackets to provide tone and emotional insight to the viewer; this can help establish the mood otherwise provided using music, nonverbal sounds and crucial sound effects, and so forth.
 
+<!-- cSpell:ignore switchwatch Swisswatch -->
+
 ```plain
 1
 00:00:00 --> 00:00:45

files/en-us/web/html/element/fencedframe/index.md

@@ -13,7 +13,7 @@ The **`<fencedframe>`** [HTML](/en-US/docs/Web/HTML) element represents a nested
 
 - Communication is restricted between the `<fencedframe>` content and its embedding site.
 - A `<fencedframe>` can access cross-site data, but only in a very specific set of controlled circumstances that preserve user privacy.
-- A `<fencedframes>` cannot be manipulated or have its data accessed via regular scripting (for example reading or setting the source URL). `<fencedframe>` content can only be embedded via [specific APIs](/en-US/docs/Web/API/Fenced_frame_API#use_cases).
+- A `<fencedframe>` cannot be manipulated or have its data accessed via regular scripting (for example reading or setting the source URL). `<fencedframe>` content can only be embedded via [specific APIs](/en-US/docs/Web/API/Fenced_frame_API#use_cases).
 - A `<fencedframe>` cannot access the embedding context's DOM, nor can the embedding context access the `<fencedframe>`'s DOM.
 
 The `<fencedframe>` element is a type of `<iframe>` with more native privacy features built in. It addresses shortcomings of `<iframe>`s such as reliance on third-party cookies and other privacy risks. See [Fenced frame API](/en-US/docs/Web/API/Fenced_frame_API) for more details.

files/en-us/web/html/element/img/index.md

@@ -14,7 +14,7 @@ The **`<img>`** [HTML](/en-US/docs/Web/HTML) element embeds an image into the do
 The above example shows usage of the `<img>` element:
 
 - The `src` attribute is **required**, and contains the path to the image you want to embed.
-- The `alt` attribute holds a textual replacement for the image, which is mandatory and **incredibly useful** for accessibility — screen readers read the attribute value out to their users so they know what the image means. Alt text is also displayed on the page if the image can't be loaded for some reason: for example, network errors, content blocking, or linkrot.
+- The `alt` attribute holds a textual replacement for the image, which is mandatory and **incredibly useful** for accessibility — screen readers read the attribute value out to their users so they know what the image means. Alt text is also displayed on the page if the image can't be loaded for some reason: for example, network errors, content blocking, or link rot.
 
 There are many other attributes to achieve various purposes:
 
@@ -180,7 +180,7 @@ This element includes the [global attributes](/en-US/docs/Web/HTML/Global_attrib
     > Loading is only deferred when JavaScript is enabled. This is an anti-tracking measure, because if a user agent supported lazy loading when scripting is disabled, it would still be possible for a site to track a user's approximate scroll position throughout a session, by strategically placing images in a page's markup such that a server can track how many images are requested and when.
 
     > [!NOTE]
-    > Images with `loading` set to `lazy` will never be loaded if they do not intersect a visible part of an element, even if loading them would change that as unloaded images have a `width` and `height` of `0`. Putting `width` and `height` on lazyloaded images fixes this issue and is a best practice, [recommended by the specification](https://html.spec.whatwg.org/multipage/embedded-content.html#the-img-element). Doing so also helps prevent layout shifts.
+    > Images with `loading` set to `lazy` will never be loaded if they do not intersect a visible part of an element, even if loading them would change that as unloaded images have a `width` and `height` of `0`. Putting `width` and `height` on lazy-loaded images fixes this issue and is a best practice, [recommended by the specification](https://html.spec.whatwg.org/multipage/embedded-content.html#the-img-element). Doing so also helps prevent layout shifts.
 
 - `referrerpolicy`
 

files/en-us/web/html/element/input/button/index.md

@@ -105,7 +105,7 @@ function updateButton() {
 {{EmbedLiveSample("Adding_keyboard_shortcuts_to_buttons", 650, 100)}}
 
 > [!NOTE]
-> The problem with the above example of course is that the user will not know what the access key is! In a real site, you'd have to provide this information in a way that doesn't interfere with the site design (for example by providing an easily accessible link that points to information on what the site accesskeys are).
+> The problem with the above example of course is that the user will not know what the access key is! In a real site, you'd have to provide this information in a way that doesn't interfere with the site design (for example by providing an easily accessible link that points to information on what the site access keys are).
 
 ### Disabling and enabling a button
 
@@ -249,7 +249,7 @@ function degToRad(degrees) {
   return (degrees * Math.PI) / 180;
 }
 
-// update sizepicker output value
+// update size picker output value
 
 sizePicker.oninput = () => {
   output.textContent = sizePicker.value;

files/en-us/web/html/element/input/datetime-local/index.md

@@ -26,16 +26,16 @@ You can set a default value for the input by including a date and time inside th
 <input
   id="party"
   type="datetime-local"
-  name="partydate"
+  name="party-date"
   value="2017-06-01T08:30" />
 ```
 
 {{ EmbedLiveSample('Value', 600, 60) }}
 
-One thing to note is that the displayed date and time formats differ from the actual `value`; the displayed date and time are formatted according to the user's locale as reported by their operating system, whereas the date/time `value` is always formatted `YYYY-MM-DDTHH:mm`. When the above value is submitted to the server, for example, it will look like `partydate=2024-06-01T08:30`.
+One thing to note is that the displayed date and time formats differ from the actual `value`; the displayed date and time are formatted according to the user's locale as reported by their operating system, whereas the date/time `value` is always formatted `YYYY-MM-DDTHH:mm`. When the above value is submitted to the server, for example, it will look like `party-date=2024-06-01T08:30`.
 
 > [!NOTE]
-> Also bear in mind that if such data is submitted via HTTP [`GET`](/en-US/docs/Web/HTTP/Methods/GET), the colon character will need to be escaped for inclusion in the URL parameters, e.g. `partydate=2024-06-01T08%3A30`. See {{jsxref("Global_Objects/encodeURI", "encodeURI()")}} for one way to do this.
+> Also bear in mind that if such data is submitted via HTTP [`GET`](/en-US/docs/Web/HTTP/Methods/GET), the colon character will need to be escaped for inclusion in the URL parameters, e.g. `party-date=2024-06-01T08%3A30`. See {{jsxref("Global_Objects/encodeURI", "encodeURI()")}} for one way to do this.
 
 You can also get and set the date value in JavaScript using the {{domxref("HTMLInputElement")}} `value` property, for example:
 
@@ -123,7 +123,7 @@ Let's look at an example; here we've set minimum and maximum date/time values, a
     <input
       id="party"
       type="datetime-local"
-      name="partydate"
+      name="party-date"
       min="2017-06-01T08:30"
       max="2017-06-30T16:30"
       required />
@@ -179,7 +179,7 @@ The simplest use of `<input type="datetime-local">` involves a basic `<input>` a
 ```html
 <form>
   <label for="party">Enter a date and time for your party booking:</label>
-  <input id="party" type="datetime-local" name="partydate" />
+  <input id="party" type="datetime-local" name="party-date" />
 </form>
 ```
 
@@ -195,7 +195,7 @@ You can use the [`min`](/en-US/docs/Web/HTML/Element/input#min) and [`max`](/en-
   <input
     id="party"
     type="datetime-local"
-    name="partydate"
+    name="party-date"
     min="2024-06-01T08:30"
     max="2024-06-30T16:30" />
 </form>

files/en-us/web/html/element/input/index.md

@@ -582,7 +582,7 @@ A few additional non-standard attributes are listed following the descriptions o
 
 - [`size`](/en-US/docs/Web/HTML/Attributes/size)
 
-  - : Valid for `email`, `password`, `tel`, `url`, and `text`, the `size` attribute specifies how much of the input is shown. Basically creates same result as setting CSS [`width`](/en-US/docs/Web/CSS/width) property with a few specialities. The actual unit of the value depends on the input type. For `password` and `text`, it is a number of characters (or `em` units) with a default value of `20`, and for others, it is pixels (or `px` units). CSS `width` takes precedence over the `size` attribute.
+  - : Valid for `email`, `password`, `tel`, `url`, and `text`, the `size` attribute specifies how much of the input is shown. Basically creates same result as setting CSS [`width`](/en-US/docs/Web/CSS/width) property with a few specialties. The actual unit of the value depends on the input type. For `password` and `text`, it is a number of characters (or `em` units) with a default value of `20`, and for others, it is pixels (or `px` units). CSS `width` takes precedence over the `size` attribute.
 
 - `src`
 

files/en-us/web/html/element/input/search/index.md

@@ -135,7 +135,7 @@ This renders like so:
 
 {{EmbedLiveSample("Basic_example", 600, 40)}}
 
-`q` is the most common `name` given to search inputs, although it's not mandatory. When submitted, the data name/value pair sent to the server will be `q=searchterm`.
+`q` is the most common `name` given to search inputs, although it's not mandatory. When submitted, the data name/value pair sent to the server will be `q=searchTerm`.
 
 > [!NOTE]
 > You must remember to set a [`name`](/en-US/docs/Web/HTML/Element/input#name) for your input, otherwise nothing will be submitted.

files/en-us/web/html/element/input/submit/index.md

@@ -120,7 +120,7 @@ This renders like so:
 
 Try entering some text into the text field, and then submitting the form.
 
-Upon submitting, the data name/value pair gets sent to the server. In this instance, the string will be `text=usertext`, where "usertext" is the text entered by the user, encoded to preserve special characters. Where and how the data is submitted depends on the configuration of the `<form>`; see [Sending form data](/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data) for more details.
+Upon submitting, the data name/value pair gets sent to the server. In this instance, the string will be `text=user-text`, where "user-text" is the text entered by the user, encoded to preserve special characters. Where and how the data is submitted depends on the configuration of the `<form>`; see [Sending form data](/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data) for more details.
 
 ### Adding a keyboard shortcut to a submit button
 

files/en-us/web/html/element/input/time/index.md

@@ -18,8 +18,12 @@ While the control's user interface appearance is based on the browser and operat
 You can set a default value for the input by including a valid time in the [`value`](/en-US/docs/Web/HTML/Element/input#value) attribute when creating the `<input>` element, like so:
 
 ```html
-<label for="appt-time">Choose an appointment time: </label>
-<input id="appt-time" type="time" name="appt-time" value="13:30" />
+<label for="appointment-time">Choose an appointment time: </label>
+<input
+  id="appointment-time"
+  type="time"
+  name="appointment-time"
+  value="13:30" />
 ```
 
 {{ EmbedLiveSample('Setting_the_value_attribute', 600, 60) }}
@@ -118,8 +122,8 @@ The simplest use of `<input type="time">` involves a basic `<input>` and {{htmle
 
 ```html
 <form>
-  <label for="appt-time">Choose an appointment time: </label>
-  <input id="appt-time" type="time" name="appt-time" />
+  <label for="appointment-time">Choose an appointment time: </label>
+  <input id="appointment-time" type="time" name="appointment-time" />
 </form>
 ```
 
@@ -137,8 +141,8 @@ It takes an integer value defining the number of seconds you want to increment b
 
 ```html
 <form>
-  <label for="appt-time">Choose an appointment time: </label>
-  <input id="appt-time" type="time" name="appt-time" step="2" />
+  <label for="appointment-time">Choose an appointment time: </label>
+  <input id="appointment-time" type="time" name="appointment-time" step="2" />
 </form>
 ```
 
@@ -156,10 +160,15 @@ You can use the [`min`](/en-US/docs/Web/HTML/Element/input#min) and [`max`](/en-
 
 ```html
 <form>
-  <label for="appt-time">
+  <label for="appointment-time">
     Choose an appointment time (opening hours 12:00 to 18:00):
   </label>
-  <input id="appt-time" type="time" name="appt-time" min="12:00" max="18:00" />
+  <input
+    id="appointment-time"
+    type="time"
+    name="appointment-time"
+    min="12:00"
+    max="18:00" />
   <span class="validity"></span>
 </form>
 ```
@@ -226,13 +235,13 @@ Let's look at an example; here we've set minimum and maximum times, and also mad
 ```html
 <form>
   <div>
-    <label for="appt-time">
+    <label for="appointment-time">
       Choose an appointment time (opening hours 12:00 to 18:00):
     </label>
     <input
-      id="appt-time"
+      id="appointment-time"
       type="time"
-      name="appt-time"
+      name="appointment-time"
       min="12:00"
       max="18:00"
       required />
@@ -259,13 +268,13 @@ In this example, we create an interface element for choosing time using the nati
 
 ```html
 <form>
-  <label for="appt-time">
+  <label for="appointment-time">
     Choose an appointment time (opening hours 12:00 to 18:00):
   </label>
   <input
-    id="appt-time"
+    id="appointment-time"
     type="time"
-    name="appt-time"
+    name="appointment-time"
     min="12:00"
     max="18:00"
     required />

files/en-us/web/html/element/input/url/index.md

@@ -18,7 +18,7 @@ The input value is automatically validated to ensure that it's either empty or a
 The {{HTMLElement("input")}} element's [`value`](/en-US/docs/Web/HTML/Element/input#value) attribute contains a string that is automatically validated as conforming to URL syntax. More specifically, there are two possible value formats that will pass validation:
 
 1. An empty string ("") indicates the user did not enter a value or that the value was removed.
-2. A single properly-formed absolute URL. This doesn't necessarily mean the URL address exists, but it is at least formatted correctly. An entry matching `urlscheme://restofurl` can be valid, even if the `urlscheme` entered doesn't exist.
+2. A single properly-formed absolute URL. This doesn't necessarily mean the URL address exists, but it is at least formatted correctly. An entry matching `urlscheme://rest-of-url` can be valid, even if the `urlscheme` entered doesn't exist.
 
 See [Validation](#validation) for details on how URLs are validated to ensure that they're formatted properly.
 

files/en-us/web/html/element/kbd/index.md

@@ -34,8 +34,8 @@ Other elements can be used in tandem with `<kbd>` to represent more specific sce
 
 ```html
 <p>
-  Use the command <kbd>help mycommand</kbd> to view documentation for the
-  command "mycommand".
+  Use the command <kbd>help my-command</kbd> to view documentation for the
+  command "my-command".
 </p>
 ```
 

files/en-us/web/html/element/link/index.md

@@ -218,9 +218,9 @@ This element includes the [global attributes](/en-US/docs/Web/HTML/Global_attrib
     Allowed values are specified by {{RFC(5646, "Tags for Identifying Languages (also known as BCP 47)")}}.
     Use this attribute only if the [`href`](/en-US/docs/Web/HTML/Element/a#href) attribute is present.
 - `imagesizes`
-  - : For `rel="preload"` and `as="image"` only, the `imagesizes` attribute is [a sizes attribute](https://html.spec.whatwg.org/multipage/images.html#sizes-attribute) that indicates to preload the appropriate resource used by an `img` element with corresponding values for its `srcset` and `sizes` attributes.
+  - : For `rel="preload"` and `as="image"` only, the `imagesizes` attribute has similar syntax and semantics as the [`sizes`](/en-US/docs/Web/HTML/Element/img#sizes) attribute that indicates to preload the appropriate resource used by an `img` element with corresponding values for its `srcset` and `sizes` attributes.
 - `imagesrcset`
-  - : For `rel="preload"` and `as="image"` only, the `imagesrcset` attribute is [a sourceset attribute](https://html.spec.whatwg.org/multipage/images.html#srcset-attribute) that indicates to preload the appropriate resource used by an `img` element with corresponding values for its `srcset` and `sizes` attributes.
+  - : For `rel="preload"` and `as="image"` only, the `imagesrcset` attribute has similar syntax and semantics as the [`srcset`](/en-US/docs/Web/HTML/Element/img#srcset) attribute that indicates to preload the appropriate resource used by an `img` element with corresponding values for its `srcset` and `sizes` attributes.
 - `integrity`
   - : Contains inline metadata — a base64-encoded cryptographic hash of the resource (file) you're telling the browser to fetch.
     The browser can use this to verify that the fetched resource has been delivered without unexpected manipulation.