davidbgk
/
larlet-fr-david-cache
Bevaka 1
Stjärnmärk 0
Förgrening 0
Kod Släpp 0 Aktiviteter
Bläddra i källkod

More links

master
David Larlet 3 år sedan
förälder
5c040a7478
incheckning
f287ef5c5e
7 ändrade filer med 694 tillägg och 0 borttagningar
Delad Vy Visa Diff Statistik
  1. 216
    0
      cache/2021/83fa7f0f8105aa10ffc88555f5699f1c/index.html
  2. 49
    0
      cache/2021/83fa7f0f8105aa10ffc88555f5699f1c/index.md
  3. 189
    0
      cache/2021/92cd5096092b0f66b72ad6e4084c17e4/index.html
  4. 41
    0
      cache/2021/92cd5096092b0f66b72ad6e4084c17e4/index.md
  5. 180
    0
      cache/2021/e14051435f3a2513d136df430ae973b3/index.html
  6. 13
    0
      cache/2021/e14051435f3a2513d136df430ae973b3/index.md
  7. 6
    0
      cache/2021/index.html

+ 216
- 0
cache/2021/83fa7f0f8105aa10ffc88555f5699f1c/index.html Visa fil

@@ -0,0 +1,216 @@
<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang="fr">
<!-- Has to be within the first 1024 bytes, hence before the `title` element
See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset="utf-8">
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- Required to make a valid HTML5 document. -->
<title>Writing for distributed teams (archive) — David Larlet</title>
<meta name="description" content="Publication mise en cache pour en conserver une trace.">
<!-- That good ol' feed, subscribe :). -->
<link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
<link rel="manifest" href="/static/david/icons2/site.webmanifest">
<link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
<meta name="msapplication-TileColor" content="#f7f7f7">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<script>
function toggleTheme(themeName) {
document.documentElement.classList.toggle(
'forced-dark',
themeName === 'dark'
)
document.documentElement.classList.toggle(
'forced-light',
themeName === 'light'
)
}
const selectedTheme = localStorage.getItem('theme')
if (selectedTheme !== 'undefined') {
toggleTheme(selectedTheme)
}
</script>

<meta name="robots" content="noindex, nofollow">
<meta content="origin-when-cross-origin" name="referrer">
<!-- Canonical URL for SEO purposes -->
<link rel="canonical" href="https://veekaybee.github.io/2021/07/17/p2s/">

<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">


<article>
<header>
<h1>Writing for distributed teams</h1>
</header>
<nav>
<p class="center">
<a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
</svg> Accueil</a> •
<a href="https://veekaybee.github.io/2021/07/17/p2s/" title="Lien vers le contenu original">Source originale</a>
</p>
</nav>
<hr>
<p>This week was my first anniversary since I started at Automattic in the spring of 2020, and I was going through my work artifacts to reflect on what I’ve done so far this year. One thing that completely surprised me was that it turns out that I only sent 11 emails this entire year.</p>

<p>How is it possible? The answer is P2s.</p>

<p>For those not familiar with <a href="https://automattic.com/">Automattic</a>, the company behind WordPress.com and <a href="https://photomatt.tumblr.com/post/186964618222/automattic-tumblr">Tumblr</a>, which I now work on as a machine learning engineer, one of the big MOs of the company is that <a href="https://automattic.com/creed/">we communicate as much as possible in durable written format</a> since we’re distributed.</p>

<p>How does no email square with complete distributed communication? The answer is <a href="https://automattic.com/creed/">P2</a>. P2 is the name of a WordPress theme <a href="https://ma.tt/2009/05/how-p2-changed-automattic/">that every team at Automattic</a> uses internally for documentation. Essentially, we have (probably) hundreds of P2s, for current teams, for teams that used to exist, for special interest groups, and events.</p>

<p>When you “P2” something, you’re writing a blog post, where you can tag in coworkers and cross-post to other P2s. What do teams use P2s for? <a href="https://p2guides.wordpress.com/best-practices/writing-useful-posts/">Absolutely everything</a>. Checklists for onboarding, status reports on projects, thoughts about detailing projects, discussions about best coding practices, architectural diagrams, marketing data analyses, and more. The best part is that the entire company’s history of P2s is available to search through. Also, you can subscribe to literally any P2, and comment on it as necessary, starting with your own team’s.</p>

<p>Why P2s? Because they capture fleeting one-off written communication: you can read a P2 at your own speed, in your own timezone, which is key since we operate across all timezones.</p>

<p>Here’s Matt <a href="https://distributed.blog/2020/06/18/distributed-faq-p2-automattic/">with more on it:</a></p>

<blockquote>
<p>P2 is the evolution of the blog for the purpose of working within and across teams. It’s organized much like a Yammer or Facebook stream, but on the back end it still operates like a blog, allowing for archiving, advanced search, and rich media embeds.</p>
</blockquote>

<p>Here’s a great post on the company MO and <a href="https://nomad.blog/2020/12/08/you-might-not-love-working-at-automattic-if/">more detail</a>:</p>

<blockquote>
<p>Most of our company communication is done on what we call “p2s”. You can actually create your own here. Think of them as free flowing, chronological sites where people can share updates, tag others for feedback, cross post to other p2s, and more. I’m on the more talkative and connected side of things which is reflected in the stats you see below (almost at the 1.5 million word mark!):</p>
</blockquote>

<blockquote>
<p>Conversations on P2s take place in line, update in real time, and provide space for threaded replies. We’ve stuck with P2 for years now, and it has ultimately evolved into a rich source of institutional wisdom and collective company memory.</p>
</blockquote>

<p>If you want to know what the team worked on last week, it’s in a P2. If you want to look for the results of a meeting from last year, you can do a keyword search.</p>

<p>A saying around the company is that you should “P2 something or it didn’t happen”, aka it doesn’t get surfaced to a place where everyone can read about it, lost languishing in an email thread.</p>

<h1>What works for me about P2s</h1>

<p>This is a completely different paradigm than I’ve ever worked in, which has been a world usually riddled with information lost to Slack, Confluence, and dozens of email re:re:res.</p>

<p>It’s true that I still spend an enormous amount of time in Slack, but the company’s focus on P2 as THE place where institutional memory lives, and where other people can interact with your work, means that there is an internal incentive to get stuff out of Slack and into P2s, where they can live forever and be collected with other P2s to form a cohesive view of how a team, project, or division operates over time. In this way, the company also owns its own institutional knoweldge instead of having it locked away in third-party tools.</p>

<p>The nature of reading P2s means even if you only write one or two P2s a month, you can send them around in meetings or Slack conversations as solid anchors and points of reference. (Another note is that we definitely do still have meetings, and I spend a good deal of my day in Slack, but I don’t come away from these times feeling like the information is lost, because I’m always building towards a P2 on whatever was discussed in either format.)</p>

<p>I’m super biased on this, but as someone who spends a lot of time processing things in writing, and who enjoys writing, I love P2s. I love that they make me clearly state what was jumbled in my head, I love that I now have a concrete trail, with links, of things that I’ve worked on. I love that I essentially am encouraged to blog internally, about things that I’ve worked on, my thoughts on projects, my progress, and ideas I have, and that I can do it mostly at a pace that works for my own work schedule.</p>

<p>Of course, as with any technology, P2s come with their own tradeoffs: <a href="https://automattic.design/2020/09/29/how-not-to-start-a-job-at-automattic/">it can be easy to get lost</a> reading through hundreds of P2 posts every day and responding unless you have a very good P2 strategy and focus on the ones relevant to you. It can be hard to synthesize a lot of technical information into a post that’s relevant enough to both engineers and business people and offer enough context and value to continue the conversation. It can be hard to go back far enough to find all of the historical context you need for your own P2s.</p>

<p>But, in spite of these issues, I really love the P2 as a medium for institutional knowledge and will definitely take the idea of P2s wherever I am in my career from now on.</p>
</article>


<hr>

<footer>
<p>
<a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
</svg> Accueil</a> •
<a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
</svg> Suivre</a> •
<a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
</svg> Pro</a> •
<a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
</svg> Email</a> •
<abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
</svg> Légal</abbr>
</p>
<template id="theme-selector">
<form>
<fieldset>
<legend><svg class="icon icon-brightness-contrast">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
</svg> Thème</legend>
<label>
<input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
</label>
<label>
<input type="radio" value="dark" name="chosen-color-scheme"> Foncé
</label>
<label>
<input type="radio" value="light" name="chosen-color-scheme"> Clair
</label>
</fieldset>
</form>
</template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
<script>
function loadThemeForm(templateName) {
const themeSelectorTemplate = document.querySelector(templateName)
const form = themeSelectorTemplate.content.firstElementChild
themeSelectorTemplate.replaceWith(form)

form.addEventListener('change', (e) => {
const chosenColorScheme = e.target.value
localStorage.setItem('theme', chosenColorScheme)
toggleTheme(chosenColorScheme)
})

const selectedTheme = localStorage.getItem('theme')
if (selectedTheme && selectedTheme !== 'undefined') {
form.querySelector(`[value="${selectedTheme}"]`).checked = true
}
}

const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
window.addEventListener('load', () => {
let hasDarkRules = false
for (const styleSheet of Array.from(document.styleSheets)) {
let mediaRules = []
for (const cssRule of styleSheet.cssRules) {
if (cssRule.type !== CSSRule.MEDIA_RULE) {
continue
}
// WARNING: Safari does not have/supports `conditionText`.
if (cssRule.conditionText) {
if (cssRule.conditionText !== prefersColorSchemeDark) {
continue
}
} else {
if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
continue
}
}
mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
}

// WARNING: do not try to insert a Rule to a styleSheet you are
// currently iterating on, otherwise the browser will be stuck
// in a infinite loop…
for (const mediaRule of mediaRules) {
styleSheet.insertRule(mediaRule.cssText)
hasDarkRules = true
}
}
if (hasDarkRules) {
loadThemeForm('#theme-selector')
}
})
</script>
</body>
</html>

+ 49
- 0
cache/2021/83fa7f0f8105aa10ffc88555f5699f1c/index.md Visa fil

@@ -0,0 +1,49 @@
title: Writing for distributed teams
url: https://veekaybee.github.io/2021/07/17/p2s/
hash_url: 83fa7f0f8105aa10ffc88555f5699f1c

<p>This week was my first anniversary since I started at Automattic in the spring of 2020, and I was going through my work artifacts to reflect on what I’ve done so far this year. One thing that completely surprised me was that it turns out that I only sent 11 emails this entire year.</p>

<p>How is it possible? The answer is P2s.</p>

<p>For those not familiar with <a href="https://automattic.com/">Automattic</a>, the company behind WordPress.com and <a href="https://photomatt.tumblr.com/post/186964618222/automattic-tumblr">Tumblr</a>, which I now work on as a machine learning engineer, one of the big MOs of the company is that <a href="https://automattic.com/creed/">we communicate as much as possible in durable written format</a> since we’re distributed.</p>

<p>How does no email square with complete distributed communication? The answer is <a href="https://automattic.com/creed/">P2</a>. P2 is the name of a WordPress theme <a href="https://ma.tt/2009/05/how-p2-changed-automattic/">that every team at Automattic</a> uses internally for documentation. Essentially, we have (probably) hundreds of P2s, for current teams, for teams that used to exist, for special interest groups, and events.</p>

<p>When you “P2” something, you’re writing a blog post, where you can tag in coworkers and cross-post to other P2s. What do teams use P2s for? <a href="https://p2guides.wordpress.com/best-practices/writing-useful-posts/">Absolutely everything</a>. Checklists for onboarding, status reports on projects, thoughts about detailing projects, discussions about best coding practices, architectural diagrams, marketing data analyses, and more. The best part is that the entire company’s history of P2s is available to search through. Also, you can subscribe to literally any P2, and comment on it as necessary, starting with your own team’s.</p>

<p>Why P2s? Because they capture fleeting one-off written communication: you can read a P2 at your own speed, in your own timezone, which is key since we operate across all timezones.</p>

<p>Here’s Matt <a href="https://distributed.blog/2020/06/18/distributed-faq-p2-automattic/">with more on it:</a></p>

<blockquote>
<p>P2 is the evolution of the blog for the purpose of working within and across teams. It’s organized much like a Yammer or Facebook stream, but on the back end it still operates like a blog, allowing for archiving, advanced search, and rich media embeds.</p>
</blockquote>

<p>Here’s a great post on the company MO and <a href="https://nomad.blog/2020/12/08/you-might-not-love-working-at-automattic-if/">more detail</a>:</p>

<blockquote>
<p>Most of our company communication is done on what we call “p2s”. You can actually create your own here. Think of them as free flowing, chronological sites where people can share updates, tag others for feedback, cross post to other p2s, and more. I’m on the more talkative and connected side of things which is reflected in the stats you see below (almost at the 1.5 million word mark!):</p>
</blockquote>

<blockquote>
<p>Conversations on P2s take place in line, update in real time, and provide space for threaded replies. We’ve stuck with P2 for years now, and it has ultimately evolved into a rich source of institutional wisdom and collective company memory.</p>
</blockquote>

<p>If you want to know what the team worked on last week, it’s in a P2. If you want to look for the results of a meeting from last year, you can do a keyword search.</p>

<p>A saying around the company is that you should “P2 something or it didn’t happen”, aka it doesn’t get surfaced to a place where everyone can read about it, lost languishing in an email thread.</p>

<h1>What works for me about P2s</h1>

<p>This is a completely different paradigm than I’ve ever worked in, which has been a world usually riddled with information lost to Slack, Confluence, and dozens of email re:re:res.</p>

<p>It’s true that I still spend an enormous amount of time in Slack, but the company’s focus on P2 as THE place where institutional memory lives, and where other people can interact with your work, means that there is an internal incentive to get stuff out of Slack and into P2s, where they can live forever and be collected with other P2s to form a cohesive view of how a team, project, or division operates over time. In this way, the company also owns its own institutional knoweldge instead of having it locked away in third-party tools.</p>

<p>The nature of reading P2s means even if you only write one or two P2s a month, you can send them around in meetings or Slack conversations as solid anchors and points of reference. (Another note is that we definitely do still have meetings, and I spend a good deal of my day in Slack, but I don’t come away from these times feeling like the information is lost, because I’m always building towards a P2 on whatever was discussed in either format.)</p>

<p>I’m super biased on this, but as someone who spends a lot of time processing things in writing, and who enjoys writing, I love P2s. I love that they make me clearly state what was jumbled in my head, I love that I now have a concrete trail, with links, of things that I’ve worked on. I love that I essentially am encouraged to blog internally, about things that I’ve worked on, my thoughts on projects, my progress, and ideas I have, and that I can do it mostly at a pace that works for my own work schedule.</p>

<p>Of course, as with any technology, P2s come with their own tradeoffs: <a href="https://automattic.design/2020/09/29/how-not-to-start-a-job-at-automattic/">it can be easy to get lost</a> reading through hundreds of P2 posts every day and responding unless you have a very good P2 strategy and focus on the ones relevant to you. It can be hard to synthesize a lot of technical information into a post that’s relevant enough to both engineers and business people and offer enough context and value to continue the conversation. It can be hard to go back far enough to find all of the historical context you need for your own P2s.</p>

<p>But, in spite of these issues, I really love the P2 as a medium for institutional knowledge and will definitely take the idea of P2s wherever I am in my career from now on.</p>

+ 189
- 0
cache/2021/92cd5096092b0f66b72ad6e4084c17e4/index.html Visa fil

@@ -0,0 +1,189 @@
<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang="fr">
<!-- Has to be within the first 1024 bytes, hence before the `title` element
See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset="utf-8">
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- Required to make a valid HTML5 document. -->
<title>Distributed FAQ: How Did P2 Become Automattic’s Signature Mode of Communication? (archive) — David Larlet</title>
<meta name="description" content="Publication mise en cache pour en conserver une trace.">
<!-- That good ol' feed, subscribe :). -->
<link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
<link rel="manifest" href="/static/david/icons2/site.webmanifest">
<link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
<meta name="msapplication-TileColor" content="#f7f7f7">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<script>
function toggleTheme(themeName) {
document.documentElement.classList.toggle(
'forced-dark',
themeName === 'dark'
)
document.documentElement.classList.toggle(
'forced-light',
themeName === 'light'
)
}
const selectedTheme = localStorage.getItem('theme')
if (selectedTheme !== 'undefined') {
toggleTheme(selectedTheme)
}
</script>

<meta name="robots" content="noindex, nofollow">
<meta content="origin-when-cross-origin" name="referrer">
<!-- Canonical URL for SEO purposes -->
<link rel="canonical" href="https://distributed.blog/2020/06/18/distributed-faq-p2-automattic/">

<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">


<article>
<header>
<h1>Distributed FAQ: How Did P2 Become Automattic’s Signature Mode of Communication?</h1>
</header>
<nav>
<p class="center">
<a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
</svg> Accueil</a> •
<a href="https://distributed.blog/2020/06/18/distributed-faq-p2-automattic/" title="Lien vers le contenu original">Source originale</a>
</p>
</nav>
<hr>
<p><em>In <strong>Distributed FAQ</strong>, Matt Mullenweg addresses some of the most common issues companies, executives, and individuals face as they consider transitioning to a distributed model.</em></p>

<hr class="wp-block-separator">

<p><strong>Q. Automattic is known for using internal blogs called <a href="https://wordpress.com/p2/">P2s</a> for most work-related conversations. How and why did that happen?</strong></p>

<p>A. In Automattic’s early days, we collaborated a lot directly in the code, or on IRC (Internet Relay Chat), a Slack precursor. We quickly realized that it wasn’t great for asynchronous discussions, and when we tried email instead, it didn’t allow for the transparency that is the hallmark of open source (it also brought a lot of noise with it). Finally, we ditched email and moved to an internal blogging system. <a href="https://wordpress.com/p2/">P2</a> is the evolution of the blog for the purpose of working within and across teams. It’s organized much like a Yammer or Facebook stream, but on the back end it still operates like a blog, allowing for archiving, advanced search, and rich media embeds.  </p>

<p><span id="more-3167"></span></p>
<p>Conversations on P2s take place in line, update in real time, and provide space for threaded replies. We’ve stuck with P2 for years now, and it has ultimately evolved into a rich source of institutional wisdom and collective company memory.</p>

<p>I would encourage anyone working in a distributed setting to <a href="https://wordpress.com/p2/">spin up a P2</a> by starting a blog at WordPress.com, which you can then use as your company’s internal blogging system.  </p>

<p>At its core, P2 is organized, searchable knowledge. For example, we write up notes from every meeting, and tag attendees by name. I can search for any person’s name tag and pull up all conversation history related to the individual in question. It’s an invaluable resource.</p>

<hr class="wp-block-separator">

<p>To learn more about Automattic’s distinct culture, listen to “<a href="https://distributed.blog/2019/11/26/the-importance-of-irl-in-a-world-of-screens/">Inside the Grand Meetup</a>,” an episode featuring several Automatticians talking about their experiences at a fully distributed company.</p>
</article>


<hr>

<footer>
<p>
<a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
</svg> Accueil</a> •
<a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
</svg> Suivre</a> •
<a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
</svg> Pro</a> •
<a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
</svg> Email</a> •
<abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
</svg> Légal</abbr>
</p>
<template id="theme-selector">
<form>
<fieldset>
<legend><svg class="icon icon-brightness-contrast">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
</svg> Thème</legend>
<label>
<input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
</label>
<label>
<input type="radio" value="dark" name="chosen-color-scheme"> Foncé
</label>
<label>
<input type="radio" value="light" name="chosen-color-scheme"> Clair
</label>
</fieldset>
</form>
</template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
<script>
function loadThemeForm(templateName) {
const themeSelectorTemplate = document.querySelector(templateName)
const form = themeSelectorTemplate.content.firstElementChild
themeSelectorTemplate.replaceWith(form)

form.addEventListener('change', (e) => {
const chosenColorScheme = e.target.value
localStorage.setItem('theme', chosenColorScheme)
toggleTheme(chosenColorScheme)
})

const selectedTheme = localStorage.getItem('theme')
if (selectedTheme && selectedTheme !== 'undefined') {
form.querySelector(`[value="${selectedTheme}"]`).checked = true
}
}

const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
window.addEventListener('load', () => {
let hasDarkRules = false
for (const styleSheet of Array.from(document.styleSheets)) {
let mediaRules = []
for (const cssRule of styleSheet.cssRules) {
if (cssRule.type !== CSSRule.MEDIA_RULE) {
continue
}
// WARNING: Safari does not have/supports `conditionText`.
if (cssRule.conditionText) {
if (cssRule.conditionText !== prefersColorSchemeDark) {
continue
}
} else {
if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
continue
}
}
mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
}

// WARNING: do not try to insert a Rule to a styleSheet you are
// currently iterating on, otherwise the browser will be stuck
// in a infinite loop…
for (const mediaRule of mediaRules) {
styleSheet.insertRule(mediaRule.cssText)
hasDarkRules = true
}
}
if (hasDarkRules) {
loadThemeForm('#theme-selector')
}
})
</script>
</body>
</html>

+ 41
- 0
cache/2021/92cd5096092b0f66b72ad6e4084c17e4/index.md Visa fil

@@ -0,0 +1,41 @@
title: Distributed FAQ: How Did P2 Become Automattic’s Signature Mode of Communication?
url: https://distributed.blog/2020/06/18/distributed-faq-p2-automattic/
hash_url: 92cd5096092b0f66b72ad6e4084c17e4

<p><em>In <strong>Distributed FAQ</strong>, Matt Mullenweg addresses some of the most common issues companies, executives, and individuals face as they consider transitioning to a distributed model.</em></p>



<hr class="wp-block-separator">



<p><strong>Q. Automattic is known for using internal blogs called <a href="https://wordpress.com/p2/">P2s</a> for most work-related conversations. How and why did that happen?</strong></p>



<p>A. In Automattic’s early days, we collaborated a lot directly in the code, or on IRC (Internet Relay Chat), a Slack precursor. We quickly realized that it wasn’t great for asynchronous discussions, and when we tried email instead, it didn’t allow for the transparency that is the hallmark of open source (it also brought a lot of noise with it). Finally, we ditched email and moved to an internal blogging system. <a href="https://wordpress.com/p2/">P2</a> is the evolution of the blog for the purpose of working within and across teams. It’s organized much like a Yammer or Facebook stream, but on the back end it still operates like a blog, allowing for archiving, advanced search, and rich media embeds.  </p>



<span id="more-3167"></span>



<p>Conversations on P2s take place in line, update in real time, and provide space for threaded replies. We’ve stuck with P2 for years now, and it has ultimately evolved into a rich source of institutional wisdom and collective company memory.</p>



<p>I would encourage anyone working in a distributed setting to <a href="https://wordpress.com/p2/">spin up a P2</a> by starting a blog at WordPress.com, which you can then use as your company’s internal blogging system.  </p>



<p>At its core, P2 is organized, searchable knowledge. For example, we write up notes from every meeting, and tag attendees by name. I can search for any person’s name tag and pull up all conversation history related to the individual in question. It’s an invaluable resource.</p>



<hr class="wp-block-separator">



<p>To learn more about Automattic’s distinct culture, listen to “<a href="https://distributed.blog/2019/11/26/the-importance-of-irl-in-a-world-of-screens/">Inside the Grand Meetup</a>,” an episode featuring several Automatticians talking about their experiences at a fully distributed company.</p>

+ 180
- 0
cache/2021/e14051435f3a2513d136df430ae973b3/index.html Visa fil

@@ -0,0 +1,180 @@
<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang="fr">
<!-- Has to be within the first 1024 bytes, hence before the `title` element
See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset="utf-8">
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- Required to make a valid HTML5 document. -->
<title>How P2 Changed Automattic (archive) — David Larlet</title>
<meta name="description" content="Publication mise en cache pour en conserver une trace.">
<!-- That good ol' feed, subscribe :). -->
<link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
<link rel="manifest" href="/static/david/icons2/site.webmanifest">
<link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
<meta name="msapplication-TileColor" content="#f7f7f7">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<script>
function toggleTheme(themeName) {
document.documentElement.classList.toggle(
'forced-dark',
themeName === 'dark'
)
document.documentElement.classList.toggle(
'forced-light',
themeName === 'light'
)
}
const selectedTheme = localStorage.getItem('theme')
if (selectedTheme !== 'undefined') {
toggleTheme(selectedTheme)
}
</script>

<meta name="robots" content="noindex, nofollow">
<meta content="origin-when-cross-origin" name="referrer">
<!-- Canonical URL for SEO purposes -->
<link rel="canonical" href="https://ma.tt/2009/05/how-p2-changed-automattic/">

<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">


<article>
<header>
<h1>How P2 Changed Automattic</h1>
</header>
<nav>
<p class="center">
<a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
</svg> Accueil</a> •
<a href="https://ma.tt/2009/05/how-p2-changed-automattic/" title="Lien vers le contenu original">Source originale</a>
</p>
</nav>
<hr>
<p>If you haven’t heard of P2 yet, check out this quick video:</p>
<p><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="src" value="https://v.wordpress.com/YYNW9iSj"><param name="allowfullscreen" value="true">https://videopress.com/v/YYNW9iSj</object></p>
<p>Almost everyone at <a href="http://automattic.com/">Automattic</a> is a blogger, but for the first couple of years of the company we didn’t blog much internally. Everything happened over IRC, Skype, and email. (In that order.) Eventually we started a blog that worked like a traditional blog did with long posts and comments, but everyone forgot to visit it until I wrote a quick script on cron job that would email everybody summaries of new posts and comments.</p>
<p>There was a disconnect we couldn’t reconcile: even though our internal blogs didn’t work out most of the company was active on <a href="http://twitter.com/">Twitter</a> every day. (WordPress users are some of the most passionate adopters of micro-blogging.)</p>
<p>We found a solution in <a href="http://en.blog.wordpress.com/2008/01/28/introducing-prologue/">Prologue</a> which added a posting box to the home page and gave it a Twitter-like feel. Now Automattic had a pulse, a place where the incredible amount of activity was chronicled and captured. It was low-friction and hassle-free, we all started using it more.</p>
<p>But there was still a problem, Prologue was great for status updates but terribly awkward for conversation. P2 solves all this by <strong>moving the conversation inline on the homepage</strong>. Conversations can be fully threaded using 2.7’s new comment features. Finally the blog started to get so busy we made it real time so you can just leave the page open and new stuff will come in. (It’s hard to describe, so watch the video above.) Seemingly simple changes have increased engagement many-fold: our main P2 now has over 4,700 posts in it with 1,100 of those in the past 60 days.</p>
<p>It completely transformed how Automattic works internally and I think is one of the most valuable things we’ve adopted in the past year. I’m on the road a lot, and sometimes my only connection is checking the mobile-optimized P2 on my iPhone.</p>
<p>I’m excited about P2 partly because blogs provide an incredibly robust infrastructure on which to build more advanced apps and this is a good example of that. I’d love to see more themes that transform what WordPress can do top-to-bottom.</p>
<p><a href="http://wordpress.org/extend/themes/p2">You can get P2 for your WordPress.org blog here</a>, and it’s available for all of WordPress.com too.</p>
</article>


<hr>

<footer>
<p>
<a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
</svg> Accueil</a> •
<a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
</svg> Suivre</a> •
<a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
</svg> Pro</a> •
<a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
</svg> Email</a> •
<abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
</svg> Légal</abbr>
</p>
<template id="theme-selector">
<form>
<fieldset>
<legend><svg class="icon icon-brightness-contrast">
<use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
</svg> Thème</legend>
<label>
<input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
</label>
<label>
<input type="radio" value="dark" name="chosen-color-scheme"> Foncé
</label>
<label>
<input type="radio" value="light" name="chosen-color-scheme"> Clair
</label>
</fieldset>
</form>
</template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
<script>
function loadThemeForm(templateName) {
const themeSelectorTemplate = document.querySelector(templateName)
const form = themeSelectorTemplate.content.firstElementChild
themeSelectorTemplate.replaceWith(form)

form.addEventListener('change', (e) => {
const chosenColorScheme = e.target.value
localStorage.setItem('theme', chosenColorScheme)
toggleTheme(chosenColorScheme)
})

const selectedTheme = localStorage.getItem('theme')
if (selectedTheme && selectedTheme !== 'undefined') {
form.querySelector(`[value="${selectedTheme}"]`).checked = true
}
}

const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
window.addEventListener('load', () => {
let hasDarkRules = false
for (const styleSheet of Array.from(document.styleSheets)) {
let mediaRules = []
for (const cssRule of styleSheet.cssRules) {
if (cssRule.type !== CSSRule.MEDIA_RULE) {
continue
}
// WARNING: Safari does not have/supports `conditionText`.
if (cssRule.conditionText) {
if (cssRule.conditionText !== prefersColorSchemeDark) {
continue
}
} else {
if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
continue
}
}
mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
}

// WARNING: do not try to insert a Rule to a styleSheet you are
// currently iterating on, otherwise the browser will be stuck
// in a infinite loop…
for (const mediaRule of mediaRules) {
styleSheet.insertRule(mediaRule.cssText)
hasDarkRules = true
}
}
if (hasDarkRules) {
loadThemeForm('#theme-selector')
}
})
</script>
</body>
</html>

+ 13
- 0
cache/2021/e14051435f3a2513d136df430ae973b3/index.md Visa fil

@@ -0,0 +1,13 @@
title: How P2 Changed Automattic
url: https://ma.tt/2009/05/how-p2-changed-automattic/
hash_url: e14051435f3a2513d136df430ae973b3

<p>If you haven’t heard of P2 yet, check out this quick video:</p>
<p><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="src" value="https://v.wordpress.com/YYNW9iSj"><param name="allowfullscreen" value="true">https://videopress.com/v/YYNW9iSj</object></p>
<p>Almost everyone at <a href="http://automattic.com/">Automattic</a> is a blogger, but for the first couple of years of the company we didn’t blog much internally. Everything happened over IRC, Skype, and email. (In that order.) Eventually we started a blog that worked like a traditional blog did with long posts and comments, but everyone forgot to visit it until I wrote a quick script on cron job that would email everybody summaries of new posts and comments.</p>
<p>There was a disconnect we couldn’t reconcile: even though our internal blogs didn’t work out most of the company was active on <a href="http://twitter.com/">Twitter</a> every day. (WordPress users are some of the most passionate adopters of micro-blogging.)</p>
<p>We found a solution in <a href="http://en.blog.wordpress.com/2008/01/28/introducing-prologue/">Prologue</a> which added a posting box to the home page and gave it a Twitter-like feel. Now Automattic had a pulse, a place where the incredible amount of activity was chronicled and captured. It was low-friction and hassle-free, we all started using it more.</p>
<p>But there was still a problem, Prologue was great for status updates but terribly awkward for conversation. P2 solves all this by <strong>moving the conversation inline on the homepage</strong>. Conversations can be fully threaded using 2.7’s new comment features. Finally the blog started to get so busy we made it real time so you can just leave the page open and new stuff will come in. (It’s hard to describe, so watch the video above.) Seemingly simple changes have increased engagement many-fold: our main P2 now has over 4,700 posts in it with 1,100 of those in the past 60 days.</p>
<p>It completely transformed how Automattic works internally and I think is one of the most valuable things we’ve adopted in the past year. I’m on the road a lot, and sometimes my only connection is checking the mobile-optimized P2 on my iPhone.</p>
<p>I’m excited about P2 partly because blogs provide an incredibly robust infrastructure on which to build more advanced apps and this is a good example of that. I’d love to see more themes that transform what WordPress can do top-to-bottom.</p>
<p><a href="http://wordpress.org/extend/themes/p2">You can get P2 for your WordPress.org blog here</a>, and it’s available for all of WordPress.com too.</p>

+ 6
- 0
cache/2021/index.html Visa fil

@@ -151,6 +151,8 @@
<li><a href="/david/cache/2021/e2bbd325581e7ec27b5c8e92ca32ce69/" title="Accès à l’article dans le cache local : Covid 'Long-Haulers' Need Medical Attention, Experts Urge">Covid 'Long-Haulers' Need Medical Attention, Experts Urge</a> (<a href="https://www.nytimes.com/2020/12/04/health/covid-long-term-symptoms.html" title="Accès à l’article original distant : Covid 'Long-Haulers' Need Medical Attention, Experts Urge">original</a>)</li>
<li><a href="/david/cache/2021/83fa7f0f8105aa10ffc88555f5699f1c/" title="Accès à l’article dans le cache local : Writing for distributed teams">Writing for distributed teams</a> (<a href="https://veekaybee.github.io/2021/07/17/p2s/" title="Accès à l’article original distant : Writing for distributed teams">original</a>)</li>
<li><a href="/david/cache/2021/cfe6353c663f062eb2e6ccfcace889ef/" title="Accès à l’article dans le cache local : Why Senior Engineers Hate Coding Interviews">Why Senior Engineers Hate Coding Interviews</a> (<a href="https://medium.com/swlh/why-senior-engineers-hate-coding-interviews-d583d2855757" title="Accès à l’article original distant : Why Senior Engineers Hate Coding Interviews">original</a>)</li>
<li><a href="/david/cache/2021/5f4b0220be54d83f711a78b356c73a68/" title="Accès à l’article dans le cache local : Carnets Web de La Grange">Carnets Web de La Grange</a> (<a href="https://www.la-grange.net/2021/01/05/newsletter" title="Accès à l’article original distant : Carnets Web de La Grange">original</a>)</li>
@@ -595,8 +597,12 @@
<li><a href="/david/cache/2021/520ea4867de8d36f3cd2b1132e44b719/" title="Accès à l’article dans le cache local : Letters to a Young Technologist">Letters to a Young Technologist</a> (<a href="https://letterstoayoungtechnologist.com/Study-the-Past-Create-the-Future" title="Accès à l’article original distant : Letters to a Young Technologist">original</a>)</li>
<li><a href="/david/cache/2021/e14051435f3a2513d136df430ae973b3/" title="Accès à l’article dans le cache local : How P2 Changed Automattic">How P2 Changed Automattic</a> (<a href="https://ma.tt/2009/05/how-p2-changed-automattic/" title="Accès à l’article original distant : How P2 Changed Automattic">original</a>)</li>
<li><a href="/david/cache/2021/5b0b6d7f4a461cef5acc3d9202cf7584/" title="Accès à l’article dans le cache local : Le Covid et « la grande démission »">Le Covid et « la grande démission »</a> (<a href="https://lundi.am/Le-Covid-et-la-grande-demission" title="Accès à l’article original distant : Le Covid et « la grande démission »">original</a>)</li>
<li><a href="/david/cache/2021/92cd5096092b0f66b72ad6e4084c17e4/" title="Accès à l’article dans le cache local : Distributed FAQ: How Did P2 Become Automattic’s Signature Mode of Communication?">Distributed FAQ: How Did P2 Become Automattic’s Signature Mode of Communication?</a> (<a href="https://distributed.blog/2020/06/18/distributed-faq-p2-automattic/" title="Accès à l’article original distant : Distributed FAQ: How Did P2 Become Automattic’s Signature Mode of Communication?">original</a>)</li>
<li><a href="/david/cache/2021/44064d714aff0deac9f882cc429d8b9d/" title="Accès à l’article dans le cache local : Some rambling thoughts about the stuttering end of the last ice age and what lockdown means">Some rambling thoughts about the stuttering end of the last ice age and what lockdown means</a> (<a href="http://interconnected.org/home/2020/04/20/continuous_partial_lockdown" title="Accès à l’article original distant : Some rambling thoughts about the stuttering end of the last ice age and what lockdown means">original</a>)</li>
<li><a href="/david/cache/2021/d01188b1ac191fa62edec50c8a2da1e4/" title="Accès à l’article dans le cache local : 👌 [ok-hand]">👌 [ok-hand]</a> (<a href="https://selfdefined.netlify.app/definitions/ok-hand/" title="Accès à l’article original distant : 👌 [ok-hand]">original</a>)</li>

Write Förhandsgranska
Laddar…
Avbryt
Spara