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

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

پیشنیاز : دوره آموزش طراحی سایت
تاریخ شروع طول دوره ساعت برگزاری نام استاد هزینه (تومان) وضعیت
1396/07/27 36 ساعت پنجشنبه ها ساعت 13 تا 16:30 مهندس کرمی 654,000 درحال برگزاری
1396/10/14 36 ساعت پنجشنبه ها ساعت 13 تا 16:30 مهندس کرمی 654,000 ثبت نام

توجه: از دانشجویان عزیز تقاضا میگردد جهت قطعی کردن ثبت نام با آموزشگاه تماس بگیرند.

پروژه های دوره:
  • یک وب سایت تک صفحه ای Single Page
  • طراحی دو وب سایت به صورت Responsive web design(RWD)
  • پیاده سازی یک وب سایت به صورت کارگاه عملی توسط دانشجو
فهرست مخاطبین دوره آموزشی
  • دانش آموختگانی که با علم روز طراحی صفحات می خواهند آشنا شوند
  • طراحانی که بدنبال فراگیری و پیاده سازی RWD هستند
  • دانش آموختگانی که نیاز به فراگیری شیوه ی طراحی عملی یک وب سایت دارند
  • طراحانی که نیاز به بروز کردن علم طراحی خود دارند
  • دانش اموختگانی که می خواهند با مفهوم preprocessor اشنا شوند و با یک preprocessor قدرتمند به نام sass اشنا می شوند با تفاوت sass و less و دیگر preprocessor ها اشنا می شوند
اهداف دوره

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

سرفصل های دوره

Html5

  • Html5 چیست ؟
  • چرا باید به Html5 کوچ کنیم
  • تفاوت های html5 و html در چیست؟
  • Video And Audio در Html5
  • Canvas
  • SVG
  • GeoLocation در html5
  • Cache page in browser
  • رویکرد مرورگر های قدیمی با html5

Css3

  • Css3 چیست ؟
  • تفاوت های css2 و css3
  • Selectors
  • Pseudo-Classes
  • Pseudo-Elements
  • اعتبار سنجی css
  • ارث بری style
  • Web Fonts
  • BoxModel چیست
  • کار با اشیایی گرافیکی در صفحات وب
  • همه چیز در مورد background
  • Transform
  • Transition
  • Animations
  • ایجاد یک گالری تصویر با css3

Sass

  • Preprocessor چیست ؟
  • Sass چیست؟
  • تفاوت sass و less چیست؟
  • Sass Basic
  • Partial Files
  • بهینه سازی partial ها در Sass
  • متغییر در Sass
  • نحوه ی استفاده Nesting Selector
  • Inheriting Properties
  • Mixins
  • کار کردن با Media Query در Sass

Responsive Web Design (RWD)

  • انواع طراحی
  • AWD چیست ؟
  • RWD چیست ؟
  • Mobile First or Desktop First?
  • استفاده از Sass Mixin برای پیاده سازی Mobile First و Desktop First
  • بهترین عملکرد در مرورگر های قدیمی
  • طراحی برای صفحات بسیار بزرگ
  • مفهوم Grid در طراحی
  • CssGrid چیست ؟
  • مزایا و معایب CSSgrid در طراحی RWD
  • Css Framework
  • UI kits
  • پیاده سازی CSSGrid شخصی
  • FlexBox چیست ؟
  • انجام طراحی با FlexBox
  • Touch Zones چیست ؟
  • کار با Touch Zones
  • The hamburger Icon
  • The Word Menu
  • پیاده سازی navigation در طراحی RWD
  • کار با تصاویر و فایل های ویدئو ای در طراحی RWD
  • استفاده از Retina.js

جاوا اسکریپت

  • بررسي و شيوه دسترسي به Dom در جاوا اسکريپت
  • درخت DOM
  • Element Node
  • Text Node
  • Attribute Node
  • دسرسي به يک Node
  • ID Selector دسترسي به وسيليه شناسه
  • Tag Name Selector دسترسي به وسيله ي نام تگ
  • Class Selector دسترسي به وسيله ي کلاس
  • querySelector
  • CssSelector
  • بررسي انواع Selecor ها و شيوه پاسخ گويي مرورگر ها با ان ها بررسي attribute هاي يک Node
  • getAttribute
  • setAttribute
  • removeAttribute
  • has Attribute
  • ساخت يک element جديد و حذف آن
  • createElement
  • createTextNode
  • appendChild
  • removeChild
  • تغيير محتواي Text Node
  • innerHTML
  • حرکت در Dom
  • parentNode
  • previousSibling
  • nextSibling
  • firstChild
  • lastChild
  • دسترسي به اولين و آخرين child
  • firstChild
  • lastChild
  • اضافه کردن و حذف کردن Node
  • createElement
  • createTextNode
  • appendChild
  • removeChild
  • متغير ها در جاوا اسکريپت
  • متغير هاي global
  • تعريف متغير در خارج بلاک
  • تغريف متغير در شي window
  • متغير هاي Local
  • انواع متغير ها در جاوا اسکريپت
  • تغريف متغير در شي window
  • قواعد نوشتاري در جاوا اسکريپت
  • Click
  • Dblclick
  • Mousedown
  • Mousemove
  • Mouseout
  • Mouseover
  • Mouseup
  • Keydown
  • Keypress
  • Keyup
  • Blur
  • Focus
  • Submit
  • Load
  • Touchstart
  • Touchmove
  • Touchcancel
  • Orientationchange
  • Gesturestart
  • Gestureend
  • Gesturechange
  • متد addEventListener

JQuery

  • اشنايي با jquery
  • چگونگي شيوه کار jquery
  • قواعد نوشتاري در jquery
  • دسترسي به المان هاي html
  • Select To Every Things دسترسي به تمام المان ها
  • ID Selector دسترسي به وسيله شناسه
  • Tag Name Selector دسترسي به وسيله ي نام تگ
  • Class Selector دسترسي به وسيله ي کلاس
  • Attribute Selector دسترسي به وسيله ي Attribute
  • Selecting Visibility دسترسي توسط نمايش و عدم نمايش
  • Selecting Parents and Children دسترسي توسط فرزند و پدر
  • رويداد ها در jquery
    • Click
    • DbClick
    • Mouse Enter
    • Mouse Leave
    • Mouse Up
    • Mouse Down
    • Hover
    • Focus
    • Blur
    • Change
    • Resize
    • Scroll
    • Focusin
    • Focusout
    • On
    • Off
  • دسترسي به Text Node
  • ويرايش مقادير Attribute هاي يک element
  • ويرايش محتواي Html
  • افکت ها در jquery
    • Hide
    • Show
    • Toggle
    • Sliding up
    • Sliding Down
    • Toggle Sliding
    • تغيير سرعت animation ها

Jquery UI

  • افکت ها در Jquery UI
  • addClass
  • Blind
  • Bounce
  • Clip
  • Color Animation
  • Drop
  • Easing
  • Highlight
  • Puff
  • Pulsate
  • Dragable
  • DropAble
  • Resizable
  • Selectable
  • Sortable
  • Accordion
  • autoComplate
  • Slider
  • Menu
  • Tooltip
  • DataPicker

پلاگین های کاربردی جی کوئری و جاوا اسکریپت برای ساخت وکار

  • اسلایدر ریسپانسیو
  • منوی سایت
  • مدیریت اسکرول بار صفحه
  • بدست اوردن مختصات جغرافیایی کاربر
  • بزرگنمایی تصاویر
  • کوکی صفحات
  • و...

معرفی مفاهیم Responsive

  • پنهان سازی برخی از بخش ها
  • کنار هم گذاری و زیر هم گذاری برخی از بخش های وب سایت
  • معرفی Responsive با استفاده از MediaQuery
  • مثال های ساده و کاربردی از حوزه بندی Css ها
  • واکشی Resolution کاربر
  • عمومی سازی بخش های مشترک MediaQuery ها
  • ساخت وب سایت های چند ستون با تعداد ستون های متغیر بر اساس نوع مرورگر بازدید کننده

مقدمات Bootstrap

  • آموزش Bootstrap
  • معرفی twitter Bootstrap
  • آموزش شروع کار با Bootstrap

Bootstrap با استفاده از Css

  • آموزش ایجاد Layout با Grid system
  • آموزش طرح بندی با Twitter Bootstrap
  • آموزش Fluid Layout با Twitter Bootstrap
  • آموزش Fixed Layout با Bootstrap
  • آموزش Responsive Layout با Bootstrap
  • آموزش Typography با Bootstrap
  • آموزش ایجاد جدول با Bootstrap
  • آموزش list با استفاده از Bootstrap
  • آموزش ایجاد فرم با Bootstrap
  • آموزش طراحی تصاویر با Bootstrap
  • تصاویر در Bootstrap
  • آموزش استفاده از آیکن های Bootstrap
  • آموزش استفاده از کمک کننده های Bootstrap
  • آموزش ایجاد دکمه با Bootstrap

مولفه های طرح بندی

  • آموزش NAv و Tab و Pill در Bootstrap
  • آموزش Navbar با استفاده از Bootstrap
  • آموزش ایجاد breadcrumbs با استفاده از Bootstrap
  • آموزش شماره گذاری با Bootstrap
  • آموزش استفاده از برچسب ها و نشانه های درون خطی با Bootstrap
  • آموزش ایجاد نوار پیشرفت با استفاده از Bootstrap
  • آموزش Panel با Bootstrap
  • آموزش کاربرد مولفه های Bootstrap
  • آموزش ایجاد dropdownlist با استفاده از Bootstrap

Bootstrap Plugins

  • آموزش کار با راهنمای ابزار Bootstrap
  • آموزش ایجاد tooltip با Bootstrap
  • آموزش ایجاد پیام های اخطار با Bootstrap
  • آموزش ایجاد تب با Bootstrap
  • آموزش ایجاد نما با Bootstrap
  • آموزش ایجاد Popover با Bootstrap
  • آموزش ایجاد ویجت accordion با Bootstrap
  • آموزش Typeahead در Bootstrap
  • آموزش ایجاد Scrollspy با Bootstrap
  • آموزش ایجاد عنصر ضمیمه با Bootstrap
  • آموزش ایجاد گردانه ی صفحه با Bootstrap

فیلم های آموزشی مرتبط با این دوره

مقدمات HTML
شروع کار با Html
کار با لیست ها و لینک ها در HTML
فونت ها، فرم ها،Style Sheet و جاوا اسکریپت در html
شروع کار HTML5
javascript
اعتبار سنجی در جاوا اسکریپت
HTML DOM در جاوا اسکریپت
آموزش BOM در جاوا اسکریپت
مقدمات Jquery
افکت های Jquery
آموزش تلفیق Jquery با Html
آموزش پیمایش در Jquery
ارسال دیدگاه نظرات کاربران
شماره موبایل دیدگاه
عنوان پست الکترونیک

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

تمامی حقوق این سایت متعلق به آموزشگاه تحلیل داده می باشد .