پایگاه اختصاصی آموزش کامل HTML

اولین وبسایت تان را بسازید

با آنچه که در درس های قبل یاد گرفتید، شما الان فقط چند دقیقه تا ساخت اولین وبسایتتان فاصله دارید.

چطور؟

در درس یک ما آن چیزهایی که برای ساخت یک سایت نیاز بود را به شما نشان دادیم: یک مرورگر و Noteped (یا هر ویرایشگر متن دیگر). چون شما در حال خواندن این متن هستید، پس از قبل مرورگر خود را باز کرده اید. تنها کاری که باید انجام بدهید این است که یک پنجره مرورگر اضافی باز کنید. (مرورگر را یک بار دیگر باز کنید.) بنابراین شما می توانید هم این آموختار را بخوانید و هم وبسایت جدیدتان را هم زمان ببینید.

همچنین Notepad را هم باز کنید. از طریق Accessories در زیر منوی Programs در منوی استارت.


من باید چه کار کنم؟

اجازه دهید با چیز های ساده شروع کنیم. چطور است راجع به یک صفحه ای که بگوید: “هورا! این اولین وبسایت من است”. شروع به خواندن کنید و به سادگی آن پی ببرید.

HTML ساده و منطقی است. مرورگر HTML را مثل وقتی که شما انگلیسی را میخوانید می خواند: از بالا به پایین و از چپ به راست. بنابراین یک سند HTML ساده با آن چیزی که باید اول بیاید شروع می شود، و با آن چیزی که باید در انتها بیاید به آخر می رسد.

اولین کاری که نیاز دارید انجام دهید، این است که به مرورگر بگویید که، شما با زبان HTML می خواهید با او گفت و گو کنید. این کار با برچسب <html> انجام می شود. بنابراین قبل از اینکه هر کاری را غیر از این انجام دهید، برچسب <html> را در اولین خط از سندتان در برنامه notepad تایپ کنید.

همانطور که ممکن است از درس های قبل به یاد داشته باشید، <html> یک برچسب باز است و باید زمانی که نوشتن کدهای html تان به پایان رسید، با برچسب بسته به اتمام برسد. بنابراین برای اینکه مطمئن شوید که برچسب بسته را فراموش نمی کنید، حال <htm/> را در دو خط پایین تر تایپ کنید و بقیه کدهای اچ تی ام ال را بین <html> و <html/> تایپ کنید.

مورد بعدی که سندتان به آن احتیاج دارد برچسب <head> است، که اطلاعاتی را در مورد صفحه آماده می کند. و <body> که محتوای سندتان در آن وجود دارد. به دلیل اینکه اگر HTML منطقی نباشد بی ارزش میشود، برچسب باز و بسته head، باید بالای برچسب باز و بسته body قرار گیرد.

سند شما باید مانند این به نظر برسد:

 html-code1

توجه کنید که ما چطور برچسب ها را با خطوط خالی (استفاده از کلید Enter) و تورفتگی ها (با استفاده از کلید Tab) ساختار بندی کردیم. در اصل اهمیتی ندارد که چگونه سند html تان را ساختار بندی می کنید. اما به شما و دیگر نویسندگان کد شما برای بازبینی بهتر کمک می کند. شدیدا پیشنهاد می شود که کدهای html را با یک شیوه شسته رفته با استفاده از فاصله ها و تورفتگی ها، ساختار بندی کنید. مانند مثال بالا.

اگر سند شما شبیه مثال بالا است، شما اولین وبسایتتان را ساختید. یک ساخت ویژه و احتمالا سایتی که از اول این آموزش به خواب هم ندیده اید. آن چیزی که شما ساختید قالب پایه ای برای همه ی اسناد HTML آینده تان خواهد بود.

تاکنون خوب بود، اما چطور محتوا را به سایت اضافه کنم؟

همانطور که پیش از این یاد گرفتید، سند HTML شما دو قسمت دارد. یک سرصفحه (head) و یک بدنه (body). در قسمت head شما اطلاعاتی راجع به صفحه می نویسید. در صورتی که Body شامل اطلاعاتی است که صفحه را تشکیل می دهد.

به عنوان مثال، اگر شما بخواهید یک عنوان به صفحه بدهید که در قسمت بالای برنامه مرورگر ظاهر می شود، این کار را باید در قسمت head صفحه انجام دهید. عنصری که برای عنوان استفاده می شود <title> است. مثلا عنوان صفحه را بین برچسب باز <title> و برچسب بسته <title/> بنویسید.

کد عنوان صفحه
توجه کنید که این عنوان در خود صفحه نشان داده نمی شود. هر چیزی که می خواهید در صفحه نشان داده شود محتوا است و بنابراین باید در بین برچسب body اضافه شود.

به طوری که وعده داده شد، ما می خواهیم در صفحه بگوییم: “هورا ! این اولین سایت من است.” این متنی است که ما می خواهیم مکاتبه شود و از این رو به قسمت body تعلق دارد. بنابراین در قسمت body کد زیر را تایپ می کنیم:

کد پاراگراف
حرف P در برچسب <p> مخفف paragraph به معنای پاراگراف است. که دقیقه معنای خود را می رساند.

سند html شما باید حالا شبیه این باشد:

html آموزش

کامل شد! شما به طور واقعی اولین وبسایت تان را ساختید.

در مرحله بعد شما باید این سند را بروی حافظه رایانه خود ذخیره کنید . در مرورگر خود باز کنید.

  • در Notepad یا هر برنامه ویرایش متن دیگر از منوی File گزینه Save as را انتخاب کنید.
  • در پنجره ای که باز می شود، از جعبه Save as type ، نوع  All Files را انتخاب کنید. این مورد خیلی مهم است. در غیر این صورت شما یک سند متن ساده را خواهید داشت، نه یک سند HTMl.
  • حال سند را به عنوان Page1.html ذخیره کنید. تمام شدن با “htm.” نشان می دهد که آن یک سند HTML است. “html.” هم نتیجه ای مشابه دارد. من همیشه از htm. استفاده می کنم ولی شما می توانید از هر کدام از این دو پسوند که ترجیح می دهید استفاده کنید. اهمیتی ندارد که این فایل را در کجای حافظه رایانه ذخیره کنید. تا زمانی که با یاد داشته باشید آن فایل را کجا ذخیره کرده اید، می توانید آن را دوباره پیدا کنید.

پنجره ای که با آن یک سند html را ذخیره می کنید.

حالا به مرورگر می رویم:

  • در منوی File دستور Open را انتخاب می کنید. (یا کلید های ترکیبی CTRL+O را فشار دهید.)
  • در جعبه ای که ظاهر می شود بروی Browse کلیک کنید.
  • حال فایل html را پیدا کنید و روی Open کلیک کنید.

پنجره ای که یک سند HTML را باز می کنید.

تبریک! حالا باید در مرورگرتان “هورا! این اولین وبسایت من است.” را نشان دهد.

اگر می خواهید که شاهکارتان فورا بروی وب دیده شود، می توانید به درس 13 پرش کنید و چگونگی آپلود یک صفحه روی اینترنت را یاد بگیرید. در غیر این صورت صبوری کنید درس ها را به ترتیب بخوانید. سرگرمی تازه شروع شده است.

نوشته شده در دسته: html - net

 
نوشته شده در تاريخ ۱۳٩٠/٥/۳۱
top of the page
2012 © | تمامی حقوق محفوظ است. کپی مطالب صرفاً با دادن پیوند مجاز است. در غیر این صورت برخورد می شود.