00:00 / 00:00
1.8x
1.4x
1.0x
0.7x
HD SD
HD
SD
ثبت‌نام رایگان
  • دسترسی به 17 جلسه نمونه از دوره
  • دسترسی به 17 جلسه نمونه از دوره
  • عضویت در تالار گفت‌وگوی دوره
  • اضافه شدن دوره به پروفایل
دوره کامل
  • دسترسی به تمام قابلیت‌های دوره
  • دسترسی کامل و نامحدود به محتوا
    +
  • گواهی‌نامه مکتب‌خونه
  • پروژه محور
  • تمرین و آزمون
  • تالار گفتگو
  • تسهیل استخدام
129,000 تومان
00:00 / 00:00
1.8x
1.4x
1.0x
0.7x
HD SD
HD
SD
مکتب‌خونه

آموزش طراحی وب سایت (Front-End)

دوره‌های مکتب‌پلاس
66 ساعت
66٪ (2827 رای)

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

بسیاری از هنرمندان، کارهای خود را به کمک وبسایت­های مختلف، به اشتراک می­گذارند، بسیاری از دانشمندان، نتایج کارهای علمی خود را اینگونه در اختیار همه قرار می­دهند و همینطور است که انواع و اقسام وبسایت ها، مانند؛ وبگاه­‌های بازرگانی، وبگاه­های ارتباطی،وبگاه‌­های سرگرمی، وبگاه­‌های نرم افزارسازی و ... ایجاد شده‌اند. بدین ترتیب، حدود یک میلیارد و 300 میلیون صفحه­ وب در سراسر جهان، در حال فعالیت است که البته، وبسایت های فعال ایرانی، سهم بسیار کمی از این رقم دارند.

در این دوره مباحث CSS ، HTML ، javaScript پوشش داده شده است.

با این گسترش، انتظار می­رود که برنامه نویسی وب، در جهان یک حرفه­ بسیار مورد نیاز به شمار برود.
طبق لیست مشاغل پر رونق سال 2017، طراحی وب در صدر مشاغل قرار دارد. در این لیست، حرفه های دیگری، مانند نویسنده­ کتاب های آنلاین، آموزش مجازی، متخصص تبلیغات در دنیای مجازی، تولید کننده­ی محتوا و ... که غیرمستقیم به وب مربوط می شوند نیز کارآمد و مورد نیاز به حساب می آیند.

در ایران نیز، برنامه­ نویس و توسعه گر وب، جز 10 شغل پردرآمد به حساب می‌­آید، همچنین آمارها نشان می‌­دهد که مخاطبین کنکور هم در چند سال اخیر به قبولی در رشته های کامپیوتری، تمایل بیشتری پیدا کرده­ اند.

با تمام این تفاسیر، شاید این جمله دور از انتظار نباشد که "برنامه نویسی وب، یکی از مهمترین دانستی‌هایی است که در روزگار فعلی، باید آموخت."

با یادگیری طراحی وب سایت می‌توانید به راحتی وب سایت خود را با سلیقه‌ی شخصی خود طراحی نمایید. اما برای اینکه یک طراح وب سایت فرانت اند شوید، چه مهارت‌هایی لازم دارید که وب‌سایت مورد نظر خود را طراحی کنید؟ در ادامه این مهارت‌ها را برای شما شرح می‌دهیم.
لیست مهارت‌هایی که یک برنامه‌نویس FRONT-END نیاز دارد، به شرح زیر می‌باشد:

  • HTML
  • CSS
  • Javascript
  • کتابخانه‌ها و انواع مختلف فریم‌ورک‌های جاوا اسکریپت 
  • کتابخانه‌های CSS 
  • پردازنده‌های CSS 
  • نرم افزارهای گرافیکی 
  • تست و آزمون خطا
  • آشنایی با UX Design

این لیست به شما کمک می‌کند که در یادگیری طراحی وب سایت، تخصصی‌تر رفتار کنید. 
در کنار این موارد باید حتما به این مورد توجه داشته باشید که برنامه ‌نویس فرانت اند با UI Designer تفاوت‌های بسیار زیادی دارند. در واقع UI Design همان طراح رابط کاربری است و در واقع برای طراحی سایت از یک گرافیست استفاده می‌شود. این شخص بدون اینکه برای سایت کدنویسی خاصی انجام دهد، وب‌سایت مورد نظر را طراحی می‌نماید.

همان‌طور که گفتیم طراح رابط کاربری خودش کدنویسی را به عهده نمیگیرد. او با استفاده از نرم‌افزارهای گرافیکی که در اختیار دارد، (مانند فتوشاپ) شکل ظاهری وب‌سایت شما را طراحی ‌می‌کند.

با این حال باید یک برنامه‌ نویس فرانت اند در کنار تسلط به زبان‌های برنامه نویسی مثل جاوا اسکریپت و html و css باید با نرم‌افزارهای گرافیکی نیز آشنایی لازم را داشته باشد تا در صورت نیاز بتواند از این نرم‌افزارها برای تخصصی‌تر کردن کار خود استفاده نماید.

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

همان‌طور که گفتیم برنامه‌نویس front-end باید طراحی تجربه کاربری را به‌خوبی اعمال کند تا کاربر در زمان استفاده از خدمات پلتفرم شما، حس خوبی را تجربه نماید.

سرفصل‌های دوره آموزش طراحی وب سایت (Front-End)

فصل اول - HTML
02:39 ساعت
02:26
Combined Shape Created with Sketch. 23 جلسه
بارم:
6%
نمایش جلسات فصل  
فصل سوم - JavaScript
00:57 ساعت
00:52
Combined Shape Created with Sketch. 6 جلسه
بارم:
3%
نمایش جلسات فصل  

در این بخش به آموزش جاوااسکریپت پرداخته می شود. جاوااسکریپت در کنار html و CSS یکی از سه تکنولوژی اصلی طراحی وب است.

آشنایی با جاوا اسکریپت
"08:08
خروجی جاوا اسکریپت در لاگ کنسول
"06:26
if و for در جاوااسکریپت
"14:33
آشنایی با JavaScript html DOM
"14:13
javascript dom style
"08:38
jsdom style
100.0%
     
"05:00
فصل چهارم - jQuery
07:12 ساعت
01:07
Combined Shape Created with Sketch. 8 جلسه
بارم:
17%
نمایش جلسات فصل  

دراین بخش با یکی از کتابخانه های مفید جاوااسکریپت با نام jQuery  آشنا می شویم.

در پایان این بخش پروژه ی میان مدت دوم، پروژه ی javascript/jQuery  را انجام خواهید داد که نسخه ی بهبود یافته ی پروژه ی اول است.

 

آشنایی با jQuery
"07:23
when document is ready
"16:31
jquery : events and selectors
"10:49
event selector
9.9%
     
"03:00
jquery hide, show and fade effects
"13:11
slide, animation and stop animation effects
"19:23
animation
5.6%
     
"02:00
پروژه بخش jQuery
84.5%
     
'06:00
فصل پنجم - طراحی واکنش گرا
09:48 ساعت
01:34
Combined Shape Created with Sketch. 12 جلسه
بارم:
20%
نمایش جلسات فصل  
پروژه نهایی
30:16 ساعت
00:16
Combined Shape Created with Sketch. 2 جلسه
بارم:
22%
نمایش جلسات فصل  

تالار گفت‌وگو

مدرس دوره
امیرحسین ناظم

امیرحسین ناظم
دانش آموخته کارشناسی رشته مهندسی برق از دانشگاه صنعتی شریف ایشان به برنامه‌نویسی وب علاقه‌مند بوده و وب سایت‌های گوناگونی پیاده‌سازی کرده است.
بیشتر علاقه‌­مندی ایشان در مورد فرانت‌اند است و با بک‌اند نیز آشنایی دارند. وی همچنین در برنامه نویسی اندروید و جاوا تجارب فراوانی دارد و از تکنولوژی‌های به‌ روز همچون واقعیت افزوده نیز در برنامه‌های خود استفاده می‌کند.

اطلاعات بیشتر

پیش‌نیاز‌های دوره آموزش طراحی وب سایت (Front-End)

این دوره برای تمامی علاقه­مندان به برنامه نویسی وب، کاربردی و مفید است و پیش­نیاز خاصی ندارد.

ویژگی‌های دوره آموزش طراحی وب سایت (Front-End)

Combined Shape1 Created with Sketch. گواهی‌نامه مکتب‌خونه

در صورت قبولی در دوره، گواهی نامه رسمی پایان دوره توسط مکتب‌خونه به اسم شما صادر شده و در اختیار شما قرار می گیرد.

 

مشاهده نمونه گواهینامه

خدمات منتورینگ

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

پروژه محور

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

تمرین و آزمون

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

تالار گفتگو

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

تسهیل استخدام

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

 

مشاهده اطلاعات بیشتر

نظرات  (53 نظر)

صفحه 

از 

6

فاطمه
15:16 - 1399/12/13
دانشجوی دوره
نسبت به سایر دوره هایی که گذرانده بودم بسیار بسیار سطح پایین تری داشت و با وجود علاقه ی زیادی که به موضوع داشتم نتونستم خودم رو راضی کنم که دوره رو تا آخر دنبال کنم.
پشتیبانی مکتب‌خونه
فاطمه عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. لطفا در صورت امکان با ارسال جزییات بیشترما را در ارتقا سطح کیفی خدمات یاری رسانید. info@maktabkhooneh.org
نورالهدی
15:20 - 1399/12/12
دانشجوی دوره
من خریدم ولی اصلا تمایل پیدا نکردم که تا آخر نگاه کنم که مدرکش رو بگیرم. خیلی بیان مطالب و تسط و کیفیت پایین بود
پشتیبانی مکتب‌خونه
نورالهدی عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. لطفا در صورت امکان با ارسال جزییات بیشترما را در ارتقا سطح کیفی خدمات یاری رسانید. info@maktabkhooneh.org
فرید
11:48 - 1399/12/07
دانشجوی دوره
نحوه تدریس فوق العاده بد و ضعیف بدون ستاره
پشتیبانی مکتب‌خونه
فرید عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. لطفا در صورت امکان با ارسال جزییات بیشترما را در ارتقا سطح کیفی خدمات یاری رسانید. info@maktabkhooneh.org
محمد
19:06 - 1399/12/05
فارغ‌التحصیل دوره
سلام خدمت دوستان،این دوره برای کسانی که میخوان با مباحث فرانت اند اشنا بشن و از قبل هیچ زمینه ای ندارند (مثل خودم)،دوره خوبیه و با زبان ها و لایبرری های مختلف آشناتون میکنه،اما به عنوان دوره پیشرفته محسوب نمیشه.به نظرم برای کسانی که میخوان تو حوزه توسعه وب کار کنند،این دوره برای دونستن فرانت اند کفایت میکنه اما برای کسایی که میخوان به صورت تخصصی فرانت اند و دیزاینینگ وب کار کنن،این دوره خیلی مقدماتی محسوب میشه و نیازمند به گذروندن دوره های پیشرفته تر هست.از نقاط ضعف دوره،ضعیف بودن و بی کیفیت بودن صدای استاد درهنگام اموزشه،صدا خیلی بد ضبط شده.
محمد رضا
08:40 - 1399/11/29
دانشجوی دوره
با عرض پوزش از مکتب خونه این دوره اصلا توصیه نمیشه و اصلا ارزش نگاه کردن نداره و وقتتون رو با این اموزش تلف نکنید
پشتیبانی مکتب‌خونه
محمدرضا عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. لطفا در صورت امکان با ارسال جزییات بیشترما را در ارتقا سطح کیفی خدمات یاری رسانید. info@maktabkhooneh.org
منصور
07:47 - 1399/11/22
دانشجوی دوره
سلام . وقتت.ن بخیر. د.ستان دوره به شدت توصیه نمیشه و ضعیف هست . یعنی مدرس حتی زحمت نداده ویدو آموزشی رو ببینه پاز کنه خودش ضبط کنه. آنلاین داره یه چیزیو نگاه میکنه و فقط به زبان بد ترجمه میکنه . واقعا از مکتب خونه بعید هست به نظرم دوره حذف شه یا همیشه 99 دصد تخفیف داشته باشه :) مدرس اینترنتش قطع بشه چیزی برای تدریس نداره. وسط دوره ولش کردم ...
پشتیبانی مکتب‌خونه
منصور عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. لطفا در صورت امکان با ارسال جزییات بیشترما را در ارتقا سطح کیفی خدمات یاری رسانید. info@maktabkhooneh.org
محمد رسول
21:43 - 1399/11/11
دانشجوی دوره
من این دوره رو به علت سطح پایین آموزش و عدم لذت بردن از چیزی که یاد میگیرم رها کردم توصیه میکنم برای یادگیری Front دوره های دیگری رو جست و جو کنید
پشتیبانی مکتب‌خونه
محمدرسول عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. لطفا در صورت امکان با ارسال جزییات بیشترما را در ارتقا سطح کیفی خدمات یاری رسانید. info@maktabkhooneh.org
سیدمهدی
14:39 - 1399/11/07
دانشجوی دوره
دوره ای ضعیف با یک ارائه ضعیف.
پشتیبانی مکتب‌خونه
سیدمهدی عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. لطفا در صورت امکان با ارسال جزییات بیشترما را در ارتقا سطح کیفی خدمات یاری رسانید. info@maktabkhooneh.org
سینا
17:23 - 1399/10/23
دانشجوی دوره
بدترین دوره ممکن بود که میشد بابتش هزینه کرد :)
پشتیبانی مکتب‌خونه
سینا عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. لطفا در صورت امکان با ارسال جزییات بیشترما را در ارتقا سطح کیفی خدمات یاری رسانید. info@maktabkhooneh.org
علیرضا
20:27 - 1399/09/18
دانشجوی دوره
اول از همه باید بگم این دوره نسبت به قیمتش ارزش یه مقدار کمتری داره و برای افرادی که هیچ سر رشته ای از برنامه نویسی وب ندارن میتونه مناسب باشه ولی پیشنهاد نمیشه این دوره صرفا سرچ محور هستش یعنی توی پروژه ها استاد بیشتر مباحث رو نمیگه و خودمون باید سرچ کنیم و پیدا کنیم (بیشتر که چه عرض کنم خییلی بیشتر) در بخش جاوااسکریپت اصلا خوب گفته نشد ولی پروژه ها چندین جاش نیاز بود که از اسکریپت استفاده کنیم در صورتی که هیچ پایه و مفهوم ضروری از اسکریپت گفته نشده بود و باعث سر در گمی میشد از تدریس بگذریم میرسیم به نحوه بیان استاد واقعا تسلط نداشت روی مطلب و هی ضبط رو متوقف میکرد و ادامه میداد که واقعا روی اعصاب بود نحوه بیان خیلی کند و تیکه تیکه بود من خودم به شخصه فیلم ها رو روی سرعت 1.8 برابر نگاه میکردم چون اصلا قابل تحمل نبود و انقدری از وسط های دوره ادم رو ناامید میکرد که یا از دوره منصرف میشد یا فقط به زور میخواست دوره رو تموم کنه حتی با کپی کردن کد من که خودم دیگه توی پروژه اخر بیخیال چند قسمت شدم و انجام ندادم که فقط دیگه دوره رو تموم کنم جمع بندی حرفم این که اگه دنبال یادگرفتن html و css هستید مکتب خونه یه دوره جدید گذاشته که فکر کنم خیلی بهتر باشه یه سری از ویدو هاشو دیدم واقعا بهتر بود به نظرم فقط در اونجا اسکریپت گفته نمیشه که اون هم با آموزش های بیرون میشه اوکیش کرد
پشتیبانی مکتب‌خونه
علیرضا عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم موارد مطرح شده جهت بررسی به بخش مربوطه ارسال شد.

سوالات پرتکرار

آموزش طراحی وب سایت شامل چه مباحثی می باشد؟
برای طراحی یک ظاهر وبسایت لازم است زبانهای markup شامل html و css را فرا بگیرید. همچنین یادگیری زبان برنامه نویسی java script برای پیاده سازی تعاملات بین کاربر و وبسایت لازم است. برای طراحی منطق سایت و جمع آوری داده ها لازم است که به مفاهیم پایگاه داده آشنا بوده و به یکی از زبانهای برنامه نویسیbackend مثل php ، python و فریمورک جنگو، java script و nodejs یا ruby مسلط باشید.
آموزش طراحی وب سایت چه مزایایی دارد؟
برنامه نویسی و طراحی وبسایت یکی از مشاغلی است که با ظهور و نفوذ اینترنت رشد چشمگیری داشته است و با یادگیری این مباحث میتوان فرصتهای شغلی مناسبی را به دست آورد.همچنین این شغل جزو مشاغلی است که برای فعالیت های freelance نیز ظرفیت بالایی داشته و امکان انجام کار به صورت پروژه را دارد.
فرق برنامه نویسی فرانت اند و بک اند چیه؟
فرانت اند به برنامه نویسی سمت کاربر گفته می‌شود که مربوط به طراحی و توسعه هر ان چیزی است که کاربر در سایت می‌بیند و با آن تعامل دارد مثل صفحات، اسلایدر ها و دکمه ها و .. بک اند به برنامه نویسی سمت سرور گفته می‌شود که مربوط به طراحی و توسعه منطق سایت و نحوه کارکرد کل سایت و تعامل آن با پایگاههای داده و سایر بخش هاست.
آیا در صورت خرید دوره، گواهی نامه آن به من تعلق می گیرد؟
خیر؛ شما با خرید دوره می توانید در آن دوره شرکت کنید و به محتوای آن دسترسی خواهید داشت. در صورتی که در زمان تعیین شده دوره را با نمره قبولی بگذرانید، گواهی نامه دوره به نام شما صادر خواهد شد.
آیا گواهی‌نامه‌های دانشگاهی به صورت رسمی و توسط دانشگاه مربوطه صادر می‌شود؟
بله؛ گواهی نامه ها توسط دانشگاه مربوطه و با امضای رئیس دانشگاه یا مسئول مربوطه که حق امضای گواهی نامه ها را دارد صادر می شود و گواهی نامه معتبر دانشگاه است که به اسم هر فرد صادر می شود.
حداقل و حداکثر زمانی که می توانم یک دوره را بگذرانم چقدر است؟
برای گذراندن دوره حداقل زمانی وجود ندارد و شما می توانید در هر زمانی که مایل هستید فعالیت های مربوطه را انجام دهید. برای هر دوره یک حداکثر زمان تعیین شده است که در صفحه معرفی دوره می توانید مشاهده کنید که از زمان خرید دوره توسط شما تنها در آن مدت شما از ویژگی های تصحیح پروژه ها توسط پشتیبان و دریافت گواهی نامه بهره مند خواهید بود.
در صورت قبولی در دوره، آیا امکان دریافت نسخه فیزیکی گواهی نامه دوره را دارم؟
پس از صدور گواهی نامه، نسخه الکترونیکی گواهی نامه در اختیار شما قرار می گیرد. در صورت درخواست شما، نسخه فیزیکی گواهی نامه نیز می تواند برای شما ارسال شود. هزینه ارسال بر عهده کاربر خواهد بود.
پس از سپری شدن زمان دوره، به محتوای دوره دسترسی خواهم داشت؟
بله؛ پس از سپری شدن مدت زمان دوره شما به محتوای دوره دسترسی خواهید داشت و می توانید از ویدئوها، تمارین، پروژه و دیگر محتوای دوره در صورت وجود استفاده کنید ولی امکان تصحیح تمارین توسط پشتیبان و دریافت گواهی نامه برای شما وجود نخواهد داشت.

×

ثبت نظر

به این دوره از ۱ تا ۵ چه امتیازی می‌دهید؟

فصل اول - HTML
02:39 ساعت
02:26
Combined Shape Created with Sketch. 23 جلسه
بارم:
6%
نمایش جلسات فصل  

در این بخش با ساختار کلی فایل های html  آشنا می شوید. در مورد تگ ها در html  توضیح داده می شود و نوشتن attribute  برای تگ های html آموزش داده می شود.

در پایان این بخش، یک پروژه ی میان مدت را شروع می کنیم که تا پایان بخش css  آن را تکمیل خواهیم کرد.

آشنایی با دوره وب
"08:33
آشنایی با وب
"05:17
web, html and front-end
"13:29
HTML and front-end
14.8%
     
"02:00
html requests
"07:48
Requests
11.1%
     
"01:00
نصب نرم افزارها
"06:49
ساختار یک صفحه html
"11:05
تگ ها
"06:55
تگ head
"06:37
تگ body
"07:36
attributes, div and span
"11:54
لینک با تگ "a"
"07:27
تگ ها
22.2%
     
"02:00
لیست های مرتب
"06:35