قسمت اول:


يادگيری زبان HTML بسيار ساده است.در مطالب زیر ياد خواهيد گرفت که چگونهبا کمک HTML صفحاتتان را ساخته و وب سايت شخصی فارسی و يا وبلاگتان را راهاندازی کنيد. مبنای اين مطالب نسخه 4 استاندارد اچتمل بوده و نکته بسيارمهم اين نسخه جداسازی فرمت بندی و انتقال آن به style sheet ها ميباشد.لازم به توضيح است که که تاکيد این مقالات بر فارسی نويسی مطابق استاندارديونيکد بوده و شامل آموزش مقدماتی HTML بهمراه مثالهای متعدد فارسی نويسیخواهد بود.

الف) مقدمه

در اين بخش با ويژگيهای فايلهای اچتمل، اجزا تشکيل دهنده آن يعنی عناصر وتگ ها ( Elements & Tags ) و نحوه ايجاد يک فايل ساده و نمايش آن درصفحه مرورگرتان آشنا خواهيد شد.


يک فايل HTML چيست؟
HTML را "اچ تی ام ال" و يا اچتمل بخوانيد.
HTML برگرفته از حروف اول HyperTextMarkupLanguage ميباشد.
يک فايل HTML فايلی از نوع text ميباشد که متشکل از markup tag ها ميباشد.مرورگر يا Browser از روی markup tag ها می فهمد که چگونه بايد صفحه رانمايش بدهد.
يک فايل HTML بايد دارای انشعاب htm و يا html باشد.
يک فايل HTML فايلی از نوع text ميباشد که با هر اديتور ساده ای قابل ايجاد است.
وظيفه اصلی تگ های اچتمل ( markup tags ) بيان چگونگی نمايش اطلاعات ميباشد.
ميخواهيد که يک فايل اچتمل بسازيد؟

اگر از ويندوز مايکروسافت استفاده ميکنيد، Notepad را باز کرده (Mac کارهااز SimplaeText استفاده کنند. ) و متن زير را در آن تايپ کنيد:







This is my first html page. This text is bold





سپس فايل را با نام مثلا test.html در درايو c:\ ذخيره کنيد.

برای ديدن فايل اچتمل بالا در مرورگر يا Brower تان ( معمولا اينترنتاکسپلورر و يا نتسکيپ نويگيتور ) کافی است که از روی منوی File/Open fileفايل بالا را از روی محل ذخيره شده بخوانيد. ( به آدرس فايل در قسمتAddress توجه کنيد، مثلا c:\test.html)

يکی از مهمترين وظايف مرورگرها نمايش صفحات اچتمل ميباشد، چه اين صفحاتروی کامپيوتر شما ذخيره شده باشند و يا اينکه از اينترنت خوانده شوند. باکليک روی یک لينک فايلی شبيه فايل ذخيره شده توسط شما از روی وب سرور توسطمرورگرتان خوانده شده و سپس نمايش داده خواهد شد!!! ( به آدرس فايل درقسمت Address توجه کنيد. )

توضيح مثال بالا

اولين تگ مثال بالا تگ <html> ميباشد. از روی اين تگ، مرورگر نوعمتن يعنی اچتمل بودنش را يافته و از روی <html/> انتهای متن اچتملرا مي یابد.

متن بين تگ <head> و تگ <head/> اطلاعات شناسنامه ای يا"Headerinformation" متن اچتمل بوده و نمايش داده نخواهند شد. در اين مثالبا کمک تگهای <title> و <title/> تيتر و يا Title صفحه که دراين مثال عبارت "Titleof page" ميباشد در بالای مرورگر نمايش داده خواهدشد.

متن بين تگ <body> و انتهای آن يعنی تگ <body/> تنها اطلاعاتی است که توسط مرورگرنمايش داده خواهند شد.

متن بين تگ [b] و انتهای آن يعنی تگ <b/> بصورت Bold و يا توپر نمايش داده خواهند شد.

انشعاب فايل htm يا html ؟

اغلب مرورگرها هر دو نوع انشعاب را به خوبی ميشناسند ولی ترجيحا به هنگامذخيره فايلهای اچتمل از html استفاده کنيد.( استفاده از انشعابهای سه حرفیمانند htm مربوط به قديم و سيستم عاملهائی چون DOS بودند.)

نکته ای در مورد اديتورهای اچتمل ( HTML Editors )

با وجوديکه با استفاده از اديتورهای اختصاصی اچتمل مانند FrontPage و ياClarisHome Page امکان نوشتن و طراحی صفحات اچتمل بصورت WYSIWYG يا"WhatYouSeeIsWhatYouGet" وجود دارد اما توصيه ميشود که از اديتورهایمعمولی متن برای تهيه صفحات خود استفاده کرده، عملکرد تگها را شناخته وهيچگاه بدون اينکه بدانيد کاربرد يک تگ چيست آنرا بکار نبريد.

بيشترين سوالات پرسيده شده ( FAQ ) :

# فايلم را درست کردم ولی هنوز نميتوانم آنرا در صفحه مرورگرم ببينم، مشکل کجاست؟

مطمئن شويد که فايل را با انشعاب درست (htm يا html ) ذخيره کرده ايد. درضمن مطمئن شويد که همان فايل را Open کرده ايد.( نام و مسير فايل را درقسمت Address مرورگرتان چک کنيد.)

#هر بار پس از تغيير و اديت مثالها نسخه اوليه را در صفحه مرورگرم ميبينم و تغييرات داده شده مشاهده نميشود، مشکل کجاست؟

به خاطر بالا بردن سرعت، هميشه مرورگرها از نسخه های موجود در Cache ياحافظه موقت خود برای خواندن صفحات استفاده ميکنند.برای وادار کردن مرورگربه خواندن اصل صفحه کافی است که در مرورگرتان Refresh/Reload کنيد. دراينترنت اکسپلورر کليد F5 يا View/Refresh و در نت اسکيپ Ctrl+R ياView/Reload اينکار را انجام خواهند داد.

# آيا ميتوانم از هر دو مرورگر Internet Explorer و Netscape Navigator استفاده کنم؟

بله، فقط اگر از استاندارد يونيکد برای فارسی نويسی استفاده ميکنيد، برایديدن درست صفحات فارسی بايد از نسخه 5 Internet Explorer و به بالا و درمورد Netscape Navigator از نسخه 6.2 و به بالا استفاده کنيد.

#کجا ميتوانم آخرين نسخه از مرورگرهای Internet Explorer و Netscape Navigator را داونلود کنم؟

Internet Explorer اينجاست و NetscapeNavigatorاينجا.
_________________________________________
ب)HTML & WWW
در اين بخش با مفاهيم وب ( تار عنکبوت جهانی يا World Wide Web ) ،اينترنت، مرورگرها و استانداردهای وب آشنا خواهيد شد. همچنين با تفاوتهایمرورگرهای وب ( WebBrowsers ) و سرويس دهنده های وب ( Web Servers ) آشناخواهيد شد.
منظور از وب چيست؟
وب شبکه ای است متشکل از تمامی کامپيوترهای دنيا، شبکه ای از شبکه ها.
اينترنت، وب، WWW ، web يا WorldWideWeb همگی يک چيزند.
تمامی کامپيوترهای وب ميتوانند با هم ارتباط داشته باشند.
کامپيوترهای موجود در وب با کمک استاندارد ارتباطی يا پروتوکل HTTP با هم ارتباط برقرار ميکنند .
نحوه کارکرد وب چگونه است؟
اطلاعات وب داخل فايلهائی به نام Web Pages و يا صفحات وب قرار دارند.
اين فايلها يا صفحات روی Web Server يا کامپيوترهای سرويس دهنده وب ذخيره شده اند.
برای ديدن صفحات وب از نرم افزاری به نام مرورگر و يا Web Browser استفاده ميشود.
دو مرورگر Internet Explorer و Netscape Navigator جزو معروفترين مرورگرها حساب ميشوند.
مرورگر Internet Explorer متعلق به شرکت مايکروسافت و مرورگر NetscapeNavigator متعلق به شرکت نت اسکيپ ميباشد.
مرورگرها چگونه به خواندن صفحات وب ميپردازند؟
يک مرورگر با کمک يک Request درخواستی برای خواندن يک صفحه از وب سرور ميکند.
اين Request يا درخواست بر اساس استاندارد ارتباطی يا پروتوکل HTTP بوده و شامل آدرس صفحه مورد نظر ميباشد.
آدرس يک صفحه وب چيزی شبيه [برای مشاهده لینک ها شما باید عضو سایت باشید برای عضویت در سایت بر روی اینجا کلیک بکنید] است. بخش //:http نوع پروتوکل و يا استاندارد ارتباطی را تعيين ميکند، [برای مشاهده لینک ها شما باید عضو سایت باشید برای عضویت در سایت بر روی اینجا کلیک بکنید] نام دومين يا Domain است و faq.html نام صفحه ای است که بايد خوانده شود.
مرورگرها چگونه صفحات وب را نمايش ميدهند؟
چگونگی نمايش يک صفحه وب بصورت مستتر در آن وجود دارد.
مرورگرها از روی دستورالعملهای داخل صفحات وب و با کمک تگ ها به نمايش صفحات ميپردازند.
وظيفه اصلی تگ های اچتمل ( HTML tags ) بيان چگونگی نمايش اطلاعات ميباشد.
يک تگ اچتمل چيزی شبيه

اين تگ پاراگراف است! p> است.
چه کسانی استاندارد های وب را تعيين ميکند؟
تعيين استاندارد های وب ربطی به شرکتهای مايکروسافت و يا نت اسکيپ ندارد.
World Wide Web Consortium يا W3C متولی تعيين استانداردهای وب است.
HTML, CSS and XML از مهمترين استانداردهای تصويب شده وب ميباشند.
آخرين استاندارد HTML استاندارد XHTML 1.0 ميباشد .
_________________________________________

ج)عناصر ( Elements )
يک متن و يا فايل اچتمل از عناصر يا element ها تشکيل ميشود و برای ايجادعناصر از تگ ها يا tags استفاده ميشود. در اين فصل با عناصر و تگ ها آشناخواهيد شد.

تگ های اچتمل (HTML Tags)
با کمک تگ های اچتمل عناصر و يا Elements ساخته ميشوند.
در زبان اچتمل حدود 80 عنصر تعريف شده است.
تگ های اچتمل بوسيله دو نويسه (char) > و < ساخته ميشوند.
تگ های اچتمل معمولا بصورت زوج ظاهر ميشوند، مانند [b]testb> تگاول در يک زوج تگ مثلا [b] تگ شروع و تگ دوم مثلا <b/> تگپايانی نام دارد.
متن بين تگ اول و تگ دوم در يک زوج تگ محتوای عنصر يا element content ناميده ميشود، مثلا "test"
تگ های اچتمل را ميتوانيد بوسيله حروف لاتين کوچک (lower case) و يا بزرگ(upper case) بنويسيد و case sensitive نيستند. برای مثال دو تگ [b]و [B] معادل هم هستند ولی شديدا توصيه ميشود که به خاطر سازگاری باXHTML از حروف کوچک استفاده شود.

عناصر اچتمل (HTML Elements)

مثال بخش مقدمه را در نظر بگيريد:







This is my first html page. This text is bold




*** نمونه ای از يک عنصر اچتمل:

This text is bold


عنصر اچتمل بالا با تگ [b] شروع شده و با تگ <b/> پايان میيابد. محتوای اين عنصر عبارت "This text is bold" است. لازم به ذکر است کهکاربرد تگ [b] نمايش توپر يا bold متون است.
*** مثال دوم يک عنصر اچتمل (معلوم الحال) :



This is my first homepage. This text is bold


عنصر اچتمل بالا با تگ <body> شروع شده و با تگ <body/> پايانمی يابد. همانطور که ميبينيد گاهی يک عنصر حاوی يک يا چند تگ ديگرميباشد.وظيفه تگ <body> تعيين بدنه اصلی يا body يک متن اچتملاست.لازم به يادآوری است که تنها اطلاعات بخش <body> يک فايل اچتملدر صفحه مرورگر نمايش داده خواهد شد.

شناسه های يک تگ (Tag Attributes)

تگ ها ميتوانند حاوی اطلاعات اضافی ديگر باشند، به اين اطلاعات شناسه ياAttribute ميگويند و وظيفه آنها بيان ديگر اطلاعات يک عنصر يا Elementميباشد. مثلا در مورد تگ <body> شناسه ای به نام bgcolor وجود داردکه رنگ زمينه متن (background) را تعيين ميکند برای نمونه اگر ميخواهيد کهرنگ زمينه صفحه اچتملتان سياه باشد کافی است که به شکل زير عمل کنيد :

......

در مثال زير تگ <body> دارای چهار شناسه مختلف با نامهای width،height ، align و border و مقادير center، 60، 100 و 0 ميباشد.

<table border="0" width="100" height="60" align="center" >

......

</table>



شناسه ها به صورت کلی "مقدار=نام" يا "name=value" نوشته ميشوند و هميشهبه تگ شروع يک عنصر يا Element اضافه ميشوند و نهايتا اگر در يک عنصر ياElement شناسه ها قيد نشوند از مقادير قراردادی يا default آنها استفادهخواهد شد مثلا در تگ body اگر شناسه bgcolor نوشته نشود از رنگ سفيد برایزمينه صفحه استفاده خواهد شد.


مقدار يک شناسه را ميتوانيد داخل نويسه های " و يا ' بنويسيد و اختيار دستشما است فقط در مواردی که مقدار يک شناسه شامل نويسه " هم ميشود بايد ازنويسه ' استفاده شود.