درس تصميم ستايل منتدى بشكل احترافي

سم الله وابدأ بفتح الفوتوشوب
نقوم بعمل جديد
بالمقاسات التالية

طبعاً الدروس تختلف عن كل دروس الإستايلات السابقة من المصممين
وسأوضح لك كيفية تحكمك في وضع تممد أو بدون تمدد
والدروس بنيت على طريقتي في تصميم الإستايلات
:::::::::::::::::
الآن نقوم باختيار الألوان المناسبة للإستايل
وسنقوم الآن بتصميم استايل معهد فوكس الجديد معاً
فأرجوا مراعاة الألوان
نقوم الآن برسم البنر
طبعاً الطريقة بدون نقط تمدد
ويمكننا الحصو على أشكال مميزة بأداة الباث
رسمت وطلع معي هالشكل مثلاً

نقوم بتدبيل الشكل
كالآتي
باضغط على الير بالزر الأيمن

وبعد حصولنا على ليرين
نذهب لللير الأسفل
وافعل ما ترى في الصورة

ستخرج لنا نافذة
إذهب إلى هذه الخيارات

كرر الخطوات السابقة
حتى ينتج لك شكل مقبول

الآن نذهب إلى باقي أجزاء البنر
ونقوم بعمل بعض الأفكار الجديدة .. والجميلة
لمسات بسطية تعطي التصميم جمال خيالي

تابع وأضف الأزرار
وما يحتاج شرح في دروس كثيرة بخصوص الأزرار
شوف كيف طلع معي

طيب كذا تقرياً نعتبر خلصنا من البنر
طبعاً قصدي التصميم فقط
باقي كثيير تونا في بداية الطريق
نقوم الآن برسم
مستطيل .. كشيء جمالي للمنتدى
ونضيف عليه التأثيرات

الآن نقوم بتصميم أهم وزبدة الموضوع
وهي تصميم اطارات جداول المواضعيع
والناف بار وغيره ..
نقوم برسم مستطيل كالتالي

طبعاً بنفس المقاسات السابقة
نقوم بهذه الإعدادات

لاحظ اللمعة .. والتجسيم

بعد ذلك نقوم بإذافة الصور والداخلات
ويمكنك التحكم في ذلك عن طريق
CTRL+G
لاحظ

نقوم بعمل الأعمدة
ارسم مستطيلاً داخل الأول
ونقوم بوضعه عند الحافة

قم بالدخول على
استايل الطبقة
واختر التدرج اللوني

ثم كرر نفس الخطوات من الجهة الأخرى
وكذلك كرر خطوات
الإطار العلوي
شاهد ما نتج لدي

أما الآن نجي لتقطيع
سهل وما يحتاج اي شي
شوف الصورة



قم باختيار الأداة كما في الصورة التالية



وقم بتقطيعه بالشكل التالي



وقم بحفظه من القائمة

file/save for web

ستفتح هذه النافذة

وقمت بالتطرق إليها .. للتقليل من حجم الصورة ..مع مراعاة الجودة



1 : هذه عدد الألوان المستخدمة يمكنك تقليل الحجم إلى 200 أو 128 بس أنتبه
للجودة

2: يمكنك زيادتها بنسبة قلية جداً كـ 3%

ويمكنك ملاحظة الحجم كما هو محدد في الصورة

بعدها سوي حفظ وتكون انحفظت

::::::::::::::::::::::::::::::::

(( القســم البرمجـــــي ))

سنبدأ من أعحلى المنتدى إلى أسفل بإذن الله

وهو كالآتي :

1-header

2-navbar

3-forumhome

4-foter

ثم ننتقل للصفحات الداخية

forumdisplay

:::::::::::::::::::::::::::::::::

أولاً الهيدر ...

افتح برنامج الفرونت بيج

وافتح عمل جديد



واضغط على التعيمات البرمجية كما هو موضح بالصورة

وقم بمسح التعليمات كاملة

كما بالصورة



الآن توجه ...إلى قائمة الجداول

وقم بعمل جدول 1 في 1



الآن قم بالضغط على الجدول بالزر الأيمن

واختر خيارات الجدول .. انتبه ( وليس خيارات الخلية )



ستفتح لنا نافذة باشكل التالي



قم باستبدال .. التغيرات كما في الصورة الثانية



بعد ذلك

قم بإضافة الصورة داخل الجدول ( صورة البنر )

لاحظ...



اييه .. الحين جينا للشغل ..

بتقول كيف بنضيف أكثر من رابط على صورة وحدة

بقولك ..سوي مثل ما أسوي ...



قم باختيار الأداة الموضحة.. ثم قم برسم .. مستطيل أو مربع حسب شكل الزر..

أول ما تخلص رسم راح تطلع لك هذه النافذة تلقائياً



حط فيها الكود على حسب الزر ...

وتفضل يا حبيبي ..كل الأكواد اللي تحتاجها في الهيدر


الرئيسيه

مشكوووووووووووووره