مرحباً .. سلسلة التغريدات هذه مخصصة للحديث عن تجربتي في تصميم وبرمجة مدونة شخصية بسيطة مكونة من صفحة رئيسية واحدة
كان عندي خيار نشر محتوى تلك المدونة على شكل نشرات إسبوعية ولكني لم أفعل لأسباب كتبت عنها في افتتاحية المدونة وبدلاً من ذلك فكرت بالعودة للكتابة في مدونة ولأني لم أرغب في العودة لبراثن خدمات التدوين ولأني أتعلم تطوير الويب للواجهة الأمامية فكانت هذه فرصة للتدرب وصنع مدونة من الصفر
بدأت في تصميم شعار المدونة عن طريق برنامج affinity designer الذي هو بديل جيد لأدوبي الستراتير ويكفي جداً لأي شيء ترغب في تصميمه ورسمه بتنسيق vector وهي تلك الرسومات التي تستطيع تكبيرها من دون أن تصاب بداء البكسلة :) كان لدي تصور مستمد من عنوان المدونة التي سأخبركم به لاحقاً
هذا التصور هو مقعد ونافذة واسم المدونة الذي سأضعه فوق المقعد .. وبدأت التصميم .. للأمانة لم أرسم كل شيء من الصفر واستعنت ببعض الرسومات الجاهزة .. بالتحديد قمت برسم المقعد واختيار الألوان ونوع الخط وبعد عدة ساعات وبعض التعديلات أثناء تصميم الموقع وصلت لشكل أشعرني بالرضا
جاء بعد ذلك دور تصميم الموقع وهذا جزء خارج عن اختصاصي كمطور ويب ولكن كان لدي تصور عن واجهة بسيطة تحوي قائمة ثابتة يمينها فيها بعض المعلومات والروابط عني وتأخذ المقالات التي سأكتبها فيما بعد بقية الحجم .. قضيت وقتاً في اختيار ألوان متناسقة عن طريق موقع hcoolors.co
وصار عندي في النهاية حزمة ألوان أعجبتني وبدأت بعدها في كتابة الكود عن طريق محرر vscode ومتصفح كروم الذي لا أستعمله بالمناسبة سوى لاستعراض التصميم بشكل مباشر عن طريق اضافة في المحرر اسمها live server .. بدأت أولاً في وضع المكونات الهيكلية عن طريق HTML ثم طلاء الموقع وتنسيقه
عن طريق CSS وأضفت بضعة أسطر جافاسكريبت ثم انتقلت لكتابة أكواد CSS لجعل الموقع متجاوب مع مختلف الشاشات Responsive design .. في العادة يتم ذلك بالتدريج مع كل قسم ولكني قمت به مرة واحدة لعدم وجود ضخامة في التصميم تستوجب ذلك .. وبعد أن انتهيت تركت التصميم جانباً وذهبت للنوم :)
كان هذا مقصوداً لأني وفي اليوم التالي قمت ببعض التعديلات التي لن ألحظ أهميتها أثناء التصميم الأولي .. وبعد أن وصلت لنتيجة مرضية انتقلت لكتابة افتتاحية المدونة .. كان هذا في مساء اليوم التالي وكالعادة ذهبت الى النوم بعد أن فرغت منها
في اليوم الثالث .. الذي هو اليوم بالمناسبة .. راجعت الافتتاحية وقمت ببعض التعديلات عليها ومن ثم جاء دور تهيئة النص لكي يتم إضافته للمدونة بحيث يظهر بكامل التنسيقات وهذا لن يتم من دون وضع ترميزات HTML معينة بين فقراته، بحثت عن تطبيق يفعل ذلك بشكل أوتوماتيكي فلم أجد
نصحني صديقي محمود @MidooDj باستعمال مايكروسوفت ورد ونصحتني شيماء @shaymaasoltan أيضاً به وبمحرر غوغل ولكني لم أخرج بنتيجة قابلة للاستخدام عن طريقهما .. قد يكون جهلي بطريقة استعمالهما لهذا الخصوص هو السبب .. في النهاية قررت القيام بالترميز بشكل يدوي وأضفت بعدها النص للمدونة
أسميت المدونة باسم "المصطبة" وستعرفون سبب التسمية عند قراءتكم افتتاحيتها .. أحاول أن لا أكرر كلامي هنا وهناك وطبعاً أن أدفعكم لزيارتها :) .. ستكون مدونة متخصصة بقصص وحكايات من ذكرياتي .. نوع من الصحبة البشرية عن طريق شبكة الإنترنت بعيداً عن جنون المواقع الاجتماعية
هكذا أصبح لدي موقع شخصي من صنعي بالكامل والحمد لله على التوفيق .. أتمنى أن يعجبكم تصميمه وأن يعجبكم بعدها محتواه .. أريد أن أشكر في النهاية محمود @MidooDj على مساعدتي في اختيار اسم الدومين بعد أن اختار واحداً أفضل مما اخترته . جميل محمود ولديه عقل وخبرات تستطيع الاعتماد عليها
جاري تحميل الاقتراحات...