توضیحات
مزیت شرکت در دوره های آموزشی طراحی سایت و سئو دارکوب آن است که در مجموعه ای آموزش شما انجام می گردد که به صورت حرفه ای در زمینه طراحی و بهینه سازی وب سایت فعالیت دارد. دارکوب از سال 1381 در زمینه طراحی وب سایت و سئو فعالیت دارد و تا کنون در حدود 4000 وب سایت طراحی و بهینه سازی نموده است. همچنین این مجموعه دارای مجوز فعالیت از سازمان نظام صنفی رایانه ای استان تهران و مجوز نشر دیجیتال بر خط از وزارت فرهنگ و ارشاد اسلامی می باشد. مجموعه دارکوب دارای رتبه 4 از شورای عالی انفورماتیک کشور می باشد که مجوز تاسیس آموزشگاه فناوری اطلاعات را از سازمان فنی و حرفه ای دریافت نموده است.
HTML و CSS (به همراه جاوا اسکریپت) سنگ بنای طراحی و توسعه وب سایت هستند. فرقی نمی کند که شما توسعه دهنده Front-end باشید یا Back-end، یا وب سایتی که توسعه می دهید ایستا باشد یا داینامیک، در هر صورت ضروری است که دانش و درک درستی از کارکرد کدهای این زبان ها داشته باشید.
Front-end: کدهایی هستند که عمدتا در سیستم کلاینت پردازش می شوند و به کمک مرورگر اینترنتی کار نمایش صفحات و اطلاعات وب سایت را بر عهده دارند.
Back-end: کدهایی هستند که معمولا با زبان هایی مانند php و ASP.net نوشته شده و در کامپیوتر سرور پردازش می شوند و نتیجه آن به کاربر نمایش داده می شود.
HTML (Hypertext Markup Language): یک زبان نشانه گذاری است که ساختار صفحات وب را مشخص می کند. برچسب (تگ) ها دستورات HTML هستند که المان صفحه را برای مرورگر توصیف می کند. برچسب های HTML المان ها و اطلاعاتی مانند: عنوان صفحه، بدنه اصلی صفحه، مقاله، پاراگراف، عکس و غیره را در صفحه وب مشخص می کنند. اگر چه می توان تنها با HTML صفحات وب سایت را ایجاد و به هم متصل کرد، اما این صفحات کاملا ساده و ابتدایی خواهند بود چون HTML امکانات کمی در زمینه زیبا سازی صفحات وب دارد برای همین CSS این کار را برعهده می گیرد.
CSS یا (Cascading Style Sheets): کار چیدمان و جلوه های تصویری (کادر، رنگ، اندازه ها و غیره) صفحات وب را بر عهده دارد. CSS به تنهایی هیچ کاربردی ندارد در واقع کار آن زیباسازی و ترکیب بندی صفحات وب بوده و برای همین با HTML به کار گرفته می شود.
کارکرد CSS بسیار وسیع است، از کارهای ساده مانند تعیین اندازه و رنگ متن در صفحه وب شروع شده و تا طراحی واکنش گرا (Responsive) و حتی انیمیشن در صفحات وب ادامه پیدا می کند.
فریم ورک هایی مانند Bootstarp که توسط شرکت توئیتر توسعه داده شده است در واقع کلاس هایی از کدهای CSS و جاوا اسکریپت هستند. فریم ورک هایی این چنینی اگرچه با کمک کلاس ها و طراح های آماده کار طراحی را آسانتر، ساده تر، سریع تر و گاه زیبا تر می کنند، اما شاید مفاهیم پایه و اساسی در طراحی صفحه را تنها در و با CSS می توان درک نمود. به علاوه با استفاده از این فریم ورک ها (مانند Bootstarp) هیچگاه نیاز به نوشتن کدهای CSS به طور کلی از بین نمی رود.
بنابراین شما کار طراحی و توسعه وب سایت را با HTML و CSS آغاز کرده و همیشه به آن ها نیاز خواهید داشت.
سرفصل ها
- آشنایی با مفهوم و تاریخچه وب و زیر ساختهای نرم افزاری و سخت افزاری لازم برای ایجاد، استقرار و نگهداری وب سایت ها
- معرفی مفاهیم شبکه ای مرتبط با وب مانند 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 و نحوه استفاده از آن
- Bootstrap
- طراحی سایت به صورت ریسپانسیو و سازگار با موبایل
