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

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

العودة   بورصات > المنتديات العامة > برامج كمبيوتر و انترنت > الفوتوشوب - فلاش - تصاميم - الجرافيكس

طريقة تصميم موقع كالمجله بالفوتوشوب 2014 خطوات تصميم موقع كالمجلة 2014

الفوتوشوب - فلاش - تصاميم - الجرافيكس

إضافة رد
 
أدوات الموضوع
قديم 15 - 08 - 2013, 10:40 PM   #1
عضو فـعّـال
 

افتراضي طريقة تصميم موقع كالمجله بالفوتوشوب 2014 خطوات تصميم موقع كالمجلة 2014

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


ثم اختر هذه الأداة


ثم اضف طبقه جديده ثم قم برسم مستطيل وقم بإعطائه الاستايل اللي حفظناه
وقد قمت برسم مستطيل واعطائه نفس الاستايل اللي حفظناه اصبح هكذا


ثم قم بحفظ العمل بالضعط على File ثم save as ثم قم بتسمية الصوره اي اسم ومن امام كملة format اختر الامتداه الموضح لك

بالصوره التاليه بالرقم 1 ثم اضغط على save


ثم قم بفتح الصوره اللي حفظناها للتو من الخيار file ثم open ثم اختر الصوره اللي حفناها .
ثم اختر اداة التحديد


ثم قم بتحديد المستطيل اللي عملناه كما التحديد الموضح لك بالصوره
(( لاحظ ان التحديد يعطي فراغ بسيط من اليمين واليسار وذلك لظهور الظل اللي بالإطار واذا لم يكن هنا ظل للاطار قم بتحديد المستطيل

بدون ترك فراغات يمين ويسار المستطيل .. ويفضل ترك فراغ بسيط من اليمين واليسار كما بالصوره التاليه ))


ثم
ثم من قائمة Edit اختر Cut ثم اذهب الى قائمة File واختر New واضغط على ok مباشرة ثم اضغط على قائمة Edit واختر منها

Paste ... وستلاحظ انه تم لصق المستطيل

ثم قم بتقسيم المستطيل الى 3 أجزاء (( تقطيع )) علوي وسفلي ومنتصف








ثم قم بتحديد الجزء العلوي من اليسار (( لا بد من فتح نافذة info علشان نقدر نعيّن مقاسات التحديد وما يهمنا بالتحديد هو العرض فقط

احفظه بذاكرتك لأننا راح نرجع له بالتقصيص للمستطيل ))


ثم من قائمة Edit اختر Cut ثم اذهب الى قائمة File واختر New واضغط على ok مباشرة ثم اضغط على قائمة Edit واختر منها

Paste ... ثم احفظ الصوره بأي إسم يدل على الصوره .
ثم حدد الجزء الأيمن بنفس عرض التحديد اللي عملناه ثم قم بقصه وحفظه بإسم يدل عليه .
وأيضا في المنتصف حدد عرض بسيط من الصوره حتى يصبح خلفيه وقم بقصه وحفظه بإسم يدل عليه .
وبعد ان قمت بقص الصوره العلويه للمستطيل نتج لي هذه الصور








ثم اذهب للصوره السفليه للمستطيل وقم بعمل تحديد للجهه اليسرى ثم اليمنى ثم المنتصف كما فعلنا بالصوره العلويه واحفظ الصور

بأسماء تدل عليها . (( ولا تنسى أن عرض التحديد يجب ان يكون متساوي )) .
وقمت بتقصيص الجزء السفلي ونتج لي هذه الصوره








ثم اذهب للصوره اللي بالمنتصف >>> ولا نحتاج منها سوى قص الجهه اليمنى واليسرى فقط (( ولاحظ ان العرض لابد أن يكون هو

نفسه بتحديدنا اللي حفظناه بذاكرتنا )) .
وقمت بالقص ونتج لي التالي :





والحين ارجع للفرونت بيج يااااامال الغنيمه وافتح الصفحه اللي ركبنا فيه التصميم ثم اضغط بالماوس مره واحده بمنتصف الصفحه حتى

تجعل المؤشر بداخله


ثم اضف جدول ذو 3 أعمده رأسيه و 3 أعده أفقيه


ثم اضغط كلك يمين بمنتصف الجدول واختر خصائص الجدول


ثم اعمل القيم كما مبين لك بالصوره


ثم اسحب العمود الأيمن الى أقصى اليمين واحسب العمود الأيسر الى أقصى اليسار وسيظهر كهذا


ثم قم بتركيب الصور كما فعلنا سابقا وكل صوره بمكانها المناسب (( ألم أقل لك أن تضع اسم يدل على الصوره ))
شاهد كيف قمنا بتركيب الصور بالجدول


والآن نقول لنفسنا هنئا لكي لقد قمتي بعمل شيء جميل ...

في أعلى الأطار أكتب مسمى لمحتوى الإطار >> مثلا (( جديد الموقع )) وفي المنتصف أكتب المحتويات كما في هالصوره :


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

القائمه المنسوخه ... أو اذا كانت لك خبرة بالتعامل من اكواد HTML تستطيع نسخ كود جدول القائمه بالكامل ومن ثم لصقه أسفل

الكود اللي نسخته مباشرة (( واذا تبي تفصل بين القائمتين تستطيع وضع هالكود
فهو يعني سطر بحيث سيتم الفصل بين

القائمتين بسطر واحد )) ... شاهد معي الطريقه


ثم بنفس الطريقه تستطيع اضافة اطارات .

وبعد إضافة القوائم والإطارات اللازمه لموقعنا ... شاهد كيف اصبح الآن


ولاحظ أن هناك خليه فارغه في الأعلى وايضا بالأسفل >>>
أما العلويه فتستطيع وضع صور للإعلانات بها او اي روابط او نصوص محببه لك .
وأما السفليه فهي لكتابة (( جميع الحقوق محفوظه لموقع بوادي )) أو كتابة اي جمله ترغبها أو وضع عداد زوار او عداد احصائيه .


وبهذا انتهينا من التصميم والتركيب بقي لدينا حفظ العمل كصفحة ويب HTM او HTML كلتا الجملتين تفي بالغرض ..


بعد الانتهاء من اضافة القوائم والاطارات اذهب للقائمة ملف من أعلى الفرونت بيج ثم اختر حفظ بإسم وستظهر لك النافذه التاليه :



ثم سيتم حفظ الصفحه بنفس الإسم index .

والآن قم بتحميل مجلد الصور كاملا الى موقع والصفحه التي بجانبه الى موقعك ... وأصبح جاهزا للتصفح


ألف مبرووووووك عليك المجله الحلوه .

اذا اعجبك الموضوع و اردت نشره في المنتديات الاخرى فاستخدم هذا الرابط:
طريقة تصميم موقع كالمجله بالفوتوشوب 2014 خطوات تصميم موقع كالمجلة 2014
http://www.borsaat.com/vb/t582494.html



lzaman غير متواجد حالياً   رد مع اقتباس
إضافة رد

جديد مواضيع الفوتوشوب - فلاش - تصاميم - الجرافيكس


مواضيع سابقة :

الدرس الرابع فى الفوتوشوب 2014 شرح نوافذ الفوتوشوب 2014
الدرس الثالث فى الفوتوشوب 2014 شرح صندوق الادوات بالكامل 2014
الدرس الثاني فى الفوتوشوب 2014 شرح القوائم المهمة بالفوتوشوب 2014

مواضيع تالية :

طريقة تصميم حاويات زجاجية بالفوتوشوب 2014 خطوات تصميم حاويات زجاجية 2014
طريقة عمل نص ثلجي بالفوتوشوب 2014 خطوات عمل نص ثلجي بالفوتوشوب 2014
طريقة دمج النصوص على الحائط 2014 خطوات دمج النصوص على الحائط 2014

طريقة تصميم موقع كالمجله بالفوتوشوب 2014 خطوات تصميم موقع كالمجلة 2014

أدوات الموضوع

تعليمات المشاركة
لا تستطيع إضافة مواضيع جديدة
لا تستطيع الرد على المواضيع
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة
Trackbacks are معطلة
Pingbacks are معطلة
Refbacks are معطلة


المواضيع المتشابهه
الموضوع المنتدى
طريقة تصميم عين واقعية بالفوتوشوب 2014 خطوات تصميم عين واقعية 2014 الفوتوشوب - فلاش - تصاميم - الجرافيكس
طريقة تصميم ميدالية بالفوتوشوب 2014 خطوات عمل ميدالية بالفوتوشوب 2014 الفوتوشوب - فلاش - تصاميم - الجرافيكس
طريقة صنع الشارع بالفوتوشوب 2014 خطوات تصميم الشارع بالفوتوشوب 2014 الفوتوشوب - فلاش - تصاميم - الجرافيكس
طريقة تصميم زر متحرك بالفوتوشوب 2014 خطوات تصميم زر متحرك بالفوتوشوب 2014 الفوتوشوب - فلاش - تصاميم - الجرافيكس


روابط الموقع الداخلية


08:33 PM
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.
Privacy Policy
SEO by vBSEO 3.6.0 ©2011, Crawlability, Inc.

الاتصال بنا - بورصات - الأرشيف - تنشيط العضوية - اعلن معنا - الأعلى    تحذير المخاطرة