آموزش طراحی وب
مبانی HTML، CSS، چیدمان و طراحی ریسپانسیو
اگر میخواهید طراح وب شوید یا طراحی وب را از پایه یاد بگیرید، این بخش برای شماست. آموزش طراحی وب از مفاهیم اولیه تا فریمورکهای CSS، جاوااسکریپت و PHP — رایگان و به زبان فارسی.
مسیر یادگیری
مبتدی درسهای ۱–۹ (HTML، CSS، ریسپانسیو، سئو، دسترسیپذیری) → متوسط درسهای ۱۰–۱۳ (فریمورکها) → راهنما درسهای ۱۴–۱۷ (چگونه طراح وب شویم، پروژهٔ لندینگ).
نکتهٔ این هفته
JavaScript, جاوااسکریپت
زبان اسکریپت سمت کلاینت برای تعامل و منطق در مرورگر. با HTML و CSS سه پایه فرانتاند وب را تشکیل میدهند.
همهٔ نکات آموزشی ←معرفی طراحی وب
طراحی وب چیست، فرانتاند و بکاند، و ابزارهای اولیه.
مبانی HTML
ساختار سند HTML، تگهای اصلی و معناسازی.
متن، لینک و تصویر در HTML
پاراگراف، عنوان، لینک، تصویر و لیستها.
مبانی CSS
اتصال CSS به HTML، انتخابگرها و قواعد پایه.
مدل جعبه (Box Model)
محتوای المان، padding، border و margin.
چیدمان با Flexbox
چیدمان یکبعدی با display: flex و تراز آیتمها.
طراحی ریسپانسیو
Media Query، واحدهای نسبی و موبایلفرست.
سئو مقدماتی برای وب
متا تگها، ساختار سند، سرعت و محتوا برای موتورهای جستجو.
دسترسیپذیری وب (A11y)
معناسازی، کنتراست و کیبورد برای همه کاربران.
فریمورکهای CSS
Tailwind، Bootstrap، Bulma و سایر فریمورکهای محبوب CSS.
ابزارها و فریمورکهای مرتبط با HTML
قالبهای HTML، پیشپردازندهها و کامپوننتهای مبتنی بر HTML.
فریمورکهای جاوااسکریپت
React، Vue، Angular، Svelte و مقایسهٔ آنها.
فریمورکهای PHP
Laravel، Symfony، CodeIgniter و انتخاب فریمورک مناسب.
چگونه طراح وب بشویم
مسیر یادگیری، مهارتها و گامهای عملی برای تبدیل شدن به طراح وب.
چگونه طراحی وب کنیم
مراحل عملی از ایده تا تحویل: تحقیق، وایرفریم، طراحی و پیادهسازی.
طراحی وب برای مبتدیان
شروع از صفر: مفاهیم پایه، ابزارها و اولین پروژهٔ طراحی وب.
پروژه عملی: ساخت صفحهٔ لندینگ
یک صفحهٔ لندینگ ساده با HTML و CSS از صفر تا تحویل.