تقطيع واجهة بالفوتوشوب وتوزيعها في الفرونت بيج ...

شرح تقطيع واجهة بالفوتوشوب ومن ثم نقله الى الفرونت بيج وعمل الروابط

مهم جدا عند نقل الموضوع لأي منتدى الرجاء حفظ الحقوق وذلك بوضع الاتي :-

\================================/
\=== جميع الحقوق محفوظة لـ العبقري نت ========/
\================================/
\===== Download37401 =====/

السلام عليكم ورحمة الله وبركاته
اخواني / أخواتي لقد وضعت هذا الدرس في الويب العربي ليستفيد منه الجميع وقد طلب مني أحد الأعضاء
أن أعمل له هذا الدرس فوعدته بذلك وها أنا أفي بوعدي وأقدم الدرس على طبق من ذهب
عزيزي القارئ كل ما أريده هو الدعاء لي ولوالدي ولا أريد غير ذلك ...

درس تقطيع واجهة بالفوتوشوب ومن ثم وضع الارتبطات التشعبية بالفرونت بيج

بسم الله الرحمن الرحيم

لنبدأ في الدرس :-

أولا يجب أن يكون لديك واجهة فوتوشوب مصممة تريد تقطيعها كل اللي عليك تعمل لها فتح

عن طريق برنامج الفوتوشوب انظر الصورة :-Download22714
Download57648
هذه الواجهة هي التي أريد أن أقطعها الى أجزاء وتركيبها على الفرونت بيج ومن ثم وضع الارتباطاتDownload83710
الان من صندوق الأدوات أختار أداة السكين للقطع كما في الصورة :-
Download62179
ثم اعمل شكل التقطيع الذي تريده وقم بتقطيع الصورة الى شرائح كما في الصورة بالأسفل :-
Download60196
وذلك بالضغط واستمرار الضغط وعمل القطعة التي تريدها استمر بالتقطيع الى أجزاء كما في الصور :-
Download41327
Download25479
واستمر في عمل المربعات حتى تصل الى النتيجة النهائية كالتالي :-
Download59478
الان انتهينا من التقطيع بقي علينا حفظه وتحويله الى قطع اتبع الاتي :-

اذهب الى ( ملف ثم حفظ للنسيج العالمي)
Download61668
الان نختار نوع الصورة وجودتها كما في الأعلى ثم انختار قوة الجودة كما في الصورة بالأسفل :-
Download20337
ثم نكتب في مربع الجودة الرقم (100)

ثم نضغط موافق للحفظ ونختار كما في الصورة :-
Download18335
ونختار النوع كما في العلى (هايبر تكست وصور)

ثم نسوي حفظ

راح ينتج لنا ملفين الأول صفحة انترنت والثاني ملف (images)

ما يهمنا هو الملف الثاني وهو ملف الصور نقوم بنسخه ثم نضعه في مجلد مستقل لوحده

ثم ندخل برنامج الفرونت بيج ونعمل صفحة جديدة فارغة ثم نحفظها باسم index

ونحفظها في المجلد الذي يوجد به مجلد (images)

يعني راح يكون الناتج ملفين كما في الصورة :-
Download39398
الان قم بعمل تحرير لصفحة (index) بالفرونت بيج

الان بقي علينا ترتيب الصور في الفرونت بيج واعطاؤها الروابط

الان أنت بداخل الفرونت بيج قم بعمل جدول كما في الصور :-
Download22514
سيظهر لنا جدول الان نضغط على الجدول بزر الماوس الأيمن ثم نختار خصائص الجدول كما في الصورة :-
Download59029
ثم نضع الخصائص كما في الصورة :-
Download10835
الان نقوم بادراج الصور في الجداول كما في الصورة التالية :-
Download35082
يعني في المربع رقم (1) نقوم بادراج الصورة رقم واحد وفي مربع رقم (2) ندرج الثانية وهكذا ...

ملاحظة : الصورة رقم (5) لاتقوموا بادراجها وانما اتركبوا المربع الخاص بها فارغا .

وراح يظهر لنا الناتج التالي :-
Download87780
الان راح يظهر لنا التصميم تمام ما عدا الصورة رقم (5) سيظهر لنا فيها مربع أبيض فارغ

الان كل اللي عليك انك تفتح برنامج الفوتوشوب مرة أخرى وتقوم بفتح الصورة رقم (5)
Download67965
ثم نذهب الى قائمة صورة ثم نختار حجم الصورة

الان سيظهر لك أبعاد الصورة ما يهمنا هو العرض والطول احفظ رقم العرض ورقم الطول

ثم اذهب الى برنامج فرونت بيج واضغط بزر الماوس الأيمن على الخلية رقم (5) ثم

اختار (خصائص الخلية)
Download31309
ضع علامة صح في مربع العرض واختار البكس وكذلك في الطول

وضع في مربع العرض (عرض الصورة رقم خمسة)

وضع في مربع الطول (طول الصورة رقم خمسة)

ثم ضع علامة صح في خانة استخدام صورة خلفية واختار استعراض ثم اختار الصورة رقم خمسة .

الان انتهينا وراح يكتمل التصميم والحمد لله

الان بقي علينا وضع الروابط اتبع الاتي :-

حدد الصورة التي يوجد من ضمنها الأزرار وذلك بالضغط عليها ضغطة واحدة
الان سيظهر لك شريط أدوات الصور الان اختار أداة التحديد من شريط الصور وحدد الازرار كما في الصورة :-
Download30269
ثم حدد الزر لوضع الارتباط التشعبي كما في الصورة :-
Download31310
الان بعد أن حددنا الازرار بأداة القلم سيظهر لنا مربع الارتباط التشعبي تلقائيا الان ضع رابط الصفحة التي تريد

أن يفتحها بمجرد الضغط على الزر

ثم طبق نفس العملية في جميع الأزرار

والحمد لله والصلاة والسلام على أشرف الأنبياء والمرسلينDownload83684

يا جـــــــــــــــــــــــــــــامد
Download14550