Différences entre versions de « Home »

De Mi caja de notas

(étude en cours)
 
 
(12 versions intermédiaires par le même utilisateur non affichées)
Ligne 4 : Ligne 4 :
 
<span style="float:right;height:128px;font-size:128px">🏠</span>
 
<span style="float:right;height:128px;font-size:128px">🏠</span>
  
−
Votre '''<dfn>page d'accueil</dfn>''' vous représente sur le web, généralement placée à la racine et en haut de votre domaine, elle affiche votre nom et une représentation [[iwc:icon]]ique souvent marquée avec une [[iwc:h-card]].
+
Votre '''<dfn>page d'accueil</dfn>''' vous représente sur le web, généralement placée à la racine et en haut de votre domaine, elle affiche votre nom et une représentation [[iwc:icon|icôn]]ique souvent marquée avec une [[iwc:h-card|h-card]].
  
−
== Pourqoi ==
+
== Pourquoi ==
−
Toutes les raisons du [[why|pourquoi]] et plus encore.
+
Toutes les raisons du [[iwc:why|pourquoi]] et plus encore.
  
−
Utilisez votre [[personal domain|domaine personnel]] pour posséder votre [[iwc:identity|identité]] sur le web.
+
Utilisez votre [[iwc:personal domain|domaine personnel]] pour posséder votre [[iwc:identity|identité]] sur le web.
  
−
En rendant votre page d'accueil plus utile, vous vous sentirez plus motivés pour partager votre URL plutôt qu'un simple nom d'utilisateur sur [[Twitter]] ou toute autre profil sur un [[silo]].
+
En rendant votre page d'accueil plus utile, vous vous sentirez plus motivés pour partager votre URL plutôt qu'un simple nom d'utilisateur sur [[iwc:Twitter|Twitter]] ou toute autre profil sur un [[iwc:silo|silo]].
  
 
__TOC__
 
__TOC__
 +
 
== Comment ==
 
== Comment ==
−
What should be on your indie web site home page?
+
Qu'est-ce qui devrait figurer sur la page d'accueil de votre site indie web ?
 
=== À Propos ===
 
=== À Propos ===
 
Votre page d'accueil devrait contenir certaines informations basiques vous concernant :  
 
Votre page d'accueil devrait contenir certaines informations basiques vous concernant :  
 
* nom
 
* nom
−
* [[iwc:icon|icône]] / [[profile photo|photo de profil]]
+
* [[iwc:icon|icône]] / [[iwc:profile photo|photo de profil]]
−
* [[communication]] links (aim: mailto: tel: etc. see [http://tantek.com/2013/338/b1/people-focused-mobile-communication-experience] for some UI brainstorming on this)
+
* les liens de [[iwc:communication|communication]] (aim: mailto: tel: etc. voir [http://tantek.com/2013/338/b1/people-focused-mobile-communication-experience] pour un premier brainstorming d'UI à ce sujet)
−
* other [[about]] / contact information, e.g.
+
* autre [[iwc:about|à propos]] / contact information, par ex.
−
** Links to [[silo]] profile URLs, approximate location, short bio, categories/tags
+
** Liens vers URLs de profils sur les [[silo-fr|silos]], emplacement approximatif , mini-bio, catégories/mots-clés
−
* marked up with [[h-card]] (see [[indiewebify]] to verify, validate)
+
* marqués avec [[iwc:h-card|h-card]] (voir [[iwc:indiewebify|indiewebify]] pour vérifier et valider)
−
* [[How_to_set_up_web_sign-in_on_your_own_domain|web-sign-in support]]
+
* [[iwc:How_to_set_up_web_sign-in_on_your_own_domain|support-connexion-web]]
−
** [[rel-me]] links to your other identities on the web
+
** Des liens [[iwc:rel-me|rel-me]] vers vos autres identités sur le web
  
−
Your home page is the URL you share with people, therefore it's useful to set it up with:
+
Votre page d'accueil est l'URL que vous partagez avec des personnes, par conséquent il est utilse de la régler avec :
−
* [[role]] - brief summary of what it is you do
+
* [[iwc:role|role]] - bref résumé de ce que vous êtes/faites
−
* [[discovery]] of what else you have on your site
+
* [[iwc:discovery|découverte]] de ce que vous avez d'autre sur votre site
−
* Your local time
+
* Votre heure locale
−
* Last seen (last checkin/location post)
+
* Vu la dernière fois (dernier checkin/post d'emplacement)
−
* upcoming events
+
* événements à venir
−
* projects
+
* projets en cours
−
* [[disclosure]] - disclosures of various types, e.g. cookies or analytics tracking
+
* [[iwc:disclosure|confidentialité]] - confidentialité de diffférents types, par ex. cookies ou tracker d'analytics
  
−
=== Stream ===
+
=== Flux ===
−
Next, it's quite popular to have:
+
Puis, il est populaire d'avoir :  
−
* [[stream]] of your most recent [[posts]] and other activities.
+
* un [[iwc:stream|flux]] de vos [[iwc:posts|posts]] les plus récents et autres activités.
−
See the Stream of Updates below for some inspiration.
+
Voir le Flux des Mises à Jour en dessous pour quelque inspiration.
  
−
=== Archive Navigation ===
+
=== Archive de Navigation ===
−
If you show a stream of recent posts on your home page, it may also be useful to show a small navigation interface for your archives.
+
Si vous voyez un flux de posts récents sur votre page personnelle, il peut être aussi utile d'afficher une petite interface de navigation pour vos archives.
  
−
More: [[archive navigation]].
+
Plus : [[iwc:archive navigation|archive navigation]].
  
−
=== Previously ===
+
=== Avant ===
−
Among early 2000s bloggers it was popular to also have on your home page:
+
Parmi les bloggers des années 2000 (les dinoblogueurs), il était populaire d'avoir aussi sur votre page personnelle :  
−
* [[blogroll]]
+
* une [[iwc:blogroll|blogroll]]
  
−
== IndieWeb Examples ==
+
== Exemples IndieWeb ==
−
=== Simple Homepages ===
+
=== Pages d'Accueil Simples ===
−
Some interesting indieweb home page examples of simple contact/about information (e.g. [[hCard]]), maps for location, live IM status etc. - probably worth expanding and document each of these:
+
Quelques exemples indieweb intéressants de page d'accueil avec une simple information de contact/à propos (par exemple,  [[iwc:hcard-fr|h-card]]), cartes ou emplacements, statut live IM, etc. - cela vaudrait probablement la peine de développer et documenter chacune d'elles :
−
* http://scottbullard.com/ - phone/email links with more: http://scottbullard.com/more.html
+
* http://scottbullard.com/ - liens vers téléphone/e-mail avec plus sur http://scottbullard.com/more.html
−
* http://www.jaredhanson.net/ - live IM status on Jared's hCard
+
* http://www.jaredhanson.net/ - statut de MI live sur la hCard de Jared
−
* http://npdoty.name/ - map as background centered on his current location
+
* http://npdoty.name/ - carte en arrière-plan centrée sur son emplacement actuel
−
* old adactio.com (pre-2012)  
+
* l'ancienne page de adactio.com (avant-2012)  
  
−
That and most recent blog post:
+
Ce blog et son post le plus récent :  
 
* http://ebdesign.se/
 
* http://ebdesign.se/
  
−
That and occasional blog posts:
+
Cela et les posts de blog occasionnels :  
 
* http://aralbalkan.com/
 
* http://aralbalkan.com/
  
−
The https://bear.im homepage for {{bear}} has a super simple [[hCard]] and then links to the [[hFeed]] and a more substantive About page
+
La page d'accueil de bear https://bear.im a une [[iwc:h-card|hCard]] super simple et fait un lien vers le [[iwc:h-feed|hFeed]] et une page "About" plus conséquente.
  
−
=== Stream of Updates ===
+
=== Flux de Mises à Jour ===
−
All that and most of the content they post online as a stream:
+
Tout cela et la plupart de contenu qu'ils posent en ligne sous forme de flux :  
  
−
Mixed/composite feed examples with complete posts:
+
Exemples composites de flux avec des posts complets :
 
* http://tantek.com/
 
* http://tantek.com/
−
* http://adactio.com/ (late 2012+)  
+
* http://adactio.com/ (fin 2012+)  
  
−
Streams of partial posts / summaries:
+
Flux de résumés de posts :  
−
* {{voxpelli}} http://voxpelli.com/ – stream of latest blog post titles
+
* {{voxpelli}} http://voxpelli.com/ – flux des derniers titres de blog  
  
−
Streams of only names/titles of posts:
+
Flux avec seulement les noms/titres des posts
 
* {{bear}} https://bear.im/bearlog
 
* {{bear}} https://bear.im/bearlog
  
−
Separate feeds:  
+
Flux séparés :  
 
* http://aaronparecki.com/
 
* http://aaronparecki.com/
−
* {{voxpelli}} http://voxpelli.com/ – links to separate feeds for bookmarks and social interactions
+
* {{voxpelli}} http://voxpelli.com/ – liens vers des flux séparés pour les signets et les interactions sociales
  
−
== Homepage Brainstorming ==
+
== Brainstorming Page Personnelle ==
 
Things which could go on homepages which aren’t currently implemented, or are underimplemented. Sometimes there is an intent to implement.
 
Things which could go on homepages which aren’t currently implemented, or are underimplemented. Sometimes there is an intent to implement.
  
Ligne 95 : Ligne 96 :
 
I might be adding links to /me (my profile page) and /about (about the site, license info, powered by, hosted at, etc.) to my homepage. --[[User:Sandeep.io|Sandeep Shetty]]
 
I might be adding links to /me (my profile page) and /about (about the site, license info, powered by, hosted at, etc.) to my homepage. --[[User:Sandeep.io|Sandeep Shetty]]
  
−
=== Signed-in Features ===
+
=== Fonctionnalités de Connexion  ===
−
When signed-in to your own site, it might be useful to have:
+
Une fois connecté sur votre propre site, il pourrait être utile d'avoir :  
−
* [[reader]] - integrated reader showing posts from others you follow
+
* un [[reader-fr|lecteur]] - lecteur intégré afffichant les posts des autres que vous suivez
−
** silo examples of such a logged in home page: [[Facebook]], [[Twitter]], [[Tumblr]] - logged in dashboard
+
** exemples à trouver dans les silos une fois connecté sur la page d'accueil : [[Facebook]], [[Twitter]], [[Tumblr]] - tableau de bord connecté
  
−
=== Sketches ===
+
=== Croquis ===
−
I did some homepage sketches/brainstorming [https://github.com/Taproot/design/blob/master/homepage-brainstorming.jpg here] --[[User:Waterpigs.co.uk|Waterpigs.co.uk]] 14:32, 18 June 2013 (PDT)
+
J'ai fait quelques croquis/brainstorming [https://github.com/Taproot/design/blob/master/homepage-brainstorming.jpg here] --[[User:Waterpigs.co.uk|Waterpigs.co.uk]] 14:32, 18 June 2013 (PDT)
  
−
=== Webmention to homepage ===
+
=== Webmention vers page personnelle ===
−
[[Webmention]]s sent directly to home pages could serve a number of use-cases:
+
Les [[iwc:webmentions|webmention]]s envoyées directement vers les pages personnelles pourrient servir un certain nombre de cas d'utilisation :  
−
* [[notification]] of a [[person-mention]] (like an indieweb @-mention) on a post somewhere else
+
* [[iwc:notification|notification]] de la [[iwc:person-mention|mention-personne]] (comme une @-mention indieweb) sur un post quelque part ailleurs
−
* [[invitation]] to an indie [[event]]
+
* [[iwc:invitation|invitation]] à un [[iwc:event|événement]] indie
−
* notification of a new private [[message]] received
+
* notification d'un nouveau [[iwc:message|message]] reçu
−
* allowing other people to tag you in photos or posts
+
* permettre à d'autres personnes de vous taguer dans les photos ou les pots
  
−
== Silo Examples ==
+
== Exemples de Silos ==
−
Silos don't technically give you access to their home page, but they do typically provide you with something resembling a home page, albeit typically at a path (not at the root), and they call it a profile. Though they really should be providing [[subdomain]]s instead of profile paths.
+
Les silos ne vous donnent pas accès techniquement à leurs pages d'accueil, mais ils fournissent généralement quelque chose ressemblant à une page d'accueil, les plus souvent un chemin (pas à la racine), et ils appellent ça un profil. Même s'ils devraient vraiment fournir des  [[subdomain|sous-domaine]]s au lieu de chemins de profil.
  
 
=== Twitter ===
 
=== Twitter ===
−
As an example, [[Twitter]] let's you customize your profile page with:
+
Par exemple, [[iwc:Twitter|Twitter]] vous permet de personnaliser votre page de profil avec :  
−
* [[icon]] - upload (min/max resolution/bytes?)
+
* [[iwc:icon|icône]] - téléversement (min/max resolution/bytes?)
−
* [[header image]] - upload (min/max resolution/bytes?)
+
* [[iwc:header image|image de bandeau d'en-tête]] - téléversement (min/max resolution/bytes ?)
−
* [[bio]] - 160 character text field, @ and # auto-linked.
+
* [[iwc:bio|bio]] - champ de texte de 160 caractères, @ et # auto-lié.
−
* [[website]] - auto-linked URL
+
* [[iwc:website|site web]] - URL auto-liée
−
* [[location]] - ??? character text field.
+
* [[iwc:location|emplacement]] - ??? character text field.
  
 
== Articles ==
 
== Articles ==
−
Articles and posts about homepage design and features:
+
Articles et posts concernant le design de page d'accueil et ses fonctionnalités :
  
 
* <span class="h-cite"><time class="dt-published">2013-12-04</time> <span class="p-author h-card">[http://tantek.com Tantek Çelik]</span>: <cite class="p-name">[http://tantek.com/2013/338/b1/people-focused-mobile-communication-experience  Toward A People Focused Mobile Communication Experience]</cite></span>
 
* <span class="h-cite"><time class="dt-published">2013-12-04</time> <span class="p-author h-card">[http://tantek.com Tantek Çelik]</span>: <cite class="p-name">[http://tantek.com/2013/338/b1/people-focused-mobile-communication-experience  Toward A People Focused Mobile Communication Experience]</cite></span>
Ligne 130 : Ligne 131 :
 
* [[2012/UK/Demos]] - specifically, General discussion / UX thoughts.
 
* [[2012/UK/Demos]] - specifically, General discussion / UX thoughts.
  
−
== See Also ==
+
== Voir aussi ==
−
* [[about]]
+
* [[iwc:about|à propos]]
−
* [[icon]]
+
* [[iwc:icon|icône]]
−
* [[payment]]
+
* [[iwc:payment|paiement]]
−
* [[webmention]]
+
* [[iwc:webmention|webmention]]

Version actuelle datée du 10 juin 2016 à 16:01

En chantier : Cette page a démarré sur iwc:home. Au stade de l'étude, la traduction sera déposée une fois terminée sur iwc:home-fr


🏠

Votre page d'accueil vous représente sur le web, généralement placée à la racine et en haut de votre domaine, elle affiche votre nom et une représentation icônique souvent marquée avec une h-card.

Pourquoi

Toutes les raisons du pourquoi et plus encore.

Utilisez votre domaine personnel pour posséder votre identité sur le web.

En rendant votre page d'accueil plus utile, vous vous sentirez plus motivés pour partager votre URL plutôt qu'un simple nom d'utilisateur sur Twitter ou toute autre profil sur un silo.

Comment

Qu'est-ce qui devrait figurer sur la page d'accueil de votre site indie web ?

À Propos

Votre page d'accueil devrait contenir certaines informations basiques vous concernant :

Votre page d'accueil est l'URL que vous partagez avec des personnes, par conséquent il est utilse de la régler avec :

  • role - bref résumé de ce que vous êtes/faites
  • découverte de ce que vous avez d'autre sur votre site
  • Votre heure locale
  • Vu la dernière fois (dernier checkin/post d'emplacement)
  • événements à venir
  • projets en cours
  • confidentialité - confidentialité de diffférents types, par ex. cookies ou tracker d'analytics

Flux

Puis, il est populaire d'avoir :

  • un flux de vos posts les plus récents et autres activités.

Voir le Flux des Mises à Jour en dessous pour quelque inspiration.

Archive de Navigation

Si vous voyez un flux de posts récents sur votre page personnelle, il peut être aussi utile d'afficher une petite interface de navigation pour vos archives.

Plus : archive navigation.

Avant

Parmi les bloggers des années 2000 (les dinoblogueurs), il était populaire d'avoir aussi sur votre page personnelle :

Exemples IndieWeb

Pages d'Accueil Simples

Quelques exemples indieweb intéressants de page d'accueil avec une simple information de contact/à propos (par exemple, h-card), cartes ou emplacements, statut live IM, etc. - cela vaudrait probablement la peine de développer et documenter chacune d'elles :

Ce blog et son post le plus récent :

Cela et les posts de blog occasionnels :

La page d'accueil de bear https://bear.im a une hCard super simple et fait un lien vers le hFeed et une page "About" plus conséquente.

Flux de Mises à Jour

Tout cela et la plupart de contenu qu'ils posent en ligne sous forme de flux :

Exemples composites de flux avec des posts complets :

Flux de résumés de posts :

Flux avec seulement les noms/titres des posts

Flux séparés :

Brainstorming Page Personnelle

Things which could go on homepages which aren’t currently implemented, or are underimplemented. Sometimes there is an intent to implement.

  • payment links/buttons
  • local weather/daylight (extra context)
  • people I’ve mentioned recently
  • tags I’ve used recently
  • actions like subscribe, contact, add to address book
  • latest comments

I might be adding links to /me (my profile page) and /about (about the site, license info, powered by, hosted at, etc.) to my homepage. --Sandeep Shetty

Fonctionnalités de Connexion

Une fois connecté sur votre propre site, il pourrait être utile d'avoir :

  • un lecteur - lecteur intégré afffichant les posts des autres que vous suivez
    • exemples à trouver dans les silos une fois connecté sur la page d'accueil : Facebook, Twitter, Tumblr - tableau de bord connecté

Croquis

J'ai fait quelques croquis/brainstorming here --Waterpigs.co.uk 14:32, 18 June 2013 (PDT)

Webmention vers page personnelle

Les webmentions envoyées directement vers les pages personnelles pourrient servir un certain nombre de cas d'utilisation :

Exemples de Silos

Les silos ne vous donnent pas accès techniquement à leurs pages d'accueil, mais ils fournissent généralement quelque chose ressemblant à une page d'accueil, les plus souvent un chemin (pas à la racine), et ils appellent ça un profil. Même s'ils devraient vraiment fournir des sous-domaines au lieu de chemins de profil.

Twitter

Par exemple, Twitter vous permet de personnaliser votre page de profil avec :

Articles

Articles et posts concernant le design de page d'accueil et ses fonctionnalités :

Related Sessions

Voir aussi

Récupérée de « https://ducamp.me/index.php?title=Home&oldid=1717 »