با عرض سلام و وقت بخیر خدمت کاربران سایت پی وی لرن . و کاربرانی که دوره کامل آموزش html را دنبال می کنند. تاکنون با مفاهیم و ساختار کلی تگ های html و طرز تایپ کردن آن ها آشنا شدیم، اما برای شروع هر گونه طراحی html شما نیاز به محیطی برای نوشتن تگ ها و طراحی ساختار html صفحات وب دارید.از این رو آشنایی با ادیتورهای html حائز اهمیت است. در ساده ترین حالت شما می توانید با یک ویرایشگر متن ساده نظیر notpad، تگ های html را نوشته و در قالب صفحه وب html ذخیره کنید، سپس می توانید نتیجه کار را در مرورگرهای وب مختلف بررسی کنید. همچنین نرم افزارهایی نظیر dreamweaver با ارائه ی ابزارهای کاملی کار طراحی صفحات وب را بسیار ساده تر می کنند. برای آشنایی با ویرایشگرهای html در ادامه کار باما همراه باشید.
در ادامه ی مباحث برای آشنایی با ویرایشگرهای html مراحل تایپ و اجرای کد html در یک ویرایشگر ساده را ارائه داده ایم.
صفحات وب را می توان با استفاده از ویراستاران حرفه ای HTML از جمله dreamweaver، ایجاد و اصلاح کرد.
با این حال، برای یادگیری HTML، یک ویرایشگر متن ساده مانند Notepad (در ویندوز) یا TextEdit (در Mac) را توصیه می کنیم.
ما معتقدیم استفاده از یک ویرایشگر متن ساده راه خوبی برای یادگیری HTML است.
حالا چهار مرحله زیر را دنبال کنید تا اولین صفحه وب خود را با Notepad یا TextEdit ایجاد کنید:
در ویندوز ۸ یا جدید تر:
Start Screen را باز کنید (نماد ویندوز در پایین و سمت چپ صفحه قرار دارد) سپس در کادر جستجو Notepad را تایپ کنید.
در ویندوز۷ یا قدیمی تر:
مسیر Start > Programs > Accessories > Notepad دنبال کنید.
مسیر Finder > Applications > TextEdit را دنبال کنید.
همچنین برخی از تنظیمات را تغییر دهید تا برنامه به درستی ذخیره شود.(از مسیر Preferences > Format گزینه “Plain Text” را انتخاب کنید).
سپس از زیر عنوان “Open and Save” تیک گزینه ی “Display HTML files as HTML code instead of formatted text” را نیز بزنید.
سپس یک سند جدید برای قرار دادن تگ های html ایجاد کنید.
کد HTML زیر را در Notepad نوشته و یا به آنجا کپی کنید:
1 2 3 4 5 6 7 8 9 10 | <!DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body> </html> |
با انتخاب مسیر File > Save as از منوی notpad فایل ایجاد شده را در کامپیوتر خود ذخیره کنید.
در پنجره ی Save as نام فایل را “index.htm” و encoding را UTF-8 تنظیم کنید.
شما می توانید از htm. یا html. به عنوان پسوند فایل استفاده کنید. هیچ تفاوتی وجود ندارد.
فایل HTML ایجاد شده را در بخش favorite مرورگر خود باز کنید (روی فایل html راست کلیک کرده و از زیر منو ی “Open with” مرورگر خود را انتخاب نمائید).
نتیجه ی کار مشابه زیر خواهد بود:
ما یک ادیتور آنلاین برای تست و اجرای کدهای HTML که در قالب مثال های HTML در طول جلسات آموزش ارائه می شود. قرار داده ایم.
در این ادیتور شما می توانید کدهای HTML مثال ها را خودتان تغییر داده و اجرا کنید.
1 2 3 4 5 6 7 8 9 10 11 12 | <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <h1>This is a Heading</h1> <p>This is a paragraph.</p> </body> </html> |
همانطور که اشاره شد برای ایجاد صفحات وب ابتدا باید کدهای html را در ویرایشگرهای html تایپ نموده و پس از ذخیره آن ها را در مرورگرهای خود تست کنید. از این رو ما مباحث این بخش را به آشنایی با ادیتورهای html اختصاص دادیم.