مروری بر دوره
در این دوره ابتدا با اصول اولیه و اصطلاحات و ابزار های مورد نیاز با این تخصص آشنا میشویم سپس با فراگیری اصول تجربه کاربری شروع به ایجاد قالب وب سایت با استفاده از نرم افزار فتوشاپ میکنیم بعد از این مراحل وارد مرحله کد نویسی می شویم. ابتدا با اصول html آشنا شده بعد به کمک Css طرح دلخواه خود را پیاده می کنیم سپس با استفاده از HTML5 & CSS3 جلوه های پیشرفته به قالب اضافه می کینم در نهایت با فراگیری اصول اولیه جاوا اسکریپت و آشنایی با Jquery پروژه خود را نهایی میکنیم. در جلسات پایانی این دوره شما با فریم ورکهای پرکاربرد طراحی وب آشنا خواهید شد.
.
آنچه خواهید آموخت
- آشنایی کامل با مفاهیم پایه ای و اصطلاحات طراحی وب
- کار با ابزارهای تخصصی طراحی ادیتورها مرورگرها هاست دامنه و....
- آشنایی با اصول تجربه کاربری (UX) و طراحی رابط کاربری (UI) با Figma
- کدنویسی حرفه ای صفحات وب با HTML5 و CSS3
- پیاده سازی صفحات ریسپانسیو با Flexbox Grid و Media Queries
- آشنایی با اصول اولیه برنامه نویسی با JavaScript و jQuery
- کار با فرم ها، جداول، منوها و عناصر پیشرفته در وب
- استفاده از هوش مصنوعی در طراحی و تولید کد
- آشنایی مقدماتی با فریمورک Bootstrap برای طراحی واکنشگرا
- آشنایی اولیه با WordPress و ساخت وب سایتهای داینامیک
- رعایت نکات دسترس پذیری (Accessibility) و بهینه سازی کد
- آماده سازی پروژه های واقعی و نهایی سازی طراحی وب
سرفصل ها
ابتدا با اصول اولیه و اصطلاحات مربوط به طراحی وب سایت آشنا میشویم
- آشنایی با اصطلاحات رایج در دنیای وب
- ابزارهای لازم برای طراحی وب ادیتورها، مرورگرها، FTP ...
- انتخاب دامنه مناسب و نکات ثبت آن
- فضای میزبانی (هاستینگ) و آشنایی با پنلهای مدیریت هاست
- آشنایی اولیه با قراردادهای طراحی سایت
- روان شناسی رنگها و اصول انتخاب رنگ در طراحی وب
- معرفی محیطهای کدنویسی و مقایسه آنها
- مروری بر مفاهیم اولیه دیجیتال مارکتینگ برای طراحان وب
سپس شروع به فراگیری اصول کدنویسی HTML خواهیم نمود
- معرفی HTML و تاریخچه آن
- بررسی نسخه های مختلف HTML
- ساختار صفحات HTML :
- تگهای اصلی <head> و <body>
- عنوانها (<h1> تا h6>
- پاراگراف ها (<p>)
- لینک ها (<a>)
- تصاویر (<img>)
- لیست ها و جدول ها
- تگ های رسانه ای :
- ویدیو (<Video>)
- صدا (<audio>)
- فریم های خارجی (<iframe>)
- تگهای معنایی و ظرف ها (Containers)
- استفاده از <div> و <span> برای ساختاردهی
- بررسی عناصر معنایی مثل <section>, <article>, <nav>, <header> <footer>
- تفاوت عناصر درون خطی (Inline) و بلوکی (Block)
- ساخت فرم ها و صفحات چندگانه
- اعتبار سنجی (Validate) کدهای HTML و بررسی خطاها
پس از آشنایی با html شروع به یادگیری css خواهیم کرد
- آشنایی با CSS و روشهای افزودن آن به صفحات HTML :
- Inline, Internal, External
- انواع سلکتورها (Selectors)
- سلکتورهای پایه (Basic Selectors)
سلکتورهای نسبی (Relational Selectors: descendant, child, sibling)
سلکتورهای شبه کلاس (Pseudo-class Selectors: :hover, :nth-child)
سلکتورهای شبه عنصر (Pseudo-element Selectors: ::before, ::after)
- مفاهیم Value و Property در CSS
- وراثت (Inheritance) و اختصاص‌پذیری (Specificity) :
- ترتیب و اولویت استایل‌ها
- مفهوم !important
- مدل جعبه‌ای (Box Model) :
- محتوا، padding، margin، border
- نحوه محاسبه اندازه عنصر
- ابعاد و موقعیت‌دهی عناصر
- ویژگی display (block, inline, inline-block, none)
- ویژگی position (static, relative, absolute, fixed, sticky)
- ویژگی float و clear
- واحدهای اندازه‌گیری (px, %, em, rem, vw, vh)
- مخفی‌سازی عناصر (display: none, visibility: hidden, opacity)
- ابزارهای مدرن چیدمان
- ساختار flexbox
- ساختار grid
- Media Queries برای طراحی واکنشگرا
- استایل‌دهی به عناصر مختلف :
- متن‌ها (تایپوگرافی)
- لیست‌ها
- فرم‌ها
- جدول‌ها
- تصاویر
- لینک‌ها
- رنگها و پس‌زمینه‌ها در CSS
- انواع رنگها (RGB, HEX, HSL)
- گرادیان‌ها (Linear و Radial)
- سایه‌ها (text-shadow, box-shadow)
- حاشیه‌ها (borders)
- ساخت منوهای آبشاری با CSS
- طراحی فرم‌ها و جداول پیشرفته
- استایل‌دهی برای چاپ (Print Stylesheet)
- اعتبارسنجی و رفع خطاهای رایج در CSS
- مفاهیم دسترس‌پذیری (Accessibility) در استایل‌دهی
مباحث HTML5 و CSS3
- معرفی HTML5 و ساختار جدید آن
- تگهای معنایی جدید: header, footer, section, article, nav, aside
- فرم‌های پیشرفته در HTML5 و فیلدهای جدید
- اضافه کردن فونت سفارشی (web fonts) و تایپوگرافی
- کار با تگهای svg و canvas
- آشنایی با APIهای HTML5 و پشتیبانی مرورگرها
- ترنزیشن‌ها، انیمیشن‌ها، Transformها
- بررسی تفاوت مرورگرها و مشکلات رایج در نمایش CSS3
ریسپانسیو
- معرفی Bootstrap و استفاده از آن در طراحی صفحات
- معرفی افزونه‌ها و ابزارهای مفید توسعه فرانت‌اند
مباحث مربوط به Figma
- کاربردپذیری
- المان‌های یک application
- نحوه کار با Figma
کاربرد هوش مصنوعی در طراحی وب
- هوش مصنوعی چیست و چرا در طراحی وب مهم است؟
- نگاهی به آینده طراحی وب با کمک AI
- معرفی ابزارهای تولید کد با AI مثل GitHub Copilot، Codeium
- ابزارهای تولید تصویر و طراحی رابط کاربری مثل Figma AI
سپس به یادگیری jQuery و آشنایی با وردپرس می‌پردازیم
سوالات متداول
بله، این دوره از صفر شروع می‌شود و تمام اصول پایه‌ای HTML، CSS و طراحی وب را پوشش می‌دهد. حتی اگر هیچ تجربه‌ای در طراحی وب نداشته باشید، می‌توانید با این دوره شروع کنید.
برای شروع دوره شما به نرم‌افزارهای ساده‌ای مانند مرورگر وب و یک ویرایشگر کد مثل VSCode نیاز خواهید داشت. در مراحل پیشرفته‌تر ممکن است به ابزارهایی مانند Figma و Git نیز نیاز پیدا کنید.
خیر، پیش‌نیاز خاصی برای این دوره وجود ندارد. اما اگر با مفاهیم پایه‌ای کامپیوتر و اینترنت آشنا باشید، یادگیری برای شما راحت‌تر خواهد بود.
در این دوره تمرکز اصلی بر روی HTML، CSS و طراحی وب است. با این حال، در بخش‌های پایانی دوره با اصول ابتدایی JavaScript و فریم‌ورک‌های طراحی وب آشنا خواهید شد.
بله، این دوره تمام مهارت‌های لازم برای شروع به عنوان یک طراح وب را به شما می‌دهد. با این حال، برای دستیابی به موقعیت‌های شغلی بیشتر ممکن است نیاز به تجربه و انجام پروژه‌های بیشتری داشته باشید.
تقویم دوره
| وضعیت | کد دوره | نام اساتید | نوع برگزاری | محل | طول دوره | شهریه | روزهای هفته | تاریخ شروع | ساعت کلاس | ||
|---|---|---|---|---|---|---|---|---|---|---|---|
|
...
|
Tra2454 | حضوری/آنلاین (لایو) | ارژنگ دوره های حضوری در محل شعبه اصلی مؤسسه آموزش عالی ارژنگ برگزار میگردند. | 60 ساعت | 55,000,000 ریال | چهارشنبه | چهارشنبه, 1404/04/04 | از 17:0 تا 21:0 | ثبت نام | ||
من html,css،javascript و تا حدی ری اکت بلدم،بنظرتون این دوره به درد من میخوره؟!
و اینکه ری اکت یاد نمی‌دید تو این دوره؟!
وقتتون بخیر، ری اکت جزو سرفصل های این دوره نیستش، ولی اگر فکر میکنید نیازه، میتونید با مفاهیمی که گفتید کاملا اصولی و کاربردی آشنا بشید.
این دوره کی برگزار میشه؟
تاریخ برگزاریش 8 دی هستش هنوز قطعی نشده البته، ممکنه یک مقدار کمی دیرتر برگزار بشه.
سلام وقت بخیر. فیلم های دوره ضبط میشن و بعدا قابل دیدن هست؟ و تا چه مدتی به فیلم ها دسترسی داریم؟
وقتتون بخیر، بله ضبط میشه و تا حدودا دو ماه دسترسی دارین.
سلام وقتتون بخیر
برای این دوره هیچ پیش نیاز خاصی لازم نیست؟ لزومی نداره از قبل مهارتی داشته باشیم؟ خصوصا در بخش برنامه نویسی
وقتتون بخیر، خیر در همین دوره تمام مفاهیم موردنیازتون آموزش داده میشه.
سلام بعد از این دوره می تونیم برای مدرک ciw اقدام کنیم؟
سلام متاسفانه کشور ما از طرف ciw تحریم هستش.
دوره غیر حضوری هم داره؟
این دوره کاملا به صورت آنلاین برگزار میشه.
سلام وقتتون بخیر باشه. دوره حضوری در همون ادرس فاطمی برگزار میشه؟ و اینکه هزینه دوره حضوری و انلاین یکیه؟
وقت بخیر
بله دوره های حضوری فاطمی برگزار میشه و هزینه دوره هم سه میلیون و پانصد هزار تومان هست
سلام خسته نباشید این دوره حتما برگزار میشه ؟ چون برام بسیار مهم و حائز اهمیت است.
ممنون
سلام آریا عزیز
بله برگزار خواهد شد.
برای این دوره پیش نیاز یا دانش قبلی ای لازمه؟ یا همه چیز از صفر تدریس میشه؟
وقت بخیر
همه موارد از صفر تدریس میشن و نیاز به پیش نیاز خاصی نیست .
سلام و عرض ادب
مدرک هم میدین ؟
با سلام بله. برای کلیه دوره های برگزار شده در ارژنگ شما مدرک معتبر وزرات علوم تحقیقات و فناوری رو دریافت می کنید.
این دوره در تهران برگزار نمیشه ؟
دوره Tra1800 همانطور که ذکر شده خیر
من این دوره رو میخوام آنلاین شرکت کنم ،یعنی فقط حضوری برگزار میشه؟
با سلام دوره شماره Tra1800 بله تنها به صورت حضوری هست.
طراحی وب فقط حضوری برگزار میشه؟انلاین نداره؟
با سلام جهت اطلاع از شیوه برکزازی به اطلاع داخل تقویم دوره توجه فرمائید.
یعنی چی حضوری/آنلاین لایو
با سلام معنی این گزینه این هست که شما خودتون نوع حضورتون در کلاس رو مشخص می کنید هم می توانید به صورت آنلاین در این دوره شرکت کنید و هم حضوری انتخا با شماست.
Salam yek Soal Dashtm xedmatetan in klass onlin ham bargozar mishawad
با سلام
نوع برگزاری هر دوره در تقویم دوره ذکر میشه و ممکن است تنها به صورت حضوری، آنلاین و یا ترکیبی باشد. لطفا به هنگام ثبت نام به شیوه برگزاری دقت فرمائید.
با تشکر
شما نیز نظر خود را بنویسید: