كيفية نشر موقع HTML على Netlify أو GitHub Pages خطوة بخطوة

دقائق القراءة: 4

كيفية نشر موقع HTML على الإنترنت بسهولة

بعد الانتهاء من تطوير موقعك باستخدام HTML، تأتي المرحلة الأهم وهي إتاحته للزوار على الإنترنت. كثير من المبتدئين ينجحون في بناء صفحاتهم الأولى، لكنهم يتوقفون عند خطوة النشر بسبب عدم وضوح الخيارات المتاحة. في هذا الدليل العملي، ستتعرف على طريقتين من أشهر الطرق المجانية لنشر المواقع الثابتة: Netlify و GitHub Pages.

كلتا المنصتين مناسبتان لاستضافة مواقع HTML البسيطة، ولا تحتاجان إلى إعدادات معقدة. لكن قبل البدء، من المهم أن يكون لديك حساب على GitHub، لأن ملفات مشروعك يجب أن تكون محفوظة داخل repository حتى تتمكن من ربطها مع خدمة النشر.

شرح نشر موقع HTML على Netlify وGitHub Pages بخطوات عملية

لماذا تختار Netlify أو GitHub Pages لنشر موقع HTML؟

إذا كان موقعك ثابتًا ويعتمد على ملفات مثل HTML و CSS و JavaScript فقط، فإن هاتين المنصتين توفران حلًا مثاليًا. إليك أبرز المزايا:

  • استضافة مجانية للمواقع الثابتة.
  • سهولة ربط المشروع مع GitHub.
  • سرعة في النشر والتحديث بعد كل تعديل.
  • ملائمة للمشاريع الشخصية، وصفحات الهبوط، والمعارض، ومواقع الأعمال الصغيرة.
المنصة أهم الميزة الحالة المناسبة
Netlify نشر سهل وإعدادات شبه تلقائية لمن يريد تجربة أسرع ومرونة أكبر
GitHub Pages تكامل مباشر مع repository على GitHub للمشاريع المفتوحة والبسيطة

طريقة نشر موقع HTML باستخدام Netlify

Netlify واحدة من أشهر منصات استضافة المواقع الثابتة، وتمتاز بواجهة استخدام واضحة جدًا. كما أنها تنفذ عملية النشر تلقائيًا بعد ربط المشروع، ما يجعلها خيارًا ممتازًا للمبتدئين.

1) إضافة موقع جديد

بعد تسجيل الدخول إلى حسابك في Netlify، ستنتقل إلى لوحة التحكم الرئيسية. هناك ستجد زر New site from git. اضغط عليه لبدء إضافة موقعك الجديد.

زر إضافة موقع جديد من Git في Netlify

2) ربط Netlify مع GitHub

بعد الضغط على زر إنشاء موقع جديد، ستظهر لك صفحة إعداد الموقع. في هذه المرحلة يجب أن يكون مشروعك قد تم رفعه مسبقًا إلى GitHub. اختر زر GitHub حتى تسمح للمنصة بالوصول إلى repository الخاص بك.

ربط Netlify بحساب GitHub لنشر موقع HTML

3) منح صلاحية الربط

في الخطوة التالية، سيُطلب منك الضغط على Authorize Netlify. هذه الصلاحية ضرورية حتى يتمكن Netlify من قراءة مستودعاتك على GitHub واستخدامها في النشر.

4) اختيار repository المناسب

بعد منح الإذن، ستظهر قائمة بمستودعاتك. اختر المستودع الذي يحتوي على ملفات موقعك. يمكنك الوصول إليه عبر التمرير داخل القائمة أو من خلال شريط البحث لتسريع العملية.

اختيار repository من GitHub داخل Netlify

5) ضبط إعدادات النشر

بعد تحديد المشروع، ستظهر صفحة خاصة بإعدادات النشر. إذا كان الموقع ثابتًا ومبنيًا باستخدام HTML فقط، فلن تحتاج غالبًا إلى إعدادات معقدة. في أغلب الحالات، يكفي الضغط على Deploy site للمتابعة.

إعدادات نشر موقع ثابت على Netlify

6) إتمام النشر والحصول على الرابط

الآن تبدأ Netlify في نشر موقعك تلقائيًا. تستغرق العملية عادة أقل من دقيقة. بعد اكتمالها، ستحصل على رابط مباشر لموقعك المنشور.

قد يكون اسم الرابط الافتراضي عشوائيًا في البداية، لكن يمكنك تغييره بسهولة من خلال Site settings ثم اختيار Change site name لتعيين اسم أكثر احترافية.

رابط الموقع المنشور على Netlify بعد اكتمال النشرتغيير اسم الموقع في Netlify لتحسين الرابط

طريقة نشر موقع HTML باستخدام GitHub Pages

إذا كنت تفضل إبقاء كل شيء داخل GitHub، فإن GitHub Pages يقدم لك وسيلة مجانية وسريعة لنشر المواقع الثابتة مباشرة من repository.

ملاحظة مهمة: لكي تتمكن من النشر عبر GitHub Pages باستخدام الحسابات العادية، يجب أن يكون المستودع public. أما إذا كان private فستحتاج إلى خطة مدفوعة أو يمكنك الاعتماد على Netlify كبديل عملي.

1) الدخول إلى repository الخاص بالموقع

بعد تسجيل الدخول إلى GitHub، انتقل إلى المستودع الذي يحتوي على ملفات الموقع الذي تريد نشره.

الدخول إلى repository الموقع على GitHub

2) فتح إعدادات المستودع

من داخل صفحة المستودع، اضغط على تبويب Settings. سينقلك هذا إلى صفحة إعدادات المشروع.

فتح إعدادات repository على GitHub

3) التوجه إلى GitHub Pages

من القائمة الجانبية داخل الإعدادات، مرّر للأسفل حتى تجد قسم Pages. اضغط عليه للانتقال إلى إعدادات النشر الخاصة بخدمة GitHub Pages.

الوصول إلى إعدادات GitHub Pages

4) اختيار الفرع المناسب

ضمن قسم source، ستجد قائمة منسدلة لاختيار الفرع الذي سيتم النشر منه. اختر الفرع master أو main بحسب اسم الفرع المستخدم في مشروعك، ثم اضغط حفظ.

اختيار فرع main أو master في GitHub Pages

5) اكتمال النشر

بعد حفظ الإعدادات، يبدأ GitHub في تجهيز الموقع. خلال أقل من دقيقة غالبًا، سيظهر لك رابط الموقع المنشور. قم بتحديث الصفحة إذا لم يظهر الرابط مباشرة.

رابط الموقع بعد نشره عبر GitHub Pages

أيهما أفضل: Netlify أم GitHub Pages؟

الاختيار بين Netlify و GitHub Pages يعتمد على طبيعة مشروعك واحتياجاتك التقنية. إن كنت تبحث عن أبسط تجربة نشر ممكنة مع ميزات مرنة، فقد يكون Netlify الخيار الأنسب. أما إذا كنت تريد حلًا مباشرًا داخل منظومة GitHub نفسها، فإن GitHub Pages يفي بالغرض بكفاءة.

  • اختر Netlify إذا كنت تريد إعدادًا أسهل وواجهة أوضح ومرونة أكبر مستقبلًا.
  • اختر GitHub Pages إذا كان مشروعك بسيطًا ومفتوح المصدر وتريد نشره من داخل GitHub مباشرة.

نصائح مهمة قبل نشر موقع HTML

  1. تأكد من وجود ملف index.html في المسار الرئيسي للمشروع.
  2. راجع الروابط الداخلية وملفات CSS و JavaScript قبل النشر.
  3. استخدم أسماء ملفات واضحة وخالية من المسافات غير الضرورية.
  4. اختبر الموقع محليًا قبل رفعه إلى GitHub.
  5. احرص على أن تكون بنية المشروع مرتبة لتسهيل التحديثات لاحقًا.

الخلاصة التقنية

نشر موقع HTML لم يعد خطوة معقدة كما كان في السابق. بفضل منصات مثل Netlify و GitHub Pages أصبح بإمكان أي مطور أو مبتدئ تحويل ملفاته المحلية إلى موقع حي على الإنترنت خلال دقائق. من الناحية العملية، يوفر Netlify تجربة أكثر مرونة وسلاسة، بينما يمنح GitHub Pages حلاً مباشرًا ومجانيًا مناسبًا للمشاريع الثابتة والبسيطة. إذا كنت تبدأ الآن، فاختيار أي من الأداتين سيكون خطوة ممتازة لإطلاق موقعك ومشاركته مع العالم.

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *