Skip to content

Latest commit

 

History

History
201 lines (145 loc) · 6.93 KB

STYLE_GUIDE.mdx

File metadata and controls

201 lines (145 loc) · 6.93 KB
Raw

Sei Docs style guide

This style guide contains general rules and principles to ensure the documentation is cohesive, useful and organized.

Principles

This documentation strives to be

Beginner Friendly

The Sei community welcomes members from all walks of life. As such, the documentation should be understandable by anyone, including those who are new to Web3 or non-technical.

The docs should strive to be Jargon Free

  • Advanced terms and concepts, especially Web3 related terms and ideas, should be properly explained.
  • Where appropriate, we should provide links to resources that can help the reader understand.
  • Acronyms should be spelled out

Simple

Great documentation is simple and to the point. It should aim to convey more meaning with less words.

  • To be clear and inclusive, avoid using jargon and obscure words where possible.
  • Limit the number of clauses in a sentence and make sure that your points are structured.
  • Avoid qualifying language, which is quite often completely uneccessary.
  • Information should be simply organized and easy to find.

Self-explanatory

Great documentation is self-explanatory. Documentation shouldn't need more documentation to explain itself.

  • Aim to provide as much context as possible. Code snippets and diagrams are great ways to illustrate complex concepts and provide examples.

Organization

The Sei Docs are structured using the Nextra. Are a guideline, we have split the pages by target audience.

General

Docs in these section describe Sei and topics that are applicable to all audiences. This is general information that is not specfic to users or developers. Information here is meant to be as layman as possible and should be understandable by everyone.

Information here might include:

  • What is Sei?
  • How does a blockchain work?
  • General information about how things work.

For Users

This section includes information specific to enabling people to interact with the Sei blockchain.

Examples include information about standard resources used to interact with the chain (Wallets, Block Explorers), as well as tutorials on how to get started on Sei (Where to find tokens, apps etc.)

For Devs

This section includes resources for developers looking to build Dapps on Sei. Examples of what goes in here include:

  • Smart contract tutorials
  • Endpoints and config information that developers should use to interact with Sei (RPC Endpoints, Chain IDs etc)
  • Information about clients and libraries that developers can use to easily develop apps.

Advanced

This section covers topics that are more specific to chain infrastructure. These are topics that are typically abstracted away from regular users and developers, but might be relevant to those looking to contribute chain infrastructure. Examples of topics here include:

  • How to run a Sei Node
  • How to run a Sei Validator

Misc

This section houses other pages that do not fall under the buckets above.

Style guidelines

Acronyms and Abbreviations

To maximize clarity, we should avoid Acronyms and Abbreviations where possible, especially for shorter, more ambiguous acronyms

  • Just use 'CosmWasm' instead of 'CW'

However, there are occasions where acronyms might be more easily understandable (Eg. NFT instead of Non-Fungible Token, RPC instead of Remote Procedure Call), or referred to very frequently.

In these cases, we should first use the use the spelled-out term followed by the shortened form in parentheses.

  • Command Line Interface (CLI)
  • Denomination (Denom)

On subsequent occurrences in the same topic, we can then use the acronym.

Links

You can add links to text using the followings syntax

[text_to_highlight](link)

Some examples (These examples assume the page is in the /pages directory):

  1. Link to section of same document.
[same document](#style-guidelines)
  1. Link to another document.
# Path is relative
[another document](/overview)
  1. Link to section of another document.
[section of another document](/overview#Staking)
  1. External Link.
[Link](www.app.sei.io)

Sentence ending punctuation should always be included outside the link.

Links should be as descriptive as possible to let the reader know where they are going.

  • Bad Example: Interested to learn more about staking? Click here to find out more

  • Better Example: Interested to learn more about staking? Refer to our staking guide to find out more!

Code

Code should either be specified as inline

Code should either be specified as `inline`

Or within code blocks.

const codeBlockString = "codeBlock"
    ```ts
    const codeBlockString = "codeBlock"
    ```

Inline Code should be used when referring to

  • File and directory names. (eg. ./pages/overview.mdx)
  • References to variables in code (eg. codeBlockString)

Code Blocks should be used when

  • Sharing code snippets
const codeBlockString = () => {
    const text = "codeblock"
    let codeBlockSize: Number = 1
}
  • Scripts that users should copy and execute directly
git clone https://github.com/sei-protocol/sei-chain
cd sei-chain
git checkout v4.1.4-evm-devnet
make install

When code blocks are used, they should always be prettified by specifying the language. For example:

    TypeScript code block labelled with 'ts'
    ```ts
    const variable = value;
    ```

    Bash command line code block labelled with 'sh'
    ```sh
    git clone https://github.com/sei-protocol/sei-chain
    cd sei-chain
    ```

When writing code blocks, avoid

  1. Creating large code blocks. Break your code into smaller, more digestible pieces.
  2. Writing too much documentation in between lines. If neccessary, break the code block up and add text to explain each code block instead.

For tutorials, the goal should be to write code blocks that can be directly copied and used by the reader.

Remember, code is used to elaborate or provide an example, make your point clearly first before using code to substantiate it!

Headings

Headings should be use to denote the start of each section. There are 4 levels of headings that correspond to different sizes (avoid using anything more than level 4 headings)

# Page Title
## Main Topic(s) on page
### Sub Topics
#### Use only if more required

Headings levels should never be skipped. A level 2 heading should follow a level 1 heading, and a level 3 heading should follow a level 2 heading etc.

Images

To use images, first add them to the ./public/assets folder.

Afterwards, they can be imported in each page using an import statement. For example:

import nameOfImage from "../../public/assets/nameOfImage.png";

Lastly, use the ImageWithCaption component to add the image to the page, along with a descriptive label:

<ImageWithCaption img={nameOfImage} alt="alt text for my image" caption="Your caption here" />