مرحبا بك عزيزي الزائر. المرجوا منك أن تعرّف بنفسك و تدخل المنتدى معنا. إن لم يكن لديك حساب بعد, نتشرف بدعوتك لإنشائه
مرحبا بك عزيزي الزائر. المرجوا منك أن تعرّف بنفسك و تدخل المنتدى معنا. إن لم يكن لديك حساب بعد, نتشرف بدعوتك لإنشائه
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.


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

 

 الدرس الرابع من دورة تصميم الاستايلات

اذهب الى الأسفل 
2 مشترك
كاتب الموضوعرسالة
a h m e d
احلى الخبراء
احلى الخبراء
avatar


ذكر
عدد الرسائل : 488
وسام : الدرس الرابع من دورة تصميم الاستايلات 16081511
احترامك لقوانين المنتدى : الدرس الرابع من دورة تصميم الاستايلات 111010
تاريخ التسجيل : 28/09/2008

الدرس الرابع من دورة تصميم الاستايلات Empty
مُساهمةموضوع: الدرس الرابع من دورة تصميم الاستايلات   الدرس الرابع من دورة تصميم الاستايلات I_icon_minitimeالثلاثاء 30 سبتمبر - 7:08:10

b]اهلا ومرحبا بحضراتكم في :[/b]

الدرس الرابع : دورة تصميم استايل للمبتدئين

انتهينا والحمد لله من التصميم وكان هذا هو الناتج باذن الله

الدرس الرابع من دورة تصميم الاستايلات 015

اليوم باذن الله سوف نقوم بتقطيع التصميم الى قطع

كي يتم تركيبها ببرنامج الفرونت بيج ومن فوائده (التمدد)

وللتقطيع طرق عديده وسنستخدم منها باذن الله

التقطيع بواسطه اداه التحديد هذه الدرس الرابع من دورة تصميم الاستايلات 005

نبدأ الشغل بسم الله الرحمن الرحيم

اولا الكل يحفظ التصميم على هيئه صورة بامتداد gif كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 001

ثم اضغط على save كالتالي

الدرس الرابع من دورة تصميم الاستايلات 002

اعطيها اي مسمى وليكن index

وبالامتداد gif كما ترون

الدرس الرابع من دورة تصميم الاستايلات 003

ثم نفتح الصورة عن طريق برنامج الفوتوشوب كالتالي :


الدرس الرابع من دورة تصميم الاستايلات 004

ثم تختار الصورة من جهازك وتضغط عليها ستفتح معك باذن الله

الان من شريط الادوات اختر اداة التحديد هذه الدرس الرابع من دورة تصميم الاستايلات 005

ثم قم بتحديد الهيدر من اليمين الى اليسار وبارتفاعه كاملا

مع ترك نسبه بسيطه من لون الخلفيه

لتكن القطعه المحدده كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 007

والان ستضغط على زرارين ctrl+c من الكيبورد

وهي تعني نسخ القطعه المحدده ..

ثم تذهب لتفتح عمل جديد كما تعلمنا كالتالي:

الدرس الرابع من دورة تصميم الاستايلات 001

ستظهر لك مقاييس العمل الجديد بنفس المقاسات التي حددتها للهيدر

فكل ما عليك هو تسميتها header والضغط على ok فقط لاغير كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 006

سيظهر لك العمل الجديد ابيض

كل ما عليك هو ان تضغط على زرارين ctrl + v اي لصق من الكيبورد

لتصبح الصورة كالتالي باذن الله

الدرس الرابع من دورة تصميم الاستايلات 007

وسنكرر هذه الطريقه مع الفوتر ؛ سنقوم بتحديده كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 008

ثم ننسخه ثم عمل جديد فسياخذ المقاسات ونسميها footer كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 009

ثم نلصقه ليكن كالتالي ان شاء الله :

الدرس الرابع من دورة تصميم الاستايلات 010

الان سنقوم بتقطيع الهيدر الى قطع صغيره ان شاء الله

نقطع البنر مع ترك نسبه من باقي الهيدر كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 011

ثم نسخ ثم عمل جديد ونسميها h-r كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 012

ثم لصق ليكن الشكل كالتالي ان شاء الله

الدرس الرابع من دورة تصميم الاستايلات 013

سوف ناخذ الان منطقه التمدد للهيدر باذن الله

نقطع اي قطه بسيطه بعرض الهيدر كاملا كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 014

ثم نسخ ثم عمل جديد ونسميها h-b كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 015

ثم لصق لتكن بالشكل التالي باذن الله :

الدرس الرابع من دورة تصميم الاستايلات 016

سوف نقوم بتقطيعها الى نصفين

ليكون النصف العلوي فارغا لوضع اي بنر اعلاني

والنصف السفلي للكتابه عليه ووضع زراير كما تحب ان شاء الله

اولا نقوم بالتعليم على النص العلوي كالتالي باذن الله

الدرس الرابع من دورة تصميم الاستايلات 017

ثم قص ctrl + x ليكن كالشكل التالي ان شاء الله

الدرس الرابع من دورة تصميم الاستايلات 018

واردت بالقص هذه المرة التيسير في اخذ القطعتين كاملتين

فتابعوا وستفهموا بعد ذلك باذن الله

ثم عمل جديد ونسميه h-b1 كالتالي ان شاء الله :

الدرس الرابع من دورة تصميم الاستايلات 019

ثم لصق ليكن كالشكل التالي باذن الله :

الدرس الرابع من دورة تصميم الاستايلات 20

والان جائت فائده القص

سنعلم على قطعه h-b بزرارين ctrl+a التعليم على الكل كالتالي :


الدرس الرابع من دورة تصميم الاستايلات 21

ثم نسخ ctrl+c ثم عمل جديد ونسميه h-b2 كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 22

ثم لصق لياخذ الشكل التالي باذن الله الدرس الرابع من دورة تصميم الاستايلات Biggrin

الدرس الرابع من دورة تصميم الاستايلات 23

اتمنى تكون اتضحت فكرة القص هذه المره ان شاء الله

والان نكون بفضل الله قد قمنا بتقطيع الهيدر كاملا والحمد لله

ونقوم بتقطيع الفوتر باذن الله الان وهو بسيط جدا

كلنا ناخذ قطعه بعرض الفوتر كاملا كالتالي ::

الدرس الرابع من دورة تصميم الاستايلات 24

ثم نسخ ثم عمل جديد ونسميه f-b كالتالي ان شاء الله

الدرس الرابع من دورة تصميم الاستايلات 25

ثم لصق ليكن الشكل كالتالي ان شاء الله

الدرس الرابع من دورة تصميم الاستايلات 26

ثم نحدد اي طول بعرض الفوتر لنكتب عليه عبارة حفظ الحقوق كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 27

ثم نسخ ثم عمل جديد ونسميه logo كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 28

ثم لصق ليكن الشكل كالتالي باذن الله :

الدرس الرابع من دورة تصميم الاستايلات 29

والان سوف نقوم باخذ لون الخلفيه وهذه الفكرة لن تنفعنا في عمل استايل

وانما تنفعنا في عمل الواجهه ان شاء الله وهذه هي المفاجئه الدرس الرابع من دورة تصميم الاستايلات Biggrin

الدرس الرابع من دورة تصميم الاستايلات 30

بعد التحديد على اي قطعه بالخلفيه ناخذها نسخ ثم عمل جديد

ونسميه back كالتالي ان شاء الله :

الدرس الرابع من دورة تصميم الاستايلات 31

ثم لصق ليكون كالتالي باذن الله :

الدرس الرابع من دورة تصميم الاستايلات 32

وكل ما نريده من القطع التي تم تقطيعها هم 6 قطع فقط لاغير الدرس الرابع من دورة تصميم الاستايلات Biggrin

وهم كالتالي :

الدرس الرابع من دورة تصميم الاستايلات 33

وكفى المؤمنين شر القتال

واراكم على خير في الدرس القادم باذن الله
الرجوع الى أعلى الصفحة اذهب الى الأسفل
مصمم الفلاش
عضو مبتدىء
عضو مبتدىء
avatar


ذكر
عدد الرسائل : 24
العمر : 31
تاريخ التسجيل : 17/10/2008

الدرس الرابع من دورة تصميم الاستايلات Empty
مُساهمةموضوع: رد: الدرس الرابع من دورة تصميم الاستايلات   الدرس الرابع من دورة تصميم الاستايلات I_icon_minitimeالسبت 18 أكتوبر - 13:04:10

تسلم اخوي عالدرووس الروعه
والله يعطيك الف عافيه....^^
الرجوع الى أعلى الصفحة اذهب الى الأسفل
a h m e d
احلى الخبراء
احلى الخبراء
avatar


ذكر
عدد الرسائل : 488
وسام : الدرس الرابع من دورة تصميم الاستايلات 16081511
احترامك لقوانين المنتدى : الدرس الرابع من دورة تصميم الاستايلات 111010
تاريخ التسجيل : 28/09/2008

الدرس الرابع من دورة تصميم الاستايلات Empty
مُساهمةموضوع: رد: الدرس الرابع من دورة تصميم الاستايلات   الدرس الرابع من دورة تصميم الاستايلات I_icon_minitimeالثلاثاء 21 أكتوبر - 13:15:31

شكرا على مرورك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
الدرس الرابع من دورة تصميم الاستايلات
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» الدرس السابع من دورة تصميم الاستايلات
» الدرس السادس من دورة تصميم الاستايلات للمبتدئي
» الدرس الاول : دورة تصميم استايل للمبتدئين
» الدرس الثانى : دورة تصميم الاستايل للمبتدئي
» الدرس الثالث : دورة تصميم استايل للمبتدئي

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
 :: قسم الفوتوشوب :: منتدى تعليم التصميم-
انتقل الى: