لماذا لا ترى النماذج متعددة الوسائط واجهات الويب

تتفاعل النماذج اليوم مع الواجهات بطريقتين: قراءة الكود المصدري (HTML وCSS وJavaScript والواجهة الخلفية) أو تحليل لقطات الشاشة. كلا النهجين غير فعّال — فالكود لا يُظهر كيف تبدو الواجهة بعد العرض وما هي العناصر المتاحة فعلياً للمستخدم، بينما تتطلب لقطات الشاشة تحليل كمية هائلة من البكسلات. المتصفح يمتلك بالفعل هندسة كل عنصر وحالته ومدى ظهوره. • **الكود يحجب الواقع** — لا تظهر إزاحات العناصر أو التداخلات أو الأجزاء المخفية أو غير المتاحة من الواجهة • **لقطات الشاشة مكلفة** — تحتاج إلى أحجام عرض (viewport) مختلفة، وحالات مختلفة (التمرير، التركيز، النوافذ المنبثقة، التحميل، الفيديو) • **المطلوب وحدة مدمجة** — إدراك دائم للبنية بدلاً من «يد» مؤقتة يعيد الوكيل كتابتها كسكربت في كل مرة

معالج بواسطة الذكاء الاصطناعي من Habr AI؛ بتحرير Hamidun News
لماذا لا ترى النماذج متعددة الوسائط واجهات الويب
المصدر: Habr AI. كولاج: Hamidun News.
استمع للمقال
بطاقة الحقائق والأرقام
المعيارالتفاصيل
المصدر الأصليHabr AI ↗
رئيس التحرير
حقيقة رئيسية #1الكود يحجب الواقع — لا تظهر إزاحات العناصر أو التداخلات أو الأجزاء المخفية أو غير المتاحة من الواجهة
حقيقة رئيسية #2لقطات الشاشة مكلفة — تحتاج إلى أحجام عرض (viewport) مختلفة، وحالات مختلفة (التمرير، التركيز، النوافذ المنبثقة، التحميل، الفيديو)
حقيقة رئيسية #3المطلوب وحدة مدمجة — إدراك دائم للبنية بدلاً من «يد» مؤقتة يعيد الوكيل كتابتها كسكربت في كل مرة

استراتيجيتان فاشلتان

تتفاعل النماذج متعددة الوسائط اليوم مع مواقع الويب بطريقتين. الأولى هي قراءة الكود المصدري: HTML وCSS وJavaScript والواجهة الخلفية. والثانية هي النظر إلى لقطات الشاشة. وفي الممارسة العملية، كلا النهجين غير فعّال.

الكود لا يُظهر الواقع. فمن خلال الترميز المصدري، لا يستطيع النموذج معرفة مكان وجود العناصر بعد العرض، ولا إن كانت متداخلة فيما بينها، ولا إن كان زر ما قد خرج عن حدود الشاشة. ولا يُظهر الكود أيضاً أن عنصراً موجوداً في الترميز لكنه غير متاح للمستخدم. يمكن توسيع السياق إلى مليون رمز (token)، لكن ذلك لن يمنح أبداً الواجهة في حالتها الفعلية.

تحلّ لقطات الشاشة جزءاً من المشكلة، لكن بتكلفة استهلاك هائلة. فلقطة واحدة لا تكفي. يلزم أحجام مختلفة لنافذة العرض (viewport)، وحالات مختلفة للعناصر، والتمرير بالمؤشر (hover)، والتركيز (focus)، والنوافذ المنبثقة، وعمليات التحميل، والتغيرات الديناميكية. وقد يتطلب الفهم الكامل حتى مقاطع فيديو. وبهذا تتحول مهمة يفهمها المتصفح بالفعل كبنية من العناصر وهندستها وحالاتها، إلى تحليل ثقيل للبكسلات — مكلف وغير فعّال.

كيف يرى الإنسان

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

نحن نرى البنية. نرى شكلاً بيضاوياً يحمل نص «تسجيل الدخول» — ونفهم فوراً أنه زر. نرى حدود الكتل والتسلسل الهرمي للعناصر. ولا يتطلب كل ذلك تحليل كل بكسل أو دراسة جميع الأنماط والترميز.

طبقة إدراك ثالثة

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

لا حاجة إلى التخلي عن المحولات (transformers). تحتاج النماذج إلى وحدة إدراك مدمجة جديدة — وسيلة لرؤية الواجهة كبنية من العناصر وحالاتها ومدى ظهورها وهندستها. ليس في شكل «يد» مؤقتة يعيد الوكيل كتابتها كسكربت في كل مرة، بل كوسيلة إدراك أساسية وجوهرية.

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

أسئلة وأجوبة حول الخبر

ما أبرز التفاصيل حول استراتيجيتان فاشلتان؟

تتفاعل النماذج متعددة الوسائط اليوم مع مواقع الويب بطريقتين. الأولى هي قراءة الكود المصدري: HTML وCSS وJavaScript والواجهة الخلفية. والثانية هي النظر إلى لقطات الشاشة. وفي الممارسة العملية، كلا النهجين غير فعّال. الكود لا يُظهر الواقع. فمن خلال الترميز المصدري، لا يستطيع النموذج معرفة مكان وجود العناصر بعد العرض، ولا إن كانت متداخلة فيما بينها، ولا إن كان زر ما قد خرج عن حدود الشاشة. ولا يُظهر الكود أيضاً أن عنصراً موجوداً في الترميز لكنه غير متاح للمستخدم. يمكن توسيع السياق إلى مليون رمز (token)، لكن ذلك لن يمنح أبداً الواجهة في حالتها الفعلية. تحلّ لقطات الشاشة جزءاً من ا

ما أبرز التفاصيل حول كيف يرى الإنسان؟

ننظر إلى الموقع بطريقة مختلفة. فنحن نميّز بشكل فوري تقريباً النص والخلفية والأزرار والحدود وحقول الإدخال والقوائم والنوافذ المنبثقة. وعند التمرير، نرى التغيرات التفاعلية: يتغير لون الزر، ويظهر تفاعل مرئي. ولا نحتاج إلى إعادة بناء الواجهة لا من الكود ولا من البكسلات. نحن نرى البنية. نرى شكلاً بيضاوياً يحمل نص «تسجيل الدخول» — ونفهم فوراً أنه زر. نرى حدود الكتل والتسلسل الهرمي للعناصر. ولا يتطلب كل ذلك تحليل كل بكسل أو دراسة جميع الأنماط والترميز.

ما أبرز التفاصيل حول طبقة إدراك ثالثة؟

يجب أن ترى النماذج متعددة الوسائط بالطريقة نفسها. لا ينبغي أن تكون الواجهات بالنسبة إليها مجرد كود أو صورة، بل تمثيلاً مُهيكلاً يصلح لفهم الصفحة وفحص التصميم والتفاعل مع واجهة المستخدم. لا حاجة إلى التخلي عن المحولات (transformers). تحتاج النماذج إلى وحدة إدراك مدمجة جديدة — وسيلة لرؤية الواجهة كبنية من العناصر وحالاتها ومدى ظهورها وهندستها. ليس في شكل «يد» مؤقتة يعيد الوكيل كتابتها كسكربت في كل مرة، بل كوسيلة إدراك أساسية وجوهرية. من شأن وحدة كهذه أن تتيح معالجة طيف واسع من المهام — من تحليل الواجهات إلى التطوير، ومن فحص التصميم إلى الأتمتة — مع البقاء عامة الاستخدام. وهذا

ZK
جمال حميدون — مدير المنتجات في Alpina Digital ومدير منتج AlpinaGPT. يبني منتجات الذكاء الاصطناعي منذ 2019. بدأ Hamidun News كمشروع شخصي ثم أصبح مُجمِّعًا إنتاجيًا بأكثر من 6000 قارئ.
✦ Unified AI Workspace · Nomad

Test Frontier LLMs & Autonomous Agents in One Workspace

Run Claude Opus 5.5, GPT-6, Gemini 3.1, and DeepSeek side-by-side in Nomad AI (nomadnet.ai) — unified model routing, deep research, and multimodal workflows under one subscription.

Try Nomad AI →Launch Nomad Agent
ما رأيك؟
جارٍ تحميل التعليقات…