دوره جامع آموزش طراحی سایت HTML CSS Dreamweaver Fireworks Bootstrap JavaScript jQuery

دوره جامع آموزش طراحی سایت HTML CSS Dreamweaver Fireworks Bootstrap JavaScript jQuery

مخاطب:

افرادی که تمایل به طراحی و برنامه نویسی تحت وب دارند با گذراندن این دوره می توانند طراحی ، ایجاد و راه اندازی وب سایت های استاتیک بر روی وب را انجام داده و در صورت تمایل پس از این دوره در کلاس های .Net و یاPHP جهت برنامه نویسی وب شرکت نمایند.


مدت دوره:

90 ساعت


پیشنیاز دوره طراحی سایت:

ICDL



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

در انتهای دوره آموزشی جامع طراحی سایت، دانشجويان قادر خواهند بود:
1.    با مبانی طراحی وب آشنا شوند.
2.    گرافیک های طراحی شده را به وب سایت استاتیک تبدیل نمایند.
3.    اسلایدرها را طراحی و ایجاد نمایند.
4.    با استفاده از جاوا اسکریپت و jQuery صفحات را مدرن و تعاملی سازند.
5.    با طراحی ریسپانسیو آشنا شده و با استفاده از bootstrap سایت های ریسپانسیو طراحی نمایند
6.    وب سایت طراحی شده را بر روی اینترنت بازکذاری نمایند.
7.    با مفهوم Ajax و نحوه کاربرد آن در jQuery آشنا شوند.


سرفصل دوره آموزشی طراحی سایت:

HTML - CSS3

• آشنایی با مفهوم و تاریخچه وب و زیرساختهای نرم افزاری و سخت افزاری لازم برای ایجاد ،استقرار و نگهداری وب سایت ها
• معرفی مفاهیم شبکه ای مرتبط با وب مانند Domain،Host،Web Server،DNS Server
• معرفی مفاهیم نرم افزاری مرتبط با طراحی وب مانند HTML و CSS
• بررسی مفهوم Markup Language
• بررسی مفهوم Cascading Style Sheet
• تشریح نحوه عملکرد Web Browser ها
• بررسی مفهوم Search Engine
• بررسی مفهوم SEO
• بررسی مفهوم UI (واسط کاربری)
• بررسی مفهوم UX
• بررسی مفهوم Responsive (واکنش گرا)
• بررسی مفهوم Tag و ساختار یک سند HTML استاندارد
• معرفیDOCTYPE
• آموزش روش آماده سازی بستر طراحی وب و نرم افزار های مربوطه
• ارائه طبقه بندی تگ ها مانند Text Level و Block Level،List و …
• بررسی نکات مربوط به List ها
• بررسی پاراگراف ها ،span و کلیه تگ های طبقه بندی شده
• معرفی مفهوم Attribute
• معرفی مفهوم Comment و دلائل استفاده از آن
• معرفی و ارائه مثال از تگ های مربوط به هر طبقه
• بررسی استاندارد های نامگذاری المانها
• بررسی مفهوم Validation در اسناد HTML
• معرفیCSS
• بررسی نقش CSS در آرایش تگ ها
• بررسی روشهای مختلف اعمال Style روی تگها مانند Inline،Internal،External
• معرفی انواع Selector ها در CSS
• بررسی نحوه استفاده از تصاویر در سند HTML
• بررسی انواع File Path
• بررسیImage Map
• بررسی نحوه استفاده از تصاویر در Background
• بررسی نکات مربوط به استفاده از تصاویر در Background مانند Repeat و …
• بررسی نحوه استفاده از صدا و تصویر در Background
• معرفیIFrame و روش استفاده از آن
• ایجاد انیمیشن با تصاویر و ابزار های مربوطه
• بررسی نحوه استفاده از رنگ
• بررسی نحوه استفاده از فونت
• بررسی نکات مربوط به فونت مانند Size و Weight و …
• معرفی انواع فونت ها و پسوندهای مربوطه
• بررسی روش استفاده از کاراکترهای خاص در سند HTML
• معرفی مفهوم Hyper Link و نکات مربوط به Navigation
• آشنایی با مفهوم Anchor و Hash
• بررسی روش ایجاد منو و انواع آن
• بررسی روشهای مختلف آدرس دهی لینکها مثلا Internal و External
• بررسی تگ Table و اجزاء مختلف آن
• بررسی معایب و مزایایTable
• بررسی نحوه استفاده از Table برای چیدمان
• بررسی نحوه اختصاص اندازه به المانها
• بررسی نکات مربوط به Formatting در Table
• بررسی نکات جدیدHTML5 در جداول
• بررسی مفهوم Layout هایTable Less
• بررسیDIV و نکات مربوطه در حیطهPositioning
• بررسی روش های تقسیم بندی صفحه
• بررسی مفاهیمMargin و Padding
• بررسیBorder و نکات مربوطه
• بررسی نکات مربوط به Text مانند Direction ،Decoration،Align و …
• بررسی نکات مربوط به Positioning در CSS3
• بررسی نکات حرفه ای تر در CSS3 مانند Animation و Transition Bottom of Form
• بررسی انواع Effect ها در CSS3
• بررسی نکات مربوط به Transform در CSS3
• بررسی انواع Layout ها
• معرفی مفهوم Float و Absolute و …
• معرفی مفاهیم مرتبط با Boxing
• بررسیForm و انواع Input ها
• معرفی تگ های مفهومیHTML5
• بررسیCanvas و نحوه استفاده از آن
• بررسیSVG و نحوه استفاده از آن
• بررسی و نحوه استفاده از وب فونتها Font Face
• معرفی Media Query
• معرفی و پیاده سازی Responsive Layout

Adobe Dreamweaver

• آشنایی با رابط کاربری Dreamweaver
• ابزار مدیریت سایت
• شخصی سازی محیط برنامه
• طراحی و ایجاد صفحات پایه
• ایجاد جداول
• فرمهای تعاملی
• ایجاد انواع لیست ها
• استفاده از Frames و Frameset ها
• اضافه کردن عناصر مالی مدیا
• ایجاد Style Sheet برای صفحات وب
• کارکردن با عناصر Div و AP
• ایجاد و استفاده از قالب برای Dreamweaver

JavaScript & jQuery

• بررسی مفهوم Client Side کد و لزوم وجود امکان برنامه نویسی سمت کلاینت
• معرفی زبان برنامه نویسیJava Script و روش استفاده از آن در یک سند HTML
• بررسی نکات مربوط به تگ Script و محل نوشتن دستورات
• معرفی مفهوم متغیر و ارائه نکات مربوط به متغیر ها در Java Script
• بررسی متغیر هایLocal و Global
• بررسی مفهوم Notation و روش رعایت آن در Java Script
• بررسی فایل هایJS و روش استفاده از آنها
• بررسی انواع عملگرها
• معرفی مفهوم شرط و ساختارهای بررسی شرط
• بررسی دستور switch
• بررسی مفهوم حلقه و موارد نیاز به حلقه های تکرار
• بررسی انواع حلقه های تکرار
• بررسی حلقه هایwhile و for و …
• بررسی روش تعریف تابع و نکات مربوطه
• بررسی مفهوم رویداد و روش اداره آن
• بررسی تنوع رویداد های المانها
• معرفیDOM و اجزاء آن و روش دسترسی به آنها
• بررسی انواع روشهای دسترسی به المانها مانند دسترسی بر اساس id و …
• بررسی روش درج، حذف و ویرایش المانها و Node ها
• بررسی روش دسترسی به Node های پدر و فرزند و حالتهای متنوع دسترسی
• معرفیinnerText و innerHTML
• معرفیFramework و مفهوم آن و انواع Framework هایJava Scrip
• معرفیjQuery و مزایای استفاده از آن
• بررسی روش استفاده از jQuery در یک سند HTML
• بررسی و مقایسه عملیات مختلف مانند اداره رویداد،فراخوانی توابع،مقداردهی به مشخصه ها در jQuery و Java Script
• معرفیSelector هایjQuery و نکات مربوطه
• آشنايی با jQuery و نحوه نصب و شیوه کار با آن
• آموزش قواعد نوشتاری در jQuery
• آموزش دسترسی به المان هایhtml در jQuery
• Select To Every Things آموزش دسترسی به تمام المان ها
• ID Selector آموزش دسترسی به وسيله شناسه
• Tag Name Selector آموزش دسترسی به وسيله ی نام تگ
• Class Selector آموزش دسترسی به وسيله ی کلاس
• Attribute Selector آموزش دسترسی به وسيله یAttribute
• Selecting Visibility آموزش دسترسی توسط نمايش و عدم نمايش
• Selecting Parents and Children آموزش دسترسی توسط فرزند و پدر
• آموزش رويداد ها و معرفیEffect ها در jQuery
• معرفی مفهوم AJAX و بررسی روش پیاده سازی آن در Java Script و jQuery و مزایای آن

Bootstrap

• معرفی مفهوم CSS Framework
• معرفی و بررسی تاریخچهBootstrap
• بررسی روش استفاده از Bootstrap در یک سند HTML
• معرفیGrid System
• معرفی انواع سایزها و کلاسهای مرتبط و روش تشخیصResolution کاربر
• معرفیResponsive Layout در Bootstrap
• بررسیTypography با Bootstrap
• بررسی روش ایجاد فرم و کلاسهای مرتبط
• بررسی روش پنهان سازی بخش هایی از سند
• بررسی نکات و کلاسهای مرتبط با جدول
• بررسی نکات و کلاسهای مرتبط با تصاویر
• بررسی روش استفاده از Icon ها
• بررسی روش استفاده از Helper ها
• بررسی نکات . کلاسهای مرتبط با دکمه
• بررسی ارائه مثال از موارد زیر :
- Button groups
- Button dropdowns
- Input groups
- Nav
- Navbar
- Breadcrumbs
- Pagination
- Labels
- Badges
- Jumbotron
- Page header
- Thumbnails
- Alerts
- Progress bars
- Media object
- List group
- Panels
- Wells
- Modal Form
- Affix
- Scrollspy
- Carousel

برای مشاهده سرفصل دوره Web Design کلیک کنید