اهداف دوره ها :
آموزش جنبه هاي عملي طراحي وب سايت بصورت كاربردي و پروژه ايافراد در پایان دوره به تسلط کامل در تگ های HTML مي رسند.افراد در پایان دوره به تسلط کامل در تگ های XHTML مي رسند.افراد در این دوره روش های کاربردی XML را در طراحی وب سایت بکار خواهند گرفت.آموزش طراحي وب سايت با استفاده از (DIV,CSS(3آموزش tag هاي جديد (HTML(5 در طراحي وب سايتبا استفاده از امکانات بی نظیر HTML 5 ماندد انیمیشن و مالتی مدیا در طراحی وب می توانند قالب وب خود را پویا نمایند.با تسلط بر چگونگی بکارگیری استایل های CSS به طور کامل می توانند به جذابیت گرافیکی وب خود بیفزایند.آموزش بهينه سازي وب سايت براي موتورهاي جستجوآموزش JavaScript و كاربرد آن در صفحات وبآموزش كاربردي JQuery و كاربرد آن در صفحات وبآموزش استفاده از كامپوننت هاي JQuery UI و استفاده از عناصر tab,accardion,popup,ديگر عناصر كاربردي JQueri UIدر این دوره دانشجویان قادر خواهند بود تا قالب گرافیکی مورد نظر خود را در نرم افزار PHOTOSHOP طراحی نمایند.افراد در طي اين دوره با ساخت 3 عدد وب سايت بصورت كامل و عملي آشنا مي شوند كه 2 عدد از اين وب سايتها به عنوان تمرين در كلاس درس داده خواهد شدسرفصلهای دوره:قسمت اول:آموزشHTML(5),CSS3مقدمه‌ای بر اینترنت، وب و HTMLدرک مفهوم HTMLآشنایی با مرورگر وب و انواع آننقش CSS در ساخت صفحات وبآشنایی با XHTMLجنگ مرورگرهای وباستانداردهای موجودعناصر سازنده صفحات وبآشنایی با مارک‌آپ (Markup)آشنایی با المان، تگ، خاصیت و مقدارمحتوای متنی یک صفحه وبلینک‌ها، تصاویر و محتوای غیرمتنیاسم فایل‌های صفحات وبHTML در مقابل XHTMLانواع نسخه‌های HTMLآشنایی با DOCTYPE و ضرورت استفاده از آنساخت اولین صفحه وبآشنایی با نرم‌افزارهای ساخت صفحات وب نظیر Dreamweaverضرورت کدنویسی دستی و ساخت صفحه وب با Notepadاستفاده درست و به‌جا از نرم‌افزارهای WYSIWYGساخت اولین صفحه وب توسط Notepadمشاهده صفحه وب ساخته شده در مرورگرهای مختلفآشنایی با ناسازگاری‌های مرورگرهای مختلفساختار اساسی HTMLفنداسیون یک صفحه وبعنوان یک صفحه وبساخت پاراگراف‌هاآشنایی با Headerهانامگذاری المان‌هاتقسیم کردن یک صفحه وب به قسمت‌های مختلفEncoding برای نمایش درست متن‌هاکاراکترهای خاص در HTMLالمان‌های طلایی وب: div و spanفرمت کردن متن در HTMLنوشتن متن به صورت bold و italicتغییر سایز نوشته یک متناستفاده از فونت‌های Monospacedاستفاده از متن‌های Preformattedمتن‌های نقل قولمتن‌های Superscript و Subscriptتراز متن در صفحه وبپروژه عملی : ایجاد یک صفحه وب مشابه صفحات ویکی پدیاتصاویر در وبپسوندهای رایج تصاویر در وبآشنایی با نرم‌افزارهای کار با تصاویرضرورت استفاده از فوتوشاپ (یا نرم‌افزارهای مشابه)آشنایی با دستور Save for Webآشنایی با نحوه لود شدن تصاویر در وبشفافیت (Transparency) در تصاویرشفافیت، تصاویر PNG و ناسازگاری‌های مرورگرهاوارد کردن تصاویر درون یک صفحه وبتغییر سایز تصاویر توسط HTMLآشنایی با متن جایگزین عکسشناورکردن تصاویر در صفحه وبپروژه عملی : ایجاد یک گالری تصویر خطی سادهلینک‌هالینک‌ها: فرامتن بودن HTMLساخت لینک‌ها در صفحه وبآشنایی با انواع لینک‌هانحوه آدرس‌دهی به لینک‌هادرست کردن میانبرهای کیبوردی برای کار با لینک‌هاآشنایی با دکمه Tab در کیبورد و نقش آن در لینک‌هاآشنایی با لینک‌های Anchor و HASHهاپروژه عملی : ایجاده منو صفحه بسیار قوی به همراه یک صفحه فهرست مقاله اینترنتیلیست‌هاآشنایی با انواع لیست‌هاساخت لیست‌های ترتیبی و غیرترتیبیانتخاب نوع بولت برای لیست‌هاتعیین شماره شروع برای لیست‌هاساخت لیست‌های توضیحیلیست‌های تودرتو و مدیریت آن‌هاپروژه عملی : ایجاد یک منوی به همراه گزینه های والد لایه ایجداولآشنایی با جداول و کاربردهای آن در صفحات وب · ساخت اولین جدولتعیین حاشیه کنار جدولتعیین فاصله درونی و بیرونی سلول جدولساخت جدول‌های حرفه‌ای‌ترتقسیم کردن جدول به گروه‌های افقیتقسیم کردن جدول به قسمت‌های عمودیکنترل حرفه‌ای حاشیه‌های کناری و داخلی یک جدولافزایش سرعت لود شدن جداولپروژه عملی :ایجاد یک لیست قیمت فروشگاه الکترونیکی و یک منوی زیبا با تکنولوِژی جدولفرم‌هانقش فرم‌ها در صفحات وبساخت اولین فرمپردازش اطلاعات وارد شده توسط کاربرآشنایی با Server-Side Programmingساخت اولین برنامه دینامیک فوق سادهدسته‌بندی المان‌های موجود در فرمساخت منوهای Drop Downساخت دکمه‌های رادیویی و چک‌باکس‌ها (Checkbox)فیلدهای آپلود فایلفیلدهای مخفی و کاربردهای آنآشنایی با دکمه‌های Submit و Resetقراردادن عکس به جای دکمه تایید فرمنقش دکمه Tab در فیلدهای یک فرمغیرفعال کردن المان‌های موجود در فرمفیلدهای فقط خواندنیپروژه عملی : ایجاد یک فرم ارتباط با ما به همراه صفحه پاسخ تاییئ ارسال فرممقدمات کار با CSSدرک مفهوم CSS و جایگاه آن در کنار HTMLآشنایی با استایل‌ها و روش‌های مختلف نوشتن آندرک ساختار یک دستور CSSنوشتن دستورات CSS در کنار یکدیگرانتخاب المان مورد نظر در HTMLآشنایی کامل با انتخاب‌کننده‌ها در CSSآشنایی با کلاس‌های دروغین (Pseudo-Class)آشنایی با المان‌های دروغین (Pseudo-Element)وراثت در CSSآشنایی با واژه Cascade و نحوه عملکرد آنفرمت‌دهی متن و فونت توسط CSSتعیین نوع فونت مورد نظرآشنایی با گروه‌های کلی فونت (Font Families)تعیین سایز فونتآشنایی با ویژگی‌های یک فونت: style, weight, variantتعیین تورفتگی یک متن از کناره‌هاتعیین فاصله بین حروف و فاصله بین خطوط یک متنتراز یک متن در صفحه وبکار با CSS3تایپوگرافیافکت سایهافکت گرادیانتافکت شعاع به المان هاانیمیشن در CSS3تغییر حالتتگ های مرور گر های مختلفکار با فرم هاکار با فرم هاپروژه عملی : تمکیل صفحه ویکی پدیا و اجرای یک پروژه طراحی وب با امکانات استایلتعیین موقعیت المان‌ها (Position)درک کامل CSS Box Model و ناسازگاری‌های موجودنقش استانداردها در CSS Box Modelشناور کردن المان‌ها در صفحه وبکنترل المان‌های موجود در مجاورت المان‌های شناورآشنایی با انواع مختلف تعیین موقعیت یک المان و کاربردهای آنمخفی کردن المان‌ها در یک صفحه وبدرست کردن ساختار (Layout) توسط CSSچرا برای ساخت یک صفحه وب، از جداول استفاده نکنیمآشنایی با انواع صفحات وب مختلفآشنایی با صفحات تک‌ستونیآشنایی با صفحات چندستونیساخت صفحات دوستونیساخت صفحات سه‌ستونی ساده و پیچیدهتنظیم ارتفاع تمامی ستون‌های صفحه وب به یک اندازهآشنایی با صفحات Absolutely-Positionedآشنایی با باگ‌های مختلف مرورگرهای مختلفپروژه عملی :ایجاد یک قالب کامل با CSSمعرفی HTML5چه خصوصياتي در html5 وجود داردچرا به HTML5 نیاز استچرا ما نیاز به عناصر جدید ساختاری داريماساس HTML5تعريف اسناد HTML5HTML5 syntaxعنصر Headerعنصر navعنصر Sectionعنصر articleعنصر asideعنصر footerبازنگری مدل محتواساختار اسناد HTML5درك الگوريتم outlineايجاد اسناد sectionاستفاده از heading به درستياستفاده از hgroup براي تحت الشعاع قرار دادن section هاساختار مناسب تودرتودسته بندي محتوا در HTML5کار کردن باشكل figure و figcaptionگروه بندي محتوا با asideاستفاده از div در HTML5استفاده از صفات id,class در HTML5كاركردن با ليستها در HTML5استناد به کار بصورت semantically معناییاستفاده از المنت addressاستفاده از المنت smallاستفاده از المنت markكاركردن با تاريخ و زمانایجاد لینک در سطح بلوکفهمیدن رابطه لينكهاساختار HTML5 معنایی برای دنیای واقعیپشتیبانی از مرورگر کنونیاطمینان از بلوک در سطح صفحه نمایشاضافه کردن پشتیبانی برای عناصر در مرورگرهای قدیمی ترکار کردن با فرم های HTML5المان جدید کادر متنیصفت های جدیدبازگشت به صفحه پیشیناستایل فرم و ایجاد پیغام های خطانکات مهم در مرور گر ها برای فرماستفاده از جاوا اسکریپت در فرمپروژه عملی : ایجاد یک فرم حرفه های با HTML5پشتيباني API HTML5معرفي Canvasنقاشي در محيط canvasبازنگري videoاضافه كردن ويديومروری بر امکان Drag and Drop APIآموزش در رابطه با Encoding Videoمالتی مدیا در وبمفهوم مالتی مدیا در وباستفاده ویدیو در وبکار با کنترلر های اشیاء ویدیودسترسی به مالتی مدیابوم نقاشیمبانی طراحی در وبرسم مسیرهااستفاده از transformesاستفاده از پیکسل هاانیمیشن در بوم نقاشیذخیره سازی اطلاعاتامکانات ذخیره اطلاعات در HTML5ذخیره اطلاعات در وباستفاده از بانک های SQLکنترل داده به کمک HTML5نمایش داده به کمک HTML5ذخیره داده در وبچگونگی ذخیره داده در لوکال Localمفهوم DRAG AND DROPچگونه می توان یک المان را DRAG AND DROP نمودایجاد و تغییر در تنظیمات DRAG AND DROPآشنايي با فناوری های مشارکتی و استفاده از آن ها در HTML5مروری بر API مکان یابی جغرافیاییمروری بر Web Storage APIامکانات چت در HTML5ترکیب CSS 3 با HTML5قسمت دوم:آموزش جاوااسکریپتآموزش شروع به استفاده از جاوااسکریپتمقدمه ای بر جاوااسکریپتشنایی با ابزارها و کاربردهاهسته دستور جاوا اسکریپتساختار کدهای جاوااسکریپتساخت متغیرهانوشتن دستورهای شرطیکارکردن با عملگرهاحلقه سازی در جاوااسکریپتساخت توابع در JavaScriptانواع داده و Object ها در جاوااسکریپتایجاد و کارکردن با آرایه هاایجاد و کارکردن با اعدادایجاد و کارکردن با مقادیر رشته ایاستفاده از دستورات کار با تاریخ و زمان JavaScriptآموزش کاملا کاربردی Document Object Model ( DOM ) :DOM چیست ؟کارکردن با Node ها و HTML Element هادسترسی یافتن به المان های موجود در DOMتغییر دادن المان های موجود در DOMساخت المان های DOMکارکردن با رخدادها و Event Listener ها :مدیریت رخدادها در جاوااسکریپترخدادهای onClick و onEvent آموزش کارکردن با رخدادهای onBlur و onFocusکار کردن با Timerرفع خطاهای رخ داده در کدهای جاوااسکریپتآشنایی با برخی خطاهای رایج جاوااسکریپتاستفاده از Firebug به منظور رفع خطای کدهای جاوااسکریپتمراحل رفع خطا ی کدهای جاوااسکریپتاستفاده از جاوااسکریپت برای مدیریت داده های فرم هادسترسی یافتن به عناصر فرم های وبجلوگیری از ارسال یک فرم با داده های نامعتبر به سرورنمایش و مخفی سازی بخش هایی از فرم های وبقسمت سوم:آموزشJQueryمقدمه ای بر jQueryjQuery چیستدانلود و نصب jQueryایجاد یک صفحه ساده دارای jQueryمروری بر ویژگی های jQueryبازیابی محتوای صفحه با jQueryمروری بر انتخاب گرها Selector و فیلترهااستفاده از انتخابگرهای اولیه jQueryاستفاده از فیلترهای اولیه jQueryاستفاده از فیلترهای صفات jQueryChild , Visibilityفیلترها و انتخابگرهای فرمپویش مستندات Traversing Documentsدرک حالت زنجیره عبارت jQueryتعیین حاشیه عملکر صفحه لینک (Annotating page links )دستکاری محتوای صفحه با jQueryایجاد ، گرفتن و تنظیم کردن محتوای صفحهدستکاری ویژگی ها ( Attributes ) با jQueryWrapping ، جایگزینی و حذف محتویستفاده از jQuery Event Objectمثال عملی : مولد خودکار TOCکار با Eventsدرک جنبه های مدیریت Event در jQuerybind کردن و unbind کردن Eventهامتدهای کمکی آسان Eventاستفاده از آبجکت Event در jQueryاستفاده از ویژگی های دیگر Eventمثال عملی : برجسته سازی و نواربندی جداولانیمیشن ها و افکت ها در jQueryمخفی سازی و نمایش المان ها بوسیله jQueryFade کردن الملان ها با jQuerySlide بندی المان ها از طریق jQueryساخت انیمیشن های سفارشیImage Rotator ( گرداننده عکس )