دوره (Web Design I(HTML5,CSS3 with Dreamweaver

سرفصل دوره آموزش Web Design I (HTML5, CSS3 with Dreamweaver)

معرفی مباحث اولیه وب

• آشنایی با مفهوم و تاریخچه وب و زیر ساختهای نرم افزاری و سخت افزاری لازم برای ایجاد، استقرار و نگهداری وب سایت ها
• معرفی مفاهیم شبکه ای مرتبط با وب مانند Domain ،Host ،Web Server،DNS Server
• معرفی مفاهیم نرم افزاری مرتبط با طراحی وب مانند HTML و CSS

سایر مباحث آموزشی

• معرفی 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 در CSS3
• بررسی نکات حرفه ای تر CSS3 مانند 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 و کاربرد آن