كيف تنشئ صفحة HTML .. الذؤابات والرأس والجسم ؟

هذا الموضوع الخاص بـ HTML ضروري لمن يريد أن ينشئ موقع على الإنترنت .

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


علماً بأن منتدى كومبيونت يستعمل XHTML 1.0 Transitional

من أجل أن تنشئ ملف HTML لن تحتاج لبرامج خاصة إذ يكفيك برنامج Notepad والذي سوف تكتب فيه اللغة التي سيتعامل معها المتصفح .. ولكن لاحظ أنك يجب أن تراعي عند التسييف (save as) أن تعطيه الإمتداد .htm

وفي نفس الوقت إذا كان عندك ملف HTML وأردت أن تصل للصفحة التي بها الكود فيمكنك ذلك عن طريق قائمة View > source أو إختصارات لوحة المفاتيح وهي :

Ctrl+U في الفايرفوكس .. و Ctrl+F3 في الأوبرا .

أو بالطريقة الثالثة وهي : كليك يمين ثم open by > Notepad .. وذلك من أجل الإضافة أو التعديل

الوحدة الأساسية في الكتابة هي التاج tag .. والمقصود بها ما نكتبه بين علامة "رأس السهم المتجه لليسار" > وإسمها "Less than" وعلامة "رأس السهم المتجه لليمين"< وإسمها "Greater than" .

ولغوياً فإن tag تعني الذؤابة .. والمقصود بالذؤابة قطعة المعدن أو البلاستيك التي نكبسها فوق طرفي الحبل أو الشريط حتى لا تنسلت فتله .

وتنقسم الصفحة إلى قسمين : الرأس - هيد Head والذي نضع به تعليمات عامة وارتباطات .. والجسم - بودي Body والذي نضع به العناصر التي سوف تظهر في صفحة ال HTML من نصوص وصور وعروض فلاش وروابط وخطوط وألوان ...إلخ

وتبدأ الصفحة بتاج الـ

وتنتهي كذلك به على شكل .. ومن هذا السلاش المائل يفهم المتصفح أن التعليمات تنتهي هنا .

وهذين التاجين البادئ والناهي يسميان معاً التاج الحاوي container tag لأنهما يحويان بينهما التعليمات التي نريد من المتصفح أن ينفذها .

وكذلك يبدأ جزء الهيد بـ وينتهي بـ ومن ثمً يبدأ البودي .

ويبدأ جزء البودي بـ وينتهي بـ وذلك عند نهاية الصفحة .

وتلاحظون أنه في لغة HTML يستحسن إستعمال الحروف الصغيرة وليس الكابيتال .

وفي جزء الرأس head نضع بعض العناصر مثل الإرتباطات بملفات الجافاسكريبت والستايل الخارجية .. والميتا تاجز .. والكلمات المفتاحية keywords والتي تبحث عنها محركات البحث .. و عنوان الموضوع title .. ورؤوس السكريبتات .. والستايلات الداخلية ...إلخ .

التقسيم الأكاديمي لأنواع التاج : هناك محاولات لتجميع التاجز في مجموعات من أجل تسهيل دراستها .. والشائع هو هذا التقسيم :

Document Layout Tags: These tags are used to structure the XHTML document. They organize the information content on a page so that text and graphical elements appear where you want them to appear. These are the tags you use to design the overall physical and visual relationships between page elements.

Text Formatting Tags: These tags are used to apply font faces, styles, sizes, and colors to the text appearing on the page. They package and decorate the text content of the page

List Formatting Tags: Certain tags are used to organize text information into lists. List structures include bulleted lists, numbered lists, and others

Graphic Formatting Tags: These tags are used to position, size, and style drawings and pictures that appear on the page

Linking Tags: Web pages are "hypertext" documents, meaning there are linkages between them. With the click of a mouse you can jump from one page to another, or from one page to a particular location on another page, immediately. It is not necessary to traverse the pages sequentially. Therefore, certain tags are used to set up these linkages between pages and between different sections of a single page

Table Tags: Web pages provide information to visitors. They present data. Often times data need to be organized in tabular form, into rows and columns, for better presentation, readability, and understanding. Table tags permit you to arrange data into tables; they also can be used as structuring devices for laying out the entire content of Web pages

Frame Tags: Web pages can also be organized into frames, or into separate windows each containing a different Web page that is accessible at the same time. Frame tags permit this structural option for laying out information on a page

Form Tags: Forms are data collection devices. They are used to collect information from visitors in order to capture data for processing or to solicit visitor preferences about content displays. Forms are the mechanisms through which visitors interact with your Web page. A number of different form tags permit various means of interaction

Multimedia Tags: Modern Web pages provide a multimedia experience, presenting audio and video information and entertaiment as well as text and graphic images. Certain tags are used to link to and play audio and video files through special media players that can be embedded on the Web page