مثال Dreamweaver MX: مهارات تطبيق الصور

تسريع تنزيل الصور

إذا كان هناك عدد كبير جدًا من الصور في صفحة الويب، فسيؤثر ذلك على سرعة التصفح. يستطيع Dreamweaver بسهولة إعداد الصور المحملة مسبقًا لتسريع تنزيلات الصور، مما يسمح للموقع بالظهور أمام المستخدمين في أسرع وقت ممكن.

وصف التأثير هو إنشاء ملف وتحميل الصورة مسبقًا أولاً بحيث يتم تنزيل الصورة إلى ذاكرة التخزين المؤقت مسبقًا لتسريع سرعة تنزيل الصورة. للحصول على التأثير الفعلي، يرجى تصفح الملف "المثال 36 - تسريع سرعة تنزيل الصور" الموجود في دليل "Dreamweaver MX 2004 100 أمثلة" الموجود على القرص المضغوط الذي يأتي مع الكتاب.

أفكار إبداعية افتح الصفحة الجديدة لبرنامج Dreamweaver MX 2004، ثم افتح لوحة الملصقات، وحدد خيار [Preload Image] في [Behavior] لتسريع عملية تنزيل الصور.

خطوات العملية

(1) قم بإنشاء ملف جديد، العملية موضحة في الشكل 36-1.



(2) احفظ الصفحة وأدخل الصورة. لكي لا يتم المطالبة بالمسارات النسبية عند إدراج الصور، قم أولاً بحفظ الصفحة باسم "36.htm". ثم أدخل الصورة المراد تحميلها مسبقاً، كما هو موضح في الشكل 36-2.


الشكل 2-36 أدخل صورة

(3) إضافة وظيفة "تحميل الصورة مسبقًا". استخدم لوحة سلوك Dreamweaver لإضافة وظيفة "التحميل المسبق للصورة"، كما هو موضح في الشكل 36-3.

(4) حدد الصورة المراد تحميلها مسبقًا، وتكون العملية كما هو موضح في الشكل 36-4.

نصيحة: إذا كان هناك عدة صور كبيرة على الموقع، فيمكنك النقر فوق أيقونة [+] أعلى [صورة التحميل المسبق] لإضافة صور متعددة التحميل المسبق، وتكون العملية المحددة هي نفسها كما هو موضح في الشكل 36-4.

(5) احفظ الملف لإكمال العملية. وبهذه الطريقة، يمكن تسريع سرعة تنزيل الصور، بحيث لا ينتظر المستخدمون وقتًا طويلاً عند تصفح الويب، وهو أمر له أهمية كبيرة لتحسين أداء موقع الويب.

صور اعلانية عشوائية

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

وصف التأثير عند تصفح إحدى صفحات الويب، ستظهر صورة إعلانية في منطقة البانر بصفحة الويب، كما هو موضح في الشكل 38-1. وبعد ذلك يتم تحديث الصورة الإعلانية كل ثانيتين، وتظهر الصورة الإعلانية بشكل عشوائي، كما هو موضح في الشكل 38-2.

أفكار إبداعية باستخدام المكون الإضافي Advance_Random_Images الخاص بـ Macromedia، يمكنك بسهولة إنشاء صور إعلانية عشوائية في صفحات الويب.

خطوات العملية

(1) قم بتثبيت البرنامج الإضافي. استخدم الأمر [Command] |. [Extension Management] في شريط القائمة لإظهار مربع الحوار [Macromedia Extension Manager] وتثبيت الامتداد Advance_Random_Images، كما هو موضح في الشكل 38-3.

(2) استدعاء الأمر. افتح ملفbanner.htm في المجلد المصدر لهذا المثال، ثم ضع المؤشر في الموقع الذي تريد إدراج الإعلان فيه، ثم قم باستدعاء الأمر [AdvancedRandomImages]، كما هو موضح في الشكل 38-4.

(3) ضبط الصورة. قم بتعيين خصائص تحويل الصورة في مربع الحوار [RandomImages] المنبثق، كما هو موضح في الشكل 38-5.

(4) إضافة الصور. أضف الصورة الإعلانية الأولى كما هو موضح في الشكل 38-6.

نصيحة: يتم وضع الصور المستخدمة في هذا المثال في مجلد الشعار في مجلد المواد الخاص بهذا المثال.

(5) ثم استخدم نفس الطريقة لإضافة صور أخرى بعد الانتهاء من الإضافة، انقر فوق الزر [موافق] لتأكيد العملية، كما هو موضح في الشكل 38-7.

(6) ثم قم بحفظ ملف الصفحة ومعاينته، ​​وسيتم إنشاء تأثير الصورة الإعلانية العشوائية. يمكن للقراء الرجوع إلى ملف التأثيرbannerok.htm في مجلد المواد الخاص بهذا المثال لمعرفة ما إذا كانت نتيجة الإنتاج صحيحة. عند هذه النقطة، تم الانتهاء من هذا المثال.

يتم استخدام التقنية الموضحة في هذا المثال بشكل شائع في العديد من مواقع الويب، على سبيل المثال، في العديد من مواقع البوابات المحلية الكبيرة، يمكن رؤية إعلانات التحويل هذه في كل صفحة تقريبًا.