یکی از مهارت هایی که اکثرا توسط دانشجویان دست کم گرفته میشود، اما اتفاقا نیازهای زیادی در بازار کار برای آن وجود دارد، طراحی صفحات وب با استفاده از HTML، CSS و jQuery است. در حالی که مشتریان و شرکت های بسیاری نیاز به افرادی مسلط در این زمینه ها دارند، اما اغلب دانشجویان به کپی کاری و ویرایش کدهای آماده بسنده می کنند و از بسیاری از مهارت ها باز می مانند و نمیتوانند پول خوبی از این طریق کسب کنند؛ چرا که تصور می کنند مهارت های برنامه نویسی میتواند درآمد بهتری داشته باشد.
تجربه همیشه ثابت کرده است بیشترین چیزی که در نگاه اول پیش روی مشتریان است و بابت آن حاضر میشوند به شما پول خوبی پرداخت کنند، ظاهر کاری است که شما تحویل آن ها می دهید. یک سایت هر چه قدر هم قوی باشد، اما اگر ظاهر خوبی نداشته باشد، نه کاربران آن سایت و نه کسانی که سایت را به شما سفارش داده اند، هیچ بهایی برای کارهای برنامه نویسی با ارزش شما قائل نخواهند شد!
به لطف پروردگار و پس از برگزاری چندین دوره آموزش در زمینه طراحی و برنامه نویسی تحت وب و همچنین برگزاری کلاسهای آموزش طراحی صفحات وب قالب وردپرس، و جلب رضایت بالای دانشجویان، تصمیم گرفتیم تا این بار در طرحی جدید، دانشجویان تمامی کشور بتوانند از دوره های آموزش طراحی حرفه ای صفحات وب آنلاینر استفاده کنند. البته به علت گستردگی کار و اهمیت کیفیت، دو استاد برای ارائه ی این دوره در نظر گرفته شده است.
هر سایتی با هر سیستم مدیریت محتوا و یا زبان برنامه نویسی ای که تولید بشود، نیاز دارد تا به وسیله ی HTML، CSS و jQuery (بعنوان محبوبترین کتابخانه جاوااسکریپت) کدنویسی شود.
برای شرکت در این دوره آموزشی، بهتر است تا مفاهیم و نکات اولیه در HTML و CSS را بدانید. اما اگر تازه کار هستید، فیلم های آموزشی ای که به شما کمک می کنند تا این مهارت ها را به دست آورید، به شما معرفی می شوند تا به صورت رایگان بتوانید آن ها را دانلود نمایید.
در این پایان دوره ی آموزشی، می توانید:
- بعنوان یک متخصص طراحی صفحات وب، با مهارت تبدیل PSD به HTML وارد بازار کار شوید (البته شما مهارت های خوبی از jQuery را نیز در دوره به دست می آورید، اما نامی که برای این مهارت در بازار به صورت عمومی استفاده میشود، تبدیل PSD به HTML است)
- از مشتریان تان سفارش طراحی سایت و قالب سایت اختصاصی بگیرید.
- گرافیست های بسیاری هستند که برای مشتریان شان طرح می زنند اما نمی توانند آن را تبدیل به کد کنند! شما میتوانید با آن ها به صورت مشترک نسبت به دریافت سفارشات طراحی سایت برای مشتریان تان اقدام کنید.
- طراحان قالب وردپرس بسیاری هستند که نمی توانند برای مشتریان شان کدنویسی های استاتیک (HTML, CSS, jQuery) انجام بدهند اما شما میتوانید با آن ها مشارکت های بسیاری داشته باشید.
- مشتریان بسیاری هستند که نیاز دارند قالب های سایت های آن ها با تکنولوژی های روز سازگار باشد، و یا نیاز به ویرایش و … دارند و جالب اینجاست که شما بابت انجام این ویرایش ها، که بسیاری از انجام آن ها ناتوان هستند، مبالغ مناسبی میتوانید دریافت کنید.
- شما میتوانید به صورت مشترک قالب های سایت تولید کنید و در سایت های مختلف به فروش برسانید.
- خواهید توانست قالب های وردپرس، قالب های جوملا و یا حتی قالب های استاتیک را فارسی سازی کنید.
- در شرکت های طراحی سایت که نیازمند نیروی متخصص هستند، استخدام شوید (آیا میدانید در صورتی که از سوی آنلاینر به شرکت های طراحی سایت معرفی شوید، چه تاثیری در میزان اعتماد به شما جهت استخدام تان خواهد داشت؟ آنلاینر افرادی که دوره را به خوبی به اتمام برسانند، به شرکت های طراحی سایت معرفی خواهد کرد.)
حداقل سرفصل ها و مباحث دوره که توسط مدرسین دوره ضبط و ارائه خواهد شد، در ذیل خدمت شما معرفی می شوند (در حین دوره نیز بر اساس سوالات و نیازهای دانشجویان در چارچوب محتوای دوره، فیلم های جدیدتری با صلاحدید اساتید دوره ضبط و ارائه میشوند). همچنین برخی عناوین آموزشی نیازمند ضبط و آموزش در چند مرحله اند و در تمامی مراحل آموزش، نکات مربوط به SEO (بهینه سازی برای موتورهای جستجو) و بهینه سازی فرآیند کدنویسی و سرعت کدنویسی نیز آموزش داده خواهد شد:
- 1- معرفی سبک کاری حین دوره و ابزار های لازم برای شروع
- 2- معرفی آموزش های پیش نیاز شروع آموزش های دوره پیشرفته
- 3- پایه گذاری کار و layout بندی با طراحی بالا به پایین – slice بندی
- 4- تکنیک های ضروری در فتوشاپ برای آموزش تبدیل PSD به HTML – ابزارهای لازم در فتوشاپ
- 5- تکنیک های ضروری در فتوشاپ برای آموزش تبدیل PSD به HTML – تنظیمات لازم
- 6- شناخت انواع پسوندهای فایل تصاویر برای استفاده در طراحی سایت
- 7- تکنیک های ضروری در فتوشاپ برای آموزش تبدیل PSD به HTML – نکات blending options
- 8- تکنیک های ضروری در فتوشاپ برای آموزش تبدیل PSD به HTML – نکات مهم و اساسی
- 9- شاخه بندی اولیه و ساخت index.html – style.css و ریست مناسب استایلهای پیش فرض – ساخت فایل reset.css
- 10- آموزش کار با پترن ها در طراحی سایت و کدنویسی CSS و HTML
- 11- شروع کدنویسی header و اعمال نوار اولیه
- 12- کدنویسی آیکون های اشتراک گذاری در شبکه های اجتماعی
- 13- کدنویسی بخش لوگو در صفحه وب
- 14- کدنویسی بخش بنر تبلیغاتی در هدر – آشنایی با ابعاد استاندارد بنرهای تبلیغاتی
- 15- ساخت منوی اصلی سایت بدون عمق
- 16- کدنویسی منوی دراپ داون با html و css در صفحه ی وب
- شروع به کار حرفه ای با jQuery
- 17- آموزش استفاده از جی کوئری jQuery در طراحی صفحات وب
- 18- آموزش ساخت snippet ها برای طراحی وب جهت افزایش سرعت
- 19- آموزش ساخت منوی کشویی با استفاده از جی کوئری – jQuery
- 20- آموزش به کارگیری منوی کشویی ساخته شده با jQuery در تبدیل PSD به HTML
- 21- آموزش اصول و syntax های اولیه و پرکاربرد جی کوئری jQuery در طراحی سایت
- 22- کدنویسی فرم جستجو و تکمیل header سایت بر اساس طرح PSD
- 23- استفاده ی بهینه و حرفه ای از Class ها در طراحی صفحات وب
- 24- کدنویسی ها و استایل دهی های ابعاد برای سایدبار و محتوای اصلی سایت
- 25- کدنویسی تب منو با HTML و CSS در سایدبار صفحه وب
- 26- اعمال نوار افقی در هدر – header
- 27- استایل دهی های اولیه به بخش محتوا در صفحه ی وب
- 28- آموزش ساخت اسنیپت تب منو با jQuery
- 29- آموزش تکمیل کدنویسی تب منوی ویژه ها در سایدبار
- 30- آموزش ساخت اسلایدر ریسپانسیو (واکنش گرا) با پلاگین SlidesJS جی کوئری
- 31- آموزش ساخت اسنیپت snippet اسلایدر ریسپانسیو jQuery با پلاگین SlidesJS
- 32- آموزش افزودن قابلیت Caption به اسلایدهای اسلایدر
- 33- آموزش گذاشتن اسلایدر در طرح اصلی و استایل دهی بر اساس طرح گرافیکی PSD
- 34- آموزش کدنویسی بنرهای تبلیغاتی در سایدبار و محتوای اصلی صفحه وب
- 35- آموزش کدنویسی تب منوی jQuery بخش پربازدیدترین مطالب سایت
- 36- آموزش کدنویسی باکس های ابزارک مانند سایدبار صفحه وب
- 37- آموزش کدنویسی بخش آخرین دیدگاه های سایت در سایدبار
- 38- آموزش ساخت و کدنویسی خبرنامه در صفحه وب
- 39- آموزش کدنویسی بخش پیوندها در سایدبار
- 40- آموزش ساخت تول تیپ با جی کوئری (jQuery Tooltip)
- 41- آموزش پیاده سازی تول تیپ jQuery به صورت متن و همچنین بزرگ‌نمایی عکس
- 42- Markup اولیه برای بخش محتوای مجله ای صفحه وب
- 43- استایل دهی CSS به بخش محتوای مجله‌ای صفحه وب
- 44- آموزش ساخت مثلث در صفحه وِب
- 45- آموزش تولید طیف رنگی (CSS Gradient) خطی در CSS3
- 46- آموزش ساخت افکت های کاربردی در صفحه وب با استفاده از CSS transition
- 47- CSS نویسی ظرافت های بخش مجله ای صفحه وب
- 48- ساخت کپشن و افکت گذاری آن در وب (برای تصاویر مطالب مجله ای)
- 49- آموزش کار با فونت آیکون Font Awesome در طراحی سایت
- 50- آموزش استفاده از فونت آیکون های Font Awesome در بخش مطالب مجله ای
- 51- نامگذاری بهینه کلاس های CSS و تکمیل بخش محتوای مجله ای صفحه وب
- 52- کدنویسی HTML و CSS تب منوی بخش ویژه ها در صفحه اصلی
- 53- کدنویسی jQuery بخش تب منوی مطالب ویژه و تکمیل آن
- 54- کدنویسی بخش فوتر
- 55- تکنیک وسط چین کردن منوی افقی در صفحه وب (تنها با HTML و CSS)
- 56- شاخه بندی و تفکیک اصولی فایل ها و پوشه ها در طراحی وب
- 57- رفع اصولی خطاهای صفحه اول وب سایت طراحی شده
- 58- کدنویسی ساختار HTML صفحه نمایش محتوای کامل در سایت
- 59- استایل دهی و کدنویسی CSS صفحات نمایش محتوای کامل در سایت
- 60- سامان دهی فراخوانی های جاوااسکریپت و جی کوئری با فایل custom.js
- 61- آموزش تکنیک فونت فیس (font-face) در طراحی وب
- 62- ساخت صفحه ی تماس با ما (کدنویسی HTML و CSS)
- 63- ساخت صفحه ی نمایش نتایج جستجو (کدنویسی HTML و CSS)
- 64- آموزش ساخت صفحه بندی Pagination (کدنویسی HTML و CSS)
- 65- آموزش ساخت منوی آکاردئونی با jQuery صفحه وب سوالات متداول
- 66- نحوه ی تبدیل و ارتباط میان صفحات استاتیک و داینامیک سایت
- 67- طراحی و کدنویسی بخش مطالب مرتبط در صفحه وب
- به کارگیری HTML5 و CSS3
- 68- معرفی HTML5
- 69- Layout Tags در HTML5 (تگ های پرکاربرد در HTML5)
- 70- دستورات و مشخصه های پرکاربرد در CSS3
- 71- تبدیل کدهای صفحه ی اصلی به HTML5
- شروع به کار با فریم ورک های CSS
- 72- معرفی فریم ورک های CSS و کاربردهای آن ها
- معرفی فریم ورک Bootstrap در CSS
- طراحی واکنش گرا (برای موبایل، تبلت و …)
- معرفی مفهوم Responsive (واکنش گرا – ریسپانسیو) بودن و توضیح کاربرد و اهمیت طراحی واکنش گرا
- کدنویسی یک طرح کلی در HTML بصورت ریسپانسیو – واکنش گرا Responsive
- کدنویسی یک طرح کلی در HTML بصورت واکنش گرا و با استفاده از فریم ورک بوت استرپ
- کدنویسی یک منوی افقی بصورت ریسپانسیو
- آنالیز طرح اصلی کدنویسی شده جهت پیاده سازی بصورت ریسپانسیو
- افزودن قابلیت واکنش گرایی و Responsive بودن به صفحه اصلی طرح کدنویسی شده
- افزودن قابلیت واکنش گرایی و Responsive بودن به صفحه ی داخلی طرح کدنویسی شده
- افزودن قابلیت واکنش گرایی و Responsive بودن به صفحه ی آرشیو کدنویسی شده
- SEO, Optimization, Cross Browser
- نکات بسیار مهم SEO (بهینه سازی برای موتورهای جستجو) در طراحی صفحات وب
- نکات حرفه ای در بهینه سازی – Optimization سایت طراحی شده در کدنویسی
- آموزش به کارگیری پیشرفته ی تکنیک CSS Sprite
- تست Cross browser صفحه ی وب کدنویسی شده
- آموزش مبحث Retina Ready بودن صفحات وب در طراحی سایت
- تکمیل پروژه نهایی (تبدیل PSD به HTML به صورت کامل)
برای شرکت در این دوره آموزشی، بهتر است (الزامی نیست) تا مفاهیم و نکات اولیه در HTML و CSS را بدانید. اما اگر تازه کار هستید، فیلم های آموزشی ای که به شما کمک می کنند تا این مهارت ها را به دست آورید، به شما معرفی می شوند تا به صورت رایگان بتوانید آن ها را دانلود نمایید.
همچنین اگر قبلا با فتوشاپ کار کرده باشید، پیشرفت بسیار بهتری خواهید داشت و سرعت شما به مراتب بالاتر و بهتر خواهد بود. سابقه ی کاری با هرگونه زبان های برنامه نویسی (به خصوص تحت وب) میتواند به شما کمک کند و سرعت شما را افزایش بدهد اما هیچ کدام از این موارد یک پیش نیاز الزامی محسوب نمیشوند.
در حال حاضر بر اساس سرفصل های ارائه شده (در ادامه سرفصل ها معرفی شده اند)؛ هر هفته حداقل دو فیلم آموززشی جدید در سایت منتشر خواهد شد تا دانشجویان به صورت گام به گام آموزش های مربوط به طراحی حرفه ای صفحات وب (آموزش تبدیل PSD به HTML) را آموزش دیده و در نهایت تبدیل به یک متخصص طراحی قالب های سایت، و کدنویس استاتیک ماهر (در زمینه ی استفاده از HTML، CSS، و jQuery) بشوند.
دانشجویان می توانند در زمان دلخواه و بر اساس فراغت زمانی شان، فیلم های آموزشی طراحی صفحات وب مربوط به دوره را دانلود نموده و تماشا نمایند.
ویژگی اصلی محتوای دوره، کوتاه، کاربردی و جذاب بودن فیلم های آموزشی است. بطوریکه به جای بیان مفاهیم به تنهایی، در عمل بتوانید با آن ها کار کنید و براساس آن چه در بازارکار با آن ها مواجه میشوید، آموزش ببینید.
راه های ذیل را برای پاسخگویی به سوالات دانشجویان گرامی در نظر گرفته ایم:
- طرح سوال در بخش دیدگاه های مربوط به همان فیلم آموزشی
- تماس تلفنی با استاد در ساعات تعیین شده
- استفاده از نرم افزار Team Viewer جهت مانیتورینگ و رفع اشکال در کامپیوتر شما توسط استاد
مدرسین این دوره سرکار خانم مهندس شمس و آقای مهندس جواد آبسالان هستند.
سرکار خانم شمس، فارغ التحصیل رشته ی مهندسی کامپیوتر از دانشگاه آزاد تهران بوده و سابقه ی فعالیت های برنامه نویسی PHP در تهران و پس از آن حضور در مشهد و پیوستن به آنلاینر و فعالیت در زمینه های HTML, CSS, jQuery را به صورت تخصصی و تجربه ی کار با WordPress را به صورت عمومی تر داشته اند.
آقای آبسالان فارغ التحصیل رشته ی مهندسی کامپیوتر از دانشگاه مشهد بوده و سابقه ی تدریس در مرکز آی تی دانشگاه فردوسی مشهد، برگزاری سمینارهای آموزشی در دانشگاه پیام نور و همچنین دانشکده ی مهندسی دانشگاه آزاد اسلامی مشهد، از جمله سوابق فعالیت های آکادمیک ایشان بوده و آموزش های فراوان مختلفی نیز در کلاس های خصوصی و نیمه خصوصی عرضه داشته اند.
فعالیت های آقای آبسالان به دو بخش آموزش های آی تی و ارائه مشاوره های تجارت الکترونیک به بازرگانان و تجار تقسیم میشود. در حوزه ی آی تی ابتدا به ساکن با وبلاگنویسی و فعالیت در وب انگلیسی فعالیت خودشان را شروع کردند که پس از آن تصمیم به فعالیت در زمینه ی توسعه ی وردپرس و طراحی سایت در ایران گرفتند. همچنین ایشان سابقه ی چندین سال کار حرفه ای با وردپرس و تاسیس وب سایت آنلاینر (Onliner.ir) را دارند که عمده فعالیت های آنلاینر در ابتدا دریافت و انجام سفارشات بسیاری از مشتریان بوده و پس از آن با توسعه ی تیم فنی، و وب سایت آنلاینر، بخش تخصصی آموزش علوم و تکنولوژی های تحت وب نیز به مجموعه فعالیت های آنلاینر اضافه شد و این سایت برای اولین بار در ایران اقدام به ضبط و انتشار رایگان فیلم های آموزش حرفه ای تکنولوژی های تحت وب در مقیاس گسترده نمود. (بخشی از نمونه فیلم های آموزشی ضبط شده توسط ایشان -که با همکاری سرکار خانم شمس انجام شده است- را می توانید در صفحه ی فیلم های آموزش جامع HTML و فیلم های آموزش CSS مشاهده بفرمایید و با سبک آموزشی ایشان آشنا شوید.)
فعالیت های دیگر آقای آبسالان خارج از دنیای آی تی، بیشتر مربوط به امور بازرگانی و رسانه ای، برندینگ، پوشش های تصویری نمایشگاه ها و سمینارها و … می باشد.
شعار اصلی مدرسین آنلاینر: چیزی به نام فوت و فن استادی نداریم! ما تمام آن چه می دانیم را بی منت در اختیار دانشجویان می گذاریم و از چیزی کوتاهی نمی کنیم؛ تا به این ترتیب، زندگی مان برکت داشته باشد.
در حالی که شما بهترین خدمات آموزشی و حرفه ای ترین تخصص ها و نایاب ترین تجربیات را در طی این دوره کسب خواهید کرد، و تجربیات و نکاتی را که ماه ها صرف زمان لازم است تا به آن ها برسید را به سرعت یاد خواهید گرفت، هزینه ی این دوره بسیار کمتر از دوره های کلاس های حضوری آموزشگاه ها می باشد.
ویژگی اصلی دوره آموزش پیشرفته طراحی صفحات وب (آموزش تبدیل PSD به HTML) این است که پس از تکمیل دوره، بلافاصله قادر به دریافت سفارش و انجام کارهای تجاری و کسب درآمد خواهید بود.
هزینه ی این دوره که شامل مباحث مقدماتی، میانه و حرفه ای و پیشرفته می باشد، تنها 129 هزار تومان می باشد که بسیار پایین تر از شهریه کلاسهای حضوری است. البته کاربرانی که کد تخفیف داشته باشند، میتوانند با اعمال آن، از تخفیف های مختلفی برخوردار شوند.
هر سایتی ممکن است با سیستم های مدیریت محتوا و یا زبان های برنامه نویسی جداگانه ای طراحی بشوند، اما تمامی آن ها نیاز دارند تا به وسیله ی HTML، CSS و jQuery به صورت قابل نمایش برای طراحی صفحات وب و اجرا در مرورگرهای کاربران در بیایند.
