├── .editorconfig ├── .eleventy.js ├── .gitattributes ├── .github └── dependabot.yml ├── .gitignore ├── .prettierignore ├── .prettierrc ├── README.md ├── assets ├── css │ ├── general.css │ └── theme.css ├── favicon │ ├── android-icon-144x144.png │ ├── android-icon-192x192.png │ ├── android-icon-36x36.png │ ├── android-icon-48x48.png │ ├── android-icon-72x72.png │ ├── android-icon-96x96.png │ ├── apple-icon-114x114.png │ ├── apple-icon-120x120.png │ ├── apple-icon-144x144.png │ ├── apple-icon-152x152.png │ ├── apple-icon-180x180.png │ ├── apple-icon-57x57.png │ ├── apple-icon-60x60.png │ ├── apple-icon-72x72.png │ ├── apple-icon-76x76.png │ ├── apple-icon-precomposed.png │ ├── apple-icon.png │ ├── favicon-16x16.png │ ├── favicon-32x32.png │ ├── favicon-96x96.png │ ├── favicon.ico │ ├── favicon.png │ └── favicon.svg ├── fonts │ └── WorkSans-Bold.ttf ├── img │ ├── apple-dark.png │ ├── apple-light.png │ ├── bloomberg-light.png │ ├── bloomberg.png │ ├── bluesky.png │ ├── canva.png │ ├── coil.png │ ├── edge.png │ ├── florian.jpg │ ├── github-dark.png │ ├── github-light.png │ ├── google.png │ ├── igalia.png │ ├── jetbrains.png │ ├── linkedin.png │ ├── mastodon.png │ ├── meta.png │ ├── mozilla-dark.png │ ├── mozilla-light.png │ ├── opencollective.svg │ ├── openwebdocs-logo-dark.png │ ├── openwebdocs-logo-light.png │ ├── openwebdocs-logo.png │ ├── sad-logo.svg │ ├── samsung-dark.png │ ├── samsung-light.png │ ├── sixworms.png │ ├── svg-wave-bg.svg │ ├── twitter.png │ ├── w3c.svg │ ├── web-icon-dark.png │ ├── web-icon-light.png │ ├── webdocs_logo_dark.svg │ └── webdocs_logo_light.svg ├── js │ └── main.js └── manifest.json ├── package-lock.json ├── package.json └── pages ├── 404.html ├── _includes ├── layouts │ ├── default.njk │ └── post.njk └── partials │ └── pagination.njk ├── content ├── posts │ ├── 2022-q1-report │ │ ├── index.md │ │ ├── q1-bcd-prs.png │ │ ├── q1-bcd-reviews.png │ │ ├── q1-content-prs.png │ │ └── q1-content-reviews.png │ ├── 2022-q2-report │ │ ├── charts │ │ │ ├── bcd-commits-by-org-q2.png │ │ │ ├── bcd-reviews-by-org-q2.png │ │ │ ├── content-all-prs.png │ │ │ ├── content-commits-by-org-q2.png │ │ │ └── content-reviews-by-org-q2.png │ │ ├── index.md │ │ └── screenshots │ │ │ ├── formal-syntax-background-after.png │ │ │ └── formal-syntax-background-before.png │ ├── 2022-q3-report │ │ ├── index.md │ │ ├── prs.png │ │ └── reviews.png │ ├── apple-joins-sc.md │ ├── bloomberg.md │ ├── branding.md │ ├── community-qa-session.md │ ├── complete-interop-features │ │ ├── index.md │ │ ├── logos.png │ │ └── mdn-gaps-example.png │ ├── css-containment.md │ ├── cycletracker.md │ ├── estelle-weyl.md │ ├── facebook-funding.md │ ├── florian-owd-director.md │ ├── igalia-gc.md │ ├── improve-formal-syntax │ │ ├── images │ │ │ ├── formal-syntax-background-after.png │ │ │ └── formal-syntax-background-before.png │ │ └── index.md │ ├── index.njk │ ├── introducing-owd.md │ ├── jean-yves-perrier.md │ ├── jetbrains-funding.md │ ├── job-posting.md │ ├── london-meetup │ │ ├── index.md │ │ └── openwebdocs_london_groupphoto.jpg │ ├── markdown-conversion.md │ ├── micro-benevolences.md │ ├── mozilla-owd.md │ ├── open-docs.md │ ├── owd-projects-h1-2023.md │ ├── posts.json │ ├── secure-the-web-forward.md │ ├── securecontext-webidl │ │ ├── fetch-mdn.drawio.svg │ │ ├── fetch-mixins.drawio.svg │ │ ├── securecontext-header.png │ │ └── securecontext-webidl.md │ ├── self-experimentation-with-csp.md │ ├── sovereign-tech-fund.md │ ├── swag-at-tpac-anaheim.md │ ├── thanks-2023.md │ ├── tpac-sevilla.md │ ├── vinyl.md │ ├── w3c-docs-cg.md │ ├── web-api-page-titles │ │ ├── document-queryselector-new.png │ │ ├── document-queryselector-old.png │ │ ├── index.md │ │ ├── response-error-new.png │ │ └── response-error-old.png │ ├── will-bamberg.md │ ├── writing-day-wtd-portland-2022.md │ └── wtd-prague-2021.md ├── reports │ ├── 2021 │ │ ├── backers.png │ │ ├── commits-2021.png │ │ ├── commits-202102.png │ │ ├── commits-202109.png │ │ ├── index.md │ │ ├── pr-reviews-2021.png │ │ ├── pr-reviews-202102.png │ │ └── pr-reviews-202109.png │ ├── 2022 │ │ ├── formal-syntax-background-after.png │ │ ├── formal-syntax-background-before.png │ │ ├── index.md │ │ ├── prs-bcd-2022.png │ │ ├── prs-content-2022.png │ │ ├── reviews-bcd-2022.png │ │ └── reviews-content-2022.png │ ├── 2023 │ │ ├── index.md │ │ ├── prs-bcd-2023.png │ │ ├── prs-content-2023.png │ │ ├── reviews-bcd-2023.png │ │ └── reviews-content-2023.png │ ├── 2024 │ │ ├── index.md │ │ ├── owd_ad_mozilla.png │ │ ├── owd_ad_smashing.png │ │ └── owd_team_2024.png │ ├── index.njk │ └── reports.json └── worklog │ ├── 2021-01.md │ ├── 2021-02.md │ ├── 2021-03.md │ ├── 2021-04.md │ ├── 2021-05.md │ ├── 2021-06.md │ ├── 2021-07.md │ ├── 2021-08.md │ ├── 2021-09.md │ ├── 2021-10.md │ ├── index.njk │ ├── mdn-md-august.png │ ├── mdn-md-september.png │ └── worklog.json ├── feed.njk ├── get-involved.html ├── index.html ├── logo.html ├── membership.html ├── og-image.njk ├── sponsors.html └── team.html /.editorconfig: -------------------------------------------------------------------------------- 1 | # editorconfig.org 2 | 3 | root = true 4 | 5 | [*] 6 | charset = utf-8 7 | indent_size = 2 8 | indent_style = space 9 | insert_final_newline = true 10 | trim_trailing_whitespace = true 11 | -------------------------------------------------------------------------------- /.eleventy.js: -------------------------------------------------------------------------------- 1 | import fs from "fs"; 2 | 3 | import { IdAttributePlugin } from "@11ty/eleventy"; 4 | import { feedPlugin } from "@11ty/eleventy-plugin-rss"; 5 | import pluginSyntaxHighlight from "@11ty/eleventy-plugin-syntaxhighlight"; 6 | 7 | import markdownIt from "markdown-it"; 8 | 9 | const markdownOptions = { 10 | html: true, 11 | breaks: true, 12 | linkify: true, 13 | }; 14 | const markdownRenderer = markdownIt(markdownOptions); 15 | 16 | import EleventyPluginOgImage from "eleventy-plugin-og-image"; 17 | 18 | export default async function (eleventyConfig) { 19 | // Output directory: _site 20 | // input directory: pages 21 | 22 | // Copy `assets/` to `_site` 23 | eleventyConfig.addPassthroughCopy({ 24 | "assets/img": "img", 25 | "assets/css": "css", 26 | "assets/js": "js", 27 | "assets/favicon": "favicon", 28 | "assets/manifest.json": "manifest.json", 29 | }); 30 | 31 | eleventyConfig.setTemplateFormats([ 32 | // Templates: 33 | "html", 34 | "njk", 35 | "md", 36 | // Static Assets: 37 | "png", 38 | "jpg", 39 | "svg", 40 | ]); 41 | 42 | eleventyConfig.addPlugin(IdAttributePlugin); 43 | eleventyConfig.addPlugin(pluginSyntaxHighlight); 44 | 45 | eleventyConfig.addPlugin(feedPlugin, { 46 | type: "atom", 47 | outputPath: "/feed.xml", 48 | collection: { 49 | name: "post", 50 | limit: 0, 51 | }, 52 | metadata: { 53 | title: "Open Web Docs blog", 54 | subtitle: 55 | "Open Web Docs supports web platform documentation for the benefit of web developers & designers worldwide. We are a community of web developers, standards makers, and technology companies that rely on this documentation as critical digital infrastructure, and we work cooperatively to ensure its long-term success and maintenance.", 56 | language: "en", 57 | base: "https://openwebdocs.org/", 58 | author: { 59 | name: "OWD team", 60 | email: "florian@openwebdocs.org", 61 | }, 62 | }, 63 | }); 64 | 65 | eleventyConfig.setLibrary("md", markdownRenderer); 66 | 67 | eleventyConfig.addPlugin(EleventyPluginOgImage, { 68 | satoriOptions: { 69 | fonts: [ 70 | { 71 | name: "WorkSans", 72 | data: fs.readFileSync("assets/fonts/WorkSans-Bold.ttf"), 73 | weight: 700, 74 | style: "bold", 75 | }, 76 | ], 77 | }, 78 | }); 79 | 80 | eleventyConfig.addShortcode("year", () => `${new Date().getFullYear()}`); 81 | 82 | return { 83 | dir: { 84 | input: "pages", 85 | }, 86 | }; 87 | } 88 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | ## GITATTRIBUTES FOR WEB PROJECTS 2 | # 3 | # These settings are for any web project. 4 | # 5 | # Details per file setting: 6 | # text These files should be normalized (i.e. convert CRLF to LF). 7 | # binary These files are binary and should be left untouched. 8 | # 9 | # Note that binary is a macro for -text -diff. 10 | ###################################################################### 11 | 12 | ## AUTO-DETECT 13 | ## Handle line endings automatically for files detected as 14 | ## text and leave all files detected as binary untouched. 15 | ## This will handle all files NOT defined below. 16 | * text=auto 17 | 18 | ## SOURCE CODE 19 | *.bat text eol=crlf 20 | *.coffee text 21 | *.css text 22 | *.htm text 23 | *.html text 24 | *.inc text 25 | *.ini text 26 | *.js text 27 | *.json text 28 | *.jsx text 29 | *.less text 30 | *.od text 31 | *.onlydata text 32 | *.php text 33 | *.pl text 34 | *.py text 35 | *.rb text 36 | *.sass text 37 | *.scm text 38 | *.scss text 39 | *.sh text eol=lf 40 | *.sql text 41 | *.styl text 42 | *.tag text 43 | *.ts text 44 | *.tsx text 45 | *.xml text 46 | *.xhtml text 47 | 48 | ## DOCKER 49 | *.dockerignore text 50 | Dockerfile text 51 | 52 | ## DOCUMENTATION 53 | *.markdown text 54 | *.md text 55 | *.mdwn text 56 | *.mdown text 57 | *.mkd text 58 | *.mkdn text 59 | *.mdtxt text 60 | *.mdtext text 61 | *.txt text 62 | AUTHORS text 63 | CHANGELOG text 64 | CHANGES text 65 | CONTRIBUTING text 66 | COPYING text 67 | copyright text 68 | *COPYRIGHT* text 69 | INSTALL text 70 | license text 71 | LICENSE text 72 | NEWS text 73 | readme text 74 | *README* text 75 | TODO text 76 | 77 | ## TEMPLATES 78 | *.dot text 79 | *.ejs text 80 | *.haml text 81 | *.handlebars text 82 | *.hbs text 83 | *.hbt text 84 | *.jade text 85 | *.latte text 86 | *.mustache text 87 | *.njk text 88 | *.phtml text 89 | *.tmpl text 90 | *.tpl text 91 | *.twig text 92 | 93 | ## LINTERS 94 | .babelrc text 95 | .csslintrc text 96 | .eslintrc text 97 | .htmlhintrc text 98 | .jscsrc text 99 | .jshintrc text 100 | .jshintignore text 101 | .prettierrc text 102 | .stylelintrc text 103 | 104 | ## CONFIGS 105 | *.bowerrc text 106 | *.cnf text 107 | *.conf text 108 | *.config text 109 | .browserslistrc text 110 | .editorconfig text 111 | .gitattributes text 112 | .gitconfig text 113 | .gitignore text 114 | .htaccess text 115 | *.npmignore text 116 | *.yaml text 117 | *.yml text 118 | browserslist text 119 | Makefile text 120 | makefile text 121 | 122 | ## HEROKU 123 | Procfile text 124 | .slugignore text 125 | 126 | ## GRAPHICS 127 | *.ai binary 128 | *.bmp binary 129 | *.eps binary 130 | *.gif binary 131 | *.ico binary 132 | *.jng binary 133 | *.jp2 binary 134 | *.jpg binary 135 | *.jpeg binary 136 | *.jpx binary 137 | *.jxr binary 138 | *.pdf binary 139 | *.png binary 140 | *.psb binary 141 | *.psd binary 142 | *.svg text 143 | *.svgz binary 144 | *.tif binary 145 | *.tiff binary 146 | *.wbmp binary 147 | *.webp binary 148 | 149 | ## AUDIO 150 | *.kar binary 151 | *.m4a binary 152 | *.mid binary 153 | *.midi binary 154 | *.mp3 binary 155 | *.ogg binary 156 | *.ra binary 157 | 158 | ## VIDEO 159 | *.3gpp binary 160 | *.3gp binary 161 | *.as binary 162 | *.asf binary 163 | *.asx binary 164 | *.fla binary 165 | *.flv binary 166 | *.m4v binary 167 | *.mng binary 168 | *.mov binary 169 | *.mp4 binary 170 | *.mpeg binary 171 | *.mpg binary 172 | *.ogv binary 173 | *.swc binary 174 | *.swf binary 175 | *.webm binary 176 | 177 | ## ARCHIVES 178 | *.7z binary 179 | *.gz binary 180 | *.jar binary 181 | *.rar binary 182 | *.tar binary 183 | *.zip binary 184 | 185 | ## FONTS 186 | *.ttf binary 187 | *.eot binary 188 | *.otf binary 189 | *.woff binary 190 | *.woff2 binary 191 | 192 | ## EXECUTABLES 193 | *.exe binary 194 | *.pyc binary 195 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | 3 | updates: 4 | - package-ecosystem: "npm" 5 | directory: "/" 6 | schedule: 7 | interval: "weekly" 8 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Include your project-specific ignores in this file 2 | # Read about how to use .gitignore: https://help.github.com/articles/ignoring-files 3 | # Useful .gitignore templates: https://github.com/github/gitignore 4 | node_modules 5 | dist 6 | .cache 7 | .idea 8 | img/.DS_Store 9 | .DS_Store 10 | _site/ -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | _site 2 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | {} 2 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Open Web Docs 2 | 3 | This is the codebase for [Open Web Docs](https://openwebdocs.org) built upon the [11ty](https://www.11ty.dev/) framework. 4 | 5 | ## Setup 6 | 7 | Clone the repository, then run `npm i` to install the dev dependencies. 8 | 9 | ## Run Locally 10 | 11 | Once you've performed the setup, you can run this codebase locally by running `npm run serve` in your terminal. This will serve the site to `localhost:8081`. The site will automatically rebuild and reload the browser page when modifications are detected. 12 | 13 | ## Build 14 | 15 | If you want to perform a simple build of the site, you can run `npm run build`. This will build the site and output the files to the `_site` folder. 16 | 17 | adds the `img` directory to `_site` so that it can be output to the browser. 18 | 19 | [//]: # (TODO: fill in contribution rules) 20 | ## Contribution 21 | 22 | ## Add New Folder 23 | 24 | If you want to include a new directory that you want outputted to the browser, you'll need to add it to the list of dircetories in `.eleventy.js`; for example: 25 | 26 | ```js 27 | // Copy `img/` to `_site/img` 28 | eleventyConfig.addPassthroughCopy("img"); 29 | ``` 30 | 31 | ### Gotchas 32 | 33 | There are some things to be aware of when making changes. 34 | 1. The `theme.css` includes rules for `prefers-color-scheme("dark")` and `body.dark` which are exactly the same this is so that folks can use dark mode regardless of their system preferences. If you make changes to one, ensure you make changes to the other. 35 | 1. If you're making changes to dark mode ensure that you're prefacing all new rules with `body.dark` and `body.systemDarkPreference` respectively. 36 | 2. For collections (posts, reports, worklog), there is an accomponying json file which includes global rules for the files that live in the related directory; for example: 37 | ```json 38 | { 39 | "layout": "layouts/post.njk", 40 | "tags": [ 41 | "post" 42 | ] 43 | } 44 | ``` 45 | This is setting the layout for all posts and ensures that each post has the tag `post` so that all posts can be included in the posts collection. 46 | 3. If you create a file that you don't want included in a collection, include `eleventyExcludeFromCollections: true` in the front-matter. 47 | -------------------------------------------------------------------------------- /assets/css/theme.css: -------------------------------------------------------------------------------- 1 | /* VARIABLES */ 2 | 3 | :root { 4 | /*BORDERS */ 5 | --divider: var(--accent-1) 1px solid; 6 | 7 | /* COLORS: CONSTANT */ 8 | --button-fg: white; 9 | --accent-1: rgb(200 182 249); 10 | --accent-2: #f7f4fe00; 11 | 12 | /* COLORS: DARK THEME (DEFAULT) */ 13 | --foreground: white; 14 | --background: #090057; 15 | --callout-background: #43279c; 16 | --link: #ff61e5; 17 | --button-bg: #9900a1; 18 | --button-bg-hover: #6b0070; 19 | } 20 | 21 | [data-theme="light"] { 22 | /* COLORS: LIGHT THEME */ 23 | --foreground: black; 24 | --background: white; 25 | --callout-background: #d2bbfd; 26 | --link: #9900a1; 27 | --button-bg: #9900a1; 28 | --button-bg-hover: #e000eb; 29 | } 30 | 31 | /* ELEMENTS */ 32 | 33 | body { 34 | background-color: var(--background); 35 | color: var(--foreground); 36 | } 37 | 38 | a { 39 | color: var(--link); 40 | } 41 | 42 | a:hover { 43 | color: var(--foreground); 44 | } 45 | 46 | .nav-item { 47 | color: var(--foreground); 48 | } 49 | 50 | .nav-item:hover { 51 | color: var(--link); 52 | } 53 | 54 | .btn { 55 | background-color: var(--button-bg); 56 | color: var(--button-fg); 57 | padding: var(--btn-padding); 58 | border: none; 59 | text-decoration: none; 60 | } 61 | 62 | .btn:hover { 63 | background-color: var(--button-bg-hover); 64 | } 65 | 66 | #toggleTheme ul { 67 | background-color: var(--background); 68 | text-decoration: revert; 69 | } 70 | 71 | #toggleTheme ul .selected { 72 | background-color: var(--link); 73 | color: var(--background); 74 | } 75 | 76 | #toggleTheme ul li:not(.selected):hover { 77 | background-color: var(--button-bg-hover); 78 | } 79 | 80 | header { 81 | border-bottom: var(--divider); 82 | } 83 | 84 | .sec-footer { 85 | border-top: var(--divider); 86 | } 87 | -------------------------------------------------------------------------------- /assets/favicon/android-icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/android-icon-144x144.png -------------------------------------------------------------------------------- /assets/favicon/android-icon-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/android-icon-192x192.png -------------------------------------------------------------------------------- /assets/favicon/android-icon-36x36.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/android-icon-36x36.png -------------------------------------------------------------------------------- /assets/favicon/android-icon-48x48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/android-icon-48x48.png -------------------------------------------------------------------------------- /assets/favicon/android-icon-72x72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/android-icon-72x72.png -------------------------------------------------------------------------------- /assets/favicon/android-icon-96x96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/android-icon-96x96.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-114x114.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-114x114.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-120x120.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-120x120.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-144x144.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-152x152.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-152x152.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-180x180.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-180x180.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-57x57.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-57x57.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-60x60.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-60x60.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-72x72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-72x72.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-76x76.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-76x76.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon-precomposed.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon-precomposed.png -------------------------------------------------------------------------------- /assets/favicon/apple-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/apple-icon.png -------------------------------------------------------------------------------- /assets/favicon/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/favicon-16x16.png -------------------------------------------------------------------------------- /assets/favicon/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/favicon-32x32.png -------------------------------------------------------------------------------- /assets/favicon/favicon-96x96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/favicon-96x96.png -------------------------------------------------------------------------------- /assets/favicon/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/favicon.ico -------------------------------------------------------------------------------- /assets/favicon/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/favicon/favicon.png -------------------------------------------------------------------------------- /assets/favicon/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 10 | 11 | 13 | 14 | 15 | 18 | 20 | 22 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /assets/fonts/WorkSans-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/fonts/WorkSans-Bold.ttf -------------------------------------------------------------------------------- /assets/img/apple-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/apple-dark.png -------------------------------------------------------------------------------- /assets/img/apple-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/apple-light.png -------------------------------------------------------------------------------- /assets/img/bloomberg-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/bloomberg-light.png -------------------------------------------------------------------------------- /assets/img/bloomberg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/bloomberg.png -------------------------------------------------------------------------------- /assets/img/bluesky.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/bluesky.png -------------------------------------------------------------------------------- /assets/img/canva.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/canva.png -------------------------------------------------------------------------------- /assets/img/coil.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/coil.png -------------------------------------------------------------------------------- /assets/img/edge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/edge.png -------------------------------------------------------------------------------- /assets/img/florian.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/florian.jpg -------------------------------------------------------------------------------- /assets/img/github-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/github-dark.png -------------------------------------------------------------------------------- /assets/img/github-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/github-light.png -------------------------------------------------------------------------------- /assets/img/google.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/google.png -------------------------------------------------------------------------------- /assets/img/igalia.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/igalia.png -------------------------------------------------------------------------------- /assets/img/jetbrains.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/jetbrains.png -------------------------------------------------------------------------------- /assets/img/linkedin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/linkedin.png -------------------------------------------------------------------------------- /assets/img/mastodon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/mastodon.png -------------------------------------------------------------------------------- /assets/img/meta.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/meta.png -------------------------------------------------------------------------------- /assets/img/mozilla-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/mozilla-dark.png -------------------------------------------------------------------------------- /assets/img/mozilla-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/mozilla-light.png -------------------------------------------------------------------------------- /assets/img/opencollective.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /assets/img/openwebdocs-logo-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/openwebdocs-logo-dark.png -------------------------------------------------------------------------------- /assets/img/openwebdocs-logo-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/openwebdocs-logo-light.png -------------------------------------------------------------------------------- /assets/img/openwebdocs-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/openwebdocs-logo.png -------------------------------------------------------------------------------- /assets/img/sad-logo.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /assets/img/samsung-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/samsung-dark.png -------------------------------------------------------------------------------- /assets/img/samsung-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/samsung-light.png -------------------------------------------------------------------------------- /assets/img/sixworms.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/sixworms.png -------------------------------------------------------------------------------- /assets/img/svg-wave-bg.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /assets/img/twitter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/twitter.png -------------------------------------------------------------------------------- /assets/img/w3c.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /assets/img/web-icon-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/web-icon-dark.png -------------------------------------------------------------------------------- /assets/img/web-icon-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/assets/img/web-icon-light.png -------------------------------------------------------------------------------- /assets/js/main.js: -------------------------------------------------------------------------------- 1 | function queryPrefersColorScheme() { 2 | return window.matchMedia("(prefers-color-scheme: light)").matches 3 | ? "light" 4 | : "dark"; 5 | } 6 | 7 | function getCurrentTheme() { 8 | return ( 9 | document.body.dataset.theme || 10 | localStorage.getItem("theme") || 11 | queryPrefersColorScheme() 12 | ); 13 | } 14 | 15 | function setThemeAttr(theme) { 16 | document.body.dataset.theme = theme; 17 | } 18 | 19 | function prepareImgs() { 20 | const imgs = document.querySelectorAll("img"); 21 | for (let img of imgs) { 22 | if (img.dataset.lightsrc) { 23 | img.dataset.darksrc = img.src; 24 | } 25 | } 26 | } 27 | 28 | function assignEls() { 29 | const theme = getCurrentTheme(); 30 | 31 | const imgs = document.querySelectorAll("img"); 32 | for (let img of imgs) { 33 | if (theme === "light") { 34 | if (img.dataset.lightsrc) { 35 | img.src = img.dataset.lightsrc; 36 | } 37 | } else { 38 | if (img.dataset.darksrc) { 39 | img.src = img.dataset.darksrc; 40 | } 41 | } 42 | } 43 | } 44 | 45 | // Set the data-theme attr and update local storage before document loads 46 | setThemeAttr(getCurrentTheme()); 47 | 48 | window.onload = () => { 49 | prepareImgs(); 50 | assignEls(); 51 | 52 | // Set the selected theme in the theme selection dropdown 53 | document 54 | .querySelector( 55 | `#toggleTheme ul li[data-value="${localStorage.getItem("theme") || ""}"]`, 56 | ) 57 | .classList.add("selected"); 58 | 59 | // Attach selector logic 60 | const themeToggleEls = Array.from( 61 | document.getElementById("toggleTheme").children[0].children, 62 | ); 63 | themeToggleEls.forEach((el) => { 64 | el.addEventListener("click", () => { 65 | const newTheme = el.dataset.value; 66 | 67 | localStorage.setItem("theme", newTheme); 68 | setThemeAttr(newTheme || queryPrefersColorScheme()); 69 | 70 | themeToggleEls.forEach((e) => e.classList.remove("selected")); 71 | el.classList.add("selected"); 72 | 73 | assignEls(); 74 | }); 75 | }); 76 | 77 | setTimeout(() => { 78 | // Prevent flash of dark while switching to light theme variables 79 | document.body.classList.add("loaded"); 80 | }, 1); 81 | }; 82 | -------------------------------------------------------------------------------- /assets/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Open Web Docs", 3 | "icons": [ 4 | { 5 | "src": "/favicon/android-icon-36x36.png", 6 | "sizes": "36x36", 7 | "type": "image/png", 8 | "density": "0.75" 9 | }, 10 | { 11 | "src": "/favicon/android-icon-48x48.png", 12 | "sizes": "48x48", 13 | "type": "image/png", 14 | "density": "1.0" 15 | }, 16 | { 17 | "src": "/favicon/android-icon-72x72.png", 18 | "sizes": "72x72", 19 | "type": "image/png", 20 | "density": "1.5" 21 | }, 22 | { 23 | "src": "/favicon/android-icon-96x96.png", 24 | "sizes": "96x96", 25 | "type": "image/png", 26 | "density": "2.0" 27 | }, 28 | { 29 | "src": "/favicon/android-icon-144x144.png", 30 | "sizes": "144x144", 31 | "type": "image/png", 32 | "density": "3.0" 33 | }, 34 | { 35 | "src": "/favicon/android-icon-192x192.png", 36 | "sizes": "192x192", 37 | "type": "image/png", 38 | "density": "4.0" 39 | } 40 | ] 41 | } 42 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "open-web-docs-website", 3 | "version": "1.0.0", 4 | "description": "Website for Open Web Docs", 5 | "type": "module", 6 | "scripts": { 7 | "build": "npx @11ty/eleventy", 8 | "bench": "DEBUG=Eleventy:Benchmark* npx @11ty/eleventy", 9 | "watch": "npx @11ty/eleventy --watch", 10 | "serve": "npx @11ty/eleventy --serve", 11 | "start": "npx @11ty/eleventy --serve", 12 | "debug": "DEBUG=* npx @11ty/eleventy", 13 | "format": "prettier --write '**/*.html' '**/*.js' '**/*.css' '**/*.json'" 14 | }, 15 | "devDependencies": { 16 | "@11ty/eleventy": "^3.1.0", 17 | "@11ty/eleventy-plugin-rss": "^2.0.4", 18 | "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.1", 19 | "eleventy-plugin-og-image": "^4.0.1", 20 | "prettier": "^3.5.3" 21 | }, 22 | "dependencies": { 23 | "markdown-it-named-headings": "^1.1.0" 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /pages/404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Page Not Found 6 | 7 | 8 | "Open Web Docs - 404" 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 26 | 27 | 28 |
29 | 55 |
56 | 57 |
58 |

Page Not Found

59 |

Sorry, but the page you were trying to view does not exist.

60 | 404 image 61 |
62 | 63 | 94 | 95 | 96 | 97 | 98 | 99 | -------------------------------------------------------------------------------- /pages/_includes/layouts/default.njk: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | {{ title }} 6 | 7 | 8 | 9 | 10 | 11 | 12 | {% ogImage "og-image.njk", { title: title | safe } %} 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 43 | 45 | 46 | 47 | 48 |
49 | 83 |
84 | 85 |
86 | 87 | {% block content %} 88 | {{ content | safe }} 89 | {% endblock %} 90 | 91 | 131 |
132 | 133 | 134 | 135 | 136 | -------------------------------------------------------------------------------- /pages/_includes/layouts/post.njk: -------------------------------------------------------------------------------- 1 | {% extends "layouts/default.njk" %} 2 | 3 | {% block content %} 4 |
5 |

{{ title }}

6 |

{{ date }} - {{ author }} - RSS feed

7 | {{ content | safe }} 8 |
9 | {% endblock %} 10 | -------------------------------------------------------------------------------- /pages/_includes/partials/pagination.njk: -------------------------------------------------------------------------------- 1 | {% if pagination.pageLinks.length > 1 %} 2 | 16 | {% endif %} -------------------------------------------------------------------------------- /pages/content/posts/2022-q1-report/q1-bcd-prs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q1-report/q1-bcd-prs.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q1-report/q1-bcd-reviews.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q1-report/q1-bcd-reviews.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q1-report/q1-content-prs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q1-report/q1-content-prs.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q1-report/q1-content-reviews.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q1-report/q1-content-reviews.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q2-report/charts/bcd-commits-by-org-q2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q2-report/charts/bcd-commits-by-org-q2.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q2-report/charts/bcd-reviews-by-org-q2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q2-report/charts/bcd-reviews-by-org-q2.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q2-report/charts/content-all-prs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q2-report/charts/content-all-prs.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q2-report/charts/content-commits-by-org-q2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q2-report/charts/content-commits-by-org-q2.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q2-report/charts/content-reviews-by-org-q2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q2-report/charts/content-reviews-by-org-q2.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q2-report/screenshots/formal-syntax-background-after.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q2-report/screenshots/formal-syntax-background-after.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q2-report/screenshots/formal-syntax-background-before.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q2-report/screenshots/formal-syntax-background-before.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q3-report/prs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q3-report/prs.png -------------------------------------------------------------------------------- /pages/content/posts/2022-q3-report/reviews.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/2022-q3-report/reviews.png -------------------------------------------------------------------------------- /pages/content/posts/apple-joins-sc.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Robert Nyman" 3 | title: "Apple joins the Open Web Docs Steering Committee" 4 | date: "2022-09-05" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "We are happy to welcome Apple to the Steering Committee of Open Web Docs! They are joining our mission to document the web for developers." 9 | --- 10 | 11 | We are happy to welcome Apple to the [Steering Committee of Open Web Docs](https://github.com/openwebdocs/project/blob/main/steering-committee/membership-expectations.md)! They are joining our mission to document the web for developers. 12 | 13 | The Steering Committee is responsible for deciding what Open Web Docs should work on and with what priorities, as illustrated by our [2022 goals](https://github.com/openwebdocs/project/blob/main/2022-goals.md). 14 | 15 | We’re excited to have representatives from all major web browser vendors in the Steering Committee of Open Web Docs, providing us with support so we can cater to and help developers globally to build better documentation on the web across all browsers. 16 | 17 | --- 18 | 19 | _Originally published at [https://opencollective.com/open-web-docs/updates/apple-joins-the-open-web-docs-steering-committee](https://opencollective.com/open-web-docs/updates/apple-joins-the-open-web-docs-steering-committee)_ 20 | -------------------------------------------------------------------------------- /pages/content/posts/bloomberg.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz" 3 | title: "Bloomberg Joins Open Web Docs" 4 | date: "2025-03-18" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Open Web Docs is excited to welcome Bloomberg as a Gold level sponsor!" 9 | --- 10 | 11 | Open Web Docs is excited to welcome Bloomberg as a Gold level sponsor joining the OWD Governing and Steering Committees along with our current Governing members Microsoft Edge, Google and Igalia. 12 | 13 | 14 | 15 | 19 | 25 | 26 | 27 | 28 | Bloomberg Engineering has a track record of backing open standards and open source, and Open Web Docs is proud to join the list of technology community organizations that Bloomberg invests in. Learn more about Bloomberg’s commitment to Open Web Docs in their [Tech At Bloomberg blog post](https://www.bloomberg.com/company/stories/bloomberg-backs-open-web-docs), shared below. 29 | 30 | ### Bloomberg Backs Open Web Docs to Support High-Quality Web Platform Documentation for All 31 | 32 | High-quality documentation is essential for innovation and to facilitate the growth of web platform technologies. [Open Web Docs](https://openwebdocs.org) (OWD) plays a vital role in providing that documentation, especially through [MDN Web Docs](https://developer.mozilla.org/en-US/), a comprehensive resource covering CSS, HTML, JavaScript, Web APIs, and other web technologies. Our engineers use MDN extensively while performing front-end development for the Bloomberg Terminal – software for finance professionals that uses the Chromium web browser and JavaScript to render its user interface – and Bloomberg.com, among other products used across the financial industry around the world. 33 | 34 | Bloomberg is proud to announce that it is now a Gold Sponsor of Open Web Docs. As part of this commitment, Alyssa Wright, a member of Bloomberg’s Open Source Program Office (OSPO) in the company’s Office of the CTO and Board Member of Open Source Collective, will also join the OWD Governing and Steering Committees. Bloomberg’s support will help ensure MDN remains a free resource for developers, suggest documentation priorities, and propose strategic partnerships. 35 | 36 | “From my unique perspective as someone who was there at the start of Open Web Docs’ journey at Open Source Collective, I’ve always believed that excellent documentation is the fuel for open source innovation,” says Wright. “By supporting OWD, Bloomberg is investing in the long-term sustainability of the open web. We’re ensuring that developers have the tools they need to build, create, and maintain a healthy and accessible web for everyone.” 37 | 38 | Software engineer Daniel Ehrenberg from Bloomberg’s JavaScript Infrastructure & Terminal Experience team, a contributor to TC39 who also serves as the President of Ecma International, adds, “Sponsoring Open Web Docs is a natural part of Bloomberg’s commitment to the web platform. Maintaining the highest quality documentation requires paid, specialized technical writers, who OWD supports. This sponsorship will help ensure that MDN’s content remains comprehensive, updated, and freely available to all. MDN is a vital daily resource for Bloomberg engineers as they develop our products.” 39 | 40 | Web technologies are constantly evolving and growing, and documentation needs to reflect that. Open Web Docs relies on donations to employ writers who update existing documentation, write new documentation, and improve documentation infrastructure in collaboration with other organizations. Bloomberg’s support will help fund OWD’s technical writing staff and the ongoing development of crucial documentation. 41 | 42 | “Open Web Docs’ goal is to ensure developers and designers have the best information available for free so they can make decisions while building on the web platform. Sustainable funding is essential to our mission,” says Florian Scholz, Open Web Docs Co-Founder and Director. He continues, “Bloomberg has been a long-time champion of open web standards, and we’re thrilled to have them support our mission.” Read more about Bloomberg’s open source-first mission, the company’s commitments to supporting web standards, and ongoing contributions to CSS and JavaScript [here](https://www.bloomberg.com/company/values/tech-at-bloomberg/open-source/). Learn more about Open Web Docs and its charter [here](https://github.com/openwebdocs/project). 43 | 44 |
45 | 46 | As an Open Web Docs [member organization](https://openwebdocs.org/membership) you support core web platform documentation and engineering which we consider critical digital infrastructure. Reach out to [florian@openwebdocs.org](mailto:florian@openwebdocs.org) for more information and join us! 47 | -------------------------------------------------------------------------------- /pages/content/posts/branding.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "OWD team" 3 | title: "Announcing the launch of our new logo and website" 4 | date: "2022-10-04" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Introducing a website redesign and a new logo, featuring Carle the bookworm" 9 | --- 10 | 11 | Open Web Docs is pleased to announce the launch of a new website, a new logo, and Carle, the new Open Web Docs mascot. 12 | 13 | Steering committee member and [Black Girls Tech](https://www.blackgirlsintech.org/) founder, [Lola Odelola](https://lolaodelola.dev/), led the OWD rebranding efforts. She coordinated the development of the new OWD mascot and logo and built the new website. 14 | 15 | Carle, pronounced *kahr-lee*, the OWD mascot, was designed by [Vladimir Grigoriev](https://nl.linkedin.com/in/grigza), a design lead at [JetBrains](https://Jetbrains.com). Carle is a bookworm! She’s named after the beloved children’s book author, [Eric Carle](https://eric-carle.com/). Carle personifies the OWD brand and is super memorable. 16 | 17 | "I definitely love the new logo. It makes me happy every time I see it, and it perfectly reflects the marketing tone we started defining a year ago of fun, inclusion, accuracy, kindness, and goofiness. Hats off to Lola and Vladimir, and a huge thank you to JetBrains as well!" remarked [Estelle Weyl](https://github.com/estelle), OWD staff writer. 18 | 19 | While Carle is usually smiling, she has five other facial reactions, enabling using slightly modified logos with different moods for different purposes. Her main color is a fantastic purple orchid, #B448FF. 20 | 21 | Carle the bookworm with six different facial expressions 22 | 23 | Using the new logo, the [OpenCollective OWD site](https://opencollective.com/open-web-docs), and the purple orchid color as a starting point, Lola built OWD a new site in [11ty](https://www.11ty.dev/), creating a site with both light and dark themes. Lola claims not to be a designer. We beg to differ. Her two themes are fantastic. The light theme has a lot of white space, is simple and friendly, and is easy to navigate. The dark theme is too. But, unlike many dark site versions, the colors aren’t inverted. Rather, the dark theme uses several gorgeous shades of purple. 24 | 25 | After a year of discussing a rebrand, we are so thankful to Lola and Vladimir for their hard work and dedication. We are delighted to officially announce the launch. The new site is available at the same URL as before: [OpenWebDocs.org](https://OpenWebDocs.org). Like everything OWD, the site is [open source and available on Github](https://github.com/openwebdocs/owd-website/). 26 | 27 | The new website provides our visitors with clear, easy way to [learn about Open Web Docs](https://openwebdocs.org/), who we are, what we do, and who funds us. You can learn about what we’ve accomplished and how you can [get involved](https://openwebdocs.org/get-involved/), including [sponsoring us and becoming a member](https://openwebdocs.org/membership/). We have a page about our [open source maintainers and steering and governing committees](https://openwebdocs.org/team/) and a page highlighting our [sponsors and funders](https://openwebdocs.org/sponsors/). The new website also includes [OWD's accomplishments for the past year](https://openwebdocs.org/content/reports/2021/) and a [blog with more details about many of our projects](https://openwebdocs.org/content/posts/). 28 | 29 | We will continue to update our site with helpful information, articles, announcements, and project successes in the [blog](https://openwebdocs.org/content/posts/) section. 30 | 31 | We would like to thank Lola and Vladimir who gave their time, energy, and talents to make this site and our branding what it is. 32 | 33 | For any questions, suggestions, feedback, or comments, please send us questions via the [Open Collective contact form](https://opencollective.com/open-web-docs/contact), love on [Twitter](https://twitter.com/OpenWebDocs), website feedback via [GitHub](https://github.com/openwebdocs/owd-website/) or content ideas via our [project proposal form](https://github.com/openwebdocs/project/issues/new?assignees=&labels=not+ready&template=owd-project.yml). 34 | 35 | -------------------------------------------------------------------------------- /pages/content/posts/community-qa-session.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Jory Burson" 3 | title: "Community Q&A Session - Join Us!" 4 | date: "2021-01-28" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "First and foremost, thank you for the outpouring of support and well-wishes for Open Web Docs following 9 | our launch post on Monday. We’re so excited to get to work with all of you to protect and maintain web platform documentation!" 10 | --- 11 | 12 | First and foremost, thank you for the outpouring of support and well-wishes for Open Web Docs following our launch post on Monday. We’re so excited to get to work with all of you to protect and maintain web platform documentation! 13 | 14 | To help get things rolling with this new community, we’re hosting our first Open Web Docs community webinar on 17 February at 17:00 UTC ([see it in your timezone](https://www.timeanddate.com/worldclock/fixedtime.html?msg=Open+Web+Docs+Community+Q%26A+Webinar&iso=20210217T1200&p1=43&ah=1)). We’ll be holding a live Q&A session with Open Web Docs team members, focusing on how we work, our goals, and how you can get involved. 15 | 16 | We also want to hear from you - what would you like to see documented, and how would you like to see us make an impact on web platform documentation this year? You can submit your questions or ideas for the panel early via [this form](https://docs.google.com/forms/d/e/1FAIpQLSfpeqHVMMkj_hoRLioWgTqU57my3M1Fg-D17XIuA7CYqMF-vg/viewform) (note that responses are visible to the public). 17 | 18 | [Subscribe to our calendar](https://calendar.google.com/calendar/u/0/r?cid=Y19vbGpyaTVyYmN1dGJmczkyb2ZwYTN1ajVzOEBncm91cC5jYWxlbmRhci5nb29nbGUuY29t) to receive meeting details directly. We really hope you can make it, but we’ll also record the session so you can watch it later. 19 | 20 | We’re planning additional community calls throughout the year. Sign up for our [newsletter](https://mailchi.mp/19c29a396724/announcing-open-web-docs) or follow us on [Twitter](https://twitter.com/OpenWebDocs) to get the latest updates from Florian and team! 21 | 22 | _Special thanks to the W3C for hosting this Zoom webinar._ 23 | 24 | --- 25 | 26 | _Originally published at https://opencollective.com/open-web-docs/updates/community-q-and-a-session-join-us._ -------------------------------------------------------------------------------- /pages/content/posts/complete-interop-features/logos.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/complete-interop-features/logos.png -------------------------------------------------------------------------------- /pages/content/posts/complete-interop-features/mdn-gaps-example.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/complete-interop-features/mdn-gaps-example.png -------------------------------------------------------------------------------- /pages/content/posts/css-containment.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Estelle Weyl" 3 | title: "CSS containment" 4 | date: "2024-04-10" 5 | description: "Improving CSS containment documentation" 6 | tags: ["projects"] 7 | ShowToc: false 8 | ShowBreadCrumbs: false 9 | excerpt: "The Open Web Docs team is improving documentation for all Baseline features. Most recently, the CSS containment module has been revised, along with a new guide on using size and style container queries." 10 | --- 11 | 12 | One of Open Web Docs's 2024 goals is to [document features supported by the three major browser engines](https://github.com/openwebdocs/project/issues/153), including ensuring all [Interop features](https://wpt.fyi/results/) are fully documented. 13 | 14 | We are starting by documenting all the features of [Interop 2021-22](https://github.com/openwebdocs/project/issues/189) and [2023](https://github.com/openwebdocs/project/issues/190). Later this year, we will focus on the [Interop 2024 features](https://github.com/openwebdocs/project/issues/191) that will, at that point, be newly supported. 15 | 16 | ## CSS containment project 17 | 18 | The first sub-project completed was [CSS containment](https://github.com/openwebdocs/project/issues/195). CSS containment is part of both [Interop 2022](https://wpt.fyi/interop-2022) and [Interop 2023](https://wpt.fyi/interop-2023), and is still being worked on as part of [Interop 2024](https://wpt.fyi/interop-2024). 19 | 20 | Containment improves rendering performance by isolating sections of content for delayed layout and rendering. Container queries, also defined in the CSS containment specification, enable targeting styles based on a container's size or style features. 21 | 22 | We created a new [CSS containment module](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Containment) landing page and guides. The module landing page includes a reference with links to all the properties, at-rules and descriptors, CSS functions, events, interfaces defined in the CSS containment specification, and guides. All these references were reviewed and updated as necessary. 23 | 24 | The larger component of this project included updating the existing containment guides and creating new ones. 25 | 26 | ### CSS containment guides 27 | 28 | There are now three CSS containment guides on MDN: 29 | 30 | * [CSS container queries](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_queries) 31 | 32 | We updated this introductory `@container` queries guide, which discusses size queries, naming queries, and container query length units, which are well supported. We left in the fallbacks for non-supporting browsers for now, and look forward to removing it soon when it's fully supported! 33 | 34 | * [Using CSS containment](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Using_CSS_containment) 35 | 36 | We fully updated this guide which describes the basic aims of CSS containment and how to leverage `contain` and `content-visibility` properties for a better user experience. The guide explains size, layout, style, and paint containment. 37 | 38 | We also moved this guide to be under the associated CSS module landing page, to improve maintainability and match our current structure. 39 | 40 | The `contain` property is supported in all browsers. The two other main features defined in the containment specification are `content-visibility` and `@container`. These features have more limited support. But, as per the goals of Interop, support is improving, and documentation for these up and coming features is now available! `content-visibility` improves the initial page load speed by enabling browsers to omit sections of layout and rendering until the content becomes needed. And `@container` enables applying styles to an element based on the size or style feature of a containment context. 41 | 42 | * [Using container size and style queries](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_queries) 43 | 44 | This represented the bulk of the project. The new guide focuses on writing container size and style queries with `@container`, including style queries for custom properties, query syntax and names, and nesting container queries. 45 | 46 | This new guide covers all the basics of currently supported container queries including a deep dive into container size queries and the size query descriptors, naming containers to limit their scope, and using the `style()` functional notation within the `@container` at rule's `` to create style queries with custom properties. 47 | 48 | The guide also touches on container style feature queries, as we await browser support for this exciting feature. 49 | 50 | ### Open Web Docs 51 | 52 | Thanks to the support of our sponsors, we, the OWD technical writers, are able to review and update existing content and dedicate the time needed to write in-depth articles when documentation is found to be lacking. We found a gap in the documentation of container style queries, and had the support to fill it! 53 | 54 | If you use MDN and find these resources helpful, please consider [sponsoring OWD on GitHub](https://github.com/sponsors/openwebdocs) or becoming an [Open Web Docs sponsor on Open Collective](https://opencollective.com/open-web-docs#category-CONTRIBUTE). Contributions are what make OWD and our documentation efforts possible. 55 | -------------------------------------------------------------------------------- /pages/content/posts/cycletracker.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Estelle Weyl" 3 | title: "Build a menstrual cycle tracker PWA" 4 | date: "2023-08-01" 5 | tags: ["projects"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Learn how to build a Progressive Web App by building a menstrual cycle tracking application. By building the PWA yourself, you know you control your own data." 9 | --- 10 | 11 | Menstruation, also known as a period, is the monthly shedding of the lining of the uterus. Most people assigned female at birth (AFAB) start menstruating as a preteen or during their teen years with periods occurring at regular intervals by the time they reach their twenties. 12 | 13 | Menstruation is one of the four parts of the menstrual cycle. The first phase of the [menstrual cycle](https://my.clevelandclinic.org/health/articles/10132-menstrual-cycle) is menstruation. While menstruation usually lasts for three to five days, the length varies between people and between stages of one’s life. The follicular phase is when an egg matures in one of the ovaries. Ovulation is the phase when the egg is released from the ovary. Ovulation usually occurs 14 days before the next menstrual period. The luteal phase occurs after ovulation; the empty follicle in the ovary produces hormones that prepare the uterus for pregnancy. If pregnancy does not occur, the lining of the uterus is shed and the menstrual cycle begins again. Of these, menstruation, due to the shedding of the uterine lining, is the easiest one to track the menstrual cycle. 14 | 15 | There are many reasons why people who menstruate want to track their periods. Tracking periods helps predict when ovulation occurs which is important for family planning, whether one is hoping to get or not get pregnant. Knowing when a period is due helps in planning; knowing when to pack period hygiene supplies, when to plan or avoid planning activities, or when to not wear white pants. If one suffers from cycle-related mood swings, cramps, bloating, and fatigue, knowing when these symptoms are likely to occur is important. Tracking menstruation helps identify cycle changes and irregularities, which can indicate a health problem. 16 | 17 | Menstrual cycle tracking applications (MCTs) help individuals track their periods. Depending on the MCT, these apps can collect a wide range of personal and sensitive data from flow and symptoms, to sexual activity, to other health information, such as weight, blood pressure, and mood. The main thing they all have in common is they track the first date and end day of each period. The main problem most MCTs have is privacy. 18 | 19 | MCTs collect a wide range of personal and sensitive data about users. When using an MCT web application you didn’t write and don’t control, your data is at risk. Personal information, especially sensitive health and reproductive data, can be used to identify users. Privacy risks include: 20 | 21 | * Data misuse: Once data is shared, you have no control over how it is analyzed or used. 22 | * Data collection and sharing: Data may be shared with advertisers, data brokers, and law enforcement. 23 | * Data security: Databases run the risk of data breaches. 24 | 25 | This is especially concerning in areas that try to regulate or even criminalize reproductive health care, including contraception and abortion. The Florida High School Athletic Association considered a policy to require girls to provide information about their menstrual cycle. Fortunately, this policy was not implemented. Restricting access to abortion, and even access to contraception is not limited to the USA. There is a legitimate concern that MCT data can be used to prevent girls from playing sports, prosecute people who have abortions, and legislate the bodies and pregnant people. 26 | 27 | If you are concerned about the privacy risks associated with MCTs, you can create and host your own! There is a step-by-step [introductory-level tutorial to create a menstrual tracking application](https://developer.mozilla.org/docs/Web/Progressive_web_apps/Tutorials/CycleTracker). CycleTracker is a [progressive web app (PWA)](https://developer.mozilla.org/docs/Web/Progressive_web_apps) with a form for the user to enter the start and end date of each period and the entered data is stored in the browser’s [localStorage](https://developer.mozilla.org/docs/Web/API/Window/localStorage). The PWA can be stored on your device and is fully functional when offline. If you follow the steps in the tutorial, you can create the PWA yourself, and host it locally without ever putting any code online. You can install it on your own device. It works when you're offline or when your local server isn’t running, and will continue running even if you delete the original source code. No form data is submitted to a server and all the data is stored in localStorage over which you have full control. 28 | 29 | Because you are coding this PWA yourself, you can add additional features, including features to increase privacy. While the tutorial uses the name "CycleTracker", you can change the name to obfuscate the app's purpose. For example, you could name the app "Manicures" and change the labeling to make it appear that the start date is when you got the manicure and the end date is when your nails needed a re-polish or a press-on nail needed a refill. You control the PWA you develop and the data you enter into it. 30 | 31 | If you want to learn how to create PWAs, check out the [CycleTracker tutorial](https://developer.mozilla.org/docs/Web/Progressive_web_apps/Tutorials/CycleTracker). It will take you through all the required steps, including building the basic markup and styles, adding the JavaScript logic, testing locally, and creating a secure connection. It will also give you an opportunity to learn about the components of a PWA manifest file, its iconography, how to define the assets to cache, and how to create a service worker to enable working offline. 32 | 33 | If you are going to work thru a tutorial, you might as well work through one that is useful. 34 | -------------------------------------------------------------------------------- /pages/content/posts/estelle-weyl.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz" 3 | title: "Estelle Weyl Joins Open Web Docs Staff" 4 | date: "2021-08-19" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Open Web Docs is thrilled to announce that Estelle Weyl has joined the team this week as a Sr. Technical 9 | Writer and Developer Advocate." 10 | --- 11 | 12 | Open Web Docs is thrilled to announce that [Estelle Weyl](http://twitter.com/estellevw) has joined the team this week as a Sr. Technical Writer and Developer Advocate. 13 | 14 | A front end engineer with 20-years of CSS, JS and HTML experience, [Estelle](http://estelle.github.io/) has always been a web standardista, advocating for a free, accessible, and performant web. Estelle has been documenting and teaching web standards since 2007, writing numerous books, blogs, and tutorials. 15 | 16 | She has spoken at over 100 conferences, organized meetups, the Confident Coding series of conferences, and the international web performance conference #PerfMatters. She has written several books including co-authoring CSS: The Definitive Guide, HTML and CSS for the Real World, and authoring Mobile HTML5. She has led CSS, accessibility, JavaScript, and web performance workshops, including teaching with Frontend Masters. She also actively works to improve inclusion in our industry. 17 | 18 | At Open Web Docs, Estelle will be focusing on community building in addition to working with the team on improving documentation. We’re excited and proud to have her join the team - please join us in welcoming Estelle Weyl! 19 | 20 | --- 21 | 22 | _Originally published at https://opencollective.com/open-web-docs/updates/estelle-weyl-joins-open-web-docs-staff._ -------------------------------------------------------------------------------- /pages/content/posts/facebook-funding.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Jory Burson" 3 | title: "Facebook Joins Open Web Docs as Lead Funder" 4 | date: "2021-05-04" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Open Web Docs is excited to welcome Facebook as a lead funder, joining Google, Microsoft, and Coil on the Governing Committee. As a leading user of, and contributor to, web-based technologies and browsers, Facebook understands how important quality documentation is to the education and productivity of developers." 9 | --- 10 | 11 | [Open Web Docs](https://opencollective.com/open-web-docs) is excited to welcome Facebook as a lead funder, joining Google, Microsoft, and Coil on the [Governing Committee](https://github.com/openwebdocs/project#governance). As a leading user of, and contributor to, web-based technologies and browsers, Facebook understands how important quality documentation is to the education and productivity of developers. 12 | 13 | “Together, Open Web Docs and Facebook will work to ensure developer documentation remains high quality, help drive shared content opportunities with other frameworks, and showcase an even a wider array of browsers that adhere to the MDN-documented technologies,” said Joel Marcey, Developer Advocate and Ecosystem Lead on Facebook’s Open Source Team, and Open Web Docs Governing Committee Member. 14 | 15 | In addition to the Governing Committee, Facebook will be joining the Steering Committee, where it will help develop roadmaps and execution to ensure Open Web Docs is working on the highest impact projects for web developers. 16 | 17 | “We see the web, both 2D and Immersive, as an important part of the overall XR user and developer experience. In order to better support the XR ecosystem, we are strong proponents of high-quality information for developers targeting browsers on all XR devices. Open Web Docs is a perfect initiative to help drive and showcase these types of underrepresented documentation,” said Dave Hill, Oculus Engineering Manager 18 | 19 | Facebook’s sponsorship will contribute to the hiring of full-time Open Web Docs technical writing staff, as well as continue the investment in the future of web platform documentation. 20 | 21 | --- 22 | 23 | _Originally published at https://opencollective.com/open-web-docs/updates/facebook-joins-open-web-docs-as-lead-funder._ -------------------------------------------------------------------------------- /pages/content/posts/florian-owd-director.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Jory Burson" 3 | title: "Introducing our Director of Open Web Docs - Florian Scholz!" 4 | date: "2024-03-06" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Florian Scholz receives a new title to reflect his leadership at OWD." 9 | --- 10 | 11 | The Open Web Docs Governing Committee is thrilled to announce that Florian Scholz has been appointed as the new Director of Open Web Docs (OWD), stepping into a pivotal role that is crucial for the advancement and stewardship of the project. This appointment marks a significant milestone in the OWD journey, reflecting our continuous commitment to enhancing web platform documentation through collaborative and open efforts. 12 | 13 | ![Photo of Florian Scholz](/img/florian.jpg) 14 | 15 | Florian previously served as OWD’s Content Lead. As Director, Florian will be at the forefront of both internal and external matters concerning the OWD project. Internally, his responsibilities will encompass chairing the Steering Committee, leading our dedicated staff writers, and collaborating with stakeholders to establish and execute projects aligned with our quarterly roadmap. His role is integral to ensuring that the vision and goals of the OWD project are met with enthusiasm, precision, and excellence. 16 | 17 | Externally, Florian's leadership will extend the visibility and awareness of the OWD project. He will engage directly with our partners to brainstorm new project ideas, explore funding opportunities, and initiate community development activities. His efforts will not only strengthen our current partnerships but also forge new ones, broadening the horizon for OWD's impact on web documentation. 18 | 19 | Florian’s expertise and dedication are invaluable for the community of contributors, and set a high bar for technical writing and documentation engineering within the OWD ecosystem. With a rich background in technical writing and a passion for open web standards, Florian is well-equipped to lead the OWD project towards achieving its goals. His leadership, mentorship, and expertise will help foster an environment where collaboration and innovation in web platform documentation thrive. 20 | 21 | Please join us in congratulating Florian on his new role. 22 | -------------------------------------------------------------------------------- /pages/content/posts/igalia-gc.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz" 3 | title: "Igalia Joins Open Web Docs Governing Committee" 4 | date: "2024-03-18" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Open Web Docs is excited to welcome Igalia on our Governing Committee joining Google and Microsoft Edge." 9 | --- 10 | 11 | Open Web Docs is excited to welcome Igalia to our Governing Committee, joining Google and Microsoft Edge. The Governing Committee administers OWD’s financial sponsorships, made via Open Collective, and explores strategic partnerships and needs for web documentation projects. 12 | 13 | The Governing Committee is composed of organizations sponsoring at the Platinum level, elected representatives from the Gold membership level, individual advisory members, and OWD’s Director. 14 | 15 | [Igalia](https://www.igalia.com/about/) is a software consultancy focused on open-source software. Igalia is known for its contributions and commitments to both open-source and open standards. They are a key contributor to every browser engine and lead the development of many Web feature implementations that Open Web Docs supports with documentation. 16 | 17 | > “Igalia has been a staunch supporter of Open Web Docs since its inception, and we‘re honored to become part of the Governing Committee. On a more personal level, everything about OWD’s mission resonates with me, so I’m excited by this opportunity to participate more actively in the work.” 18 | – Eric Meyer, Developer Advocate at Igalia 19 | 20 | > “Igalia has been a long-time partner to OWD and a big supporter of open web documentation. Igalia has been a key member in our Steering Committee since OWD’s inception in 2021. I’m thrilled to have Igalia on our Governing Committee going forward.” 21 | – Florian Scholz, Director of Open Web Docs 22 | 23 | With a $20k yearly donation, Igalia is an OWD Gold Sponsor, helping us reach our yearly goal of fully funding four full-time technical writers to work on open web documentation. 24 | -------------------------------------------------------------------------------- /pages/content/posts/improve-formal-syntax/images/formal-syntax-background-after.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/improve-formal-syntax/images/formal-syntax-background-after.png -------------------------------------------------------------------------------- /pages/content/posts/improve-formal-syntax/images/formal-syntax-background-before.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/improve-formal-syntax/images/formal-syntax-background-before.png -------------------------------------------------------------------------------- /pages/content/posts/improve-formal-syntax/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Will Bamberg" 3 | title: "Improving MDN's CSS formal syntax" 4 | date: "2022-10-11" 5 | tags: ["projects"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "How we made MDN's CSS formal syntax more readable and reliable, with the help of some great open source software packages." 9 | --- 10 | 11 | If you've spent much time with the CSS docs on MDN, you've probably seen the ["Formal syntax" section](https://developer.mozilla.org/en-US/docs/Web/CSS/background#formal_syntax) in the CSS property reference pages. When we ask developers what they think of this part of the docs, most of them say something like "I have no idea what this means". This used to be my reaction too, but now I think it can be extremely useful. CSS properties can have complex syntax, and explaining it in prose can be really hard. Once you've learned a few rules, the formal syntax gives you a very precise description of the syntax in a very concise manner. 12 | 13 | Until recently, though, there were two big problems with the way MDN represented formal syntax. 14 | 15 | The first problem was presentation: the macro that rendered the formal syntax as HTML tended to render it as a wall of text, making it hard to read and scarier than strictly necessary: 16 | 17 | ![Screenshot of old formal syntax rendering for the background property, showing it as a wall of text](images/formal-syntax-background-before.png) 18 | 19 | The second problem was about data quality. Although the formal syntax should match the syntax in the specifications, MDN maintained its own copy of the data in a separate repository, [mdn/data](https://github.com/mdn/data). We often weren’t able to keep this up to date with the specification, and as a result, users of MDN would see inaccurate or outdated syntax. 20 | 21 | ## Enter css-tree and @webref/css 22 | 23 | Our solution to these problems rested heavily on two amazing open source packages. 24 | 25 | The [css-tree](https://www.npmjs.com/package/css-tree) package enabled us to generate an [AST](https://en.wikipedia.org/wiki/Abstract_syntax_tree) for a formal syntax definition, making it much easier to render it in a more usable form. In particular, we have added syntax highlighting and pretty-printing. Here’s that syntax for `background` with the updated code: 26 | 27 | ![Screenshot of new formal syntax rendering for the background property, showing it pretty-printed](images/formal-syntax-background-after.png) 28 | 29 | Next, we replaced mdn/data as a data source with the [@webref/css](https://www.npmjs.com/package/@webref/css) package, developed and maintained by our friends at the W3C. This scrapes the syntax directly from the specifications, so we know it will be fresh. 30 | 31 | The collection of webref packages contains lots of interesting structured content extracted from the specs, and we think there are [potentially many ways we can use it to make MDN more accurate and maintainable](https://github.com/mdn/yari/pull/7227#issuecomment-1264230886). Using it for formal syntax is, we hope, only the start. 32 | 33 | ## Wrapping up 34 | 35 | Huge thanks go to [@lahmatiy](https://github.com/lahmatiy), the developer of css-tree, and [@tidoust](https://github.com/tidoust) for his work on webref and his patient guidance in navigating the CSS specifications. 36 | 37 | We're interested to hear what you think too. If you have ideas for how we can make the formal syntax more useful and approachable, or how we can use structured content from the specs to improve MDN, please [let us know](https://github.com/openwebdocs/project/issues)! 38 | -------------------------------------------------------------------------------- /pages/content/posts/index.njk: -------------------------------------------------------------------------------- 1 | --- 2 | layout: layouts/default.njk 3 | title: "Open Web Docs - Blog" 4 | eleventyExcludeFromCollections: true 5 | pagination: 6 | data: collections.post 7 | size: 12 8 | alias: posts 9 | reverse: true 10 | --- 11 | 12 |
13 |

Blog

14 | Subscribe to the feed. 15 | 26 | {% include "../../_includes/partials/pagination.njk" %} 27 |
28 | 29 | -------------------------------------------------------------------------------- /pages/content/posts/introducing-owd.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Robert Nyman" 3 | title: "Introducing Open Web Docs" 4 | date: "2021-01-25" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "High-quality documentation for web platform technologies is a critically important component of our shared, open digital infrastructure." 9 | --- 10 | 11 | High-quality documentation for web platform technologies is a critically important component of our shared, open digital infrastructure. 12 | Today, we’re excited to publicly introduce [Open Web Docs](https://opencollective.com/open-web-docs/), a collective project designed to support a community of technical writers around strategic creation and long-term maintenance of web platform technology documentation that is open and inclusive for all. 13 | 14 | Open Web Docs was created to ensure the long-term health of web platform documentation on de facto standard resources like [MDN Web Docs](https://developer.mozilla.org/), independently of any single vendor or organization. Through full-time staff, community management, and our network of partner organizations, we enable these resources to better maintain and sustain documentation of core web platform technologies. Rather than create new documentation sites, Open Web Docs is committed to improving existing platforms through our contributions. 15 | 16 | Florian Scholz joined the project in November 2020 as our Content Lead, working with stakeholders to define initial workstreams. Our 2021 priorities include working with Mozilla’s MDN writers and engineers to support the recent [infrastructure transition](https://hacks.mozilla.org/2020/12/welcome-yari-mdn-web-docs-has-a-new-platform/) and to prioritize and move forward with key documentation work, developing a community of contributors around core web technology documentation, browser compatibility data, and improving JavaScript documentation. Additional hires will be announced soon, and those interested can follow our updates at [opencollective.com/open-web-docs](https://opencollective.com/open-web-docs), [https://github.com/openwebdocs](https://github.com/openwebdocs) and [@OpenWebDocs](https://twitter.com/OpenWebDocs). 17 | 18 | Open Web Docs staff are supported by founding sponsors Coil, Google and Microsoft, with additional financial support from Igalia and generous backers on Open Source Collective. Mozilla, Samsung, and W3C provide additional support and participation. Participating orgs are collaborating on content work via weekly editorial and OWD steering committee meetings, and there are plans to create a shared process as we get deeper into the work. 19 | 20 | **Get Involved** 21 | 22 | Documentation is for everyone - if you think so too, let’s work together! Check out our [high-level goals plan](https://github.com/openwebdocs/project/blob/main/2021-goals.md), and let us know what you would like to see prioritized. We’re also planning a live Q&A session the week of Feb. 16 - [sign up for our newsletter](http://newsletter.openwebdocs.org/) to get attendance information and receive update digests. And of course, follow [@OpenWebDocs](https://twitter.com/OpenWebDocs) on Twitter to get the latest news. 23 | 24 | **Questions and answers** 25 | 26 | **Q: Is this a new docs platform?** 27 | 28 | A: No, we are working closely together with existing platforms, and our current priority is contributions to MDN Web Docs. 29 | 30 | **Q: Is this a competitor/replacement for MDN Web Docs?** 31 | 32 | A: No. Open Web Docs writers contribute to important developer documentation resources, including MDN. Mozilla is a part of Open Web Docs and a member of its Steering Committee. 33 | 34 | **Q: Is this the same as Web Platform Docs was?** 35 | 36 | A: No, Web Platform Docs was a new documentation platform, whereas this is aimed at contributing to existing platforms. 37 | 38 | **Q: How is Open Web Docs funded?** 39 | 40 | A: Open Web Docs is funded by contributions from our founding sponsors Coil, Google and Microsoft, and [contributors from the wider developer community](https://opencollective.com/open-web-docs) such as Igalia. We welcome more backers who want to ensure support for long-term maintenance of web platform technology documentation. 41 | 42 | **Q: How do I get involved?** 43 | 44 | A: For funding, you can contribute to the project on our Open Source Collective [project page](https://opencollective.com/open-web-docs/). For collaboration opportunities or an interest in becoming a lead funder, please reach out to hello@oscollective.org. 45 | 46 | --- 47 | 48 | _Originally published at https://opencollective.com/open-web-docs/updates/introducing-open-web-docs._ -------------------------------------------------------------------------------- /pages/content/posts/jean-yves-perrier.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz" 3 | title: "Jean-Yves Perrier Joins Open Web Docs Staff" 4 | date: "2021-08-02" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Open Web Docs is excited to announce that Jean-Yves Perrier has joined the team today as a full-time Sr. Technical Writer." 9 | --- 10 | 11 | Open Web Docs is excited to announce that Jean-Yves Perrier has joined the team today as a full-time Sr. Technical Writer. 12 | 13 | Previously a C++ software developer with a 10-year experience in multitasked applications and a long-time advocate of the open web, Jean-Yves has more than a decade of experience on web-related documentation, both as a volunteer and professionally. 14 | 15 | In addition to his previous work on MDN and speaking at conferences, he has also been heavily involved with enabling a community of web advocates through the Mozilla Tech Speaker program, organising events, and creating curriculums. 16 | 17 | Jean-Yves is thrilled to help us build an Open Web documentation community! 18 | 19 | Please join us in welcoming Jean-Yves Perrier! 20 | 21 | --- 22 | 23 | _Originally published at https://opencollective.com/open-web-docs/updates/jean-yves-perrier-joins-open-web-docs-staff._ -------------------------------------------------------------------------------- /pages/content/posts/jetbrains-funding.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz" 3 | title: "JetBrains Joins Open Web Docs" 4 | date: "2021-07-27" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "We’re excited to welcome JetBrains to the Open Web Docs Steering Committee!" 9 | --- 10 | 11 | We’re excited to welcome JetBrains to the Open Web Docs Steering Committee! 12 | 13 | [JetBrains](https://www.jetbrains.com/) is a software tooling vendor that created IntelliJ IDEA, WebStorm, and many other developer tools. 14 | 15 | > “More and more people in the JavaScript and web development community are recognizing the importance of good documentation. We at JetBrains recognize it, too. For many years, we’ve equipped our IDEs with MDN documentation, helping developers find information faster and when it’s most relevant. 16 | 17 | > For us, the OWD initiative is an amazing opportunity to support the open-source community and improve the quality of documents in the tooling used by developers on a daily basis.” 18 | 19 | – Piotr Tomiak, WebStorm Senior Software Developer. 20 | 21 | With a $20k donation, JetBrains helps us to get closer to our yearly goal to fully fund four full-time Tech Writers to work on Open Web Documentation. 22 | 23 | --- 24 | 25 | _Originally published at https://opencollective.com/open-web-docs/updates/jetbrains-joins-open-web-docs._ -------------------------------------------------------------------------------- /pages/content/posts/job-posting.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Jory Burson" 3 | title: "Now Accepting Applications: Open Web Docs Tech Writer / Advocate" 4 | date: "2021-04-20" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Are you passionate about the open web, technical documentation, and growing healthy, sustainable online communities? Join Open Web Docs!" 9 | --- 10 | 11 | Are you passionate about the open web, technical documentation, and growing healthy, sustainable online communities? Join Open Web Docs! We're looking for an experienced technical writer to join Florian, Will, and an amazing community of contributors to help sustain web platform documentation. 12 | 13 | This is a full-time, remote position on our small-but-mighty team. You'll work with people across multiple organizations and timezones to improve important web development resources like MDN. The salary for this role is $120,000 USD plus benefits paid in your local currency. Check out the job description below, and reach out to jory @ openwebdocs.org or florian @ openwebdocs.org with questions. 14 | 15 | ### Tech Writer / Advocate - [Apply Here](https://docs.google.com/forms/d/e/1FAIpQLSeiperW7c7kD9WwMYaKN1hBTTkAPrdHJhd5UsFEygU6gHSZ3Q/closedform) 16 | 17 | **0/ What is Open Web Docs?** 18 | 19 | The Open Web Docs project is a collective of people and organizations contributing to the betterment of open web platform documentation for the benefit of web developers worldwide. In practice this means contributing to platforms such as MDN Web Docs and others, and taking a lead role on specific content projects within these platforms, in coordination with these platforms as appropriate. 20 | 21 | **1/ Job Description** 22 | 23 | Open Web Docs is looking for a Senior team member with both technical writing and developer advocate skills to join our team. 24 | 25 | You will both focus on writing projects, tooling and processes related to documentation for Web platform technologies as well as developer advocacy work such as blogging, promotion to the developer community, community management, social media and events. 26 | 27 | In particular, you'll be contributing to MDN Web Docs, and related efforts, with an independent editorial voice and championing the needs of the global population of web developers in prioritizing and executing on documentation. 28 | 29 | As part of a growing team, you'll engage with the contributor community, the MDN Product Advisory Board, standards bodies, and other partners to propose, plan, and author new content, and maintain and improve existing documentation. 30 | 31 | Open Web Docs is an all-remote team. You will work on open source projects and under open licenses, and prioritize inclusion across all concerns. 32 | 33 | Together with other OWD team members and the Open Web Docs Steering Committee, you will inform a set of priorities and execute against those priorities alongside other corporate and community partners. 34 | 35 | **2/ Responsibilities** 36 | 37 | * Contribute to and collaborate with, and continuously improve open Web documentation projects, e.g. MDN 38 | * Participate in high-level content & editorial strategy discussions for Open Web Docs involvement in documentation sources 39 | * Prioritize documentation work, create roadmap(s), milestones and manage tasks 40 | * Improve information architecture standards 41 | * Write blog posts, and other engagement with the developer community such as podcasts, interviews and use of social media 42 | * Establish and oversee processes that foster healthy communities and productive contributions on our project repositories 43 | * Build a vibrant and diverse community around Open Web Docs and MDN. 44 | * Provide strategic input on and contribute to key doc infrastructure projects (such as MDN Browser Compat Data) 45 | * Communicate with the Web documentation projects Governance Bodies such as the MDN PAB and partners 46 | * Contribute to the improvement of team process and style, as well as cross-functional efforts 47 | 48 | **3/ Job Requirements** 49 | 50 | * Prior experience in technical writing 51 | * Great research, planning, writing, editing, information architecture, and content strategy skills. 52 | * Experience planning and leading major initiatives, such as the launch of new documentation resources, and large-scale documentation reviews and overhauls. 53 | * Experience in remote work and across time zones 54 | * Knowledge of open web technologies 55 | * Highly organized and able to prioritize and triage various issues and projects 56 | * Experience with documentation tooling (git, markdown, “docs-as-code”) 57 | * Ability to manage and grow contributions from the community 58 | * Technical community management experience 59 | * Experience with diversity & inclusion and/or codes of conduct programs within technology communities or open source projects 60 | 61 | [Apply Now](https://docs.google.com/forms/d/e/1FAIpQLSeiperW7c7kD9WwMYaKN1hBTTkAPrdHJhd5UsFEygU6gHSZ3Q/closedform) 62 | 63 | --- 64 | 65 | _Originally published at https://opencollective.com/open-web-docs/updates/now-accepting-applications-open-web-docs-tech-writer-advocate._ -------------------------------------------------------------------------------- /pages/content/posts/london-meetup/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz" 3 | title: "Open Web Docs meetup with Mozilla’s MDN team" 4 | date: "2023-02-08" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "On January 18-20 all of the Open Web Docs Technical Writing team and members of the OWD Governing Committee were invited to London to meet with Mozilla’s MDN Team." 9 | --- 10 | 11 | This January 18-20, the entire Open Web Docs Technical Writing team and members of the OWD Governing Committee were invited to London to meet with Mozilla’s MDN Team. Mozilla generously sponsored OWD staff's travel and accommodation and Google hosted all of us in their London office. The OWD team was very grateful for this opportunity. Given Open Web Docs was founded during the global covid pandemic, it was the first time we met as a group in person. For some of us, it was our first time meeting each other face-to-face in real life. 12 | 13 | The most important project Open Web Docs contributes to is MDN Web Docs. We work closely with Mozilla, our main sponsors Google, Microsoft, Igalia, JetBrains, Canva, our 150+ individual funders, and the larger web community to maintain and innovate on the best documentation site for web developers and designers around the world. 14 | 15 | ## Shared roadmap 16 | 17 | In Q4 of 2022, Open Web Docs started working very closely with Mozilla on community coordination and keeping the MDN contribution process running efficiently and effectively. To that end, Mozilla and OWD created a [shared and open roadmap](https://github.com/orgs/mdn/projects/26/) for ongoing and planned work. The Open Web Docs team actively collaborates and gives direct input on MDN’s information architecture, compatibility data, content structures, code examples, and other changes coming impacting all sections of the MDN Web Docs site. 18 | 19 | With well over 11,000 pages on MDN Web Docs and an ever-evolving Web platform to document, the scope, requirements, and impact of changes for web developers all around the world can be quite a challenge to get right. With all of the expertise from the technical writer and advisory committee teams, we are all coming together on MDN Web Docs to provide web developers with the information they need to create accessible, secure, and performant web pages and applications. It is this mission that drives all of us to collaborate closely, share knowledge, and bring new ideas to the table. 20 | 21 | Our shared roadmap will help us to capture significant site changes, from content updates to navigation improvements, and will empower Mozilla, OWD, and our community to implement and execute complex projects together. 22 | 23 | ## Breakout sessions 24 | 25 | Many of the discussions in London were about how to collaborate more closely. We also had a few technical deep dive sessions where we were able to discuss in person some of the current projects we are working on. The minutes for these sessions are [available on our GitHub](https://github.com/openwebdocs/project/blob/main/steering-committee/meetups/london-2023/index.md). The areas of focus are: 26 | 27 | * [Content lifecycle](https://github.com/openwebdocs/project/blob/main/steering-committee/meetups/london-2023/session-content.md): We identified the maintenance cost of content additions during planning, defined sunsetting strategies, and discussed ways to separate technical or implementation details from prose that may quickly become outdated. 28 | * [Information architecture / page types](https://github.com/openwebdocs/project/blob/main/steering-committee/meetups/london-2023/session-ia.md): We talked through the ongoing work to categorize and organize content on the site based on the technology it relates to, and how it works with other technologies. 29 | * [Discoverability](https://github.com/openwebdocs/project/blob/main/steering-committee/meetups/london-2023/session-discover.md): We discussed how to make it simple for developers to find the information they need while browsing the site, improving the site's search functionality and making it more straightforward and exciting to discover new and related content. 30 | * [Web platform feature groups](https://github.com/openwebdocs/project/blob/main/steering-committee/meetups/london-2023/session-webplatform.md): This discussion was about developing a hierarchy that groups platform features across technologies so that developers get a clear picture of whether they can use the features, what they relate to, and the browser and device support for these features. 31 | * [Code examples](https://github.com/openwebdocs/project/blob/main/steering-committee/meetups/london-2023/session-code-examples.md): This session covered the plans to make the different types of code examples displayed on MDN easier to maintain and contribute to and ways to simplify the editor that renders them on the page for readers. 32 | * [BCD](https://github.com/openwebdocs/project/blob/main/steering-committee/meetups/london-2023/session-bcd.md) (the meeting notes are thin, sorry): This session was about the state of the compatibility data, how to maintain it going forward, and how to guarantee data quality. 33 | 34 | Having a meetup with Mozilla, W3C, Google, and Microsoft was an excellent opportunity to discuss ongoing efforts to support web platform documentation for the benefit of web developers & designers worldwide. Our community of technical writers, developers, standards makers, and technology companies continues to do invaluable work for MDN Web Docs. We aim to continue to support documentation as critical digital infrastructure for everyone. 35 | 36 | We hope this isn't a one-time event and that we get to meet in person with our partners and people who deeply care about web infrastructure and documentation again when the situation allows. Thanks again to Mozilla and Google for sponsoring us this time! If you want to sponsor Open Web Docs’ next meetup, or want to support us in some other way, get in touch: [florian@openwebdocs.org](mailto:florian@openwebdocs.org) or [jory@openwebdocs.org](mailto:jory@openwebdocs.org). 37 | 38 | ![Group photo of all attendees](openwebdocs_london_groupphoto.jpg) 39 | -------------------------------------------------------------------------------- /pages/content/posts/london-meetup/openwebdocs_london_groupphoto.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/london-meetup/openwebdocs_london_groupphoto.jpg -------------------------------------------------------------------------------- /pages/content/posts/micro-benevolences.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Estelle Weyl" 3 | title: "Micro benevolences" 4 | date: "2023-08-08" 5 | description: "Making MDN more inclusive." 6 | tags: ["projects"] 7 | ShowToc: false 8 | ShowBreadCrumbs: false 9 | excerpt: "The Open Web Docs team has been working to reduce the occurrence of microaggressions and up the number of micro-benevolences throughout MDN." 10 | --- 11 | 12 | Many of us are unknowingly responsible for microaggressions in our everyday interactions, including when we write content and create examples for MDN. The Open Web Docs team has been working to reduce the occurrence of microaggressions and up the number of micro-benevolences throughout MDN. 13 | 14 | ## Reducing microaggressions 15 | 16 | Microaggressions are demeaning experiences in seemingly normal daily interactions from generally well-intentioned people who are unaware their behavior is non-inclusive and even offensive. 17 | 18 | The use of stereotypes is an environmental microaggression. This may be manifested by who is portrayed as a knowledgeable teacher versus who is portrayed as naive and needing to learn. The absence of diversity is also an environmental microaggression. Ensuring representation in curricula and the overall culture of an organization, in general, improves diversity. The absence of diversity, such as including only or mainly cis-hetero-white-men of North American and European descent in relationships with power dynamics, in prose and code are environmental microaggressions. 19 | 20 | When people are not represented, they feel invisible. When people from minoritized communities do not see themselves represented in learning or workplace settings, which includes MDN, they can feel isolated, lonely, and excluded. When the only minoritized representations are of learners and students, these microaggressions can negatively impact confidence. 21 | 22 | Microaggressions aren't just related to birth-based differences. Language is important for all readers. Describing something as "simple" or "easy", or telling a developer to "just" do something, makes those who don't find something simple or easy, or have never encountered a task, API, or property, feel inadequate or incompetent, and can lead to imposter syndrome. Microaggressions negatively impact everyone's mental and emotional health. 23 | 24 | The OWD team has been working to remove potential microaggressions on MDN content. For example, when we encounter words minimizing the complexity of a task, we remove them. 25 | 26 | ## Adding micro-benevolences 27 | 28 | A micro-benevolence is a small act of kindness that benefits another person, without expecting reciprocity. Micro benevolences can be as basic as including culturally sensitive names in code examples or putting primary parent and secondary parent on a form instead of defaulting to cis-gendered, patriarchal, heteronormative norms. 29 | 30 | In addition to removing potential microaggressions on MDN, the OWD team has been working to include micro-benevolences in code examples and imagery when we update content. As we work thru new content and revise old content to meet new specs and coding standards, we update the text and code examples to reflect the diversity of our readers. By increasing the diversity of cultures, genders, ages, and topics portrayed in code examples, more of our readers will feel seen and included. Another great benefit is that all readers will be exposed to cultures, genders, ages, and topics of interest not their own. 31 | 32 | ### Diversifying code examples 33 | 34 | When learning to code, you will often encounter John Doe and Mike Smith in code examples, with the occasional Jane and Kim. The OWD team went thru the `content` directory and updated such examples to better reflect the diversity of developers. For example, the first names in a [table of names](https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-child) was updated to include common first names of different cultures, such as Diego, Shilpa, Caterina, Jayla, Aisha, Kyouko, and Shireen, and non-gendered names, such as Dominique, Jayla, and Gila. 35 | 36 | Opportunities for benevolence abound; another [table was a list of names and countries](https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-child#using_of_selector_to_fix_striped_tables) was updated to included country-appropriate names, and indigenous names, such as Tlayolotl for Mexico. 37 | 38 | With a little effort, and mostly awareness, we hope to make all people feel included and seen. 39 | 40 | We also included examples that made people who are often discriminated against and marginalized feel seen. On the web, many code examples are geared toward science fiction and math lovers. While we haven’t removed all references to Star Wars, all male sports teams, planets, or Pythagorean, we’ve included [quotes by Maya Angelou](https://developer.mozilla.org/en-US/docs/Web/CSS/overflow), [SVGs of mandalas](https://developer.mozilla.org/en-US/docs/Web/CSS/Filter_Effects/Using_filter_effects#applying_repeated_filters), and a welcome to our [trans](https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow?retiredLocale=de#setting_zero_for_offset_and_blur) friends. 41 | 42 | We are also encouraging the community to be aware of historical discrimination and exclusion and how history impacts our examples. For example, a community contributor suggested a code example that included the top scorers for the 1954 World Cup. Originally, FIFA allocated only one spot in the World Cup to the three continents of Africa, Asia, and Oceania (one spot in total, not one to each continent). While most people know that FIFA excluded women for most of its history, most don’t know that over half of the world’s male population was also excluded. In this case, we guided the contributor thru the PR review process to use a more inclusive statistic. In so doing, we both improve the inclusion in this single example and made contributors more aware of being mindful when creating examples. 43 | -------------------------------------------------------------------------------- /pages/content/posts/mozilla-owd.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz" 3 | title: "Mozilla and Open Web Docs working together on MDN" 4 | date: "2022-03-17" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Mozilla will soon launch MDN Plus, a premium subscription service for MDN readers." 9 | --- 10 | 11 | Mozilla will soon launch MDN Plus, a premium subscription service for MDN readers. Have a look at the Hacks blog post [Mozilla and Open Web Docs working together on MDN ](https://hacks.mozilla.org/2022/03/mozilla-and-open-web-docs-working-together-on-mdn/)to read about how Open Web Docs and Mozilla work together, how our missions overlap and how they differ, and how a premium subscription service fits into all this. 12 | 13 | --- 14 | 15 | _Originally published at https://opencollective.com/open-web-docs/updates/mozilla-and-open-web-docs-working-together-on-mdn._ -------------------------------------------------------------------------------- /pages/content/posts/open-docs.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz" 3 | title: "Maximizing impact of open documentation for the web platform" 4 | date: "2023-07-20" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "The Open Web Docs community believes that freely available open web platform documentation, written by experts, and contributed to by the community is essential to the ongoing health of the web." 9 | --- 10 | 11 | The Open Web Docs community believes that freely available open web platform documentation, written by experts, and contributed to by the community is essential to the ongoing health of the web. In this post we outline our relationship with MDN as the current main web presentation of the open source content we contribute to, and share our thoughts on future presentations and uses of this content. 12 | 13 | Since its inception in 2021, Open Web Docs has been heavily contributing to [mdn/content](https://github.com/mdn/content), which contains the documentation for all features of the web platform, and [mdn/browser-compat-data](https://github.com/mdn/browser-compat-data), which contains detailed browser-compatibility data for all features of the web platform. These two repositories are the foundation of Mozilla's [MDN Web Docs](https://developer.mozilla.org/). These repositories are also used by [devdocs.io](https://devdocs.io/) and [caniuse.com](https://caniuse.com/#comparison), and there are integrations with browser tools, W3C and WHATWG specifications, other developer tools, and IDEs as well. 14 | 15 | Open Web Docs believes that contributing to these open source projects drives the biggest impact on web developer documentation worldwide. These repositories build a foundation that helps developers understand web technologies. 16 | 17 | Thanks to the clarity of open source licenses and the generosity of open source contributors, `mdn/content` and `mdn/browser-compat-data` data can be published anywhere by anyone. 18 | 19 | Over the years, several MDN community members have created forks of `mdn/content` for their own publication and use. While OWD continues to see this pattern as a feature rather than a bug of open source, OWD plans to continue contributing to the upstream `mdn/content` repository and encourages the community to continue making their own content contributions to the upstream repository in order to sustain the high degree of quality and editorial review necessary for content of this caliber and importance. 20 | 21 | The proper presentation of web platform documentation should be driven by the needs of the web development community and what is best for it. 22 | 23 | Consuming technical documentation using a website has been the standard practice for many years, but developer needs are changing. Web platform documentation can benefit developers in many other useful ways if it is made available not only through a website but also within context to not interrupt developers in their flow, for example in developer tools (in browser developer tools and extensions, IDEs, and other code editors). Sites and platforms that have specific goals or audience needs in mind might provide only documentation components that are relevant given that context. 24 | 25 | Since its founding, Open Web Docs has focused on supporting the quality and coverage of web platform docs as [core digital infrastructure](https://github.com/openwebdocs/project/blob/main/charter.md), whether they are embedded on websites, platforms suited to specific needs, or within context in new and existing products, like IDEs and code editors. Migrating the docs into markdown was one of our initial steps; our next project on this path will be developing [embeddable versions of the HTML and CSS documentation](https://github.com/openwebdocs/project/issues/174). 26 | 27 | We imagine an ecosystem of tools and resources that deliver high-quality, technically correct web platform documentation and data wherever the developer needs it. If your organization or project is interested in embedding open web platform documentation into your tools or services, we would love to hear from you. Please reach out to [florian@openwebdocs.org](mailto:florian@openwebdocs.org). 28 | -------------------------------------------------------------------------------- /pages/content/posts/posts.json: -------------------------------------------------------------------------------- 1 | { 2 | "layout": "layouts/post.njk", 3 | "tags": ["post"] 4 | } 5 | -------------------------------------------------------------------------------- /pages/content/posts/secure-the-web-forward.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Florian Scholz, Will Bamberg" 3 | title: "Docs to Secure the Web Forward" 4 | date: "2023-10-05" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "Open Web Docs attended the Secure the Web Forward W3C workshop." 9 | --- 10 | 11 | Open Web Docs attended the W3C workshop [Secure the Web Forward](https://www.w3.org/2023/03/secure-the-web-forward/index.html). The workshop was held virtually on September 26-28, 2023 with the goal to drive developer awareness and adoption of web security standards & practices. 12 | 13 | We handed in a position paper called [Documentation for web security education](https://www.w3.org/2023/03/secure-the-web-forward/papers.html#owd) and presented our paper as part of the "Developer awareness" track on the last day of the workshop. 14 | 15 | In the paper, we take a look at the [MDN short survey results on web security](https://github.com/web-platform-dx/developer-research/blob/main/mdn-short-surveys/2023-05-15-security-dx/interpretation.md). 16 | 17 | The responses to the survey suggest a clear need for better education, tools, and best practices to assist developers in detecting and preventing security vulnerabilities in their development workflows. On average, 60% of developers rated the security aspects as somewhat challenging or very challenging, while only 17% of developers rated them as easy or very easy. 18 | 19 | With this need in mind, we took a look at the current state of the [MDN security documentation area](https://developer.mozilla.org/en-US/docs/Web/Security), proposed a better structure, and started conversations how to create better documentation for web security. 20 | 21 | The talk was recorded: 22 | 23 | - [Video & transcript](https://www.w3.org/2023/03/secure-the-web-forward/talks/owd.html) 24 | - [HTML slides](https://florianscholz.com/security-docs-workshop/) 25 | - [PDF slides](https://www.w3.org/2023/03/secure-the-web-forward/talks/slides/owd.pdf) 26 | 27 | 28 | 29 | Many thanks to the [program committee](https://www.w3.org/2023/03/secure-the-web-forward/index.html#pc) and in particular to Dan Appelquist (Snyk) and François Daoust (W3C) for inviting us and for all the work on organizing this workshop! 30 | 31 | Some takeaways from the discussion that followed the presentation of our paper: 32 | 33 | - Agreement that documentation plays a major role in the adoption of best practices and in understanding threats and defense mechanisms. 34 | - Lots of support for a standard "Security considerations" section in reference docs, like MDN has for accessibility. 35 | - There is some gatekeeping going on: We should aim to empower more people and make security more accessible to everyone and not act like security is some else's problem. (or only the browser's problem, or only a problem on the server side). 36 | - Related: No need to be a "Security expert" to care and work on security. Everyone should be responsible and even doing basic checks is already better than doing nothing at all. 37 | - We need to document end user impact: the why, and the potential harm, to help developers (and their managers) understand the value of good security practices. 38 | - We will see regulation in this space, for example the [Cyber Resilience Act](https://en.wikipedia.org/wiki/Cyber_Resilience_Act), but there are no guidelines or best practices. Maybe we need WCAG but for security to help inform regulations. 39 | - Can we incorporate security advice inside IDEs and devtools? 40 | - Can we have demos of security problems, to make them less abstract? 41 | 42 | As a next step, we hope to meet again with interested folks to: 43 | 44 | - Workshop a content outline for structured documentation on web security including the four quadrants of documentation (tutorials, how-tos, guides, reference). 45 | - Get more insights into developer needs and misunderstandings in the web security field (maybe through additional surveys or user interviews). 46 | - Create guidelines for a "Security considerations" section on reference pages. 47 | 48 | We hope to use all of these discussions, the research and the work on a content outline to formulate an Open Web Docs project on web security documentation which we can work on in 2024. 49 | 50 | Please reach out to Florian or to Will to be included in planning. 51 | -------------------------------------------------------------------------------- /pages/content/posts/securecontext-webidl/securecontext-header.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/openwebdocs/owd-website/7f5edbddc87ac20607e1a85c5ae2736036ccde6d/pages/content/posts/securecontext-webidl/securecontext-header.png -------------------------------------------------------------------------------- /pages/content/posts/self-experimentation-with-csp.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: "Will Bamberg" 3 | title: "Self-experimentation with CSP" 4 | date: "2024-11-07" 5 | tags: ["announcements"] 6 | ShowToc: false 7 | ShowBreadCrumbs: false 8 | excerpt: "What we learned when we tried to deploy a CSP for openwebdocs.org." 9 | --- 10 | 11 | Last week [we landed a big update](https://github.com/mdn/content/pull/36157) to the [MDN guide page about Content Security Policy (CSP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP), a web security feature that has a reputation for being complicated and difficult to deploy. 12 | 13 | It started with a discussion in the [Security Web Applications Community Group](https://www.w3.org/community/swag/) about [how we can help CSP gain more adoption among web developers](https://github.com/w3c-cg/swag/issues/3). [Florian](https://front-end.social/@floscholz) asked whether our site, , has a CSP, and embarrassingly, it didn't. We thought perhaps that by trying to add one, we might get some insight into the difficulties web developers face when trying to deploy their own. 14 | 15 | ## Strict CSP 16 | 17 | Netlify generously host openwebdocs.org under their [Open Source Plan](https://www.netlify.com/legal/open-source-policy/). So I went there, and found a very interesting post: [How I learned to stop worrying and love the Content Security Policy](https://www.netlify.com/blog/general-availability-content-security-policy-csp-nonce-integration/), which describes how Netlify supports a style of CSP which uses a nonce (number used once) to determine whether scripts are allowed to execute, rather than a CSP that lists acceptable hosts. The general idea is that every time a document is served, the server generates a random value, and embeds this value both in the CSP header and in the [`nonce`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#nonce) attribute of any [` 51 | ``` 52 | 53 | The server's explicit intention is important here: it means that even if an attacker tricks the server into inadvertently including a malicious script (for example, in a [reflected XSS attack](https://portswigger.net/web-security/cross-site-scripting/reflected)), then the injected script won't contain the nonce, and it won't execute. 54 | 55 | By definition, though, auto-CSP doesn't understand the server's intention. Netlify's dynamic CSP runs in the CDN, and automatically injects the nonce into every ` 73 | 78 | 79 | 80 | 81 | 90 | 98 | 107 | 116 | 124 | 133 | 134 | 138 | 142 | 143 | 144 | 151 | 152 | open 153 | 154 | w 155 | e 156 | b 157 | do 158 | c 159 | s 160 | 161 | 165 | 166 | 167 | 168 |
169 | 170 |
171 | 172 | 173 |
174 | 188 | 189 | -------------------------------------------------------------------------------- /pages/og-image.njk: -------------------------------------------------------------------------------- 1 | 28 | 29 |
30 |

{{ title }}

31 | 32 |

https://openwebdocs.org

33 |
34 | -------------------------------------------------------------------------------- /pages/sponsors.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: layouts/default.njk 3 | title: "Open Web Docs - Sponsors" 4 | --- 5 | 6 |
7 |

Sponsors

8 | 9 |

10 | Open Web Docs offers tiered sponsorship levels in order to support 11 | participation from a diverse group of organizations based on size, 12 | financials, and resource bandwidth. Our 13 | Membership page outlines the sponsorship levels 14 | available to organizations. 15 |

16 | 17 |

18 | On our 19 | open collective 22 | page or on GitHub you 23 | can make one-time donations or set up monthly or yearly recurring 24 | contributions. 25 |

26 | 27 |

Thank you so much for supporting OWD! ❤️

28 | 29 |

Platinum Sponsors

30 | 31 | 35 | 36 | 42 | 43 |

Gold Sponsors

44 | 45 | 60 | 61 | 65 | 66 |

Silver Sponsors

67 | 68 | 72 | 73 |

Individual Supporters

74 |

75 | Huge thanks to all the individuals who support us with a recurring monthly 76 | donation of $10 or more! 77 |

78 |

79 | 83 |

84 | 85 |

Individual Backers

86 | 87 |

88 | Also thanks to the many backers who support us with a recurring donation of 89 | $5 or more every month! 90 |

91 | 92 | 96 | 97 |

GitHub Sponsors

98 | 99 |

100 | You can also sponsor Open Web Docs using 101 | GitHub Sponsors. Your 102 | support will be forwarded to our Open Collective. 103 |

104 | 105 | 112 |
113 | --------------------------------------------------------------------------------