يمكن لعلامة IFRAME إنشاء إطار مضمن في صفحة الويب ، والذي يستدعي محتوى مستند صفحة ويب أخرى من خلال تحديد سمة SRC. مثل FrameSet ، يتم استخدامه لتقسيم بنية صفحة الويب للحفاظ على بعض أجزاء صفحة الويب العامة ، ولكن بالمقارنة مع بنية إطار FrameSet التي تقسم صفحة الويب بأكملها ، تكون الإطارات أكثر مرونة ويمكن تضمينها في أي مكان على صفحة الويب. نظرًا لهذه الميزة من استخدام IFRAME ، فقد تم استخدامه على نطاق واسع في بعض صفحات الويب ، مما أدى أيضًا إلى بعض الإساءة غير المناسبة. سيقوم تصميم الويب بتحليل عدة طرق شائعة لاستخدام عنصر الويب iframe.
- صنع مكون صفحة استجابة خالية من التحديث كحل للتبادل غير المتزامن للبيانات. هذه طريقة بديلة لإرسال الطلبات بشكل غير متزامن دون استخدام Ajax في الأيام الأولى. من خلال تعيين عنصر غير مرئي على الصفحة على الصفحة وإشارة سمة SRC الخاصة به إلى عنوان الصفحة حيث يحتاج الطلب إلى إرسال الطلب ، يمكن إرسال الطلب. في نفس المجال ، يمكن تحليل الصفحة التي تم إرجاعها للحصول على البيانات. ميزة أخرى هي أنه يتجاوز نموذج أمان صندوق الرمل في Ajax ويمكنه إرسال طلبات النطاق عبر المجال بنجاح للحصول على البيانات ، ولكن في هذه الحالة ، لا يمكن استرداد كائن المستند الخاص بـ iframe. بسبب خاصتها ، لا يزال قابلاً للتطبيق في بعض صفحات الويب التي تتطلب طلبات متعددة المجالات. هذا النوع من التحديث المجاني يعني أن الصفحة الأصل لا يتم تحديثها أثناء عملية تبادل البيانات وتستمر في الاستجابة لعمليات المستخدم. يتم قفل تبادل البيانات الفعلي بواسطة صفحة iframe المضمنة على الصفحة الأصل. يمكن تعيين صفحة Iframe المدمجة هذه لتكون مرئية أو غير مرئية حسب الحاجة ولن تؤثر على استجابة العناصر الأخرى في الصفحة الأصل للمستخدم. يشبه هذا التأثير أن التحديث الخالي من Ajax ، ولكن يمكن أن نرى أن آليته مختلفة تمامًا. على الرغم من أن Gmail هو نموذج لتطبيقات Ajax ، إلا أنه يجمع بين العديد من الإطارات لتحقيق أدائها المتفوق وتجربة المستخدم.
- طريقة لتحسين الصفحة. استخدم IFRAMES لتحميل البرامج النصية بالتوازي لحل مشاكل التحميل الخاصة بمحتوى الطرف الثالث البطيء مثل الرموز والإعلانات. تعني منصة إعلانات Google AdSense استخدام IFRAME لمشاركة الإيرادات على مواقع المستخدمين. يمكنك أيضًا رؤية هذا النوع من التكنولوجيا من خلال عرض وتحليل رموز الإعلان على الصفحة الرئيسية للبوابة المحلية. يمكنك أيضًا استخدام iframe المخفي لإحداث ملفات أكبر مسبقًا لتخزين ذاكرة التخزين المؤقت عندما تكون الشبكة تحت ضغط الشبكة المنخفض ، بحيث يمكن للصفحات الأخرى استخدامها. يمكن تحليل مفهوم التحميل المسبق باستخدام Firebug للصفحة الرئيسية Google. يمكنك أن ترى في علامة الجسم:
onload = document.fqfocus () ؛ if (document.images) new Image ().
باستخدام مثل هذا الرمز ، لا يتم استخدام الصورة المحملة NAV_LOGO4.PNG على الصفحة الرئيسية ، ولكن عند استخدام هذه الصورة على صفحات أخرى مثل قائمة نتائج البحث ، تحتاج فقط إلى قراءتها من ذاكرة التخزين المؤقت ولا تحتاج إلى تنزيلها مرة أخرى.
- كطريقة اختراق للطبقة العائمة في متصفح IE6 لحظر عناصر التحكم في تحديد العناصر وعناصر الفلاش. في عصر Web2.0 ، أصبحت تقنية Lightbox (أو سميث بوكس) تأثيرًا شائعًا مع تجربتها الجيدة وتجربتها البصرية الجديدة. تستخدم هذه التقنية في الواقع طبقة عائمة مكونة تمامًا لتغطية الصفحة الأصلية لتقديم المعلومات النصية أو الصور أو النماذج أو أي عناصر صفحات تعسفية أخرى ، لتحل محل الطريقة في تطوير الويب المبكر التي غالبًا ما تستخدم رسائل أو ضوابط مدخلات المتصفح المنبثقة للتفاعل مع المستخدمين. بالطرق القديمة ، يتم اعتراض البرامج النصية التي تطفو على النوافذ الجديدة غالبًا من خلال نظام حظر إعلانات المتصفح ، ويتم انتقاد أدوات التحكم في الرسائل الخاصة بالمتصفح من قبل باحثين تجربة المستخدم لأنهم يقطعون عملية المتصفح ، مما يؤدي إلى تصفح صفحات الويب بأكملها من خلال علامات متعددة يتم قفلها. بصفتك مطورًا أماميًا للوصول الأمامي مع متطلبات صارمة على نفسك ، ستواجه بالتأكيد هذه المشكلة في عملية تنفيذ تأثير Lightbox. لا يمكن لطبقة تحديد المواقع المطلقة تغطية عناصر تحكم SELECT وفلاش على صفحة الويب في IE6 ، وحتى إذا تم تعيين النمط على قيمة Z-Index أعلى ، فسيكون ذلك عديم الفائدة. هذا لأن العنصر المحدد هو عنصر على مستوى النموذج في IE6 ، وأولويته أعلى بكثير من جميع علامات HTML الأخرى. يمكن فقط تغطيته الإطارات من نفس المستوى. لذلك ، وجد المطورون أن وضع الطبقة العائمة في iframe أو وضع iframe في الطبقة العائمة يمكن أن يحل هذه المشكلة. لحسن الحظ ، تم تصحيح هذه المشكلة في إصدار ترقية IE بعد IE6 ، ولكن بالنسبة لـ IE6 ، والتي لا تزال لديها حصة السوق بنسبة 50 ٪+ (الإحصاءات اعتبارًا من وقت النشر) ، لا يزال هذا الحل ذا أهمية عملية.
بالإضافة إلى التطبيقات الثلاثة المذكورة أعلاه ، تعد بعض التطبيقات غير المناسبة شائعة أيضًا لعناصر IFRAME. على سبيل المثال ، قم بتضمين الكثير من إطارات iframe في الصفحة ، وقم بتحديث iframe عند النقر فوقه عن طريق تحديد السمة الهدف لعلامة الارتباط خارج الإطار. يشبه هذا الاستخدام FrameSet ، وتحقيق الغرض من مشاركة التنقل. النية الأصلية جيدة ، ولكن لا يوجد شك في العيوب. سيؤدي هذا إلى الكثير من الطلبات لصفحة. تنص مقالة "أفضل الممارسات لتسريع موقع الويب الخاص بك" المذكورة أعلاه بوضوح أن تحسين الصفحات يتطلب تقليل عدد الإطارات المعيارية ، ويلخص ثلاثة عيوب:
- حتى إذا كان المحتوى فارغًا ، فسوف يتسبب في فقدان الموارد (بما في ذلك العميل والخادم) ؛
- مشغلات حدث Onload Clock (الكتل صفحة Onload ، ويتم ترجمتها لأنها ستمنع الصفحة من التحميل ، هناك شك هنا)
- لا توجد دلالات (SEO جزء مهم من تسويق الموقع)
في الإصدار التالي من HTML5 من XHTML1.0 ، لا يوجد أي دعم لعلامة الإطارات بسبب التأثير السلبي على توفر صفحة الويب ، وهو ما يفسر أيضًا بعض المشكلات من الجانب.
بالإضافة إلى ذلك ، نظرًا لأن IFRAME المدمج لا يمكنه التكيف تلقائيًا مع حجم المحتوى الداخلي الخاص به ، من أجل الحفاظ على سلامة عرض الصفحة ، من الضروري أيضًا كتابة نص JavaScript لضبط حجمه على الفور وفقًا للتغييرات في محتوى IFRAME. تزيد الطلبات المتعددة المنتشرة ، إلى جانب الحاجة إلى نصوص JavaScript لتصحيح ، من خطر تشغيل صفحات IFRAME المتعددة. إذن ، هل هناك طريقة جيدة للحفاظ على محتوى الصفحة علنيًا؟ لقد قدم لنا جانب الخادم منذ فترة طويلة حلولًا. يتم استخدام جميع التضمين في ASP وطرق المتطلبات في PHP لتضمين قطعة رمز موجودة في البرنامج. يمكن أن يمكّن ذلك أيضًا جزءًا معينًا من الصفحة (مثل قوائم التنقل ، تذييلات) من أن تكون عامة. ومع ذلك ، بعد التشغيل ، يتم الإخراج كصفحة كاملة ، مما يقلل بشكل فعال من طلبات العميل ، ولا توجد مشكلة في قدرة عالية على التكيف مع IFRAMES.
