آموزش طراحی سایت، دوره مقدماتی فرانت اند رایگان - درسمن

صفحه اصلی / دوره‌های آموزشی / HTML-CSS / آموزش طراحی سایت، دوره مقدماتی فرانت اند

آموزش طراحی سایت، دوره مقدماتی فرانت اند


سطح مهارت
مقدماتی
مدت زمان
500 دقیقه
تعداد دانشجویان
3788
مدرس
مهدی عباسی
میانگین امتیاز دوره: (145 رای)

جلسات


             
مهدی عباسی
مدرس :

مهدی عباسی

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

توضیحات دوره

دوره آموزش طراحی سایت

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

آموزش طراحی سایت به صورت کاملا اصولی

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

آموزش طراحی سایت به معنای واقعی

 طراحی یک سایت مجموعه ای از فعالیت های مرتبط می باشد. این فعالیت ها شامل UI، UX، Frontend و Backend می شود. اما در اکثر موارد منظور از طراحی سایت؛ بخش سمت کاربر، یعنی فرانت اند است. در یادگیری طراحی وب، اهمیت فرانت اند بسیار زیاد است. برای پیاده سازی فرانت اند نیز یک سری مراحل را باید طی کنیم. در ادامه به شرح این مراحل می پردازیم.

شروعی ساده با HTML

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

از جمله فعالیت هایی که با استفاده از HTML می توان انجام داد این است که یک کلمه یا تصویر را در جای خاصی  از صفحه قرار دهیم، یا اینکه کلمات را ایتالیک کنیم و یا فونت را تغییر دهیم. همه این موارد و بسیاری دیگر از فعالیت ها را می‌توانیم با استفاده از HTML انجام دهیم. 

علاوه بر این موارد، طراحان وب سایت با توجه با رعایت اصول طراحی وب می‌ توانند از HTML برای طراحی فرم هایی مربوط به سفارش محصولات، رزرو کردن کالا یا جستجوی اطلاعات استفاده کنند. بنابراین، HTML بلوک اصلی برای ایجاد یک نام تجاری و راه اندازی یک سایت تجارت محور است.

در نخستین گام از آموزش طراحی سایت، باید html را بیاموزید

ادامه روند با CSS

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

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

جهشی قدرتمند با جاوا اسکریپت

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

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

هنگامی که موس را روی منو حرکت می دهید، آن چیزی که مشاهده می کنید، تغییر پویا رنگ عناصر در یک صفحه است که نشات گرفته از حضور کدهای جاوا اسکریپت در کدهای آن صفحه است. 

جاوا اسکریپت قدرتمند در کنار آموزش طراحی سایت

اکما اسکریپت

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

 ECMAScript معمولا برای اسکریپت نویسی سمت سرویس گیرنده در شبکه جهانی وب استفاده می شود و به طور فزاینده ای برای نوشتن برنامه ها و سرویس های سرور با استفاده از Node.js استفاده می شود.

حرفه ای ترین حالت ممکن با React

مهم ترین گام در یادگیری طراحی سایت React است. React.js توسط یک مهندس نرم‌افزار که در فیسبوک مشغول به کار بود ساخته شد. React یکی از فریمورک های جاوا اسکریپت است که در ایجاد رابط‌های کاربری با استفاده از یک مفهوم مبتنی بر مؤلفه متمرکز است. هدف اصلی React این است که گسترده، سریع، منعطف و ساده باشد.

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

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

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

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

سوالات متداول

دوره اصول طراحی سایت در چه سطحی برگزار شده است؟

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

پیش نیاز های ورود به این دوره چیست؟

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

آیا پس از گذراندن دوره طراحی سایت می توانم جذب بازار کار شوم؟

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

یادگیری دوره اصول طراحی سایت مناسب چه افرادی است؟

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

پس از یادگیری این دوره در چه حوزه ای می توان مشغول به کار شوم؟

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

نظر شما در تصمیم دیگران اثرگذار است.

لطفا برای همراهان درسمن و بهتر شدن دوره نظر خود را بنویسید.

برای ارسال نظر نیاز است وارد سایت شوید. در صورت نداشتن حساب کاربری عضو شوید.

نظرات دانشجویان

کاربر درسمن
میلاد ناظریان

سلام استاد گرانقدر مهندس عباسی.. قربان از شیوایی و رسا بودن و گیرایی کلامتون نمیتونم بحق تعریف کنم. دس مریزاد.. استاد من حدود 10ساله تو این وادی UI هستم و سئو.. اما بااینکه دوره حضوری HTML, CSS و کلی دوره های پروژه محور ازین قبیل که 90درصد طراحی کامل قالب بوده, رو گذروندم بقول معروف تئوری و حفظ کردنیام خوبه اما استاد نمیتونم بطور عملی پروژه رو بیارم بالا و اون قلق رو نتونستم بگیرم..استدعا دارم مثه همیشه راهکاری امیدوارانه نصیبم گردانید..باتشکر بسیار ارادتمند: میلاد.

پشتیبانی 1
پشتیبانی 1

سلام میلاد عزیز، از اینکه صمیمانه همراه ما هستید و به ما لطف دارید از شما مچکریم.

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

کاربر درسمن
نسرین همرنگ

استاد عالی توضیح میدن

کاربر درسمن
میرابراهیم میرآقایی

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

پشتیبانی 1
پشتیبانی 1

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

کاربر درسمن
معصومه فرجامی

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

پشتیبانی 1
پشتیبانی 1

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

کاربر درسمن
Mahmod

سلام ببخشید من تازه دارم برنامه نویسی رو دنبال میکنم.خواستم بپرسم برای شروع باید چه دوره ای رو اول ببینم من فعلا دارم دوره مقدماتی سی پلاس پلاس میبینم.کدوم دوره را باید برای شروع مقدماتی دید؟؟؟؟لطفا جواب بدید

پشتیبانی 1
پشتیبانی 1

سلام امیر جان، بستگی به خودتون داره که هدفتون چی باشه؟

پیشنهاد ما به شما این هست که برای شروع ابتدا دوره html css را مشاهده کنید.

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

موفق و پیروز باشید.

نمایش بیشتر
آموزش طراحی سایت به همراه یادگیری اصول

56