هذا الدرس سيقسّم إلى ثلاثة أقسام ، وسيتم إنشاء موقع ويب على 3 مراحل ، وهي كالتالي :
- التصميم بواسطة الفوتوشوب .
- التقطيع بواسطة الإيميج ردي " أو الفوتوشوب نفسه "
- التحرير والترتيب و " الفبركة " بواسطة الفرونت بيج .
قبل الشروع في الدرس تأكد أن لديك كلا ً من البرنامجين التاليين :
أدوبي فوتوشوب (5.5 ، 6 )
فرونت بيج XP
---------------------------------------------------------------------------------
أولا : الفوتوشوب
----
1- قم بإنشاء ملف جديد ، قياساته كالتالي :
عرض : 780 (( أنت ملزم بهذا القياس لشاشات 800 / 600 )) وهو الأفضل
طول : 438 (( يختلف هذا القياس باختلاف طول الصفحة ، فإذت كانت الصفحة طويلة " دليل مواقع أو صفحة
داخلية مثلا ً " فسيكون القياس طويل ، أما إذا كانت صفحة مقدمة " واجهة " فأنصحك بهذا القياس ))
دقة : 50 (( مناسبة لمثل هذه التصاميم ولتصاميم ويب عموما ً ))
وكل هذه الخطوات مبينة في الشكل المجاور .
http://www.mazoo.com/html/images/web-tut-1.gif
-------
الآن بعد عملية انشاء الملف تأتيك صفحة بيضاء خاوية ، فمالعمل ؟!
يجب على المصمم التفريق بين صفحات ويب والتصاميم العادية (( نقطة مهمة جدا ً ))
ففي الإنترنت (( ولا سيما انترنتنّا )) هناك مسألة التحميل والسحب من الخادم صور الموقع ونصوصه ، لذلك
وجب عليك أن تنتبه لهذه النقطة وعليه ، اتبع التالي :
-------
2- حاول ابقاء مكان أبيض فارغ للنص (( لا أنصحك بكتابة النص بالفوتوشوب لأنه سيتعامل معه على أساس أنه
صورة وهذا قد يأخذ وقتا ً أكثر من النص العادي )) لأننا سنقوم لاحقا بقص الفراغ هذا وكتابة النص المطلوب
مكانه .. وهنا في الشكل المجاور مثال يبين المقصود .
http://www.mazoo.com/html/images/web-tut-2.gif
-----
3-الإسهاب في الألوان وكثرتها قد يتعبك ، إذا كنت تريد موقع ويب سريع التحميل مميز وممتاز .. (( من ناحية
الألوان فدع الفوتوشوب نفسه يتولى هذه العملية )) يمكنك اختيار لوح ألوان " خاص للويب " وذلك كما هو مبين
لك في الشكل .
http://www.mazoo.com/html/images/web-tut-3.gif
-----
4-حاول أن تكون خلفية العمل عندك خلفية بلون واحد ، أو خلفية يسهل " على برنامج الفرونت بيج تكرارها
بدون تأثر للخلفية " ... =|| سنقوم بإفراد درس كامل إن شاء الله تعالى عن الخلفيات والأزرار لصفحات ويب
=|| ، والسبب في ذلك هو أننا أحيانا ً يمكننا أن نستغني عن صور ليس لها داعي في العمل فنقوم بحذفها " أزلنا
صورة " واستبدالها بخلفية كاملة لصفحة الإنترنت " استبدلناها بلون "
--------
5- حاول أن تقوم بعملية رسم " كروكي " للموقع على ورقة خارجية لتسهل عليك عملية التنفيذ ، وتركيب
الشكل الإجمالي ، ولو كانت الورقة ملونه أو مكتوب على الأماكن الألوان والمعلومات فهذا سيكون أفضل .
لاحظ الشكل المجاور .
http://www.mazoo.com/html/images/web-tut-4.jpg
--------
-{}--الـــتتمة في الدرس القادم-{}--
هذا الدرس أحد دروس القسم التقني من موقع مـازن :
http://www.mazoo.com
- التصميم بواسطة الفوتوشوب .
- التقطيع بواسطة الإيميج ردي " أو الفوتوشوب نفسه "
- التحرير والترتيب و " الفبركة " بواسطة الفرونت بيج .
قبل الشروع في الدرس تأكد أن لديك كلا ً من البرنامجين التاليين :
أدوبي فوتوشوب (5.5 ، 6 )
فرونت بيج XP
---------------------------------------------------------------------------------
أولا : الفوتوشوب
----
1- قم بإنشاء ملف جديد ، قياساته كالتالي :
عرض : 780 (( أنت ملزم بهذا القياس لشاشات 800 / 600 )) وهو الأفضل
طول : 438 (( يختلف هذا القياس باختلاف طول الصفحة ، فإذت كانت الصفحة طويلة " دليل مواقع أو صفحة
داخلية مثلا ً " فسيكون القياس طويل ، أما إذا كانت صفحة مقدمة " واجهة " فأنصحك بهذا القياس ))
دقة : 50 (( مناسبة لمثل هذه التصاميم ولتصاميم ويب عموما ً ))
وكل هذه الخطوات مبينة في الشكل المجاور .
http://www.mazoo.com/html/images/web-tut-1.gif
-------
الآن بعد عملية انشاء الملف تأتيك صفحة بيضاء خاوية ، فمالعمل ؟!
يجب على المصمم التفريق بين صفحات ويب والتصاميم العادية (( نقطة مهمة جدا ً ))
ففي الإنترنت (( ولا سيما انترنتنّا )) هناك مسألة التحميل والسحب من الخادم صور الموقع ونصوصه ، لذلك
وجب عليك أن تنتبه لهذه النقطة وعليه ، اتبع التالي :
-------
2- حاول ابقاء مكان أبيض فارغ للنص (( لا أنصحك بكتابة النص بالفوتوشوب لأنه سيتعامل معه على أساس أنه
صورة وهذا قد يأخذ وقتا ً أكثر من النص العادي )) لأننا سنقوم لاحقا بقص الفراغ هذا وكتابة النص المطلوب
مكانه .. وهنا في الشكل المجاور مثال يبين المقصود .
http://www.mazoo.com/html/images/web-tut-2.gif
-----
3-الإسهاب في الألوان وكثرتها قد يتعبك ، إذا كنت تريد موقع ويب سريع التحميل مميز وممتاز .. (( من ناحية
الألوان فدع الفوتوشوب نفسه يتولى هذه العملية )) يمكنك اختيار لوح ألوان " خاص للويب " وذلك كما هو مبين
لك في الشكل .
http://www.mazoo.com/html/images/web-tut-3.gif
-----
4-حاول أن تكون خلفية العمل عندك خلفية بلون واحد ، أو خلفية يسهل " على برنامج الفرونت بيج تكرارها
بدون تأثر للخلفية " ... =|| سنقوم بإفراد درس كامل إن شاء الله تعالى عن الخلفيات والأزرار لصفحات ويب
=|| ، والسبب في ذلك هو أننا أحيانا ً يمكننا أن نستغني عن صور ليس لها داعي في العمل فنقوم بحذفها " أزلنا
صورة " واستبدالها بخلفية كاملة لصفحة الإنترنت " استبدلناها بلون "
--------
5- حاول أن تقوم بعملية رسم " كروكي " للموقع على ورقة خارجية لتسهل عليك عملية التنفيذ ، وتركيب
الشكل الإجمالي ، ولو كانت الورقة ملونه أو مكتوب على الأماكن الألوان والمعلومات فهذا سيكون أفضل .
لاحظ الشكل المجاور .
http://www.mazoo.com/html/images/web-tut-4.jpg
--------
-{}--الـــتتمة في الدرس القادم-{}--
هذا الدرس أحد دروس القسم التقني من موقع مـازن :
http://www.mazoo.com
تعليق