كيف لعرض مصدر HTML في جوجل كروم

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

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

أكثر من مجرد HTML

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

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

كيف ترى الكود المصدري لموقع الويب؟ إليك الإرشادات خطوة بخطوة للقيام بذلك باستخدام متصفح Google Chrome.

تعليمات خطوه بخطوه

1. افتح ال متصفح جوجل كروم (إذا لم يكن لديك Google Chrome مثبتًا ، فهذا تنزيل مجاني).

2. انتقل إلى صفحة الويب التي ترغب في دراستها.

3. انقر بزر الماوس الأيمن الصفحة وانظر إلى القائمة التي تظهر. من تلك القائمة ، انقر فوق اظهر مصدر الصفحة.

   

4. سيظهر الآن رمز المصدر لهذه الصفحة كعلامة تبويب جديدة في المتصفح.

5. بدلاً من ذلك ، يمكنك أيضًا استخدام اختصارات لوحة المفاتيح الخاصة بـ CTRL + U على جهاز كمبيوتر لفتح نافذة مع شفرة المصدر الخاصة بالموقع معروضة. على نظام التشغيل Mac ، يكون هذا الاختصار Command + Option + U.

ادوات المطورين

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

لاستخدام أدوات مطوري برامج Chrome:

1. افتح جوجل كروم.

2. انتقل إلى صفحة الويب التي ترغب في فحصها.

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

4. من القائمة ، مرر الماوس فوق المزيد من الأدوات ثم انقر فوق ادوات المطورين في القائمة التي تظهر.

   

5. سيؤدي ذلك إلى فتح نافذة تعرض شفرة مصدر HTML على يمين الجزء ومن CSS الموجود على الجانب الأيمن.

6. بدلا من ذلك ، إذا قمت بالنقر بزر الماوس الأيمن عنصر في صفحة الويب وحدد فحص من القائمة التي تظهر ، ستظهر أدوات مطوّري البرامج في Chrome وسيتم تحديد العنصر المحدد الذي حددته في HTML مع CSS المقابل المعروض إلى اليسار. هذا مفيد للغاية إذا كنت تريد معرفة المزيد حول كيفية إنشاء جزء معين من الموقع.

   

هو عرض رمز المصدر القانونية؟

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

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

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