الرئيســــية الكــادر لماذا نحن؟ اتصل بنا البريد الالكتروني
التأريخ : 2017 - 06 - 29
 
 

مهند التميمي

حيدر عاشور

هادي عباس حسين

خلودالشريف

بان سلمان شكر













موقع شركة الاطلس لايت
موقع شركة الاطلس لايت


موقع شركة هركت
موقع شركة هركت


داناتا
داناتا


reclam
reclam


بوستر
بوستر



حروفيات محمد رضا حروفيات محمد رضا


داخل الغرفة داخل الغرفة


جمال لامع جمال لامع


الطبيعه الطبيعه


نص بعنوان ( اللهم بارك) نص بعنوان ( اللهم بارك)


كيفية حفظ صفحة انترنت بعد تصميها بـ"الفوتو شوب" واخراجها بصيغة "HTML"


الكاتب:فتيان اكرم الفتيان

عدد القراءات -2710

اضغظ للحصول على الحجم الطبيعي للصورةان جميع صفحات الانترنت في الحقيقة هي مقسمة الى عدة مستطيلات او جداول خفية مختلفة الاحجام توضع فيها اجزاء التصميم والمعلومات لكي تظهر في الشكل النهائي بهيئة صفحة واحدة متكاملة.
اضغظ للحصول على الحجم الطبيعي للصورة
انظر الشكل (1)

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

عملية تقسيم التصميم الى جداول تخصص اماكن الصفحة كلٌ حسب وظيفته، اي يخصص جزء للإعلانات وجزء للاقسام والورابط التشعبية وجزء لشعار الموقع وجزء للاخبار، وهكذا حسب متطلبات الصفحة. وهذا يمكننا من تغيير المعلومات في احدى هذه الاجزاء بدون العودة الى التصميم ككل، اي تغيير الجزء فقط.
الاداة التي ستقوم بهذه المهمة في برنامج فوتوشوب هي الاداة (Slice tool)، ويمكن الوصول اليها من خلال شريط الادوات، اذ سنجدها مختبئة ضمن ادواة (Crop tool)، او من خلال الضغط على (Shift+c).
انظر الشكل (2)

بعد تقسيم الصفحة بأداة (Slice tool) حسب التصميم، سيعرض فوتوشوب التقسيمات متضمنة رقم تسلسلي وشكل صغير اشبه بالجبل في الزاوية اليسرى من كل جزء، ان الارقام تشير الى تسلسل وترتيب الجداول او الاجزاء مع ملاحظة لون الارقام اذا كان ازرق فهذا يعني ان الجدول من صنع يد المصمم اما اذا كان لونه رمادي فهذا يعني انه صُنِعَ تلقائياً، اما عن شكل الجبل الذي يظهر الى يمين الرقم فهو دلالة على ان الجدول يتضمن صورة.

وعند النقر بمرة واحدة على الرقم التسلسلي سيتحدد الجزء بإطار ذهبي اللون للتأكيد على انتقاء الجزء. وباستخدام اداة (Slice tool) وبنقر مزدوج على الجزء المحدد سيظهر مربع حوار يسمح بتغيير او اضافة اسم للجزء من خلال (name)، وإضافة رابط الى صفحة اخرى او الى موقع على الانترنت من خلال (URL). انظر الشكل رقم (3). شكل لوحة المواصفات

اذن بهذه الطريقة ايضا يمكننا ان نعمل لوحة ازرار انتقال رئيسية للصفحة الانترنت او الموقع ونعطي لكل زر من هذه الازرار رابط خاص. انظر الشكل رقم (4) شكل ازرار مقسمة


- تصدير العمل او التصميم الى صيغة (HTML):

بعد الانتهاء من التقسيمات واضافة الروابط، نحفظ العمل اولاً بصيغة (psd)، ثم نحفظ التصميم بـصيغة (HTML) عن طريق الذهاب الى (file) ومن ثم اختيار (save for web & Dvices).
اللوحة المخصصة لـ(save for web & Dvices)، تعرض التصميم وتشير الى حجمه في الزاوية اليسرى في اسفل اللوحة، ومن خلال تحديد الجزء عن طريق اداة (Slice tool) في اللوحة ذاتها سنرى حجم الجزء او الصورة المحددة من الزواية نفسها. ومن خلال قائمة (preset) في اعلا يمين اللوحة نتمكن من تحديد نوعية الصورة (jpeg او gif او ping او bmp) والتحكم بدقتها ايضاً. انظر الشكل رقم (5) شكل اللوحة مشيرة الى حجم الصفحة ومكان تخيير نوعية الصورة والدقة
نضغط بعدها على (save) ومنه نحدد اسم الملف، والاهم من قائمة (Format) نختار (HTML and Images). وهذا سيعمل على حفظ التصميم بشكل صفحة انترنت وبلغة (HTML) مع ملف للصور المتعلقة بالتصميم.




2011-12-22

- يرجى الاشارة الى المصدر (الفنون الجميلة) عند الاقتباس والنشر -

محاضرات ذات صلة

تصميم العلاقات في الزمن والفضاء

تأثير المفاهيم والمذاهب الفنية على بيئة المنتج جمالياً ووظيفياً

العملية التصميمية

مدخل في تحليل التصميم.. الحجم

صناعة شكل الرعد بواسطة برنامج فوتوشوب

المصمم الصناعي والمعالجات البيئية للمنتج الصناعي

تحليل العلاقات في التصميم

الفكرة والتصميم

الفاعلية بين عناصر التصميم والبيئة

إعادة رسـم الخطوط العربية والزخرفة وتطويرها بواسطة (PhotoShop)

مراحل في تحليل الغلاف الحيوي للظاهر التصميمي

البيئة الثلاثية الأبعاد

تحويل النصوص أو الأشكال إلى نار ملتهبة بواسطة برنامج فوتوشوب

الاختراع..الابتكار..التطوير

الأسس في التصميم ليست هدفاً


 
  ©  جميع حقوق النشر محفوظة باسم موقع - " الفنون الجميلة " - 2017