ورود به اکانت شما

نام کاربری *
رمز عبور *
مرا بخاطر بسپار

ایجاد حساب کاربری

فیلد های ستاره دار را پر کنید.
نام *
نام کاربری *
رمز عبور *
تکرار رمز عبور *
ایمیل *
تکرار ایمیل *
کپچا *
بارگذاری کپچا

آماده سازی ساختار سند مطلب ویژه

توسط 30 خرداد, 1393 3335 0

در صورت مفید بودن این مقاله حتما نظر خودتان را در پایین مطلب برای ما ارسال کنید

html-7HTML دارای یکسری قوانین ثابت و خاص می باشد. می توانید با استفاده از محتویات وب خود خلاقیت زیادی از خود نشان دهید , اما باید زیر ساختار لازم  را برای مرورگر وب فراهم بیاورید تا بتواند صفحات وب شما را به خوبی خوانده و نمایش دهد . این بدان معنی است که سند باید حاوی تگ های خاصی باشد که قسمت های اصلی را مشخص کرده و به مرورگر می گویند که چه نوع کدی توسط سند استفاده شده .

 

در این , فصل یاد می گیرید که چگونه با استفاده از تگ های اصلی ساختار سند خود را تعیین کنید. همچنین یاد می گیرید که چگونه نوع HTML که می نویسید را مشخص کرده و چگونه قسمت های Head و Body را ایجاد نمایید . همچنین یاد می گیرید که چگونه پاراگراف ها و شکست خط ها را ایجاد کرده و  یک عنوان صفحه را تعیین کرده و کلمه های کلیدی پنهان را به صفحه خود اضافه کنید تا موتورهای جستجو بتوانند صفحه شما را راحت تر پیدا کنند. در آخر نیز یک صفحه آزمایشی را روی یک سرور وب منتشر می کنید .

مشخص کردن نوع سند

وقتی یک سند HTML5 را ایجاد می کنید, اولین خط سند باید دارای تگ زیر باشد :

 

<!DOCTYPE html>

 
تگ DOCTYPE همیشه با یک علامت تعجب شروع شده و همیشه در ابتدای سند قبل از هر تگ دیگری قرار می گیرد. اغلب تگ های HTML به بزرگی و کوچکی حساس نیستند اما عبارت DOCTYPE باید همیشه با حروف بزرگ باشد .
استفاده از تگ DOCTYPE همانند امضاء کردن یک قرارداد است. این یک تگ دلخواه است اما وقتی از آن استفاده می کنید, مشخص می نمایید که کد شما از استانداردهای خاصی تبعیت خواهد کرد. وقتی یک مرورگر وب با یک تگ DOCTYPE مواجه نمی شود, از حالت متغیر استفاده می نماید. وقتی مرورگر <!DOCTYPE html> را می بیند, فرض می کند که شما از HTML5 استفاده می نمایید.

تقاوت میان حالت استاندارد و متغیر در روز های اولیه HTML خود را نشان داد که مشکلاتی برای استاندارد کردن بین مرورگر ها وجود داشت . در بعضی از مرورگر ها, برای نمایش مناسب صفحه ها لازم بود که از ترفند هایی در کد HTML استفاده کنید. کدنویسی HTML مدرن به شما اجازه این کار را نمی دهد اما بعضی از صفحات قدیمی هنوز هم از این راه حلها استفاده می کنند. با استفاده از تگ ,DOCTYPE به مرورگر قول می دهید که هیچ چیزی به جز کد HTML خالص در آن صفحه نخواهد بود.


نسخه های اولیه HTML از تگ های پیچیده تر DOCTYPE استفاده می کردند. اگر از نسخه HTML4.01 استفاده می کنید, روش استفاده از این تگ به این صورت است :



<!DOCRTYPE HTML PUBLIC '_//W3C/DTD HTML 4.01 Transitional//EN' http://www.w3.org/TR/html4/loose.dtd>

 

ایجاد قسمت های HTML, Head, Body

تمام کد HTML  شما     -  به جز تگ DOCTYPE – باید درون تگ دو طرفه <HTML> باشند. تگ دو طرفه, تگی است که تمام محتویات آن درون یک تگ باز و یک تگ بسته قرار می گیرند و تگ بسته همانند تگ باز است با این تفاوت که دارای یک اسلش است . تگ های باز  بسته <html> به است صورت هستند: <html> </html>. این دو تگ همانند یک بسته بندی به دور دیگر تگ های سند شما عمل می کنند.

 

به علاوه سند شما باید دارای دو قسمت باشد : یک Head و یک Body. قسمت Head یا عنوان, توسط تگ دو طرفه <head> مشخص می شود. این قسمت حاوی عنوان صفحه (Page Title) است. عنوان صفحه متنی است که در نوار عنوان مرورگر و روی دکمه نوار وظیفه برای مرورگر ظاهر می شود. همچنین این قسمت حای اطلاعاتی درباره سند است که نمایش داده نمی شوند مانند تگ های <meta> که در اینده بیشتر بررسی می شوند.  همچنین می توانید خط هایی از کد که اسکریپت هایی مانند جاوا اسکریپت را اجرا می کنند در ان قرار دهید .

 

قسمت Body یا بدنه, توسط تگ دو طرفه<body>  تعریف می شود که حاوی اطلاعاتی است که هنگام باز شدن صفحه وب توسط مرورگر, در آن نمایش داده می شوند.

 

ایجاد پاراگراف و شکست های خط

درون قسمت <body> سند خود, متنی را تایپ می کنید که می خواهید درون صفحه وب ظاهر شود. هر پاراگراف متن باید درون یک تگ دو طرفه مشخص کننده نوع آن قرار بگیرد.
اصلی ترین نوع پاراگراف, پاراگراف بدنه است که با تگ <p> مشخص می شود. این تگ دو طرفه است و بنابراین متن پاراگراف بین یک <P> و یک </P> قرار می گیرد.
وقتی مرورگر یک صفحه وب را نشان می دهد, یک فاصله سفید بین پاراگراف ها قرار می دهد . این فاصله معمولاً باعث راحت تر خوانده شدن متن می شود اما در بعضی مواقع مشکل ساز می شود مانند زمانی که یک آدرس را وارد می کنید. که این فاصله اضافی باعث سخت خوانده شدن متن می شود.

برای ایجاد یک شکست خط (یعنی شروع متن از ابتدای خط بعدی) بدون این که پاراگراف جدید ایجاد کنید (یعنی بدون ایین که فاصله اضافی به وجود بیاید), از تگ <br> استفاده می کنید. این یک تگ یک طرفه است که درون یک پاراگراف و در انتهای هر خط قرار می گیرد و باعث می شود تا متن بعد از آن, از ابتدای خط بعدی شروع شود بدون این که یک پاراگراف جدید ایجاد شود, مانند این :



<p>asarayan<br>
021-433-4333</p>

 

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



</title>عنوان سایت<title>

 

این تگ بین تگ دو طرفه <head> قرار می گیرد.

عنصر دیگری که در هدر قرار می گیرد, تگ <meta> است. تگ <meta> دارای چند کاربرد است. یکی از آن ها مشخص کردن کلمه های کلیدی مربوط به صفحه است. قرار دادن کلمه های کلیدی صحیح در یک صفحه باعث می شود کاربران بتوانند صفحه شما را راحت تر در بعضی از موتورهای جستجو مانند MSN پیدا کنند. بعضی از موتور های جستجو هنگام فهرست کردن یک صفحه وب, نه تنها از متن صفحه استفاده می کنند بلکه از کلمه های کلیدی درون قسمت تگ <meta> نیز استفاده می کنند.

به عنوان مثال فرض کنید وب سایت asarayan می تواند برای کسانی که به دنبال اطلاعاتی درباره همه انواع مشکلات رایانه ای و اموزش ها شبکه و ... می گردند بسیار مفید باشد. شاید همه این موارد در صفحه اصلی ذکر نشده باشد اما می توانید از کلمه های کلیدی درون تگ <meta> برای این کار استفاده کنید. به عنوان مثال :

 

<meta name='keywords' content='network,computer,hack,security,asarayan,asashop,learning,It'>

 

 دقت کنید که تگ <meta> در کد بالا, به صورت یک تگ یک طرفه حاوی دو خاصیت می باشد: name(نام)  و content(محتویات) مقادیر هر کدام از این خاصیت ها بعد از یک علامت تساوی ظاهر شده و درون کتیشن مارک های دوتایی (' ')  قرار می گیرند(به عبارت دیگر آن ها یک رشته متنی هستند).

می توان از تگ <meta> برای هدایت کاربران به صفحات دیگر نیز استفاده کرد. به عنوان مثال, فرض کنید که به افراد زیادی آدرس وب سایت خود را داده اید و ناگهان مجبور می شوید تا از آدرس دیگری استفاده کنید. می توانید یک صفحه 'We've Moved'(ما جابجا شدیم) در آدرس اصلی قرار داده و از تگ <meta> برای هدایت کاربران بعد از یک مدت زمان خاص (در این مثال 5 ثانیه) استفاده کنید مانند این :

 

<meta http-equiv='refresh' content='5; url=http://asarayan.com'>

 

در این جا کاربرد دیگر را می بینید: تگ <meta> می تواند طرح انکد کاراکتر را نیز مشخص کند. اگر شما کد خود را به انگلیسی یا یک زبان مشابه که از کاراکترهای رومی استفاده می کند , می نویسید مشکلی ندارید اما اگر کد خود را به زبان های دیگری می نویسید این کار لازم خواهد بود. به عنوان مثال می توانید <meta charset='utf-9'> در قسمت   <head>  سند  خود استفاده کنید تا به صورت صریح مشخص کنید که از زبان های سازگار با Utf-8 استفاده می نمایید.
یا از متاتگ رو زیر :

<meta encoding='utf-8'>

 

این مورد را ارزیابی کنید
(0 رای‌ها)
آخرین ویرایش در سه شنبه, 03 شهریور 1394 ساعت 15:50
کلیه حقوق متعلق است به فروشگاه آسارایان. طراحی و پشتیبانی: webriz
تک وب دیزاین-قالب فارسی جوملا