بنام خدا

در این درس با معرفی محیط کد نویسی HTML ، اولین صفحه سایتمان را مثل آب خوردن می نویسیم. این کار خیلی آسان است و بزودی به راحت بودن یادگیری آن پی خواهید برد.

در ویندوز برنامه ای به نام نوتپد (Notepad) وجود دارد که یک ویرایشگر متن خیلی ساده است. این برنامه علیرغم ساده بودن، برنامه ای بسیار کاربردی مخصوصا برای برنامه نویس هاست.

نکته! برای آوردن این برنامه در ویندوز ۸ به بالا، کافیست به استارت (Start) رفته و تایپ کنید Notepad. سپس برنامه را باز کنید.
در ویندوز ۷ و پایینتر، به مسیر زیر به ترتیب بروید:
Start → Programs → Accessories → Notepad

اگر از مک استفاده می کنید برای باز کردن برنامه TextEdit، به مسیر زیر بروید:
Finder → Applications → TextEdit

شروع کنیم!

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

 <!DOCTYPE html>
<html>
<head>
<title>عنوان صفحه</title>
</head>
<body>

<h1>سر فصل</h1>
<p>یک سطر متن</p>

</body>
</html> 

ساختار صفحه HTML
حالا وقت ذخیره سازی اولین صفحه وبسایت است. برای این کار از نوار بالای برنامه نوتپد روی File و سپس Save کلیک کرده و محلی دلخواه را برای ذخیره فایل انتخاب می کنیم.
نام فایل را مثلا index.htm قرار دهید. دلیل این کار این است که اولین صفحه ی هر سایت در کنترل پنل سرور معمولا index یا default است که سرور به طور خودکار آن را اولین صفحه سایت در نظر می گیرد و نمایش می دهد.
سپس طبق تصویر زیر Encoding را UTF-8 قرار دهید تا صفحه وب فونت فارسی را درست نشان دهد.
ساختار صفحه HTML

نکته! پسوند فایل را می توانید htm یا html ذخیره کنید که فرقی با هم ندارند. در گذشته زمانی که پسوند چهار حرفی مجاز بود، از html استفاده می شد.

اجرای اولین صفحه سایت

اکنون به محل ذخیره سازی فایل بروید و آن را اجرا کنید. می توانید حتی کلیک راست کنید و Open with را بزنید و با مرورگر دلخواه مثل اینترنت اکسپلورر، فایرفاکس، کروم و غیره آن را باز کنید.
تبریک! اولین صفحه سایت شما:
ساختار صفحه HTML

در درس های آینده برای تمرین از ویرایش گر متن آنلاین بابا آب داد استفاده می شود. اما شما می توانید از نوتپد یا هر ویرایشگر متن دیگری مثل Adobe Dreamweaver استفاده کنید.

 

اینفوگرافی

دستور انگلیسی

آیا می دانید؟

لغات 504

مکالمات انگلیسی

اصطلاحات انگلیسی





عضویت در خبرنامه

با عضویت در خبرنامه، از آخرین آموزش ها، محصولات و تخفیف های بابا آب داد مطلع شوید.

یا برای اطلاع می توانید در هر یک از کانال های زیر در تلگرام، گپ و ایتا به آی دی babaabdadchannel@ عضو شوید:

گپ تلگرام ایتا

آموزش HTML ؛ درس اول: ساخت اولین صفحه وبسایت

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *