تماس درباره   صفحه اصلی
  برنامه نويسی مبتنی بر وب > Advanced HTML  
 
 

Advanced HTML


در اين صفحه به مطالبی نظير نحوه استفاده از رنگ ها، متاها و آدرس دهی لينک ها که در طراحی وب سايت مفيد هستند اشاره شده است.

رنگ
مسير
جزئيات head
فريم


رنگ

مجموعه ای از اسامی توسط اکثر برازها برای تعيين مقدار ريگ پشتيبانی می شود. تنها شانزده رنگ توسط استاندارد W3C در HTML 4.0 درنظرگرفته شده است که عبارتند از:

aqua,black,blue,fuchsia,gray,green,lime,maroon,navy,olive,purple,red,silver,teal,white ,yellow.

رنگ می تواند با يک مقدار عددی بر مبنای شانزده برای ترکيب رنگ های قرمز، سبز و آبی هم تعيين شود. کد رنگ به صورت rrggbb# است. rr، gg و bb دو رقم هگز برای تعيين شدت رنگ های به ترتيب قرمز و سبز و آبی است. کمترين مقدار 00# و بيشترين مقدار FF# است.

ترکيب رنگ های قرمز و سبز و آبی به اين صورت 16 ميليون رنگ مختلف را می دهد(256×256×256).


مثال. رنگ زمينه آبی، رنگ متن سياه، رنگ لينک ها زرد و لينک های ديده شده به رنگ قرمز در خواهند آمد.

<body bgcolor="#0000FF" text="#000000" link="#FFFF00" vlink="#FF0000">

جدول زير ترکيب سه رنگ اصلی نور را نشان می دهد :

رنگ شماره رنگ RGB
rgb(0,0,0) #000000  
rgb(255,0,0) #FF0000  
rgb(0,255,0) #00FF00  
rgb(0,0,255) #0000FF  
rgb(255,255,0) #FFFF00  
rgb(0,255,255) #00FFFF  
rgb(255,0,255) #FF00FF  
rgb(255,255,255) #FFFFFF  

نکته. بعضی از ويرايشگرهای HTML با گلچين رنگ های خود می آيند.

رنگ های Safe

قبلا وقتی که اکثر کامپيوترها تنها 256 رنگ داشتند ليستی شامل 216 رنگ به عنوان استاندارد معرفی شد (40 رنگ سيستمی ثابت توسط سيستم عامل های Mac و Microsoft به صورت رزرو شده هستند). البته چون کامپيوترهای امروزه قابليت نمايش ميليون ها رنگ مختلف را دارند استاندارد بودن رنگ ها ممکن است زياد مهم نباشد.


مسير

وقتی لينکی به يک صفحه يا تصوير در وب ايجاد می کنيد مقصد لينک را بايد تعيين کنيد. مقدار خاصيت (hypertext reference) href يا مسير می تواند به صورت مطلق (absolute) يا نسبی (relative) باشد:

مسير مطلق

يک لينک مطلق وقتی ايجاد می شود که مقدار href شامل URL کامل مقصد باشد. يعنی شامل پروتکل انتقال، نام دامنه و نام فايل است و به همين دليل مطلق ناميده می شود.


مثال. يک لينک مطلق به صفحه اصلی سايت Motive مشابه زير است:

Motive homepage


از مسير مطلق هنگامی استفاده کنيد که به عنصری که در دامنه سايت شما نيست داريد آدرس می دهيد. يعنی نام دامنه مقصد دامنه متفاوت است. برای آدرس دهی به عناصری که در دامنه خودتان است نيازی به ذکر نام دامنه نيست.

به مسير مطلق گاهی URL هم گفته می شود.

مسير نسبی

هنگامی که نسبت به موقعيت صفحه وب جاری آدرس می دهيد داريد يک لينک نسبی ايجاد می کنيد. در اين حالت مسير شامل نام دامنه نمی شود.

يک لينک نسبی تنها برای پيوندهای درون يک وب سايت می تواند استفاده شود. يعنی مبدا ومقصد هردو تحت يک نام دامنه بايد باشند.


مثال. يک لينک نسبی به صفحه تماس به صورت زير می تواند باشد.

contact details

علامت ../ مرورگر را از موقعيت جاری يک فولدر به عقب برمیگرداند. سپس به فولدر about می رود و فايل contact.php را باز می کند.


اگر نام فايل ذکر نشود (مثلا به صورت href='../') سرور سعی می کند فهرست يا فايل پيش فرض دايرکتوری جاری را باز کند.

اسامی فايل های پيش فرض در سرورهای وب مختلف متفاوت است و معمولا يکی از نام های default.htm، index.htm، index.html و welcome.htm است. بهترين نام برای صفحه اصلی index.html است.

نکته. اگر ساختار وب سايت خودتان را تغيير می دهيد بخاطر داشته باشيد مسيرهای نسبی را هم اصلاح کنيد.
نکته. اگر مقصد در همان دايرکتوری جاری است تنها نام فايل ذکر می شود.
نکبه. اگر مقصد در زير فهرست دايرکتوری جاری است بايد به صورت نام "فايل/زيرفهرست" آدرس دهی شود (مسير با علامت اسلش شروع نمی شود).
نکته. لينک به يک دايرکتوری قبل به صورت /.. است.


جزئيات head

بخش head می تواند شامل اطلاعات کلی درباره صفحه وب باشد که به آن متا اطلاعات گفته می شود. متا به معنی "اطلاعاتی درباره" است. عناصر درون head در مرورگر نمايش داده نمی شوند. تعداد کمی از تگ ها در بخش head مجاز هستند.

شرح تگ
تعيين تيتر سند در مرورگر <title>
تعريف يک URL پايه برای همه لينک های داخل سند <base>
تعيين ارجاعات به فايل های ديگر <link>
تعريف اطلاعات متا <meta>
تعريف شيوه های درونی <style>
تعريف اسکريپت ها <script>

متا

تگ <meta> از تگ های درون Head است که هدف آن آوردن اطلاعاتی درباره صفحه وب است. اين اطلاعات بيشتر توسط مرورگرها يا موتورهای جستجو مورد استفاده قرار می گيرد. کلمات کليدی برای موتورهای جستجو توسط صفات name و content در تگ متا تعريف می شوند.

اگر می خواهيد شرح کوتاهی از محتويات صفحه خود بدهيد از مقدار description را به صفت name و شرح موردنظر را به content اختصاص دهيد.


مثال. عنصر متای زير شرحی از صفحه وب را تعيين می کند.

<meta name="description" content="Free Web tutorials on HTML, CSS and DHML">


برای مشخص کردن کلمات کليد محتوای صفحه خود صفت name را با مقدار keyword صفت content را با کلمات کليدی مقداردهی کنيد.


مثال. عنصر متای زير کلمات کليدی صفحه وب را تعيين می کند.

<meta name="keywords" content="HTML, DHTML, CSS, XHTML, JavaScript, VBScript">


صفات ناشناخته متا می تواند نشانه منحصر به فردی برای سايت يا نويسنده آن باشد.


مثال.

<meta name="security" content="low">


نکته. تگ <!DOCTYPE> که در ابتدای سند HTML ممکن است اضافه شود برای تعريف نوع فايل است.


فريم

وقتی درباره فريم (frame) صحبت می شود درواقع منظور frameset است که مجموعه ای از صفحات وب است. صفحه frameset شامل ارجاعاتی به فايل های HTML است که هر کدام در يک فريم جداگانه نمايش داده می شوند. هر فريم ناحيه مستطيلی جداگانه درون مرورگر می گيرد و می تواند دارای نوارهای پيمايش باشد و بارگذاری مجدد يا چاپ شود. کليه صفحات درون يک frameset در يک پنجره مرورگر ديده می شوند.


مثال. در يک صفحه وب يک فريم می تواند بعنوان جدولی از محتويات و فريم ديگر برای لينک ها درنظر گرفته شود.


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

ايجاد يک frameset

برای ساختن frameset ابتدا بايد صفحات وب را جداگانه طراحی کرد سپس با هم در يک frameset قرار داد. فايل حاوی frameset هيچ محتوائی ندارد و تنها به مرورگر می گويد که چه صفحه ای را لود کند و چگونه در پنجره قرار دهد.

برای ساختن يک سند frameset يک صفحه جديد با تگ های زير بسازيد.

<html>
<head>
   <title>Your Title</title>
</head>
<!-- Frames -->
   <frameset>

توجه کنيد چون محتوائی وجود ندارد تگ را نداريد.

تگ يک مجموعه از سطرها و ستون ها را مشخص می کند که تعيين می کنند چگونه پنجره به فريم ها تقسيم شود. هر تعداد فريم افقی و عمودی می توان داشت، به هر کدام درصدی از صفحه تعلق می گيرد.

مقدار ويژگی های cols و row ميزان ناحيه صفحه برای اشغال هر فريم را تعريف می کنند.

تگ تعيين می کند چه سندی در هر فريم قرار بگيرد.


مثال. تعريف دو فريم عمودی با نام های menu و showframe که به ترتيب صفحات frame_a.htm و frame_b.htm را نمايش می دهند.

<frameset cols="25%,75%">
   <frame name="menu" src="frame_a.htm" scrolling="auto" frameborder="1">
   <frame name="showframe" src="frame_b.htm" marginwidth ="10">
</frameset>


خاصيت src به مرورگر می گويد که کدام صفحه را در فريم لود کند. scrolling تعيين می کند که نوار پيمايش باشد يا خير. frameborder حاشيه فريم را تعيين می کند. صفت name در تگ فريم برای اسم گذاری فريم ها استفاده می شود. marginwidth حاشيه راست و چپ و marginheight اندازه حاشيه بالا و پائين فريم را به پيکسل تعيين می کند.

از لينک های صفحات ديگر می توان محتوای فريم را با تعيين target تغيير داد.


مثال. صفحه frame_c.htm را در فريم showframe لود می کند.

<a href ="frame_c.htm" target ="showframe">Frame c</a>


نکته. بهتر است فريم ها نامگذاری شوند.
نکته. اگر می خواهيد حاشيه های فريم ثابت باشد و کاربر قادر به تغيير اندازه آنها نباشد صفت noresize="noresize" را به تگ <frame> اضافه کنيد.
نکته. تگ <noframes> را برای پشتيبانی از برازرهائی که فريم را پشتيبانی نمی کنند اضافه کنيد.
نکته. تگ <iframe> برای تعيين يک فريم درونی در صفحه وب بدون استفاده از frameset بکار می رود.


 

 


 

صفحه اصلی| PDF| درباره| تماس