آموزش HTML صفحه اصلی اینستاگرام ما
ویرایشگرها

ویرایشگرهای HTML


یک ویرایشگر متنی ساده همه چیزی است که شما برای یادگیری HTML نیاز دارید .


یادگیری HTML با استفاده از Notpad یا TextEdit

صفحات وب می توانند با استفاده از ویرایشگرهای حرفه ای HTML ساخته و ویرایش شوند.

با این وجود برای یادگیری HTML ، ما یک ویرایشگر متن ساده مانند Notpad در PC یا TextEdit در Mac را پیشنهاد میکنیم .

ما باور داریم که استفاده از یک ویرایشگر متن ساده روشی خوب برای یادگیری HTML است .

گام های زیر را دنبال کنید تا نخستین صفحه وب خود را با NotPad یا TextEdit بسازید .


گام نخست: بازکردن NotePad در PC

ویندوز 8 یا نسخه های جدیدتر

صفحه شروع(نماد پنجره در گوشه پایین سمت چپ صفحه نمایش) را باز کنید . در بخش جستجو NotePad را نوشته و آنرا باز کنید .

ویندوز 7 یا نسخه های قدیمی تر

مسیر زیر را دنبال کرده و NotePad را باز کنید:

Start > Programs > Accessories > Notepad


گام نخست: باز کردن TextEdit در Mac

مسیر زیر را دنبال کرده و TextEdit را باز کنید:

Finder > Applications > TextEdit

همچنین برخی تنظیمات را تغییر دهید تا ذخیره فایل ها بدرستی صورت پذیرد . به مسیر Preferences > Format > رفته و
"Plain Text" را انتخاب کنید .

سپس در زیر "Open and Save" ، کادر "Display HTML files as HTML code instead of formatted text -نمایش فایل های HTML بصورت کد HTML بجای متن قالب بندی شده" را تیک بزنید .

سپس یک سند جدید برای قرار دادن کد باز کنید .


گام دوم: نوشتن کد HTML

کد HTML زیر را در ویرایشگر متن خود بنویسید یا کپی پیست کنید :

<!DOCTYPE html>
<html>
<body>

<h1>نخستین عنوان من</h1>

<p>نخستین پاراگراف من.</p>

</body>
</html>
img_notepad.png

گام سوم: ذخیره صفحه HTML

سند را در رایانه خود ذخیره کنید . مسیر File > Save as را در منوی NotePad دنبال کرده و Save as را انتخاب کنید .

ابتدا در بخش File name یک نام برای فایل خود انتخاب کرده و در ادامه آن پسوند .htm یا .html را قرار دهید . این دو پسوند مشخص میکنند که فایل ما یک متن ساده نیست و یک فایل html است .

سپس بخش Encoding را نیز روی UTF-8 تنظیم کنید (که کدگذری ارجح برای فایل های HTML است).

img_saveas.png
شما میتوانید از هر یک از این دو پسوند .htm یا .html بصورت افزونه فایل استفاده کنید . هیچ تفاوتی بین این دو نیست و استفاده از هر یک بستگی به شما دارد .

گام چهارم: مشاهده صفحه HTML در مرورگر

فایل HTML ذخیره شده را در مرورگر مورد علاقه خود باز کنید (بر روی فایل دابل کلیک کنید ، یا بر روی فایل راست کلیک کرده و از بخش "Open with" فایل را با یکی از مرورگرها باز کنید .

نتیجه مانند زیر به نظر میرسد :

img_chrome.png

ویرایشگر آنلاین W3Schools

با این ویرایشگر آنلاین نیز شما میتوانید کد HTML خود را ویرایش و نتایج را در مرورگرتان مشاهده کنید .

این ویرایشگر آنلاین توانایی ذخیره کد و به اشتراک گذاری آن با دیگران را نیز دارد :

مثال

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

<h1>نخستین عنوان من</h1>
<p>نخستین پاراگراف من.</p>

</body>
</html>
امتحان کن »

بر روی دکمه "امتحان کن" کلیک کنید تا چگونگی کارکرد آن را ببینید . توجه داشته باشید که برای نمایش نتایج باید بروی دکمه Run کلیک کنید .




پسین پیشین