angular · pkozlowski-opensource · Jul 22, 2026 · Jul 22, 2026 · Jul 22, 2026
diff --git a/adev/shared-docs/pipeline/guides/index.mts b/adev/shared-docs/pipeline/guides/index.mts
@@ -55,6 +55,16 @@ async function main() {
       }
 
       const markdownContent = await readFile(filePath, {encoding: 'utf8'});
+
+      // A leading byte order mark (U+FEFF) stops the first Markdown heading from being
+      // recognized, so the page title renders as a paragraph and loses its header. Fail
+      // the build so the BOM has to be removed from the source file instead.
+      if (markdownContent.charCodeAt(0) === 0xfeff) {
+        throw new Error(
+          `The file "${filePath}" starts with a byte order mark (BOM). Remove it so the leading heading is parsed correctly.`,
+        );
+      }
+
       const htmlOutputContent = await parseMarkdownAsync(markdownContent, {
         markdownFilePath: filePath,
         apiEntries: mapManifestToEntries(apiManifest),

diff --git a/adev/src/content/guide/templates/binding.md b/adev/src/content/guide/templates/binding.md
@@ -1,4 +1,4 @@
-# Binding dynamic text, properties and attributes
+# Binding dynamic text, properties and attributes
 
 In Angular, a **binding** creates a dynamic connection between a component's template and its data. This connection ensures that changes to the component's data automatically update the rendered template.
 

diff --git a/adev/src/content/guide/templates/ng-container.md b/adev/src/content/guide/templates/ng-container.md
@@ -1,4 +1,4 @@
-# Grouping elements with ng-container
+# Grouping elements with ng-container
 
 `<ng-container>` is a special element in Angular that groups multiple elements together or marks a location in a template without rendering a real element in the DOM.