دليل Markdown للمبتدئين — اللغة التي يستخدمها كل مطوّر في العالم

ما هي Markdown؟

Markdown لغة ترميز نصّية بسيطة، ابتكرها John Gruber عام 2004. هدفها: كتابة نصّ مُنسَّق دون الحاجة لمحرّر معقّد أو أزرار Bold و Italic. تكتب بقواعد بسيطة، والنتيجة تتحوّل تلقائياً إلى HTML جميل.

الفكرة: "النصّ يجب أن يبدو مقروءاً حتى قبل تحويله". لاحظ الفرق:

HTML تقليدي:

<h1>عنوان</h1>
<p>هذه فقرة فيها <strong>نصّ بارز</strong>.</p>

Markdown:

# عنوان
هذه فقرة فيها **نصّ بارز**.

الناتج النهائي متطابق، لكن Markdown أقصر وأسهل قراءة في النصّ الخام.

أين تُستخدم Markdown؟

GitHub: كل ملف README.md، التعليقات على الـ Issues
Reddit: تنسيق المشاركات والتعليقات
Discord و Slack: الرسائل والقنوات
Notion: نظام التدوين الأساسي
StackOverflow: أسئلة وأجوبة
WhatsApp: النسخة البسيطة (*bold* و _italic_)
المدوّنات الثابتة: Jekyll, Hugo, Hexo
الوثائق التقنية: معظم projects مفتوحة المصدر

📝

أدوات نصّية مفيدة

JSON Formatter, محسّن النصوص، ومحوّلات صيغ

القواعد الأساسية

1. العناوين

استخدم رمز #:

# عنوان رئيسي (H1)
## عنوان فرعي (H2)
### عنوان أصغر (H3)
#### وهكذا حتى H6

2. التأكيد والنصّ البارز

**نصّ غامق** أو __نصّ غامق__
*نصّ مائل* أو _نصّ مائل_
***غامق ومائل***
~~نصّ مشطوب~~

3. القوائم

قائمة غير مرتّبة:

- العنصر الأول
- العنصر الثاني
  - عنصر فرعي (مسافتان)
  - عنصر فرعي آخر
- العنصر الثالث

قائمة مرتّبة:

1. الخطوة الأولى
2. الخطوة الثانية
3. الخطوة الثالثة

4. الروابط

[نصّ الرابط](https://example.com)
[رابط مع عنوان](https://example.com "العنوان عند المرور")
<https://example.com>  ← رابط مباشر

5. الصور

![وصف الصورة](https://example.com/image.jpg)
![صورة مع عنوان](image.jpg "عنوان")

6. اقتباس

> هذا اقتباس
> يمكن أن يمتدّ لأسطر متعدّدة
>
> > وحتى اقتباسات متداخلة

7. الكود

كود قصير في وسط النصّ — ضع بين `:

استخدم الدالة `console.log()` لطباعة قيمة.

بلوك كود متعدّد الأسطر — ضع بين ثلاث `:

```javascript
function hello() {
  console.log("مرحباً");
}
```

8. الخطّ الأفقي

---
أو
***
أو
___

قواعد متقدّمة

1. الجداول

| العمود 1 | العمود 2 | العمود 3 |
|----------|----------|----------|
| خلية 1   | خلية 2   | خلية 3   |
| خلية 4   | خلية 5   | خلية 6   |

للمحاذاة:

| محاذاة لليسار | محاذاة وسط | محاذاة لليمين |
|:--------------|:----------:|--------------:|
| نصّ           | نصّ         | نصّ            |

2. قوائم المهامّ

- [x] مهمّة منجزة
- [ ] مهمّة غير منجزة
- [ ] مهمّة قيد العمل

3. سطر فاصل في الفقرة

أضف مسافتين في نهاية السطر، أو سطراً فارغاً:

السطر الأول
السطر الثاني  ← مسافتان قبل enter

السطر الثالث (فقرة جديدة)

4. هروب الرموز الخاصة

إذا أردت كتابة * أو _ كنصّ عادي، أضف \\ قبله:

\*ليس مائلاً\* — يظهر كنصّ عادي

أدوات لكتابة Markdown

محرّرات مجانية ممتازة

Typora: الأجمل، يعرض النتيجة مباشرة (WYSIWYG)
Visual Studio Code: مع إضافة Markdown Preview
Obsidian: للملاحظات الشخصية والمعرفة الشخصية
StackEdit: أونلاين، لا يحتاج تثبيت
Dillinger: أونلاين، مفتوح المصدر

محرّرات أون لاين سريعة

HackMD: للتعاون الجماعي
Markdown Live Preview: سريع وبسيط
GitHub Markdown Renderer: اختبر مباشرة في GitHub

نسخ Markdown المختلفة

Markdown نفسها بسيطة، لكن كل منصّة أضافت ميّزات خاصة:

CommonMark: المعيار الموحّد المعتمد عالمياً
GitHub Flavored Markdown (GFM): أضافت الجداول وقوائم المهامّ ومُربّعات Code Fence
Reddit Markdown: تختلف قليلاً
Discord Markdown: نسخة مبسّطة
WhatsApp: الأبسط (*غامق* فقط)

مثال عملي: ملف README احترافي

# اسم المشروع

وصف قصير وجذّاب للمشروع في سطر واحد.

[![License](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)

## ✨ الميّزات

- ✅ ميّزة 1
- ✅ ميّزة 2
- 🚀 ميّزة 3 (الأهمّ)

## 📦 التثبيت

```bash
npm install my-project
```

## 🎯 الاستخدام

```javascript
const project = require('my-project');
project.run();
```

## 🤝 المساهمة

نرحّب بأيّ مساهمة! اقرأ [CONTRIBUTING.md](CONTRIBUTING.md).

## 📄 الترخيص

[MIT](LICENSE) © 2026 اسمك

نصائح من المحترفين

اترك سطراً فارغاً قبل وبعد العناوين والقوائم — للتأكّد من العرض الصحيح
استخدم العناوين بترتيب منطقي — H1 ثم H2 ثم H3، لا تقفز
اختبر دائماً قبل النشر — كل منصّة تعرض بشكل مختلف قليلاً
أضف الإيموجي — يجعل README أو الوثائق أكثر جاذبية
استخدم Code Fence مع تحديد اللغة — يفعّل تلوين الكود (Syntax Highlighting)

أخطاء شائعة

نسيان المسافات في القوائم: -عنصر غير صحيح، الصحيح - عنصر
إساءة استخدام العناوين: H1 يجب أن يكون مرّة واحدة فقط في الصفحة
تنسيق الكود بمسافات بدلاً من ```: النتيجة غير منتظمة
عدم اختبار الجداول: تأخذ وقتاً لإتقانها، استخدم أدوات توليد
استخدام HTML بدلاً من Markdown: صحيح أن HTML يعمل داخل MD، لكن لماذا تفقد البساطة؟

متى تستخدم HTML بدلاً من Markdown؟

Markdown قوية لكن محدودة. استخدم HTML داخلها عندما تحتاج:

إضافة style أو ألوان مخصّصة
عناصر معقّدة كالنماذج (Forms) أو الفيديوهات
محاذاة دقيقة (center, right)
عناصر تفصيلية مع طيّ (<details>)

مثال:

<div align="center">
  <img src="logo.png" alt="Logo" width="200">
  <h1>عنوان وسط</h1>
</div>

الخلاصة

Markdown ليست تقنية معقّدة، هي طريقة كتابة طبيعية تكتسب قيمتها من البساطة والانتشار. بعد قراءة هذا المقال، أنت تتقن 90% من القواعد التي ستحتاجها في حياتك التقنية.

الباقي يأتي بالممارسة — استخدمها في README مشروعك التالي، أو في تدوين ملاحظاتك، أو في مساهمتك التالية على GitHub. خلال أسبوع، ستكون أسرع منها من Microsoft Word.

🚀 جرّب الآن: افتح أيّ مشروع لك على GitHub، حدّث README.md باستخدام Markdown — ستلاحظ كم يبدو أكثر احترافية فوراً.

دليل Markdown للمبتدئين — تعلّمه في 15 دقيقة