DAVEN FARNHAM: اليوم، انا ذاهب ل نتحدث قليلا عن HTML، لغة توصيف النص التشعبي. ترى HTML في كل مكان هذه الأيام. في الواقع، إذا كنت أشاهد هذا الفيديو في المتصفح، وكنت رؤية HTML الآن. HTML ليست لغة برمجة، بدلا من ذلك، انها لغة الترميز المستخدمة من قبل متصفحات الويب لتقديم صفحات على شبكة الانترنت. 

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

اسمي Daven فارنهام. هذا هو CS50. 

ذلك على سبيل المثال، يمكنني استخدام الصورة الطبقة - لا، هناك الكثير من الصفات. اسمي Daven فارنهام. هذا هو CS 650. أريد أن أقول CSS. هذا هو CSS.