-iOS: new WWDC23 video {'Create rich documentation with Swift-DocC'}.

src/assets/json/en/ios/wwdc/ios-wwdc-listnota11y.json

@@ -76,6 +76,17 @@
     "raccourcis": "2023/23Symbols",
     "profils": ["All"]
   },
+  {
+    "themes": "WWDC 2023",
+    "title": "Create rich documentation with Swift-DocC",
+    "type": [],
+    "tests": [],
+    "verifier": [],
+    "resultat": [],
+    "exception": "",
+    "raccourcis": "2023/2310244",
+    "profils": ["All","DocC"]
+  },
   {
     "themes": "WWDC 2023",
     "title": "Design dynamic Live Activities",

src/en/mobile/ios/wwdc/nota11y/2023/2310244.md

@@ -0,0 +1,237 @@
+---
+title : "Create rich documentation with Swift-DocC"
+abstract: "Learn how you can take advantage of the latest features in Swift-DocC."
+
+displayToc: true
+---
+
+# WWDC 2023: Create rich documentation with Swift-DocC
+Find hereafter a detailed summary of the above named video that belongs to a [taxonomy of some WWDC footages](../../).
+
+The original videos are available on the **Apple official website** ([session 10244](https://developer.apple.com/videos/play/wwdc2023/10244/)).
+
+![](../../../../../images/iOSdev/wwdc23-10244_Poster.png)
+
+"Learn how you can take advantage of the latest features in Swift-DocC to **create rich and detailed documentation** for your app or framework. We'll show you how to use the **Xcode 15 Documentation Preview editor** to efficiently iterate on your existing project's documentation, and explore expanded authoring capabilities like grid-based layouts, video support, and custom themes."
+
+</br>Hereafter, the underlined elements **lead directly to the playback of the WWDC video** at the appropriate moment.
+</br>
+
+## [Overview](https://developer.apple.com/videos/play/wwdc2023/10244/?time=46)
+Aside from being an [open&nbsp;source](https://developer.apple.com/videos/play/wwdc2023/10244/?time=99) project, **Swift-DocC** is an **integrated documentation environment** that enables `Xcode` to realize many useful actions regarding the documentation for `Swift` packages and frameworks: this documentation is [available](https://developer.apple.com/videos/play/wwdc2023/10244/?time=80) to anyone who has access to the source code while being deployed to a website as well.
+![](../../../../../images/iOSdev/wwdc23-10244_1.png)
+New in `Xcode 15`, the [preview&nbsp;editor](https://developer.apple.com/videos/play/wwdc2023/10244?time=125) enables the documentation to be written while real-time results are displayed nearby.
+
+![](../../../../../images/iOSdev/wwdc23-10244_2.png)
+</br>
+
+## [Authoring](https://developer.apple.com/videos/play/wwdc2023/10244?time=214)
+### Assessment
+[Building](https://developer.apple.com/videos/play/wwdc2023/10244?time=239) the documentation through `Xcode` is the best way for a **documentation assessment** in your project including all the dependencies: a clear and well-organized [presentation](https://developer.apple.com/videos/play/wwdc2023/10244/?time=290) is the key to provide a useful documentation that's easy to understand.
+![](../../../../../images/iOSdev/wwdc23-10244_3.png)
+
+As a [new&nbsp;`Swift-DocC`&nbsp;feature](https://developer.apple.com/videos/play/wwdc2023/10244/?time=367), `Xcode 15` gives the opportunity to **document the extensions**.
+
+![](../../../../../images/iOSdev/wwdc23-10244_4.png)
+
+If some modifications need to be done, activate the **preview editor** to be displayed whatever the navigation between the files.
+</br>
+
+### Preview&nbsp;editor
+
+<ul class="nav nav-tabs" role="tablist">
+    <li class="nav-item" role="presentation">
+        <a class="nav-link active"
+           data-bs-toggle="tab" 
+           href="#DocCWriting1"
+           id="DocCWriting1_tab"
+           role="tab" 
+           aria-selected="true">Interface</a>
+    </li>
+    <li class="nav-item" role="presentation">
+        <a class="nav-link"
+           data-bs-toggle="tab" 
+           href="#DocCWriting2"
+           id="DocCWriting2_tab"
+           role="tab" 
+           aria-selected="false">Modifications</a>
+    </li>
+    </ul>
+
+<div class="tab-content">
+<div class="tab-pane show active" id="DocCWriting1" role="tabpanel">
+
+<a alt="Click to playback the footage at the appropriate moment regarding the preview editor" href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=485">🎬</a>
+
+![](../../../../../images/iOSdev/wwdc23-10244_5.png)
+</div>
+
+<div class="tab-pane" id="DocCWriting2" role="tabpanel">
+
+It is simple to add elements to the documentation by following a few rules:
+- Insert a **discussion section** ⟹ <a alt="Click to playback the video footage." href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=536">🎬</a>
+
+- Introduce a **code example** ⟹ <a alt="Click to playback the video footage." href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=562">🎬</a>
+
+- Use a **screenshot** through the documentation catalog ⟹ <a alt="Click to playback the video footage." href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=601">🎬</a>
+
+- Write the **image syntax** ⟹ <a alt="Click to playback the video footage." href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=679">🎬</a>
+
+- Put a **sentence at the end** ⟹ <a alt="Click to playback the video footage." href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=708">🎬</a>
+
+![](../../../../../images/iOSdev/wwdc23-10244_6.png)
+</div>
+</div>
+</br>
+</br>
+
+### [Directives](https://developer.apple.com/videos/play/wwdc2023/10244/?time=790)
+![](../../../../../images/iOSdev/wwdc23-10244_7.png)
+The **directives** are used alongside markdown to be recognized as **dedicated markers** by `Swift-DocC` for informing how this latter should generate the content in a [creative&nbsp;way](https://developer.apple.com/videos/play/wwdc2023/10244/?time=866).</br>
+The directives' purposes are highlighted hereafter with the improvement of an article presentation and the introduction thereof into a top-level page.
+</br>
+
+#### Article
+<ul class="nav nav-tabs" role="tablist">
+    <li class="nav-item" role="presentation">
+        <a class="nav-link active"
+           data-bs-toggle="tab" 
+           href="#DocCWritingDirectives1"
+           id="DocCWritingDirectives1_tab"
+           role="tab" 
+           aria-selected="true">Improv&nbsp;#1</a>
+    </li>
+    <li class="nav-item" role="presentation">
+        <a class="nav-link"
+           data-bs-toggle="tab" 
+           href="#DocCWritingDirectives2"
+           id="DocCWritingDirectives2_tab"
+           role="tab" 
+           aria-selected="false">Improv&nbsp;#2</a>
+    </li>
+    <li class="nav-item" role="presentation">
+        <a class="nav-link"
+           data-bs-toggle="tab" 
+           href="#DocCWritingDirectives3"
+           id="DocCWritingDirectives2_tab"
+           role="tab" 
+           aria-selected="false">Improv&nbsp;#3</a>
+    </li>
+    <li class="nav-item" role="presentation">
+        <a class="nav-link"
+           data-bs-toggle="tab" 
+           href="#DocCWritingDirectives4"
+           id="DocCWritingDirectives2_tab"
+           role="tab" 
+           aria-selected="false">Improv&nbsp;#4</a>
+    </li>
+    </ul>
+
+<div class="tab-content">
+<div class="tab-pane show active" id="DocCWritingDirectives1" role="tabpanel">
+
+<a alt="Click to playback the footage at the appropriate moment regarding the first improvement" href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=892">🎬</a>
+
+[Adapting&nbsp;the&nbsp;style](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1163) of a document's header to its content is essential.
+
+![](../../../../../images/iOSdev/wwdc23-10244_10.png)
+
+Using different arguments for the **[PageKind](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1221)** directive is the appropriate way to accurately define the document's type.
+</div>
+
+<div class="tab-pane" id="DocCWritingDirectives2" role="tabpanel">
+
+<a alt="Click to playback the footage at the appropriate moment regarding the second improvement" href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=1133">🎬</a>
+
+Adding a **dynamic content** might be a good way for promoting the document's content.
+
+![](../../../../../images/iOSdev/wwdc23-10244_11.png)
+</div>
+
+<div class="tab-pane" id="DocCWritingDirectives3" role="tabpanel">
+
+<a alt="Click to playback the footage at the appropriate moment regarding the third improvement" href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=928">🎬</a>
+
+When the images and the text might seem to be disproportionate, the association with **grid and directives** is a [good&nbsp;means](https://developer.apple.com/videos/play/wwdc2023/10244/?time=973) to easily adapt the size and rearrange the position of elements.
+
+![](../../../../../images/iOSdev/wwdc23-10244_8.png)
+</div>
+
+<div class="tab-pane" id="DocCWritingDirectives4" role="tabpanel">
+
+<a alt="Click to playback the footage at the appropriate moment regarding the fourth improvement" href="https://developer.apple.com/videos/play/wwdc2023/10244/?time=945">🎬</a>
+
+When **reducing the occupied space** becomes crucial, a **tab navigator** for combining many elements altogether may be a good candidate for the [solution](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1074). 
+![](../../../../../images/iOSdev/wwdc23-10244_9.png)
+</div>
+</div>
+</br>
+</br>
+
+![](../../../../../images/iOSdev/wwdc23-10244_12.png)
+
+#### [Top-level&nbsp;page](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1265)
+<ul class="nav nav-tabs" role="tablist">
+    <li class="nav-item" role="presentation">
+        <a class="nav-link active"
+           data-bs-toggle="tab" 
+           href="#DocCWritingTopLevelPage1"
+           id="DocCWritingTopLevelPage1_tab"
+           role="tab" 
+           aria-selected="true">Final&nbsp;rendering</a>
+    </li>
+    <li class="nav-item" role="presentation">
+        <a class="nav-link"
+           data-bs-toggle="tab" 
+           href="#DocCWritingTopLevelPage2"
+           id="DocCWritingTopLevelPage2_tab"
+           role="tab" 
+           aria-selected="false">Code&nbsp;writing</a>
+    </li>
+    </ul>
+
+<div class="tab-content">
+<div class="tab-pane show active" id="DocCWritingTopLevelPage1" role="tabpanel">
+
+![](../../../../../images/iOSdev/wwdc23-10244_14.png)
+</div>
+
+<div class="tab-pane" id="DocCWritingTopLevelPage2" role="tabpanel">
+
+1. **[Document&nbsp;recording](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1281)** into a `Topic` group.
+![](../../../../../images/iOSdev/wwdc23-10244_15.png)
+
+2. **[Creation&nbsp;of&nbsp;a&nbsp;section](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1300)** thanks to the `Links` directive.
+![](../../../../../images/iOSdev/wwdc23-10244_16.png)
+
+3. **[Creation&nbsp;of&nbsp;a&nbsp;page&nbsp;image](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1366)** in the metadata of a document.
+![](../../../../../images/iOSdev/wwdc23-10244_17.png)
+
+4. Insert an **[image&nbsp;in&nbsp;the&nbsp;header](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1411)** and modify the **[background&nbsp;color](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1440)**
+![](../../../../../images/iOSdev/wwdc23-10244_18.png)
+</div>
+</div>
+</br>
+</br>
+
+![](../../../../../images/iOSdev/wwdc23-10244_13.png)
+</br>
+
+## [Theming](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1512)
+Custom theming in `Swift-DocC` is **specific to a deployment** and aims at looking right with an existing website.
+When dealing with a [page-specific&nbsp;situation](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1561), the directives must be used to reach the sought design in `Xcode`.
+
+![](../../../../../images/iOSdev/wwdc23-10244_19.png)
+
+The themes in `Swift-DocC` are defined in the dedicated **["theme-settings.json"&nbsp;file](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1627)** to be added to the [documentation&nbsp;catalog](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1698).
+
+![](../../../../../images/iOSdev/wwdc23-10244_20.png)
+
+Finally, the [`Navigation`&nbsp;sidebar](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1801) helps to highlight the changes when viewing the [updated&nbsp;website](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1709).
+</br>
+
+## [Navigating](https://developer.apple.com/videos/play/wwdc2023/10244/?time=1862)
+The brand new navigation capabilities rendered by the `Swift-DocC` websites with `Xcode 15` are definitely pointed out by the new **`Quick Navigation` popover** fully integrated with the existing `Navigation` sidebar.
+
+![](../../../../../images/iOSdev/wwdc23-10244_21.png)
+</br>

src/en/mobile/ios/wwdc/nota11y/index.md

@@ -22,12 +22,13 @@ The videos that may be of interest to **designers** are highlighted with a **ded
 
 <section class="visually-hidden" id="wwdcTests" aria-hidden="true">
    <h2  id="hhwwdc2023" class="pt-5">WWDC 2023</h2>
-   <p id="hwwdc82">WWDC 2023 Animate symbols in your app</p>
-   <p id="hwwdc81">WWDC 2023 Bring widgets to life</p>
-   <p id="hwwdc80">WWDC 2023 Bring widgets to new places</p>
-   <p id="hwwdc79">WWDC 2023 Build accessible apps with SwiftUI and UIKit</p>
-   <p id="hwwdc78">WWDC 2023 Build programmatic UI with Xcode Previews</p>
-   <p id="hwwdc77">WWDC 2023 Create animated symbols</p>
+   <p id="hwwdc83">WWDC 2023 Animate symbols in your app</p>
+   <p id="hwwdc82">WWDC 2023 Bring widgets to life</p>
+   <p id="hwwdc81">WWDC 2023 Bring widgets to new places</p>
+   <p id="hwwdc80">WWDC 2023 Build accessible apps with SwiftUI and UIKit</p>
+   <p id="hwwdc79">WWDC 2023 Build programmatic UI with Xcode Previews</p>
+   <p id="hwwdc78">WWDC 2023 Create animated symbols</p>
+   <p id="hwwdc77">WWDC 2023 Create rich documentation with Swift-DocC</p>
    <p id="hwwdc76">WWDC 2023 Design dynamic Live Activities</p>
    <p id="hwwdc75">WWDC 2023 Expand on Swift macros</p>
    <p id="hwwdc74">WWDC 2023 Explore pie charts and interactivity in Swift Charts</p>