دوره طراحی سایت مدرن با Bootstrap ،Tailwind ،HTML/CSS

web design 1:

• • معرفی DOCTYPE
  • آموزش روش آماده سازی بستر طراحی وب و نرم افزارهای مربوطه
  • معرفی Project Structure در طراحی وب
  • ارائه طبقه بندی تگ ها مانند Test Level و Block Level و ...
  • بررسی نکات مربوط به List ها
  • بررسی پاراگراف ها، Span و کلیه تگ های طبقه بندی شده
  • معرفی مفهوم Attribute
  • معرفی مفهوم Comment و دلائل استفاده از آن
  • معرفی و ارائه مثال از تگ های مربوط به هر طبقه بندی
  • بررسی استانداردهای نامگذاری المان ها
  • بررسی مفهوم Validation در اسناد Html
  • معرفی CSS
  • بررسی نقش CSS در آرایش تگ ها
  • بررسی نکات مربوط به فونت مانند Size و Weight و ...
  • معرفی انواع فونت ها و پسوندهای مربوطه
  • بررسی Icon ها و فونت های گوگل
  • بررسی روش استفاده از کاراکترهای خاص در سند HTML
  • معرفی مفهوم Hyper Link و نکات مربوط به Navigation
  • آشنایی با مفهوم Anchor و Hash
  • ایجاد Shortcut برای لینک ها
  • بررسی Site Map و روش ایجاد آن
  • بررسی روش ایجاد منو و انواع آن
  • بررسی روش های مختلف آدرس دهی لینک ها مثلا Internal و External
  • بررسی نکات جدید HTML5 در مورد لینک ها مانند Download
  • بررسی تگ Table و اجزا مختلف آن
  • بررسی معایب و مزایای Table
  • بررسی نحوه استفاده از Table برای چیدمان
  • بررسی نحوه اختصاص اندازه به المانها
  • معرفی قابلیت های Design Envirement مانند منوها و قسمت های مختلف Dream Weaver
  • بررسی روش های مختلف اعمال Style روی تگ ها مانند Inline، Internal، External
  • معرفی انواع Selector ها در CSS
  • بررسی نحوه استفاده از تصاویر در سند HTML
  • بررسی انواع File Path
  • بررسی مفهوم Save/Export For Web
  • بررسی نحوه Load شدن تصاویر
  • بررسی پسوندهای مختلف تصاویر
  • بررسی تصاویرPNG و مشکلات نمایشی مرورگرها
  • بررسی نکات مربوط به تصاویر مانند Transparency
  • بررسی Image Map
  • بررسی نحوه ویرایش و بهینه سازی تصاویر برای وب با نرم افزارهای مربوطه
  • بررسی نحوه استفاده از تصاویر در Background
  • بررسی نکات مربوط به استفاده از تصاویر در Background مانند Repeat و ...
  • بررسی نحوه استفاده از صدا و تصویر در Background
  • معرفی IFrame و روش استفاده از آن
  • بررسی روش استفاده از Google Map و سایر موارد مرتبط با IFrame
  • ایجاد انیمیشن با تصاویر و ابزارهای مربوطه
  • بررسی نحوه استفاده از رنگ
  • بررسی نحوه استفاده از فونت
  • بررسی نکات مربوط به Formatting در Table
  • بررسی نکات جدید HTML5 در جداول
  • بررسی مفهوم Layout های Tableless
  • بررسی Div و نکات مربوطه در حیطه Positioning
  • بررسی روش های تقسیم بندی صفحه
  • بررسی مفهوم Margin و Padding
  • بررسی Border و نکات مربوطه
  • بررسی نکات مربوط به Text مانند Direction ، Decoration، Align و ...
  • بررسی نکات مربوط به Positioning در css
  • بررسی نکات حرفه ای تر css مانند Animation و Translation
  • بررسی انواع Effect ها در CSS3
  • بررسی انواع Layout ها
  • بررسی Localization برای زبانهای RTL
  • معرفی مفهوم Float و Absolute و...
  • معرفی مفاهیم مرتبط با Boxing
  • بررسی Form و انواع Input ها
  • معرفی تگ های مفهومی HTML5 مانند مفاهیم موارد زیر
  • <article>
  • <aside>
  • <details>
  • <figcaption>
  • <figure>
  • <footer>
  • <header>
  • <main>
  • <mark>
  • <nav>
  • <section>
  • <summary>
  • <time>
  • و بررسی نقش هر یک
  • بررسی امکانات مرتبط با شبکه های اجتماعی
  • طرح مشکل نمایش وب سایت در مرورگرهای متفاوت و نکات مربوطه
  • بررسی Drag & Drop
  • بررسی Canvas و نحوه استفاده از آن
  • بررسی SVG و نحوه استفاده از آن
  • معرفی Edge و Illusttator و کاربرد آنها
  • معرفی Mute و کاربرد آن

web design 2:

• • • طراحی وب سایت با کد های css و bootstrap
    • طراحی وی سایت ریسپانسیو / واکنشگرا ( نمایش صحیح و بهینه صفحات وب در کامپیوتر ، تبلت ، موبایل و ...) با کدهای css و

همچنین به کمک bootstrap

• • اصول ایجاد تجربه کاربری مطلوب برای بازدید کننده وبسایت ( ux)
  • پیاده سازی وب سایت بر اساس هارمونی در طرح ، رنگ و چیدمان