آموزش ببین

آموزش صفر تا صد به زبان ساده
×

آموزش اچ تی ام ال – طراحی وب با HTML – مقدماتی

خانه » دانلود » آموزش اچ تی ام ال – طراحی وب با HTML – مقدماتی
امتیاز خود را ثبت کنید
48000 تومان
اطلاعات دوره
50%
تخفیف
تعداد دانشجو
0
مدت دوره
02:56:02
تعداد درس ها
12

admin

درباره استاد
اشتراک گذاری محصول

بیشترین زمان

با بالاترین کیفیت تدریس

اساتید مجرب

بهترین استاد های ایران

ویدیو با کیفیت

دارای ضمانت نامه کیفیت

دسترسی ایمن

تنها خودتان یاد بگیرید

امتیاز خود را ثبت کنید
 

HTML چیست؟

واژه HTML (اچ‌‌تی‌‌ام‌ال) مخفف Hyper Text Markup Language به معنی زبان نشانه‌‌گذاری فوق متن است. HTML به عنوان زبان بنیادی طراحی وب، یکی از ساده‌ترین زبان‌های کامپیوتری است که با استفاه از آن می‌توانیم اسکلت اصلی وب‌سایت را طراحی کنیم.

HTML از تگ‌ها یا نشانگرهای خاص برای نشان دادن محتوا و ساختار صفحات استفاده می‌کند، این تگ‌ها به مرورگر اعلام می‌‌کنند، که هر بخش از صفحه چه نوع عنصری است و باید به چه صورت نمایش داده شود.

اهمیت یادگیری HTML چیست؟ 

 وقتی حرف از طراحی وب‌‌سایت به میان می‌‌آید، ذهن تمامی افراد ناخواسته به سمت زبان HTML و CSS هدایت می‌‌شود. این زبان، زبان استاندارد صفحات وب است و زبان نهایی است که توسط مرورگر ترجمه‌ شده و به کاربر نمایش داده می‌‌شود. به طور دقیق‌‌تر، وقتی شما وب‌‌سایتی را به زبان PHP و یا ASP.Net طراحی و برنامه‌‌نویسی می‌کنید، این وب‌‌سایت بعد از اجرا بر روی سرور و همین طور سیستم کاربر، تبدیل به قطعه کدهای HTML شده و بر روی مرورگر ترجمه شده و به کاربر نشان داده می‌‌شود. بنابراین، یادگیری HTML برای افرادی که در زمینه طراحی وب فعالیت می‌کنند، بسیار مهم است.

در این آموزش ببین چه چیزی یاد می‌گیریم؟ 

در این آموزش ببین در ابتدا با مقدمات HTML و تگ‌های Text Formatting آشنا می‌شویم. در ادامه Link Building و عکس‌ها در صفحه وب را بررسی کرده و مروری بر CSS خواهیم داشت. در گام بعدی لیست‌ها، جدول و تگ div را ارائه خواهیم کرد و در نهایت فرم و مدیا در صفحه وب و تگ‌های درون head و مفهوم DOCTYPE را بیان می‌کنیم.

XHTML مخفف Extensible Hyper Text Markup Language و تقریبا همانند HTML4 است. این آموزش بر اساس XHTML 1.0 ارائه شده و پس از مشاهده این آموزش، برای تثبیت بهتر مطالب می‌توانید به آموزش پروژه‌محور HTML و CSS  نیز مراجعه نمایید.

 

سرفصل‌ها

  • درس اول: مقدمات HTML
    • معرفی HTML
    • شروع کار با HTML
    • مفهوم تگ یا نشانه
    • تگ html
    • تگ head
    • تگ body
    • تگ meta و استفاده از آن برای تعیین Encoding صفحه
    • تگ title و مزایا و نقش آن در SEO
    • معرفی مفهوم SEO یا Search Engine Optimization
    • تگ p برای ایجاد پاراگراف
    • معرفی خصوصیت style و مفهوم آن
    • معرفی خصوصیات مهم موجود در Style از قبیل font-size, width, height, color, background-color, background-image, font-weight, text
    • align, direction و …
    • معرفی تگ‌های Heading و نقش آن در SEO
    • معرفی تگ span
    • معرفی موجودیت (Entity) ها در HTML از جمله برای فاصله گذاری
    • معرفی تگ br
  • درس دوم: تگ های Text Formatting
    • تگ b
    • تگ i
    • تگ u
    • تگ strong و نقش آن در SEO
    • تگ em و مفهوم آن
    • اشاره ای به وب معنایی
    • تگ های big, small, del, ins, mark, sup, sub, blockquote, q , abbr, address, cite, samp, code, kbd, code, pre, var
  • درس سوم: Link Building
    • معرفی تگ a و خصوصیت href برای ایجاد لینک
    • انواع آدرس دهی و تفاوت آن ها
    • نکات مربوط به SEO
    • خصوصیت title
    • خصوصیت target
    • ایجاد Bookmark با استفاده از تگ a و خصوصیت name
  • درس چهارم: عکس ها در صفحه وب
    • معرفی تگ img و خصوصیت src
    • معرفی خصوصیات title و alt
    • گذاشتن عکس در لینک و استفاده از خصوصیات مربوط به border
    • استفاده از map به منظور ایجاد چند ناحیه قابل کلیک در یک عکس
  • درس پنجم: مروری بر CSS
    • بررسی اشکالات گذاشتن Style به صورت inline
    • معرفی تگ style
    • مفهوم انتخاب گر یا selector در CSS و بررسی چند selector از قبیل id و class
    • معرفی Style به صورت external و معرفی مفهوم CSS و تگ link
  • درس ششم: لیست ها
    • تگ ol و لیست مرتب
    • تگ ul و لیست نامرتب
    • معرفی خصوصیات type و start
    • تعیین عکس به عنوان bullet برای لیست
  • درس هفتم: جدول
    • معرفی تگ table
    • استفاده از تگ های tr و td در جدول
    • خصوصیات border, align, valign, width, colspan, row
    • تگ های colgroup, tfoot, thead, tbody
  • درس هشتم: تگ div
    • معرفی مفهوم و موارد استفاده تگ div
    • کنار هم چیدن div ها برای قالب بندی صفحه
    • مفهوم position و مختصات left و top
    • مفهوم float
    • قالب بندی یک صفحه با div
    • مفهوم clear
  • درس نهم: فرم در صفحه وب
    • تگ form
    • کنترل های فرم برای برنامه نویسی در html4 و html5
    • تگ های input با انواع button, text, checkbox, radio, submit , reset, password, number, color, date, range
    • تگ textarea
    • تگ select و option برای ایجاد Dropdown
    • تگ datalist
  • درس دهم: مدیا در صفحه وب
    • معرفی تگ video و source برای گذاشتن ویدیو در صفحه وب
    • معرفی تگ audio
    • تگ object
    • تگ embed
  • درس یازدهم: تگ های درون head و مفهوم DOCTYPE
    • معرفی انواع تگ های meta
    • تگ base
    • مفهوم DOCTYPE و معرفی انواع نسخه HTML
  • درس دوازدهم: مروری مختصر بر رنگ ها

محتوای این آموزش

۲ ساعت آموزش ویدئویی

۶ تمرین به‌همراه پاسخ

فایل برنامه‌ها و پروژه‌ها

مدرس

 
محمد عبداللهی

محمد عبداللهی

  • کارشناس ارشد مهندسي فناوری اطلاعات (IT) – معماری سازمانی
  • دانشگاه شهيد بهشتي

مهندس محمد عبداللهی، دارای کارشناسی ارشد مهندسی فناوری اطلاعات (IT) – معماری سازمانی از دانشگاه شهيد بهشتی تهران هستند. زمينه‌های کاری و تخصصی ايشان در حوزه برنامه‌نويسی و طراحی وب، طراحی، توليد و توسعه نرم‌افزارهای سازمانی، مديريت پروژه‌های توليد نرم‌افزار بوسيه چارچوب‌های چابک مانند: اسکرام و معماری سازمانی طبق چارچوب TOGAF است. تکنولوژی‌های مورد استفاده ايشان در کارهای تخصصی و نيز آموزش عبارتند از: HTML, CSS, JavaScript, jQuery, PHP, MySQL, .NET Core و MS SQL Server

سوابق تحصیلی

مقطع تحصیلی رشته تحصیلی دانشگاه / موسسه آموزشی
کارشناس ارشد مهندسي فناوری اطلاعات (IT) – معماری سازمانی دانشگاه شهيد بهشتي
کارشناسی مهندسی کامپیوتر – نرم‌افزار دانشگاه صنعتی اصفهان
  •  

نرم‌افزارهای مرتبط با آموزش

NotePad++ 6.9.2

29:14
آموزش طراحی وب با HDML 1
15:49
آموزش طراحی وب با HDML 2
13:26
آموزش طراحی وب با HDML 3
15:13
آموزش طراحی وب با HDML 4
14:46
آموزش طراحی وب با HDML 5
10:57
آموزش طراحی وب با HDML 6
17:58
آموزش طراحی وب با HDML 7
13:20
آموزش طراحی وب با HDML 8
17:31
آموزش طراحی وب با HDML 9
10:49
آموزش طراحی وب با HDML 10
12:02
آموزش طراحی وب با HDML 11
05:44
آموزش طراحی وب با HDML 12

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

آموزش های مرتبط