Code Monkey home page Code Monkey logo

markdown-styleguide's Introduction

Style Guidelines: Markdown

This document contains formatting standards for creating readable, consistent files using Markdown.

One problem I run into constantly when creating Markdown files is that I waste an ass-load of time fiddling with how the text looks before it gets parsed. Then, after I'm finished writing, I waste even more time adjusting what looks good in my text editor so that it looks good in a browser or Markdown viewer.

Being a masochist, I of course decided to create a guideline I could follow which would produce decent looking output without looking stupid in vim.

Basic conventions for Markdown files

  • Wrap all lines at 80 characters.
  • Denote bold text using the asterisk format: **bold text**.
  • Denote italic text using the underscore format: _emphasized text_.
  • Force a linebreak by ending a line with two spaces, no more.

Headings

  • Header text must use the atx-style with no closing # character.

  • Include a space between the # and the text of the Header^1.

    # Header 1
    ## Header 2
    ### Header 3
    
  • Headers spanning more than 80 characters should be re-evaluated.

  • Headers must be preceded and followed by a newline except at the beginning of a file.

Horizontal Rules

The convention for horizontal rules in this style guide is to use hyphens (instead of asterisks or underscores). Following another basic convention of the guide, horizontal rules should span 80 characters for readability.

--------------------------------------------------------------------------------

Lists

  • List items must be indented 4 spaces further than their parent.

  • Unordered list Items should use - instead of *.

    This is arbitrary text, an unordered list begins on the next line.
        - list item 1
        - list item 2
            - sub-list item
    
  • The first level of list items must not be preceded by a newline.

  • All lists must be followed by newlines.

    This text precedes a list of things.
          - list item 1
          - list item 2
              1. sub-list item 1
              2. sub-list item 2
    
          - list item 3
          - list item 4
    
    This is text of any kind that follows a list.
    
  • List item lines exceeding 80 characters should, when wrapped, align vertically with the beginning of the preceding line's text.

      - Large, avian creatures, chocobos roughly act as the equivalent of
        horses, being domesticated for use as mounts...
    

Code

  • Inline code must use single backticks and must not have spaces between the backtick characters and the code.

    # Bad
    ` .this-is-wrong `
    
    # Good
    `.this-is-good`
    
  • Fenced code blocks must be preceded and followed by a newline.

  • When used inside list items, fenced code blocks must be indented as if they were one level deeper that the list item that contains them.

      - This list item contains a fenced code block.
      - Let's show how it might interact with a list.
    
        ```
        .code-example {
          property: value;
        }
        ```
    
    There is a newline above this paragraph because it is both the end of a
    list and because it follows a fenced code block.
    

Tables

Like fenced code blocks, tables in Markdown are provided by Markdown Extra which seems to be pretty widely implemented.

  • Pipe characters must be preceded and followed by spaces for readability.

  • Table column width should be determined by the longest cell in the column.

  • Always format tables so they are readable in pre-processing.

    # This is completely unreadable, although it is technically valid.
    table header | other table header
    --- | ---
    table data | other table data
    
  • Never use preceding or trailing pipes when writing tables.

    # This wastes our precious 80 character limit.
    | table header | other table header |
    | ------------ | ------------------ |
    | table data   | table data         |
    
  • Tables must always be preceded and followed by newlines.

Table example:

This table meets all the criteria:

Group                     | Domain          | First Appearance
------------------------- | --------------- | ----------------
ShinRa                    | Mako Reactors   | FFVII
Moogles                   | MogNet          | FFIII
Vana'diel Chocobo Society | Chocobo Raising | FFXI:TOAU

A handsome table in pre-processed markdown is also handsome when rendered:

Group Domain First Appearance
ShinRa Mako Reactors FFVII
Moogles MogNet FFIII
Vana'diel Chocobo Society Chocobo Raising FFXI:TOAU

Footnotes

  1. This is enforced locally through redcarpet2's configuration: :space_after_headers.

markdown-styleguide's People

Contributors

carwin avatar notslang avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

markdown-styleguide's Issues

Subtitles?

Hello!

Is there a recommended standardization for subtitles? I've seen a few in the wild, mostly these two:

# Title
## Subtitle

### Header

Body
# Title
*Subtitle*

## Header

Body

Thanks!

Use 4 spaces only for nested list items.

What is the rationale for the 2 space indent on every level?

I propose 4 indents on everything except first line style such as:

Par.

- very vey very
    very long l11

- l12
    - 21
    - 22
        - 31
        - 32

Rationale:

  • multiple paragraphs on a list item look nicer because new pars must be indented by 4 spaces.

    Looks better:

    - l1
        - l2 par 1 line 1
            par 1 line 2
    
            par2 line 1 ALIGNED 
    

    Looks worse:

      - l1
        - l2 par 1 line 1
          par 1 line 2
    
            par2 line 1 NOT ALIGNED
    
  • easier for humans to remember: always use 4 spaces on lists and code blocks.

  • more common based on my subjective experience

Fix unordered list marker.

How about fixing the list markers?

My preferred choice are hyphens - because:

  • asterisks are already used for other functions: italics and boldface
  • I am yet to see someone using +

how should hr's be written?

There's a whole bunch of styles for this, so it's probably worth defining one in the styleguide:

***
* * * * *
-------------------------
_ _ _ _ _

I'm pretty sure that a line of hyphens is the most common, but it's usually a random number of hyphens. Maybe we should define it as exactly 80 so it lines up with the wrap-guide? Or should it be something shorter like 40, 20, or 10? We could go as low as 3, but then it wouldn't look much like a horizontal rule.

Thoughts?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.