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

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

  • مدرس این دوره : میلاد ده یامی
  • طول دوره : 36 ساعت
  • شروع دوره : 1398/08/09
  • تعداد جلسات : 12 جلسه
  • امکان قسط بندی : دارد
  • هزینه ثبت نام : 500,000 تومان
  • روزهای برگزاری : پنج شنبه ( 09:00 الی 12:00 )

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

یک وب سایت تشکیل شده است از تعدادی فایل با فرمت های مختلف که توسط مرورگرهایی همچون 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

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

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

مکان برگزاری

  • نشانی : اصفهان ، اصفهان ، خیابان هشت بهشت شرقی بن بست 33 اولین ساختمان سمت چپ آکادمی برنامه نویسان
  • محل برگزاری : شعبه  اصفهان ، کلاس اول
  • تلفن تماس : 02188454816 ، 09309057504
  • شماره فکس :

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

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

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

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

مشاهده همه