في هذه المقالة ، ستتعلم كيفية استخدام HTML لكتابة موقع الويب الأول الخاص بك! ستقدم المقالة أمثلة توضيحية لفهم أفضل. دعنا نحجز على الفور أن المقالة قد صممت في الأصل لأولئك الذين بدأوا للتو في تعلم HTML. بالإضافة إلى ذلك ، نعدك أنه بنهاية قراءة هذا المقال ، نضمن لك إنشاء موقع الويب الأول الخاص بك.
HTML تعني لغة ترميز النص التشعبي ، أي لغة تنظيم النص.
بخلاف لغات البرمجة (JavaScript ، PHP ، إلخ) التي تستخدم البرامج النصية لتنفيذ إجراءات على مواقع الويب ، تستخدم لغة التسلسل (HTML) العلامات لترميز محتوى موقع الويب.
لنبدأ في تعلم HTML من البداية
تمامًا كما تتكون اللغة الإنجليزية من الأحرف A و B و C وما إلى ذلك ، فإن HTML يتكون من "أحرف" غريبة:
، ،
وما إلى ذلك. يطلق مشرفي المواقع على هذه "الأحرف" الخاصة بلغة HTML علامات الوسوم.
التالي مثال لعلامة HTML.
Tags قم بإنشاء تسطير حول حواف هذا النص.
تسمح لك علامات HTML المقترنة بأنماط لغة CSS بإنشاء مواقع الويب بسرعة وكفاءة.
مكان HTML بين اللغات الأخرى
كما تعلم ، موقع جيدمدمج بخمس لغات على الأقل.
موقع الويب الحديث مبني باللغات:
- HTML (الهيكل والترتيب).
- CSS (محتوى النمط).
- JavaScript (إجراءات المتصفح).
- PHP (إجراء الخادم).
- SQL (تخزين البيانات).
HTML هي اللغة الأساسية الأساسية التي يعتمد عليها الآخرون. لذلك ، يجب أن يكون تعلم HTML هو الخطوة الأولى لأي شخص يتعلم كيفية إنشاء مواقع الويب على الويب.
علامة
تغيرت لغة HTML على مر السنين منذ إنشائها. في الوقت الحالي ، تنتقل معظم مواقع الإنترنت إلى أحدث إصدار من اللغة - HTML5. ولكن حتى في HTML5 ، تظل أساسيات اللغة دون تغيير.
هيكل صفحة HTML يشبه شطيرة. تمامًا مثل الشطيرة التي تحتوي على شريحتين من الخبز ، يحتوي مستند HTML على علامة HTML للفتح والإغلاق.
هذه العلامات ، مثل الخبز في شطيرة ، تحيط بكل شيء بالداخل.
علامة
مع استمرارك في تعلم HTML ، يجب أن تصبح بالتأكيد على دراية بالعلامة. يوجد داخل العلامة الأصلية مباشرة كل محتوى الموقع ، بما في ذلك العلامة. هذه العلامة مطلوبة وتحتوي على جميع إعدادات صفحة الموقع التي تمت كتابتها من أجلها. هذه الإعدادات غير مرئية لزوار الموقع ، فقط المتصفحات (Google Chrome ، Mozilla Firefox ، إلخ) تراها.
تحتوي كتلة إعدادات صفحة الويب على جميع العناصر "غير المعروضة" التي تساعد المتصفح في عرض موقعك بشكل صحيح على الويب.
كل الخيارات التييمكن تهيئتها داخل العلامة ، سننظر إليها ، ولكن بعد ذلك بقليل - عندما يحين الوقت.
علامة
العلامة ، مثل العلامة ، داخل العلامة.
هذه العلامة ضرورية لتظهر على موقعك جميع المعلومات التي تريد عرضها.
العناوين والفقرات والجداول والصور والروابط ليست سوى جزء صغير من العناصر التي يمكن احتواؤها داخل العلامة.
البنية الأساسية لوثيقة HTML:
……
موقعك الأول
الآن أنت تعلم أنه يمكنك إنشاء مواقع ويب باستخدام HTML وأن العلامات الأساسية تستخدم لهذا:
- . يرسم حدود صفحة الويب.
- . يحتوي على إعدادات لعرض صفحة الويب في المتصفح.
- . يحتوي على جميع عناصر صفحة الويب (الصور ومقاطع الفيديو والنصوص وما إلى ذلك) التي تريد عرضها لزوار الموقع.
علامات أخرى مثل ، ، ، سنتحدث عنها قريبًا.
سيكون رائعًا ألا يقرأ القارئ هذه المقالة فحسب ، بل ركض أيضًا على الفور لصقل مهاراته. لصقل مهاراتك في HTML ، ستحتاج إلى إنشاء موقع الويب الأول الخاص بك ، والذي سيكون بمثابة ساحة اختبار لمهاراتك الجديدة.
من المعروف أن مشغلي شبكات الهاتف المحمول ("MTS" و "MegaFon" وما إلى ذلك) يزودوننا بخدمات الهاتف المحمول. بنفس الطريقة ، يتم تقديم خدمات إنشاء المواقع وإدارتها إلينا من خلال مشغلي الاستضافة. لإنشاء موقع الويب الخاص بك ، انتقل إلى موقع أي مشغل استضافة مجاني.
يشمل مقدمو الاستضافة المعتمدون BEGET أوreg ، على سبيل المثال. يمكنك اختيار أي شخص.
بعد تسجيل قصير ، بعد 24 ساعة ، سيتم إنشاء موقع الويب الأول الخاص بك على الإنترنت تلقائيًا ، وسيكون مرئيًا للعالم بأسره ، ويمكنك البدء في التدريب!
هيكل الموقع الحديث
الآن بعد أن أصبح لديك موقعك ، تحقق من العلامات التي تحتوي عليها العلامة وكيف تنظم المعلومات على المواقع.
الصورة أعلاه عبارة عن تمثيل تخطيطي للبنية التي جاءت مع أحدث إصدار من لغة HTML - HTML5. إلى جانب HTML5 ، لم تأتي فقط علامات جديدة ، ولكن أيضًا معنى بناء مواقع الويب. جميع العلامات التي تراها في الصورة موجودة في العلامة الرئيسية. تساعدك هذه العلامات على "تحديد" هيكل موقعك وإعطائه معنى.
على سبيل المثال ، داخل العلامات … من الملائم وضع عنوان الموقع (العلامات) ووصف الموقع (العلامات).
من المريح وضع قائمة (روابط) الموقع (العلامة) داخل العلامات.
من الملائم وضع أي كتلة كبيرة من المعلومات ذات الصلة بالمعنى داخل العلامات. يمكن أن تكون عدة مقالات ، كل منها "ملفوفة" في علامات ، أو صور (علامة) ، أو جداول (العلامات
) والمزيد.
من المريح وضع أي معلومات داخل الوسوم لا تتناسب مع معنى
داخل العلامات ، من المعتاد وضع معلومات إضافية مثل معلومات الاتصال ، وأقسام إضافية من الموقع ، وما إلى ذلك.
إذن أنت الآن أكثر مهارة فيما تصنع منه مواقع الويب الحديثة. لنأخذ مثالا علىالاضطراب في رأسي استبدل بالرهبة من البصيرة
لذا ، عندما تفتح مدير الملفات على موقع مشغل الاستضافة الخاص بك وتجد مستندًا يسمى index.php ، فلا تتردد في الكتابة فيه ، كما لو كان من البداية ، بنية موقعك.
موقعي الأول
عنوان الصفحة
وصف الصفحة
رابط1 | الرابط رقم 2 | رابط3
عنوان لبعض المقالات
هذه كتلة تحتوي على أي معلومات ، وبمساعدة CSS يمكنك تلوين هذه الكتلة ، والموقع بأكمله بكل محتوياته ، بالطريقة التي تريدها. © جميع الحقوق محفوظة
تذكر قلنا أن هناك إعدادات مختلفة للموقع؟ حسنًا ، ها هو:
- باستخدام المتصفحات نظهر أن الموقع يمكن أن يحتوي على أحرف روسية وإنجليزية (وإلا ، عند فتح الموقع ، سترى krakozyabry رهيب).
- يستخدم للإشارة إلى اسم الصفحة التي سيتم عرضها في علامة تبويب المتصفح وفي محرك البحث ("Yandex" و Google وما شابه ذلك).
بالطبع ، بدون نمط CSS ، سيبدو موقعك بخيلًا (أحرف سوداء على خلفية بيضاء) ، ولكن تأكد من محاولة كتابة صفحتك الأولى بتنسيق HTML أولاً.
مبروك! لقد قمت للتو بإنشاء صفحة الويب الأولى الخاصة بك على موقع الويب الخاص بك! سيكون أكثر إثارة!