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

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

دوره آموزش طراحی سایت HTML و CSS و Jquery
  • مدرس : -
  • شروع دوره : -
  • طول دوره : -
  • روزهای برگزاری : -
  • شهریه :
توجه ! در کلاس از مطالب فیلم و صدا تهیه میشود و پایان هر جلسه در اختیار دانشجویان عزیر قرار داده خواهد .

شرح مختصری از دوره

دوره آموزش طراحی سایت با استفاده از Html , Css , JavaScript , Jquery

مخاطبان دوره

  

  • دوستداراد طراحی سایت
  • کسانی که سعی دارند ساخت صفحات وب را خودشان به عهده بگیرند

پیشنیاز دوره

این دوره پیشنیاز ندارد .
 

عناوین مهم دوره

  • طراحی صفحات وب بر اساس استانداردهای W3C
  • تکنیک های طراحی صفحات وب با استفاده از div و css
  • آموزش HTML و XHTML بصورت کامل و اصولی
  • استفاده از محیط های NotePade, Visual Studio, Dreamweaver برای کدنویسی
  • بررسی مزایای طراحی Div Based نسبت به متدهای منسوخ شده Table Based
  • طراحی منطبق با مرورگرهای مختلف (Cross Browser Compatibility)
  • آموزش CSS بصورت کامل و تخصصی
  • آشنایی با رنگ ها و بکارگیری آنها در صفحات HTML
  • تکنیک های طراحی منو و زیر منو با استفاده از CSS
  • ایجاد دکمه ها و برچسب های مختلف با استفاده از CSS
  • بررسی تکنیک های Positioning در CSS
  • بهینه سازی و کم حجم سازی فایل های CSS
  • آموزش Cross Browser Compatibility (تطبیق سایت با مرورگرهای مختلف)
  • بهینه سازی و کم حجم کردن (Optimization) تصاویر بدون تغییر در کیفیت آنها
  • بهینه سازی و کم حجم کردن (Optimization) سایت
  • آشنایی با زبان برنامه نویسی سمت کلاینت JavaScript
  • آشنایی با jQuery و نحوه کار آن
  • jQuery آشنایی با انواع دستورات و توابع
  • آشنایی با Selector های jQuery
  • ایجاد انواع افکت توسط jQuery
  • استفاده از دستورات بهینه ی jQuery بجای JavaScript
  • آشنایی با Bootstrap
  • قالب بندی صفحات با استفاده از بوت استراپ
  • آموزش طراحی با استفاده از Table
  • آموزش طراحی با استفاده از Div و CSS (طراحی بدون Table)
  • طراحی یک سایت استاندارد
  • بررسی استاندارد بودن صفحات HTML و فایل های CSS توسط سایت W3C

 

سرفصل دوره

  • مقدمه
    • آشنایی با صفحات وب
    • استانداردهای جهانی وب
    • زبان های برنامه نویسی
      • سمت سرور (server-side)
      • سمت کاربر (client-side)
  • آشنایی با HTML و XHTML
    • Tag ها و Element ها
    • جدا کردن Head ها از Body
    • Attribute چیست
    • یاد گرفتن از دیگران با نگاه به سورس کد آنها
    • آشنایی با عنصرهای Block و Inline
    • عناصری برای زیبا سازی متن
    • طراحی با <table> (منسوخ شده)
    • گروه بندی کردن عنصرها با استفاده از <div> و <span>
    • Comment ها
  • ساختار یک فایل HTML
    • اعلان XML
    • اعلان نوع Document
    • عنصر <html>
    • عنصر <head>
    • عنصر <title>
    • عنصر <body>
  • مبانی فرمت کردن متن
    • White Space و Flow
    • ایجاد سرصفجه ها با استفاده از عنصر <hn>
    • صفت Align (منسوخ شده)
    • ایجاد پاراگرف ها با استفاده از عنصر <p>
    • ایجاد خط فاصله با استفاده از عنصر ‎<br />‎
    • ایجاد متن از پیش فرمت شده با استفاده از عنصر <pre>
  • عنصرهای نمایشی
    • عنصر <b>
    • عنصر <i>
    • عنصر <sup>
    • عنصر <sub>
    • عنصر ‎<hr />‎
  • عنصرهای جمله ای
    • عنصر <em> برای افزودن تاکید
    • عنصر <strong> برای افزودن تاکید قوی
    • عنصر <address> برای افزودن آدرس
    • عنصر <acronum> برای افزودن اختصارها
    • عنصر <blockquote> برای نقل قول کردن
    • عنصر <q> برای نقل قول های کوتاه
    • عنصر <code> برای نمایش سورس کد
  • لیست ها
    • استفاده از عنصر <ul> برای ایجاد لیست های فاقد شمارش
    • لیست های دارای شمارش
    • لیست های Definition
    • لیست های تو در تو
  • کار با تصاویر
    • صفت Src
    • صفت Alt
  • پیوند ها
    • صفت Href
    • صفت Target
    • استفاده از Anchor
    • لینک کردن نام، تصویر و ...
  • فرم ها
    • آشنایی با فرم ها
    • ایجاد یک فرم با استفاده از عنصر <form>
      • صفت action
      • صفت method
      • صفت id
      • صفت name (منسوخ شده)
      • صفت onsubmit
      • صفت onreset
      • صفت enctype
      • صفت accept-charset
      • صفت accept
      • صفت target
      • White Space و عنصر <form>
    • کنترل های قابل استفاده در فرم ها
      • ورودی متن
      • دکمه ها
      • چک باکس ها
      • دکمه های رادیویی
      • باکس های انتخاب
      • باکس های انتخاب فایل
      • کنترل های مخفی
    • ایجاد لیبل برای کنترل های با استفاده از عنصر <label>
    • سازماندهی فرم ها با استفاده از عنصرهای <fieldset> و <legend>
    • فوکوس
      • ترتیب گردش Tab
      • Access Key ها
    • کنترل های غیرفعال و فقط خواندنی
  • Cascading Style Sheet
    • آشنایی با CSS
      • یک مثال ساده
      • ارث بری
    • روش های مختلف استفاده از CSS در صفحه
      • عنصر <link>
      • عنصر <style>
      • مزایای CSS های External
    • مشخصه های CSS
    • کنترل کردن متن
      • مشخصه font-family
      • مشخصه font-size
      • مشخصه font-weight
      • مشخصه font-style
      • مشخصه font-variant
      • مشخصه font-stretch
      • مشخصه font-size-adjust
    • فرمت کردن متن
      • مشخصه color
      • مشخصه text-align
      • مشخصه vertical-align
      • مشخصه text-decoration
      • مشخصه text-ident
      • مشخصه text-shadow
      • مشخصه text-transform
      • مشخصه letter-spacing
      • مشخصه word-spacing
      • مشخصه white-space
      • مشخصه direction
    • کلاس های شبه متن
      • شِبهِ کلاس first-letter
      • شِبهِ کلاس first-line
    • انتخابگر ها
      • انتخابگر Universal
      • انتخابگر Type
      • انتخابگر Class
      • انتخابگر ID
      • انتخابگر فرزند
      • انتخابگر Descendant
      • انتخابگر هم نوع مجاور
      • انتخابگر هم نوع عمومی
      • انتخابگر صفت
    • طول ها
      • واحدهای نسبی
      • واحدهای مطلق
      • درصدها
    • آشنایی با مدل Box
      • مثالی از کاربرد مدل Box
      • مشخصه های Border
      • مشخصه padding
      • مشخصه margin
      • ابعاد یک Box
      • باگ مدل Box در Internet Explorer
  • مطالبی بیشتر در زمینه Cascading Style Sheet ها
    • لینک ها
    • پس زمینه ها
      • مشخصه background-color
      • مشخصه background-image
      • مشخصه background-repeat
      • مشخصه background-position
      • مشخصه background-attachment
      • مشخصه background (شکل کوتاه)
    • لیست ها
      • مشخصه list-style-type
      • مشخصه list-style-position
      • مشخصه list-style-image
      • مشخصه list-style (شکل کوتاه)
    • جدول ها
      • مشخصه های خاص جدول ها
      • مشخصه border-collapse
      • مشخصه border-spacing
      • مشخصه empty-cells
      • مشخصه caption-side
      • مشخصه table-layout
    • Outline ها
      • مشخصه outline-width
      • مشخصه outline-style
      • مشخصه outline-color
      • مشخصه oultine (شکل کوتاه)
    • شبه کلاس های ‎:focus و ‎:active
    • مشخصه های دیگر
      • مشخصه cursor
      • مشخصه display
      • مشخصه visibility
    • قواعد اضافی
      • قاعده ‎@Import : ماژولار کردن Style Sheet ها
      • قاعده ‎!important
      • قاعده ‎@charset
    • مختصات دهی و چینش با استفاده از CSS
      • Flow عادی
      • مشخصه Position
      • مشخصه های Box Offset
      • مختصات دهی بصورت Relative
      • مختصات دهی Fixed
      • مشخصه z-index
      • شناور کردن با استفاده از مشخصه float
      • مشخصه clear
  • واحد های اندازه گیری در CSS
    • بررسی و کاربرد واحد اندازه گیری px
    • بررسی و کاربرد واحد اندازه گیری em
    • بررسی و کاربرد واحد اندازه گیری ex
    • بررسی و کاربرد واحد اندازه گیری pt
    • بررسی و کاربرد واحد اندازه گیری pc
    • بررسی و کاربرد واحد اندازه گیری in
    • بررسی و کاربرد واحد اندازه گیری cm
    • بررسی و کاربرد واحد اندازه گیری mm
    • بررسی و کاربرد واحد اندازه گیری Percentage
    • کجا باید از چه واحدی استفاده کنیم
  • آشنایی با رنگ ها
    • استفاده از نام رنگ
    • استفاده از کد ترکیبی (عدد دهدهی) - RGB
    • استفاده از کد ترکیبی (عدد مبنای 16) - Hex
  • بررسی Box Model
    • Box Model چیست
    • بررسی Border
    • بررسی Margin
    • بررسی Padding
    • ابعاد Box
    • بررسی height
    • بررسی width
    • بررسی line-height
    • بررسی min-height
    • بررسی max-height
    • برسی min-width
    • بررسی max-width
  • Position ها CSS
    • بررسی و کاربرد Static Position
    • بررسی و کاربرد Absolute Position
    • بررسی و کاربرد Relative Position
    • بررسی و کاربرد Fixed Position
  • مقدمه ای بر jQuery
    • jQuery چیست؟
    • jQuery چگونه کار می کند؟
    • اضافه کردن رفرنس های jQuery به صفحات
    • Syntax jQuery
    • نحوه ی کار با jQuery
    • هسته ی jQuery
  • انتخاب آیتم ها با jQuery
    • انتخابگرهای jQuery
    • Universal Selector
    • ID Selector
    • Element Selector
    • Class Selector
    • Selector های گروهی و ترکیبی
  • استفاده از متدهای CSS در jQuery
    • متد css(name, value)‎
    • متد css(name)‎
    • متد css(properties)‎
    • متد addClass
    • متد removeClass
    • متد toggleClass
  • ایجاد افکت با jQuery
    • متد show‎
    • متد hide
    • متد toggle
    • متد slideDown
    • متد slideUp
    • متد slideToggle
    • متد fadeIn
    • متد fadeOut
    • متد fadeTo
    • متد animate
  • سازگاری صفحه با Browser های مختلف (Corss Browser Compatibility)
    • Cross Browser Compatibility چیست؟
    • رعایت اصول Cross Browser
    • چگونه صفحات وب ما در تمام مرورگرها یکسان نمایش داده شود
  • معرفی bootstrap
    • معرفی
    • طراحی سریع
    • اولین صفحه سایتمان
    • محتویات
    • قرار دادن اسکریپت ها و استایل ها
    • مفاهیم مربوط به هسته ی بوت استرپ
    • خلاصه
  • درست کردن ساختار صفحه با بوت استرپ
    • معرفی
    • ساختار جدولی
    • ساختار ساده
    • جداول ثابت
    • جداول متحرک
    • طراحی responsive
    • قابلیت های طراحی responsive
    • چند ایده جدید
    • خلاصه
  • جمع بندی تمام مطالب فوق
  • طراحی قالب سایت با استفاده از Div و CSS
    • طراحی بخش های مختلف Layout با استفاده از div
      • تکنیک های طراحی Header
      • تکنیک های طراحی منو با استفاده از CSS
      • تکنیک های طراحی SubMenu با استفاده از CSS
      • تکنیک های طراحی Side Bar ها
      • تکنیک های طراحی محتوای صفحه
      • تکنیک های طراحی Footer
    • ایجاد صفحه اصلی
    • ایجاد صفحه تماس با ما
    • ایجاد صفحه درباره ما
    • ایجاد گالری تصاویر
    • ایجاد لیست