آموزشگاه برنامه نویسان

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

  • مدرس این دوره : میلاد ده یامی
  • طول دوره : 36 ساعت
  • شروع دوره : 1398/08/16
  • تعداد جلسات : 12 جلسه
  • امکان قسط بندی : دارد
  • هزینه ثبت نام : 500,000 تومان
  • روزهای برگزاری : پنج شنبه ( 16:00 الی 19:00 )
  • شعبه  اصفهان ، کلاس اول
  • تلفن تماس : 02188454816
  • نشانی : اصفهان ، اصفهان ، خیابان هشت بهشت شرقی بن بست 33 اولین ساختمان سمت چپ آکادمی برنامه نویسان

توضیحات این دوره

یک وب سایت تشکیل شده است از تعدادی فایل با فرمت های مختلف که توسط مرورگرهایی همچون Firefox , Chrome و ... توسط کامپیوتر های شخصی، موبایل و یا تبلت بازدید می شوند. برای  پیاده سازی یک وب سایت دو بخش کلی برای کد نویسی وجود دارد که به یک بخش، سمت سرور (Server Side) و دیگری سمت کلاینت یا کاربر (Client Side)  گفته می شود. برای طراحی یک قالب، نیاز به دانستن موضوعاتی مانند: Html, Css, Js می باشد.

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

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

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

مخاطبان این دوره

  • دوستداراد طراحی سایت
  • کسانی که سعی دارند ساخت صفحات وب را خودشان به عهده بگیرند
  • دوستداران برنامه نویسی سمت کلاینت (jQuery)
  • دوستداران استایل نویسی با کمک زبان های برنامه نویسی Less

مزایای شرکت در این دوره

  • طراحی صفحات وب بر اساس استانداردهای W3C
  • تکنیک های طراحی صفحات وب با استفاده از div و css
  • استفاده از محیط های NotePade ++, Visual Studio Code برای کدنویسی
  • آموزش HTML و XHTML بصورت کامل و اصولی
  • آشنایی با المنت های جدید HTML5
  • معرفی انواع وروردی های جدید از قبیل date , time , email, color , range , ...
  • اعتبار سنجی فرم ها
  • بررسی مزایای طراحی Div Based و تگ های Html5 نسبت به متدهای منسوخ شده Table Based
  • طراحی منطبق با مرورگرهای مختلف (Cross Browser Compatibility)
  • آموزش CSS بصورت کامل و تخصصی
  • آشنایی با رنگ ها و بکارگیری آنها در صفحات HTML
  • تکنیک های طراحی منو و زیر منو با استفاده از CSS
  • ایجاد دکمه ها و برچسب های مختلف با استفاده از CSS
  • بررسی تکنیک های Positioning در CSS
  • بهینه سازی و کم حجم سازی فایل های CSS
  • آشنایی با امکانات جدید CSS3
  • آشنایی و برنامه نویسی استایل ها (Less)
  • آموزش Cross Browser Compatibility (تطبیق سایت با مرورگرهای مختلف)
  • بهینه سازی و کم حجم کردن (Optimization) تصاویر بدون تغییر در کیفیت آنها
  • آشنایی با زبان برنامه نویسی سمت کلاینت JavaScript
  • آشنایی با jQuery ، نحوه کار و استفاده از انواع دستورات و توابع با آن
  • آشنایی با Selector های jQuery
  • ایجاد انواع افکت توسط jQuery
  • استفاده از دستورات بهینه ی jQuery بجای JavaScript
  • آشنایی با Bootstrap
  • قالب بندی صفحات با استفاده از بوت استراپ
  • آموزش طراحی با استفاده از 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
    • ایجاد سرصفحه ها
    • ایجاد پاراگرف ها با استفاده از عنصر <p>
    • ایجاد خط فاصله با استفاده از عنصر‎<br />‎
    • ایجاد متن از پیش فرمت شده با استفاده از عنصر <pre>
  • عنصرهای نمایشی
    • عنصر <b>
    • عنصر <i>
    • عنصر <sup>
    • عنصر <sub>
    • عنصر‎<hr />‎
  • عنصرهای جمله ای
    • عنصر <em>برای افزودن تاکید
    • عنصر <strong>برای افزودن تاکید قوی
    • عنصر <address>برای افزودن آدرس
    • عنصر <blockquote>برای نقل قول کردن
    • عنصر <q>برای نقل قول های کوتاه
    • عنصر <code>برای نمایش سورس کد
  • لیست ها
    • استفاده از عنصر <ul>برای ایجاد لیست های فاقد شمارش
    • لیست های دارای شمارش
    • لیست هایDefinition
    • لیست های تو در تو
  • کار با تصاویر
    • صفتSrc
    • صفتAlt
  • پیوند ها
    • صفتHref
    • صفتTarget
    • استفاده ازAnchor
    • لینک کردن نام، تصویر و...
  • فرم ها
    • آشنایی با فرم ها
    • ایجاد یک فرم با استفاده از عنصر <form>
      • صفتaction
      • صفتmethod
      • صفتid
      • صفتonsubmit
      • و عنصر <form>
    • کنترل های قابل استفاده در فرم ها
      • ورودی متن
      • دکمه ها
      • چک باکس ها
      • دکمه های رادیویی
      • باکس های انتخاب
      • باکس های انتخاب فایل
      • کنترل های مخفی
    • ایجاد لیبل برای کنترل های با استفاده از عنصر <label>
    • سازماندهی فرم ها با استفاده از عنصرهای <fieldset>و <legend>
    • فوکوس
      • ترتیب گردشTab
      • Access Keyها
    • کنترل های غیرفعال و فقط خواندنی
  •   مهاجرت ازHTML4/XHTMLبهHTML5
    • تغییرdoctype
    • تغییرEncoding
    • اضافه کردن اسکریپت برای پشتیبانی ازHTML5
    • حذف کردن تگhead
    • آشنایی با المنت های معنی دار
      • header
      • nav
      • footer
      • article
      • section
    • قابلیت های جدیدHTML5
    • اعتبار سنجی فرم ها
      • نمایش و اجرای فایل های چند رسانه ای
        • Video
        • Audio
  • 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
      • شبه کلاس های‎:focusو‎:active
      • مشخصه های دیگر
        • مشخصهcursor
        • مشخصهdisplay
        • مشخصهvisibility
      • مختصات دهی و چینش با استفاده ازCSS
        • مشخصه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
  • کار باCSS3و قابلیت های جدید آن
    • Advanced Selectors
    • گرد کردن گوشه ها- Rounded Corners
    • حاشیه تصویری- Border Image
    • سایه ها- Box Shadow & Text Shadow
    • رنگ ها- Colors
      • RGBA
      • Gradient
    • Transformچرخش ، جابجایی و...
    • قاب های چند ستونی- Multicolumn Layout
    • استفاده از فونت در وب- Web Fonts
    • متحرک سازی اجزای صفحه - Animations and Transitions
    • ایجاد متن و شمارنده - Generated Content and Counters
    • Box Sizing
    • Media Queries
    • پس زمینه- Background
      • پس زمینه های متعدد- Multiple Backgrounds
      • background-size
      • background-clip
      • background-origin
    • خاصیت های جدید برایTextها
      • text-overflow
      • word-wrap
      • word-break
  • زبان برنامه نویسی استایل ها(Less)
    • بیشتر بدانیم
    • تفاوت هایLessوSass
    • آشنایی و شروع کار باLess
      • تنظیمات اولیه برای استفاده ازLess
      • متغیر ها درLess
      • استایل های ترکیبی درLess
      • استایل های تو در تو درLess
      • استفاده از اپراتورها درLess
      • استفاده از توابع درLess
      • محدوده درLess
      • ترکیب کردن چند فایل استایل درLess
    • کامپایل کردن فایل هایLess
  • مقدمه ای بر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
    • چگونه صفحات وب ما در تمام مرورگرها یکسان نمایش داده شود
  • طراحی قالب سایت ( شروع پروژه عملی سایت TopLearn.com )

اهداف این دوره

یادگیری کد های Html, Css , javascripts , jQuery  و less

نحوه استفاده و پیاده سازی کد ها در طراحی یک سایت

طراحی و پیاده سازه یک قالب وب سایت

مشاور پروژه های برنامه نویسی و بازاریابی الکترونیکی

آیا نیاز به یک مشاور حرفه ای و مجرب در پروژه های برنامه نویسی و یا پروژه های بازاریابی الکترونیکی خود دارید ؟

مهندس ایمان مدائنی مدرس بین المللی و رسمی مایکروسافت، مدیر و موسس انجمن برنامه نویسان و آموزشگاه برنامه نویسان ، دارای مدارک رسمی Microsoft Certified Trainer - MCT و MCSD و MCP و MCSE و MCSA از مایکروسافت، مشاور چندین سازمان و ارگان دولتی و شرکت های خصوصی، می تواند در این مسیر شما را همراهی نماید.

آخرین مطالب بلاگ

مشاهده همه