eldweeek
07-12-2009, 10:56 AM
http://img297.imageshack.us/img297/1682/1571528671cn6.gif
يمكنك الان تصميم موقع شخصى احيرافى لك
ويكنك ايضا تصميم موقع لشركات
الان يمكنك الكسب من خلال بيع التصميمات الجميلة
الان لنبدا
هذه صورة التصميم الذى سنفعل مثلة
http://img189.imageshack.us/img189/627/webx.gif
http://www.des-ksa.com/up/images/2-web-p/1.gif
نختار من ملف .... جديد
http://img30.imageshack.us/img30/9274/webpyg.jpg
نضبط المقاسات كما تلاحظ 770 - 800 بكسيل
http://img190.imageshack.us/img190/3787/webf.jpg
نختار لونين متناسقين واحد ثقيل والاخر خفيف ... ونقوم بتلوين الخلفيه باللون الخفيف كما تلاحظ
http://img32.imageshack.us/img32/9580/webpxl.jpg
الان نرسم بالدائره ( اذا لم تكن واضحه الدائره عندك اضغط الزر الايمن على المربع وخترها من القائمه ) نرسم 3 دوائر ويكون شكلها كما تلاحظ بالصوره
اثنتين بشكل طولي والاخرى كبيره بالنص
http://img156.imageshack.us/img156/6374/webjhr.jpg
الان نحول الدوائر جميعا لنتمكن من التعامل معها بشكل افضل ... تابع الصوره لتحويل الدوائر الى اشكال عاديه
http://img194.imageshack.us/img194/7076/webk.jpg
الان نقوم بتعبئة الدوائر بالباترين .. والباترين هو خطوط او نقط او اشكال لتجميل الحشو بالمربعات والدوائر .. تابع الصوره لتتعرف كيف يتم الوصل للباترين
والتعبئه
http://img190.imageshack.us/img190/6691/webt.jpg
نقوم بتعبئة الدوائر واحد واحد نحدد الدائره بالضغط عليها ثم نعبئها بالباترن المختار ... والان نريد اعطاء الدوائر شكل افضل .. نختار الاداة الموضحه
بالصوره ونذهب للخيار الاخير .
http://img32.imageshack.us/img32/698/webcopyw.jpg
نعمل كما تلاحظ بالصوره وهذا لأعطاء الدائره تحديد على اطرافها
http://img156.imageshack.us/img156/629/webcopy.jpg
الان نرسم دائرتين بالاعلى كما تلاحظ
http://img156.imageshack.us/img156/7937/webcopys.jpg
ونعدل على الدوائر لنعطيها شكل افضل
http://img156.imageshack.us/img156/4923/webcopyf.jpg
نبداء بضبط الاعدادات كما تلاحظ بالصور التاليه
http://img41.imageshack.us/img41/629/webcopy.jpg
http://img529.imageshack.us/img529/1198/webcopycopy.jpg
http://img189.imageshack.us/img189/4339/79603396.gif
http://img189.imageshack.us/img189/8242/64312113.gif
وهذا التعديل الاخير ولاكن انتبه عند الانتهاء من ضبط الاعدادات نضغط على الزر المحدد باللون الأحمر . نيو ستايل . لنحفظ التعديلات ونطبقها بكل سهوله على
اي شكل اخر ... بعد الحفظ اضغط اوكي ..
http://img154.imageshack.us/img154/8193/60837453.gif
الان نطبق الاعدادات على الدائره الثانيه نفس الاولى .. وهذا بالذهاب الى قائمة الستايلات او الانماط .. وختيار اخر نمط . وهو الذي قمنا بحفظة قبل قليل
. ومن لم تظهر له هذه الانماط يذهب الى .. قائمة وندوز او نوافذ .. ثم يختار ستايل او نمط ....... بعد تعديل الدوائر . نرسم مستطيل فوقها
ونعطيه الاعدادات نفس مافعلنا بالدوائر .. ونقوم بتعبئتة بالباترن كما تعلمنا قبل قليل ... ينتج هذا الشكل
http://img189.imageshack.us/img189/3450/16293431.gif
الان نريد ان نرسم اشكال على الاطراف للبنر ... نختار الشكل من قائمة الادوات ونحدد الشكل الذي نريد كما تلاحظ بالصوره وهو محدد باللون الاحمر
ومن لم تظهر هذه الاشكال عنده يضغط على الزر الصغير بأقصى اليمين .. وهو محدد باللون الازرق بالصوره التاليه .. تظهر قائمه . اختر كلمة all
او الكل
http://img189.imageshack.us/img189/3301/97487392.gif
نرسم بالشكل المحدد اثنين ونوزعها على اليمين واليسار بشكل منسق ونعطيها اعدادات مثل الدوائر السابقه من قائمة ستايل التي حفظنا الاعدادات بها كما تلاحظ
بالصوره
http://img89.imageshack.us/img89/7647/18907005.gif
والان نختار شكل جديد وليكن الموجود بالصوره التاليه
http://www.des-ksa.com/up/images/2-web-p/20.gif
نرسم ورقه يمين وننسخها او نرسم اخرى يسار ونعطيها ستايل نفس ستايل الاشكال الاخر .. وتلاحظ تكرار الاعدادات او الستايل على الكل وهذا لتنسيق الموقع
بشكل احترافي .. الان نريد ان نضبط الشكلين بحيث يظهر الثاني عكس الاول وهذا لتنسيق الشكل بين اليمين واليسار للموقع .. نقوم اولا بتحديد الشكل
المطلوب تابع الصور التاليه
http://img89.imageshack.us/img89/8110/41314646.gif
ثم نعكسها باأتباع الصوره التاليه
http://img89.imageshack.us/img89/980/85336744.gif
ينتج هذا الشكل الى الان
http://img89.imageshack.us/img89/626/74978358.gif
نرسم دائره متناسقه بالنص ونعطيها نفس ستايل الاشكال الاخرى .
http://img89.imageshack.us/img89/1052/94276305.gif
الانر نريد ان نجعل للدائره التي بالنص خلفية ولتكن صوره .. نذهب الى ملف ... فتح .
http://img189.imageshack.us/img189/2599/78708575.gif
نختار الصوره ونضغط فتح
http://img189.imageshack.us/img189/5883/56360513.gif
الان نجعل الصوره فوق الدائره .. وندمجها .. باتباع الصوره التاليه .
http://img189.imageshack.us/img189/9199/10652481.gif
بعد الدمج نريد تعديل الوان الصوره لتتناسق مع الموقع .. تابع الصوره لتعديل الألوان
http://img189.imageshack.us/img189/8887/66768892.gif
تظهر نافذه التعديل .. اول شي نأشر بعلامة صح على المربعات الموضحه تحت .. ثم نسحب الموشر ليعطينا اللون المطلوب للصوره
http://img89.imageshack.us/img89/2122/97585177.gif
بعد تعديل البنر .. باقي اضافات جماليه .. خفيفه .. وليكن كما هو موضح بالصوره التاليه .. نرسم دائره صغيره ثم نختار من الاشكال الخط
http://img189.imageshack.us/img189/185/78590588.gif
نرسم الخط من فوق لتحت كما هو محدد باللون الاحمر بالصوره التاليه .. ونعطيه الفلتر الموضح ... تابع
http://img189.imageshack.us/img189/2138/84762424.gif
تظهر نافذه تحذيريه .. اضغط اوكي
http://img189.imageshack.us/img189/2559/63805046.gif
هذا الفلتر يسمح لك بالتعديل على الخط كما تشاء .. اعمل منحنيات بالخط بالضغط والسحب للجهه التي تريد ... اذا اردت ان تعيده لشكله الاول لتعدل عليه
مره اخرى اضغط على الزر المحدد باللون الاحمر للتعديل .. بعد ضبط الخط اضغط اوكي
http://img89.imageshack.us/img89/2735/10357170.gif
الان نكرر الخط ونعمل الشكل المطلوب مع الدائره الصغيره التي رسمناها .. ونكرر هذا الشكل لتوزيعه على البنر كما تريد ..
ينتج عندنا هذا البنر بشكل احترافي مع الخلفيه
http://img154.imageshack.us/img154/9084/10857364.gif
بعد ان اجتزنا الجزء الاول من تصميم الواجهه الاحترافيه .. وكان الدرس عن تصميم البنر والخلفيه ... نبداء الان بالجزء الثاني وهو الاخير لتصميم الواجهه ولكن ليس الدرس الاخير بالسلسله ...
فبقي علينا بعد تصميم الواجهه تقطيعها وطريقة رفعها على الانترنت وادراج الروابط والجماليات مثل الاهداءات واخر 10 مواضيع وخلافه وايضا طريقة تركيب الشات وضبط اعداداته ... فالطريق مازال طويلاً ومن يريد ان يتعلم كل شي ماعليه الا ان يتابع وان شاء الله تتوضح كل الامور للجميع
درس اليوم هو انهاء الواجهه الرئيسية وسيكون الدرس على الفوتر ثم مربع العشر مواضيع ومربع الاعلانات والشات والقوائم
على بركة الله نبداء ....
نفتح عملنا السابق ونرسم مربع اسفل الواجهه وهو الفوتر على شكل مستطيل منحنى الاطراف
http://img89.imageshack.us/img89/8272/17872881.gif
ندرج صوره ونجعلها فوق الفوتر ونضغط الاختصار CTRL+G من لوحة المفاتيح ليتم دمج الصوره مع الفوتر وهي حركه تجميليه للفوتر وتستطيع ان تستغني عنها
http://img89.imageshack.us/img89/435/36731613.gif
نختار شكل من قائمة الاشكال وهو الموضح بالصور وايضا تستطيع ان تختار مايناسبك ونحن هنا نعطيك البدايه او طريقة التصميم والابداع يبقى عليك انت
http://img89.imageshack.us/img89/7706/41738177.gif
بعد رسم المربع نضبط اعداداته او شكل كما عملنا سابقا بالبنر .. ونوزع الشكل على الفوتر يمين ويسار بحيث يتناسب مع بعضه
http://img10.imageshack.us/img10/6254/81388579.gif
نرسم دائره بالنص ونكتب مانريد داخلها من حفظ حقوق وخلافه ... والى هنا ننتهي من الفوتر
http://img268.imageshack.us/img268/4535/69951980.gif
الان بعد الانتهاء من الفوتر نصمم مربع الاخر 10 مواضيع وهو شكل تجميلي للواجهه ... بالبداية نرسم مستطيل باطراف منحنيه كما تلاحظ
http://img268.imageshack.us/img268/8615/35761173.gif
نكرر المستطيل او نرسم واحد اخر ولكن بشكل اصغر بكثير ونضعه فوق الاول ونكتب مثلا اخر 10 مواضيع بالشكل التالي
http://img268.imageshack.us/img268/1521/98994983.gif
الان انتهينا من اخر 10 مواضيع .. نبداء بتصميم المساحات الأعلانيه وانا اعتبرها من الأساسيات بالموقع .. فهي التي تحقق شهره للموقع بالتبادل الاعلانيه وغيره
نرسم مربع باطراف منحنيه تحت العشر مواضيع ونضبط اعداداته وشكله كما تعلمنا سابقا
http://img186.imageshack.us/img186/1060/22142569.gif
نرسم مربع اخر بنفس الشكل ولاكن اصغر منه قليلا ونضعه فوق الاول
http://img186.imageshack.us/img186/559/93669486.gif
الان ندرج صوره تجميليه ونضغط كما فعلنا سابقا CTRL+G لدمجها مع المربع العلوي وهي حركه تستطيع الاستغنى عنها . ونكتب مثلا مساحه اعلانيه كما تلاحظ بالصوره التاليه وتلاحظ ايضا ترتيب اللير ليسهل عليك معرفة تصميمها
http://img186.imageshack.us/img186/3186/22366831.gif
الان انتهيناء من المساحه الاعلانيه ... مثل ماصممنا الاولى نصمم الثانيه ونجعلها تحت بهذا الشكل
http://img186.imageshack.us/img186/1555/83333080.gif
وهكذا نكون خلصنا من تصميم مربع الشات .. ومثل ماتلاحظ العملية كلها رسم مربعات وتنسيقها لا اكثر .
نبداء بتصميم القوائم وهي اخر ماتبقى لنا .. نذهب الى الأشكال ونختار الشكل المحدد كما تلاحظ بالصور وتستطيع ان تستبدله بأي شكل تريد
http://img186.imageshack.us/img186/3810/52504791.gif
الان نرسم الشكل الذي اخترناه ونرسم ايضا اشكال اخرى بطريقة متناسقه كما تلاحظ هنا
http://img186.imageshack.us/img186/7553/99826756.gif
نرسم دائره فوقها جميعا
http://img196.imageshack.us/img196/2010/17458758.gif
نرسم اشكال اخرى فوق كما تلاحظ لندمجها مع القائمه
http://img229.imageshack.us/img229/7261/69848438.gif
ندمجها واحدا واحدا بالضغط كما تعلمنا سابقا على CTRL+G وهذه الحركه تجميليه
http://img196.imageshack.us/img196/2883/51563737.gif
نرسم شكل اخر فوق كما تلاحظ
http://img186.imageshack.us/img186/9346/59451583.gif
نرسم الازرار وهي مستطيلات متناسقه كما تلاحظ
http://img196.imageshack.us/img196/8306/67131590.gif
نرسم دائر تجميلية صغيره لها كما تلاحظ
http://img186.imageshack.us/img186/200/98087106.gif
نضع روابط للقائمه ..
http://img196.imageshack.us/img196/2325/20523643.gif
وهكذا ننهي الموقع كاملااااااا
اتمنى ان ينال الشرح اعجابكم
ولا تبخلوا بالردود
لاتنس ذكر الله
ارجو التثبيت للافاده
يمكنك الان تصميم موقع شخصى احيرافى لك
ويكنك ايضا تصميم موقع لشركات
الان يمكنك الكسب من خلال بيع التصميمات الجميلة
الان لنبدا
هذه صورة التصميم الذى سنفعل مثلة
http://img189.imageshack.us/img189/627/webx.gif
http://www.des-ksa.com/up/images/2-web-p/1.gif
نختار من ملف .... جديد
http://img30.imageshack.us/img30/9274/webpyg.jpg
نضبط المقاسات كما تلاحظ 770 - 800 بكسيل
http://img190.imageshack.us/img190/3787/webf.jpg
نختار لونين متناسقين واحد ثقيل والاخر خفيف ... ونقوم بتلوين الخلفيه باللون الخفيف كما تلاحظ
http://img32.imageshack.us/img32/9580/webpxl.jpg
الان نرسم بالدائره ( اذا لم تكن واضحه الدائره عندك اضغط الزر الايمن على المربع وخترها من القائمه ) نرسم 3 دوائر ويكون شكلها كما تلاحظ بالصوره
اثنتين بشكل طولي والاخرى كبيره بالنص
http://img156.imageshack.us/img156/6374/webjhr.jpg
الان نحول الدوائر جميعا لنتمكن من التعامل معها بشكل افضل ... تابع الصوره لتحويل الدوائر الى اشكال عاديه
http://img194.imageshack.us/img194/7076/webk.jpg
الان نقوم بتعبئة الدوائر بالباترين .. والباترين هو خطوط او نقط او اشكال لتجميل الحشو بالمربعات والدوائر .. تابع الصوره لتتعرف كيف يتم الوصل للباترين
والتعبئه
http://img190.imageshack.us/img190/6691/webt.jpg
نقوم بتعبئة الدوائر واحد واحد نحدد الدائره بالضغط عليها ثم نعبئها بالباترن المختار ... والان نريد اعطاء الدوائر شكل افضل .. نختار الاداة الموضحه
بالصوره ونذهب للخيار الاخير .
http://img32.imageshack.us/img32/698/webcopyw.jpg
نعمل كما تلاحظ بالصوره وهذا لأعطاء الدائره تحديد على اطرافها
http://img156.imageshack.us/img156/629/webcopy.jpg
الان نرسم دائرتين بالاعلى كما تلاحظ
http://img156.imageshack.us/img156/7937/webcopys.jpg
ونعدل على الدوائر لنعطيها شكل افضل
http://img156.imageshack.us/img156/4923/webcopyf.jpg
نبداء بضبط الاعدادات كما تلاحظ بالصور التاليه
http://img41.imageshack.us/img41/629/webcopy.jpg
http://img529.imageshack.us/img529/1198/webcopycopy.jpg
http://img189.imageshack.us/img189/4339/79603396.gif
http://img189.imageshack.us/img189/8242/64312113.gif
وهذا التعديل الاخير ولاكن انتبه عند الانتهاء من ضبط الاعدادات نضغط على الزر المحدد باللون الأحمر . نيو ستايل . لنحفظ التعديلات ونطبقها بكل سهوله على
اي شكل اخر ... بعد الحفظ اضغط اوكي ..
http://img154.imageshack.us/img154/8193/60837453.gif
الان نطبق الاعدادات على الدائره الثانيه نفس الاولى .. وهذا بالذهاب الى قائمة الستايلات او الانماط .. وختيار اخر نمط . وهو الذي قمنا بحفظة قبل قليل
. ومن لم تظهر له هذه الانماط يذهب الى .. قائمة وندوز او نوافذ .. ثم يختار ستايل او نمط ....... بعد تعديل الدوائر . نرسم مستطيل فوقها
ونعطيه الاعدادات نفس مافعلنا بالدوائر .. ونقوم بتعبئتة بالباترن كما تعلمنا قبل قليل ... ينتج هذا الشكل
http://img189.imageshack.us/img189/3450/16293431.gif
الان نريد ان نرسم اشكال على الاطراف للبنر ... نختار الشكل من قائمة الادوات ونحدد الشكل الذي نريد كما تلاحظ بالصوره وهو محدد باللون الاحمر
ومن لم تظهر هذه الاشكال عنده يضغط على الزر الصغير بأقصى اليمين .. وهو محدد باللون الازرق بالصوره التاليه .. تظهر قائمه . اختر كلمة all
او الكل
http://img189.imageshack.us/img189/3301/97487392.gif
نرسم بالشكل المحدد اثنين ونوزعها على اليمين واليسار بشكل منسق ونعطيها اعدادات مثل الدوائر السابقه من قائمة ستايل التي حفظنا الاعدادات بها كما تلاحظ
بالصوره
http://img89.imageshack.us/img89/7647/18907005.gif
والان نختار شكل جديد وليكن الموجود بالصوره التاليه
http://www.des-ksa.com/up/images/2-web-p/20.gif
نرسم ورقه يمين وننسخها او نرسم اخرى يسار ونعطيها ستايل نفس ستايل الاشكال الاخر .. وتلاحظ تكرار الاعدادات او الستايل على الكل وهذا لتنسيق الموقع
بشكل احترافي .. الان نريد ان نضبط الشكلين بحيث يظهر الثاني عكس الاول وهذا لتنسيق الشكل بين اليمين واليسار للموقع .. نقوم اولا بتحديد الشكل
المطلوب تابع الصور التاليه
http://img89.imageshack.us/img89/8110/41314646.gif
ثم نعكسها باأتباع الصوره التاليه
http://img89.imageshack.us/img89/980/85336744.gif
ينتج هذا الشكل الى الان
http://img89.imageshack.us/img89/626/74978358.gif
نرسم دائره متناسقه بالنص ونعطيها نفس ستايل الاشكال الاخرى .
http://img89.imageshack.us/img89/1052/94276305.gif
الانر نريد ان نجعل للدائره التي بالنص خلفية ولتكن صوره .. نذهب الى ملف ... فتح .
http://img189.imageshack.us/img189/2599/78708575.gif
نختار الصوره ونضغط فتح
http://img189.imageshack.us/img189/5883/56360513.gif
الان نجعل الصوره فوق الدائره .. وندمجها .. باتباع الصوره التاليه .
http://img189.imageshack.us/img189/9199/10652481.gif
بعد الدمج نريد تعديل الوان الصوره لتتناسق مع الموقع .. تابع الصوره لتعديل الألوان
http://img189.imageshack.us/img189/8887/66768892.gif
تظهر نافذه التعديل .. اول شي نأشر بعلامة صح على المربعات الموضحه تحت .. ثم نسحب الموشر ليعطينا اللون المطلوب للصوره
http://img89.imageshack.us/img89/2122/97585177.gif
بعد تعديل البنر .. باقي اضافات جماليه .. خفيفه .. وليكن كما هو موضح بالصوره التاليه .. نرسم دائره صغيره ثم نختار من الاشكال الخط
http://img189.imageshack.us/img189/185/78590588.gif
نرسم الخط من فوق لتحت كما هو محدد باللون الاحمر بالصوره التاليه .. ونعطيه الفلتر الموضح ... تابع
http://img189.imageshack.us/img189/2138/84762424.gif
تظهر نافذه تحذيريه .. اضغط اوكي
http://img189.imageshack.us/img189/2559/63805046.gif
هذا الفلتر يسمح لك بالتعديل على الخط كما تشاء .. اعمل منحنيات بالخط بالضغط والسحب للجهه التي تريد ... اذا اردت ان تعيده لشكله الاول لتعدل عليه
مره اخرى اضغط على الزر المحدد باللون الاحمر للتعديل .. بعد ضبط الخط اضغط اوكي
http://img89.imageshack.us/img89/2735/10357170.gif
الان نكرر الخط ونعمل الشكل المطلوب مع الدائره الصغيره التي رسمناها .. ونكرر هذا الشكل لتوزيعه على البنر كما تريد ..
ينتج عندنا هذا البنر بشكل احترافي مع الخلفيه
http://img154.imageshack.us/img154/9084/10857364.gif
بعد ان اجتزنا الجزء الاول من تصميم الواجهه الاحترافيه .. وكان الدرس عن تصميم البنر والخلفيه ... نبداء الان بالجزء الثاني وهو الاخير لتصميم الواجهه ولكن ليس الدرس الاخير بالسلسله ...
فبقي علينا بعد تصميم الواجهه تقطيعها وطريقة رفعها على الانترنت وادراج الروابط والجماليات مثل الاهداءات واخر 10 مواضيع وخلافه وايضا طريقة تركيب الشات وضبط اعداداته ... فالطريق مازال طويلاً ومن يريد ان يتعلم كل شي ماعليه الا ان يتابع وان شاء الله تتوضح كل الامور للجميع
درس اليوم هو انهاء الواجهه الرئيسية وسيكون الدرس على الفوتر ثم مربع العشر مواضيع ومربع الاعلانات والشات والقوائم
على بركة الله نبداء ....
نفتح عملنا السابق ونرسم مربع اسفل الواجهه وهو الفوتر على شكل مستطيل منحنى الاطراف
http://img89.imageshack.us/img89/8272/17872881.gif
ندرج صوره ونجعلها فوق الفوتر ونضغط الاختصار CTRL+G من لوحة المفاتيح ليتم دمج الصوره مع الفوتر وهي حركه تجميليه للفوتر وتستطيع ان تستغني عنها
http://img89.imageshack.us/img89/435/36731613.gif
نختار شكل من قائمة الاشكال وهو الموضح بالصور وايضا تستطيع ان تختار مايناسبك ونحن هنا نعطيك البدايه او طريقة التصميم والابداع يبقى عليك انت
http://img89.imageshack.us/img89/7706/41738177.gif
بعد رسم المربع نضبط اعداداته او شكل كما عملنا سابقا بالبنر .. ونوزع الشكل على الفوتر يمين ويسار بحيث يتناسب مع بعضه
http://img10.imageshack.us/img10/6254/81388579.gif
نرسم دائره بالنص ونكتب مانريد داخلها من حفظ حقوق وخلافه ... والى هنا ننتهي من الفوتر
http://img268.imageshack.us/img268/4535/69951980.gif
الان بعد الانتهاء من الفوتر نصمم مربع الاخر 10 مواضيع وهو شكل تجميلي للواجهه ... بالبداية نرسم مستطيل باطراف منحنيه كما تلاحظ
http://img268.imageshack.us/img268/8615/35761173.gif
نكرر المستطيل او نرسم واحد اخر ولكن بشكل اصغر بكثير ونضعه فوق الاول ونكتب مثلا اخر 10 مواضيع بالشكل التالي
http://img268.imageshack.us/img268/1521/98994983.gif
الان انتهينا من اخر 10 مواضيع .. نبداء بتصميم المساحات الأعلانيه وانا اعتبرها من الأساسيات بالموقع .. فهي التي تحقق شهره للموقع بالتبادل الاعلانيه وغيره
نرسم مربع باطراف منحنيه تحت العشر مواضيع ونضبط اعداداته وشكله كما تعلمنا سابقا
http://img186.imageshack.us/img186/1060/22142569.gif
نرسم مربع اخر بنفس الشكل ولاكن اصغر منه قليلا ونضعه فوق الاول
http://img186.imageshack.us/img186/559/93669486.gif
الان ندرج صوره تجميليه ونضغط كما فعلنا سابقا CTRL+G لدمجها مع المربع العلوي وهي حركه تستطيع الاستغنى عنها . ونكتب مثلا مساحه اعلانيه كما تلاحظ بالصوره التاليه وتلاحظ ايضا ترتيب اللير ليسهل عليك معرفة تصميمها
http://img186.imageshack.us/img186/3186/22366831.gif
الان انتهيناء من المساحه الاعلانيه ... مثل ماصممنا الاولى نصمم الثانيه ونجعلها تحت بهذا الشكل
http://img186.imageshack.us/img186/1555/83333080.gif
وهكذا نكون خلصنا من تصميم مربع الشات .. ومثل ماتلاحظ العملية كلها رسم مربعات وتنسيقها لا اكثر .
نبداء بتصميم القوائم وهي اخر ماتبقى لنا .. نذهب الى الأشكال ونختار الشكل المحدد كما تلاحظ بالصور وتستطيع ان تستبدله بأي شكل تريد
http://img186.imageshack.us/img186/3810/52504791.gif
الان نرسم الشكل الذي اخترناه ونرسم ايضا اشكال اخرى بطريقة متناسقه كما تلاحظ هنا
http://img186.imageshack.us/img186/7553/99826756.gif
نرسم دائره فوقها جميعا
http://img196.imageshack.us/img196/2010/17458758.gif
نرسم اشكال اخرى فوق كما تلاحظ لندمجها مع القائمه
http://img229.imageshack.us/img229/7261/69848438.gif
ندمجها واحدا واحدا بالضغط كما تعلمنا سابقا على CTRL+G وهذه الحركه تجميليه
http://img196.imageshack.us/img196/2883/51563737.gif
نرسم شكل اخر فوق كما تلاحظ
http://img186.imageshack.us/img186/9346/59451583.gif
نرسم الازرار وهي مستطيلات متناسقه كما تلاحظ
http://img196.imageshack.us/img196/8306/67131590.gif
نرسم دائر تجميلية صغيره لها كما تلاحظ
http://img186.imageshack.us/img186/200/98087106.gif
نضع روابط للقائمه ..
http://img196.imageshack.us/img196/2325/20523643.gif
وهكذا ننهي الموقع كاملااااااا
اتمنى ان ينال الشرح اعجابكم
ولا تبخلوا بالردود
لاتنس ذكر الله
ارجو التثبيت للافاده