Unconfigured Ad Widget

تقليص

إعـــــــلان

تقليص
لا يوجد إعلان حتى الآن.

تصميم المواقع ببرنامج الفوتوشوب (1)

تقليص
X
 
  • تصفية - فلترة
  • الوقت
  • عرض
إلغاء تحديد الكل
مشاركات جديدة

  • تصميم المواقع ببرنامج الفوتوشوب (1)

    هذا الدرس سيقسّم إلى ثلاثة أقسام ، وسيتم إنشاء موقع ويب على 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

  • #2
    موضوع جدا مهم
    جزاك الله خير
    وبانتظار بقية الدرس

    تعليق


    • #3
      السلام عليكم والرحمة

      والله درس رائع اخوي " مازن " ومفيد جدا جدا جدا
      ومهم جدا جدا جدا


      وشكرا لك على هذا الدرس

      وننتظر التتمة




      محبكم
      تحياتي للجميييييييييييع....دون استثناء!!

      sa7er

      تعليق


      • #4
        حياكم الله وبيّاكم يا إخوان ... وشكرا لكم على تفاعلكم

        فيه إشكال عند الكثيرين .. في النقطة رقم 3 ، 4
        ------------------------ لذلك بنشرحها بتفصيل أكثر :
        كثرة الألوان ..... إذا كانت الألوان هذي على شكل صور ...
        أما إذا كانت خلفيات لجداول ... أو خلفية لصفحة ... فما راح يتأخر التحميل ....
        فغير معقول أن يقوم أحدهم بواسطة برنامج الفرونت بيج " باختيار خلفية أكثر من لون " .... ولكن المعقول هو أن يقوم بتصميم خلفية
        إما أن تكون كبيرة جدا ً ... " ملء المتصفح كاملا ً "
        وتكون تحوي أكثر من لون ...
        ببساطة .... نصمم العمل في الفوتوشوب بخلفية لون واحد .... لكي يسهل علينا بعد ذلك ... إزالة الصور ...
        مثال ليبين المقال :
        http://mazmooz.virtualave.net/front-4.gif
        واستبدالها بـ " خلفية للصفحة أو للجدول " ... بنفس اللون ...
        فنكون بذلك استبدلنا ... " صورة = حجم ثقيل في التحميل "
        بـ " لون = سريع في التحميل "
        --------------------------------------------------
        4-حاول أن تكون خلفية العمل عندك خلفية بلون واحد ، أو خلفية يسهل " على برنامج الفرونت بيج تكرارها "
        ---
        سؤال جيد وممتاز ......
        نعم الفرونت بيج يكرر الخلفيات !!
        ولكن الكثير من الإخوان قد أغفل هذه الخاصية التي ... لو علموها وأتقنوها .... " لوفرّت عليه جهدا ً ... ووفرت على زائر الموقع وقت كبير في التحميل " ... بس كل هذا .... يكون تحت قياسات معينة !! ومهمة هالشغلة ...

        مثال ... ليبين المقال : ...
        واحد يبي يحط خلفية في موقعه
        المطلوب منه أن تكون الخلفية على كامل الصفحة ... مثل هالشكل :
        http://mazmooz.virtualave.net/front-1.jpg
        .......
        أكيد راح يصمم خلفية ... بحيث إن هالخلفية ... تكون كافيه أن تظهر على جميع الصفحة " 800 * 600 " ....
        http://mazmooz.virtualave.net/front-3.jpg
        عاد ، شوفوا الوقت اللي راح يآخذه الزائر بتحميل هالصورة ... " اكنه يحمل برنامج " .... وربما كانت قياسات شاشة زائر الموقع " 1024 * 768 " .... وساعتها ماراح تظهر الخلفية بالشكل المطلوب !
        الحل ... هو بالخلفية هذي :
        http://mazmooz.virtualave.net/front-2.jpg
        هذي الخلفية ... تعطي نفس نتيجة ... الخلفية الكبيرة اللي من شوي تكلمنا عنها .... بس إنها أصغر في الحجم والمقاس ! ...
        والسبب راجع إلى ... خاصية تكرار الخلفية في برنامج الفرونت بيج ..

        -- أتمنى إني أكون وصلت لكم الفكرة .... واللي عنده أي سؤال يتفضل يطرحه ... وإن شاء الله نحاول إننا نجاوب عليه ---
        ملاحظة / الدرس موجود بموقع http://www.mazoo.com
        وما وضع هنا إلا لمناقشته والتعمق فيه أكثر .. وليراه من لم يزر الصفحة

        نـــون بيزعل علينا قمنا نشرح الفرونت بيج ... هنا .. تحملنا أخوي لأن الاستخدام الفعلي لـ
        الفوتوشوب هو 75 % تقريبا ً من الموقع يعني أفضل شئ هذا المنبر

        تعليق


        • #5
          sa7er :
          وعليكم السلام ورحمة الله ....

          ----------------
          التتمة . ستكون في القريب العاجل إن شاء الله تعالى فانتظروا

          تعليق


          • #6
            حلو كتير كتير مازن


            الله يوفقك ..

            نستناك
            أشق شيء على الإنسان فرقته
            لمن يحب ويهوى أينما كانا
            تمربالمرء أوقات يضيق بها
            ذرعا فيذكر أن الله أحيانا

            تعليق

            يعمل...
            X