استخدام الفوتوشوب

فى الدرس السابق تكلمنا عن معنى دقة الصورة و انها تقاس بالنقطة او البكسل و ان المساحة الكلية لصفحة الانترنت هى 720×400

و يجب الالتزام بهذه المساحة عند وضع الصور بالصفحة

و الصورة السابقة ذات مساحة 200 × 200 و هذه المساحة تصلح للاعلانات الجانبية اى الاعلانات او الصور اللتى توضع فى جانب صفحة الموقع مثل تلك الموضوعة فى الجانب الايسر للمدونة

سؤال: اذا كانت صورة بحجم 600 × 400 ووضعتها فى المدونة كما هى و تتيح لى المدونة تصغير ابعاد الصورة فلماذا نحتاج لتصغيرها فى الفوتوشوب او فى اى برنامج رسومات اخر؟

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

فمثلا الصورة 600×400 مساحتها التخزينية تقريبا 80 كيلوبايت و هو حجم رهيب بالنسبة لصفحة الانترنت اذ تأخذ الصفحة فى التحميل ما يقرب من 27 ثانية على سرعة التليفون العادى اما الصورة 200×200 فحجمها 4 كيلوبايت فقط و تأخذ ما يقرب من 4 ثوانى للتحميل على سرعة التليفون العادى

اذا من المهم تقليل دقة الصورة الى اقصى حد ممكن لزيادة سرعة التحميل على الانترنت

الصورة السابقة مثال على الصور بحجم 600×400 و هذا الحجم يصلح لوضعه فى صفحة الموقع فى المنتصف مثلا

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

نأتى لدور الفوتوشوب فى تصغير الصور

نفتح الصورة على الفوتوشوب ثم نختار قائمة
Image

ثم

Image Size

يظهر الشكل الاتى

نرى من التحديد الاماكن اللتى نعدل بها حجم الصورة وهى

Width

عرض الصورة وهو هنا 642 بيكسل

Hight

ارتفاع الصورة وهو هنا 482 بيكسل

ملاحظة: فى الشكل السابق نلاحظ انه عند تعديل عرض الصورة يتعدل الارتفاع تلقائيا و لايمكن تعديل احدهما دون الاخر الا بازالة العلامة على الاختيار

Constraint Proportions

و يتبين من علامة الرابط بجانب العرض و الارتفاع

و عند ازالة العلامة على الاختيار السابق نستطيع تعديل كل من العرض و الارتفاع على حدة

عند الانتهاء نضغط على زر

Ok

***

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

اول ما يتبادر الى الذهن هو اختيار

save او save as

من قائمة

File

اقول لكم اننا اذا حفظنا الصورة بالاختيارات السابقة فإن تعديلاتنا السابقة تصبح غير ذات اهمية

و لكن نستخدم امر

save for web

من قائمة

file

كما يتبين من الشكل الاتى

و عند اختيار الامر السابق نحصل على الشكل التالى

نتأكد من اختيار المنظور الرباعى كما بالشكل السابق و ذلك بالضغط على

4Up

كما هو محدد فى اعلى يسار الشكل

من التحديد الايمن يتضح لنا اننا اخترنا نوع الصورة

JPG

جودة

Low

وهى المناسبة لصفحات الانترنت و يتضح من اسفل الصورة الاولى ان هذه الصورة ذات مساحة تخزين 3.85 كيلوبايت تقريبا و ان سرعة التحميل هى 2 ثانية على سرعة التليفون العادى التى تبلغ 28 كيلوبت (بت و ليس بايت) اذ ان الحجم يقاس بالبايت و سرعة التحميل تقاس بالبت فى الثانية مع ملاحظة ان البايت يساوى 8 بت

بقى ان نضغط على

save

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

نصيحة هامة: يجب التأكد من مساحة الصورة و ابعادها قبل تحميلها على الانترنت

دقة الصور و عدد النقاط المستخدمة

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

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

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

فلنبدأ على بركة الله

***

تعريف دقة الصورة

Resolution

دقة الصورة تعنى عدد النقاط اللتى تملأ صورة ما

يعنى ان كل صورة فى الكمبيوتر تتكون من عدد صغير جدا من النقط اللتى لا ترى بالعين المجردة و تسمى

pixels

و تترتب افقيا و رأسيا بحيث ترسم لنا الصورة النهائية

و تؤثر كثافة النقط المكونة للصورة على مساحة الصورة التخزينية و كذلك تؤثر على سرعة تحميلها من الانترنت

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

و ايضا كلما ازداد عدد النقاط فى الصورة كلما ازداد حجمها على الشاشة

ملحوظة: فى مجال الكمبيوتر لا نستخدم السنتيمتر فى قياس حجم الصورة على الشاشة و لكن نستخدم النقط او البكسلات

PIXELS

الشكل السابق يعرض لنا معلومات الصورة و اللتى تشمل دقتها و نوعها

و نوع الصورة المبين هو

JPEG

او

JPG

و هو النوع الشائع الاستخدام فى الانترنت و من مميزاته قلة المساحة المستخدمة مع الصورة لزيادة سرعة تحميلها

و هناك انواع اخرى للصور مثل

BitMap

او

BMP

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

النوع

GIF

و هو يستخدم فى عمل خلفيات المواقع و كذلك الصور المتحركة و سوف اتكلم عن هذا النوع فى درس لاحق

و يتبين من الشكل السابق ان الدقة المستخدمة للصورة الاولى هى

642×452

و معناها 642 نقطة افقى × 452 نقطة رأسى وهى كبيرة نوعا ما اذ ان حجم الشاشة المستخدمة فى تصفح الانترنت هى

720×400

و المساحة المذكورة تقاس بالنقطة او البكسل كما ذكرت سابقا

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

ملحوظة: اصدار البرنامج المستخدم هو

PhotoShop 8 CS ME

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