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



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

 

 شرح طريقه قص وتصميم واجهه الموقع للمبتدئين

اذهب الى الأسفل 
2 مشترك
كاتب الموضوعرسالة
muslem




عدد الرسائل : 772
تاريخ التسجيل : 02/08/2006

شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Empty
مُساهمةموضوع: شرح طريقه قص وتصميم واجهه الموقع للمبتدئين   شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Emptyالخميس 11 يناير - 14:06

:idea: Shocked :suspect:
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين

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


-مقدمه

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


-برنامج تحتاجه لتسهيل عملية القص

حمل البرنامج التالي image splitter مع الشكر الخاص للاخ الرفيع صاحب شبكه الخريف لتوفيره

Images Splitter

[
-البدايه

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

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

شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 1

مثل ما انتم شايفين الموقع انتهى الاخ مستر جرافيكس من التصميم الكامل ومخلي الازرار فاضيه عشان تكتب فيها اللي تبيه

الا اذهب الى برنامج قص الصور واختار الزر
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 2
واختار الصوره اللي تبي تقصها اللي هي واجهه الموقع

اختار الزر
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 3
لعمل خطوط عرضيه للقص هذه الخطوط توضع فوق وتحت الزر وفوق الفوتر وتحت البنر وفي اي مكان تحتاجه

اختار الزر
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 4
لعمل خطوط طوليه للقص هذه الخطوط توضع على يمين ويسار الازرار وكذا كل زر يصير مستقل لحاله

وهذه نتيجه التحديد
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 5

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

تختار الزر
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 6
وهذا زر اضافه الروابط

اذهب على الزر اللي تبي تضيف له رابط واضغط عليه .. راح يطلع عليه شبكه مثل
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 7

وبيطلع لك مربع خصائص الروابط مثل
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 8

URL هنا تكتب الرابط
Alternate text هذا اختياري اذا اردت ان تكتب كلمات عند مرور الماوس على الزر مثال لعمله
هنا كتبت
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 9
Target frame هذه خاصيه تخيرك بين فتح الرابط في صفحه خارجيه جديده او نفس الصفحه
اذا اخترت New browser window فتح الرابط في صفحه خارجيه جديده
اذا اخترت Same frame فتح الرابط في نفس الصفحه
الخيارات اللي على اليمين ماراح تحتاجها لان لو تبي تسويها افضل في الفرونت بيج - اعلى من مستوى المبتدئين
حدد الخيارات واكتب الرابط واضغط ok

وكذا امشي وكمل على كل الازرار الي تبي تسويها

-ازرار تهمك في البرنامج

زر التجربه او معاينه العمل
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Test

زر الرجوع اذا غلطت في شي
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Undo

زر مسح الكل او اعاده العمل
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Reset

لما تنتهي من كل شي اضغط على
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Save
وسوي للعمل حفظ بإسم index

بيطلع لك ملف html اللي هو الصفحه ومجلد الصور مثل
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Index

لما تفتح الملف index.html
بيطلع كذا
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين 11

التصميم كله على اليسار والخلفيه سوداء

اسحب الملف index.html وافتحه الان على الفرونت بيج
ولمسات خفيفه سوي له توسيط واختار لون الخليفه اللي تبيه
واظن التوسيط ما يبيله شرح ظلل التصميم في الفرونت بيج واضغط زر التوسيط

بالنسبه للون الخلفيه
في الفرونت بيج في الخلفيه بالماوس اضغط زر الماوس اليمين واختار خصائص الصفحه
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Pageproperties

بتجيك النافذه
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Bg
اختار formatting من فوق
واختار لون الخلفيه اللي تبيه من تحت من عند background

واحفظ العمل وارفع الملفين
شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Index
مع بعض

ملاحظه: ملف index.html يكون خارج مجلد الصور وليس داخله

هذا وصلى الله على سيدنا محمد وعلى آله وصحبه أجمعين .. اتمنى الدعاء لي

أرجو عدم مسح الحقوق من الشرح

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




عدد الرسائل : 755
تاريخ التسجيل : 01/09/2006

شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Empty
مُساهمةموضوع: رد: شرح طريقه قص وتصميم واجهه الموقع للمبتدئين   شرح طريقه قص وتصميم واجهه الموقع للمبتدئين Emptyالخميس 18 يناير - 8:52

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

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