HTML از صفر؛ ساخت وبسایت
یک مسیر تقریباً کامل HTML در ۵۱ گام: از اولین فایل تا متن، لینک، رسانه، تصاویر واکنشگرا، جدول، فرم، ساختار معنایی، دسترسپذیری، فراداده و پروژهٔ وبسایت سهصفحهای؛ رایگان و بدون پیشنیاز.
مشاهده مسیر یادگیریHTML از صفر تا ساخت یک وبسایت
این دورهٔ یکپارچه و رایگان، مباحث مهم و کاربردی HTML را از صفر تا موضوعهای تکمیلی پوشش میدهد. هیچ تجربهٔ برنامهنویسی لازم نیست؛ همهٔ مسیر در همین یک دوره است.
مسیر دوره؛ ۸ بخش و ۵۱ گام
- اولین صفحه: وب، فایل HTML، ساختار سند، تگ و ویژگی
- متن و محتوا: تیتر، پاراگراف، فهرست، تأکید، نقلقول و کاراکترهای ویژه
- لینک و رسانه: مسیر فایل، ناوبری، alt، figure، تصاویر واکنشگرا، audio، video و زیرنویس
- HTML معنایی: ناحیههای صفحه، article و section، جدول و سرستونهای دسترسپذیر
- فرمها: label و name، انواع input، انتخابها، textarea و select، datalist، فایل، اعتبارسنجی و ارسال داده
- دسترسپذیری: صفحهکلید، نام کنترل، ARIA، ویژگیهای عمومی و متن فارسی و دوجهته
- امکانات تکمیلی: فراداده، details و dialog، popover، iframe، progress و meter، SVG و canvas و MathML، template، اتصال CSS و JavaScript، خطایابی و انتشار
- پروژهٔ پایانی: سایت سهصفحهای معرفی و ثبتنام کارگاه
چطور یاد میگیریم؟
۳۲ گام آموزشی و ۱۹ فعالیت شامل پیشبینی، تغییر و تکمیل کد، رفع اشکال و نوشتن HTML داریم. تمرینهای کدنویسی در مرورگر پیشنمایش و بررسی خودکار دارند. راهنماهای تدریجی برای فعالیتها در دسترساند. نمونهها را تغییر بده، نتیجه را ببین و علت آن را توضیح بده.
برای ساخت سایت چندصفحهای، فایلها را در رایانه هم ذخیره میکنی؛ یک ویرایشگر متن ساده و مرورگر کافی است. بررسی خودکار ساختارهای مشخص را میسنجد؛ کیفیت محتوا، دسترسپذیری کامل و رفتار سایت را با چکلیستهای دستی هم بازبینی میکنی.
در پایان چه میسازی؟
یک سایت سهصفحهای با ناوبری، تصویر، جدول، پرسشهای متداول و فرم دسترسپذیر. فرم پروژه نمایشی است و ذخیرهٔ داده به سرور نیاز دارد. نقش و شیوهٔ اتصال CSS و JavaScript معرفی میشود؛ یادگیری این دو پیشنیاز دوره نیست. موضوعهای وابسته به برنامهنویسی مانند رسم پویا و Web Components در حد شناخت کاربرد و مرز با HTML معرفی میشوند.
برای هر گام آموزشی حدود ۵ تا ۱۵ دقیقه و برای تمرینها و پروژه زمان بیشتری در نظر بگیر. با تکمیل گامهای الزامی، نشان «سازندهٔ صفحات HTML» را دریافت میکنی.
دربارهٔ محیط تمرین
پیشنمایش امن سایت، مجموعهٔ محدودی از تگها و ویژگیهای HTML را نگه میدارد. برای مباحثی مثل اطلاعات head، برخی ویژگیهای فرم، details، رسانههای بیرونی و بعضی جزئیات جدول، روش اجرای کامل در فایل محلی توضیح داده شده است. بررسی خودکارِ هر فعالیت فقط معیارهای اعلامشدهٔ همان فعالیت را میسنجد. یادگیری تمام مباحث دوره با یک مرورگر و ویرایشگر متن ساده ممکن است.
پیشنیازها
هیچ پیشنیاز آموزشی، برنامهنویسی، HTML، CSS یا JavaScript لازم نیست. از صفر شروع میکنیم. فقط کار معمولی با رایانه، ساخت پوشه و ذخیرهٔ فایل را قدمبهقدم انجام میدهیم. هیچ دورهٔ دیگری پیشنیاز اجباری نیست.
دستاورد پایان دوره
بج پایان دوره: سازندهٔ صفحات HTML
با تکمیل گامهای الزامی دورهآماده یادگیری هستید؟
برای ثبت پیشرفت وارد شویدمسیر یادگیری
51 گام۱. اولین صفحه؛ وب و ساختار سند HTML رایگان
۲. متن، فهرست و نشانهگذاری محتوا رایگان
۳. لینک، تصویر و رسانه رایگان
۴. HTML معنایی و جدولهای داده رایگان
۵. فرمها؛ دریافت اطلاعات از کاربر رایگان
- فرم چگونه کار میکند؟ label، name و ارسال
- انواع input؛ انتخاب مناسب برای هر داده
- اعتبارسنجی بومی؛ required، pattern و محدودیتها
- انتخابها؛ radio، checkbox و fieldset
- textarea، select و پیشنهادهای datalist
- فایل، hidden و تفاوت disabled با readonly
- تمرین؛ فرم ایمیل با برچسب و اعتبارسنجی
- تمرین؛ انتخاب شیوهٔ حضور در کارگاه
- پیشبینی؛ کدام دادهٔ فرم ارسال میشود؟
۶. دسترسپذیری و صفحهٔ فارسی رایگان
۷. امکانات تکمیلی، فراداده و انتشار رایگان
- head حرفهای؛ عنوان، توضیح، آیکون و فراداده
- عناصر تعاملی بومی؛ details، dialog و popover
- کدام ساختار پرسشوپاسخ درست است؟
- iframe و محتوای جاسازیشده؛ مرز یک سند دیگر
- نشاندادن مقدار؛ progress، meter و output
- گرافیک و فرمول؛ SVG، canvas و MathML
- اتصال CSS و JavaScript؛ template و مرز رفتار پویا
- خطایابی و اعتبارسنجی؛ مرورگر همهٔ خطاها را نشان نمیدهد
- انتشار، سازگاری و نقشهٔ ادامهٔ HTML