في الفترة الأخيرة اتجه الكثير لتصميم المواقع الالكترونية من أجل كتابة مدوناتهم او خدماتهم وما إلى ذلك ولكن تواجه الكثير عقبات وهي لغات البرمجة والتصميم وانا مثل غيري تخصصي هو الحاسب الآلي ولكني أحببت أن اخوض هذا المجال وخلال هذه الفترة جربت اكثر من طريقة للتصميم وطالعت الكثير من الموقع وخرجت بنتيجة جيدة وصار بامكاني تصميم موقع خاص بي من خلال ما تعلمته وإنني ارغب في مشاركة غيري فكرتي مع العلم أني لست متمكنا ومصمما بارعا ولكن القليل قد يفي بالغرض.
على حسب تجربتي ساوضح طرق تصميم المواقع بشكل مفهوم للجميع المبتدي والمتوسط.
أولا: الفكرة الاساسية للموقع:
الطريقة التي ساذكرها تفيد المبتدئ في التصميم والمتوسط ومن يحب تصميم موقعه بنفسه، وأما الخبير أو من يريد التطور أكثر يمكنه تطبيق الطريقة التي سأذكرها وبعدها يتبحر في المواقع التي ذكرتها في اخر الشرح.
كما هو معروف كل موقع مبني على فكرة والأفكار كثيرة جدا وكل فكرة تختلف عن غيرها في التصميم وحتى في البرامج وسنقسم الأفكار إلى ثلاثة أقسام لتبسيطها:
الفكرة الأول: موقع ذو صفحا محددة ولا يعتمد على قاعدة بيانات مثل مواقع السيرة الذاتية او التعريفية، وأفضل الطرق لذلك هي التصميم المرئي حيث يقوم المصمم بطرح الفكرة بشكل مباشر ورسمها، ومن أفضل البرامج في ذلك وأسهلها برنامج Mobirise وهو مذكور في أخر هذا الشرح مع الاحالة لشرحه، وميزة هذا البرنامج هو تصميم صفحات للموقع وربطها مع بعض وتصميمها بطريقة عصرية وجميلة جدا ولكن هذه الفكرة كما تقدم ليس بها قاعدة بيانات.
الفكرة الثانية: تصميم مدونة أو موقع يعتمد على قاعدة بيانات للمحتوى أو للمشتركين، ويمكن للمصميم استخدام مدونة قوقل بلوجر وهي سهلة الاستخدام ومجانية بالكامل وفيها قوالب كثيرة ومميزة، وأيضا يمكن استخدام مدونة ووردبريس وهي قريبة من بلوجر ولكن فيها ميزات أكثر ويمكن تصميم الموقع بطريقة أسهل، ويمكن مراجعة الشرح:
الفكرة الثالثة: تصميم موقع تجارة الكترونية أو موقع مميز بتصميم خاص وهنا يمكن استخدام أكثر من أداة وأكثر من برنامج، مثلا يمكن استخدام استضافة ووردبريس مع إضافة elementor برو، وتقوم باستخدام قالب معين أو انشاء قالب بواسطة الإضافة وتقوم بتصميم مرئي مميز ولست بحاجة للتمكن في لغات البرمجة تكفيك الإضافة مع ووردبريس فقط، وسيم شرحها على حدة في شرح مستقل ويمكنك مراجعة الموقع الالكتروني الخاص لخدمات الويب:
ويمكن ايضا استخدام اكثر من برنامج مثل برنامج ادوبي وأيضا استخدام بقية البرامج المذكورة في الشرح هذا، ولكنني ذكرت الأسهل منها ومن يحب الاطلاع اكثر يراجع الموقع المذكور ويتم اضافة شروح بشكل دوري.
ثانيا: البرامج والمواقع العامة للتصميم:
أفضل مواقع شروح لغات البرمجة وكل المواقع العالمية معتمدة بشكل كامل على هذا الموقع ولكنه باللغة الانجليزية ويعتبر قاموس لكل مبرمج ويمكنك الاستفادة منه كثيرًا وأيضا يمكنك تصفحه من قوقل كروم مع الترمة الخاصة بقوقل وبتستفيد منه الكثير وهو مرتب ومنسق قد يكفيك عن كل المواقع الأخرى.
وأما البرامج فهي كثيرة واخترت 4 برامج وتعتبر من أفضل البرامج في ذلك:
أولا: برنامج Adobe Dreamweaver
البرنامج من أشهر برامج التصميم ويكفي انه من شركة أدوبي، والبرنامج يقوم بعمل المواقع الالكترونية بشكل كامل إما بطريقة لغة HTML أو عبر التصميم المرئي وهذا من أهم ميزاته، وسيتم شرح أهم خصائص البرنامج وطريقة تنزيله وتثبيته في شرح مستقل: برنامج Adobe Dreamweaver.
ثانيا: برنامج WYSIWYG Web Builder 15:
البرنامج شبيه ببرنامج ادوبي كثير ولكن فيه مميزات اكثر في التصميم المرئي وفيه خيارات كثيرة وتستطيع برمجه موقع متكامل بواسطته إما بطريقة لغة HTML أو عبر التصميم المرئي أيضا، وسيتم شرح أهم خصائص البرنامج وطريقة تنزيله وتثبيته في شرح مستقل: برنامج WYSIWYG Web Builder 15.
ثالثا: برنامج Mobirise:
البرنامج في عدة خيارات للتصميم المرئي وهو مجاني بالثيمات المجانية الأساسية ويفي بالغرض لتصميم موقع شخصي وهو أيضا من أفضل برامج التصميم ومن أهم ما يميزه أنك لست بحاجة إلى أي لغة في التصميم وتصميماته روعة ومتوافقة تلقائيا مع الجوال وغيره وسريع في التصميم وخفيف في البرمجه وهو الخيار الأمثل للمبتدئ، وسيتم شرح أهم خصائص البرنامج وطريقة تنزيله وتثبيته في شرح مستقل: برنامج Mobirise.
رابعا: برنامج Notepad++:
البرنامج صغير الحجم ولكن لا غني لمبرمج عنه نهائيا فهو يقوم بالتعديل على ملفات المواقع بعدة لغات ومن أهمها لغة HTML، وأيضا تستطيع تصميم موقع متكامل بالبرنامج ولكن الشغل فيه يعتمد كليا على اللغة، وأكثر ما يفيد المصمم في حالات التعديل حيث أنك تستطيع التعديل في بعض الخصائص والكلام أو العناوين بسهولة فيه وتقوم بعدم تعديلات سريعة عليه، وسيتم شرح أهم خصائص البرنامج وطريقة تنزيله وتثبيته في شرح مستقل: برنامج Notepad++.
هذه أهم البرامج التي استخدمتها والتي افضلها على غيرها.
ومن أفضل المواقع التي تفيدك في الموضوع:
موقع: https://www.php.net/
الموقع يعتبر قاموس للغة php وسيفيدك في حال واجهتك مشاكل متعلقة باللغة.
موقع: https://github.com/
من الموقع المهمة لكل مبرمج حيث يوجد فيها قوالب كثيرة ومنتدى لتبدل الخبرات وغير ذلك الكثير.
موقع: https://sites.google.com/new
من المواقع المهمة يقوم بشرح طريقة تصميم موقع الكتروني من البداية. وفيه الكثير من حلول مشاكل اللغة.
موقع: https://elementor.com/
من أفضل مواقع التصميم المرئي وفيه ميزات كثيرة جدا ويعتبر الأفضل ولكنه مدفوع والنسخه المجانية لا توجد فيها كامل الاضافات ويمكن استخدامه مستقل او عبر استضافة ووردبريس.
وتوجد مواقع كثيرة جدا تقوم بالتصميم المرئي فيها وبعضها تستطيع البرمجة بعدة لغات ولكنني ذكرت هذه لأنها أسهل وأوسع من غيرها ولا تجد مصمم إلا ويعتمد على أحدها حتى ولو كان شغالة على برامج أخرى.
وأخيرا:
التصميم يحتاج إلى الصبر، وكل يوم تضيف معلومة جديدة، والتطوير مستمر وما زال مستمر؛ فالمصمم لازم أن يطلع أكثر وأكثر، ولكن في البداية يبدأ بما ذكرته، ولو تلاحظون أن أغلب الشركات كانت في البداية تصاميمها خفيفة بل بعضها كانت مليئة بالأخطاء ولكن مع الوقت يتم التطوير وأنت هكذا ابدأ والباقي سيأتي مع الأيام المهم لا تيأس.
بقي علينا كيف نعرف انه تم التصميم بالشكل النهائي ونريد رؤية ما قمنا بها:
نقوم بعمل سيرفر داخلي في الكمبيوتر الخاص بنا وذلك عبر تثبيت برنامج AppServ لمعرفة طريقة التنزيل والتثبيت راجع المقال التالي:
طريقة عمل سيرفر داخلي
تعليق واحد