اصول نوشتن صفحات HTML

در اينجا مي خواهيم به ساختار شناسه ها يا همان تگها (tag) در HTML بپردازيم. يک تگ هميشه با علامت کوچکتر رياضي يعني اين علامت > آغاز مي شود و با علامت بزرگتر < به پايان مي رسد. مثلاً تگي که باعث ايجاد زيرخط کلمات مي شود اينطور نوشته مي شود: <U> اين علامت را قبل از متني که مي خواهيم زير آن خط کشيده شود قرار مي دهيم. به اين تگ ، تگ ابتدايي (Opening tag) مي گويند، که عملياتي را که شما مي خواهيد آغاز کنيد شروع مي کند. به منظور پايان دادن به زيرخط بايد از يک تگ پاياني استفاده کنيد. يک تگ پاياني با اين علامت شروع مي شود: />  بقيه تگ مانند تگ ابتدايي مي باشد. براي درک بهتر اين مطلب به مثال زير توجه کنيد:

Tags and their position

 

در HTML همه تگها به يک تگ پاياني نياز ندارند. براي مثال تگي که براي وارد کردن عکس استفاده مي شود  از اين قبيل تگهاست، که به اين صورت مي باشد:

 

<img src="myimage.gif">

البته بعداً در مورد اين تگ توضيح خواهيم داد در اينجا فقط براي مثال اين تگ را آورديم. موارد ديگري هم با اين وضعيت وجود دارند مثلاً <br> که براي رفتن به خط بعدي استفاده مي شود، <hr> که براي ايجاد يک خط افقي به کار مي رود و <p> که براي رفتن به پاراگراف بعدي استفاده مي شود.

 

در ضمن نياز نيست که حتماً تگها با حروف بزرگ نوشته شوند. مثلاً <P> همان <p> است. البته در نسخه هاي جديدتر HTML توصيه مي شود کدهاي HTML با حروف کوچک نوشته در XHTML هم نوشتن کدها با حروف کوچک الزامي است. فضاي خالي هم بين تگها تأثيري ندارد. مثلاً :

 

<u>         متن زيرخط دار          </u>

کد بالا همان نتيجه اي را مي دهد که کد زير دارد:

 

<u>متن زيرخط دار</U>

به اين طريق هم اگر نوشته شود فرقي نمي کند:

 

<u>

متن زيرخط دار

</u>

قالب پايه اي يک فايل HTML مانند زير است. ببينيد مي توانيد کاري را که تگهاي اين کد انجام مي دهند حدس بزنيد؟ البته همه آنها را بعداً توضيح مي دهيم.

 

 

 

<html>

<head>

<title>html قالب اصلي</title>

</head>

<body>

هر چيزي که اينجا قرار گيرد در صفحه شما قابل ديدن است

</body>

</html>

براي درک بهتر اين قسمت سعي کنيد تگها را به صورت جفتي در نظر بگيريد (از جايي که باز مي شوند تا جايي که بسته مي شوند) اولين تگ <html> است که علامت شروع يک متن HTML است و تگ پاياني آن <html/> است که همانطور که ممکن است حدس زده باشيد نشانه پايان متن HTML است. هر چيزي در HTML بايد بين اين دو تگ قرار گيرد. مانند متن، ديگر تگها، عکسها و... چون اين دو تگ نشان دهنده آغاز و پايان صفحه شما هستند.

 

تگ بعدي <head> است. اين تگ مشخص کننده بخشي است که شما بايد عنوان صفحه، کلمات کليدي، و ديگر توضيحات خود براي اين صفحه را در آن قرار دهيد. اين بخش با <head/> به پايان مي رسد. در مثال بالا تنها قسمت HEAD عنوان صفحه بود که با TITLE مشخص مي شود.

 

تگ <title> به شما اجازه مي دهد براي صفحه خود يک عنوان برگزينيد. اين قسمت مورد استفاده موتورهاي جستجو قرار مي گيرد و همان متني است که به هنگام مشاهده صفحه در نوار عنوان مررگر نشان داده مي شود. تا هنگامي که اين تگ در قسمت BODY قرار نگيرد در متن شما نشان داده نمي شود.

تگ <body> بخشي را آغاز مي کند که در صفحه مرورگر شما به نمايش در مي آيد. اين قسمت جايي است که ما بايد کار اصلي خود را در آن انجام دهيم. براي پايان دادن به اين تگ از <body/> استفاده مي کنيم. در مثال بالا متني که در صفحه مرورگر ديده مي شود به صورت زير است (البته در اينجا براي نوشته زير رنگ و فونت نيز انتخاب شده که در قسمتهاي بعد به آنها خواهيم پرداخت) :

 

چيزي که در اينجا مي بينيم متني است که به صورت ساده نوشته شده و در طرف چپ صفحه قرار دارد.

 

در درس بعد در مورد چگونگي کار کردن با متنها بحث مي کنيم.