یک قالب وب سایت با استفاده از HTML5 و CSS3 طراحی کنید

Design a Website Template using HTML5 & CSS3

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.

نمونه ویدیوها: (صرفا برای مشاهده نمونه ویدیو، ممکن هست نیاز به شکن داشته باشید.)

توضیحات دوره: آموزش ساخت قالب وب سایت از ابتدا فقط با استفاده از HTML و CSS نحوه ایجاد یک قالب وب از ابتدا با استفاده از عناصر معنایی در HTML تعریف قوانین در CSS برای استایل دادن به قالب استفاده از بهترین انتخابگرها در CSS نحوه استفاده از flexbox در طراحی قالب وب پیش نیازها: حداقل دانش سطح متوسط از HTML و CSS هر رایانه: ویندوز، لینوکس یا مک یک مرورگر وب و یک ویرایشگر کد (در مقابل کد ترجیح داده می شود)

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

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

در این دوره، من قصد دارم یک قالب ساده و زیبا از ابتدا ایجاد کنم و در مورد تمام نکات مربوط به طراحی قالب برای وب سایت ها صحبت کنم.

در این دوره از فریم ورک خاصی مانند بوت استرپ یا مشابه برای طراحی قالب استفاده نمی شود و قالب کاملا ثابت است و فقط با HTML و CSS طراحی شده است.

علاوه بر این، عناصر معنایی HTML برای تشکیل بخش‌های مختلف الگو استفاده می‌شوند.

این الگو دارای ویژگی های زیر است:

بخش هدر سایت که شامل دکمه ثبت نام و ورود به سیستم، آرم و منوی اصلی سایت می باشد
قسمت بدنه سایت که شامل مقدمه، فرم جستجو، نمایش اطلاعات آماری، کادر درباره ما و لیست آخرین دوره ها می باشد
بخش پاورقی سایت که شامل پیوندهایی به شبکه های اجتماعی و پیوندهای مفید و اطلاعات تماس است

علاوه بر این موارد زیر در طراحی بخش های مختلف استفاده شده است

Flexbox
نمادهای Google و نمادهای آنها
عناصر معنایی شامل: سرصفحه، ناوبری، اصلی، بخش، مقاله، پاورقی، آدرس

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

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

سرفصل ها و درس ها

مقدمه Introduction

مقدمه Introduction

ایجاد ساختار پایه برای آموزش و پرورش قالب وب سایت Create Basic Structure for Education Website Template

سربرگ - قسمت 1 Header - Part1
سربرگ - قسمت 2 Header - Part 2

بخش مقدمه Intro Section

اضافه کردن بخش مقدمه Add Intro Section
ایجاد و استایل جستجو فرم Create and Styling Search Form

نمایش اطلاعات و آمار وب سایت Show Website Information & Statistics

بخش گزارش Report Section
درباره بخش About Section

نمایش لیست دروس در قالب وب سایت آموزش Show Course List in Education Website Template

افزودن لیست دوره ها Adding Course List
فهرست درس استایلینگ - قسمت 1 Styling Course List - Part 1
فهرست درس استایلینگ - قسمت 2 Styling Course List - Part 2

پاورقی را به قالب اضافه کنید Add Footer to the Template

اضافه کردن پاورقی Adding the Footer
سبک دادن به پاورقی Styling the Footer

برای ارسال نظر ثبت نام کنید.

نمایش نظرات

Udemy (یودمی)

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

یکی از ویژگی‌های برجسته یودمی، کیفیت بالای دوره‌ها و حضور استادان مجرب و با تجربه در هر حوزه است. این امر به کاربران اعتماد می‌دهد که در حال دریافت آموزش از منابع قابل اعتماد و معتبر هستند و می‌توانند به بهترین شکل ممکن از آموزش‌ها بهره ببرند. به طور خلاصه، یودمی به عنوان یکی از معتبرترین و موثرترین پلتفرم‌های آموزشی آنلاین، به افراد امکان می‌دهد تا به راحتی و با کیفیت، مهارت‌های مورد نیاز خود را ارتقا دهند و به دنبال رشد و پیشرفت شغلی خود باشند.