تالار گفتمان سایت ساز رزبلاگ

تالار گفتمان سایت ساز رزبلاگ

Q:

آموزش HTML - مطابق HTML5

خیلی وقت بود که میخواستم این آموزش ها رو ارائه بدم اما نمیدونستم که باید یه وبلاگ به صورت مجزا بسازم یا در یکی از انجمن های طراحی وب اونو منتشر کنم، تا اینکه بالاخره تصمیم گرفتم اون رو در انجمن رزبلاگ به دلیل مشتاق بودن دوستان به طراحی وب با شما به اشتراک بذارم.

در این آموزش سعی میکنم هر چیزی رو که در رابطه با HTML میشه رو با زبان ساده به شما آموزش بدم.

یاد گیری HTML یکی از اولویت های طراحی وب محسوب میشه تا بتونید وبتون رو ایجاد کنید.

یکی دیگه از نکته های حائز اهمیت در مورد HTML اینه که یاد گیری اون خیلی آسونه و شرط میبندم ازش لذت میبرید.

در طول آموزش شما رو با تکنیک ها و مهارت هایی برای ارتقائ مهارت های شما نه تنها در مورد طراحی وب بلکه در مورد سایر امورات آشنا میکنم.

آموزش طراحی و ویرایش قالب
پاسخ ها

خوبه ولی اموزش کو ؟

مستر گرافیک هنوز که شروع نشده ( دنبال شکلک اون یارو که دست گذاشته روی سرش گگشتم ولی مثل اینکه شکلک ها برداشته شده )!

معرفی و آشنایی با HTML

با یک مثال شروع میکنم:

کد:

<!DOCTYPE html>

<html>

<body>

<h1>اولین سرنویس من.</h1>

<p>اولین پاراگراف من.</p>

</body>

</html>

شرح مثال بالا:

  • DOCTYPE نوع سند HTML را مشخص میکند.
  • محتوای بین ... صفحه ی وب را تعریف میکند.
  • محتوای بین ... محتوای قابل مشاهده صفحه وب است.
  • متن بین ... به عنوان یک عنوان نمایش داده می شود.
  • متن بین ... به عنوان یک پاراگراف نمایش داده می شود.

برای فراخوان HTML5 و شناساندن آن به مرورگر میباشد.

HTML چیست؟

HTML یک زبان برای توصیف صفحات وب است.

  • HTML مخفف Hyper Text Markup Language زبان نشانه گذاری فوق متن
  • HTML یک زبان نشانه گذاری است.
  • یک زبان نشانه گذاری مجموعه ای از تگ های نشانه گذاری است.(tags)
  • تگ ها (tags) محتوای سند را توصیف میکنند.
  • اسناد HTML شامل تگ های HTML و متون ساده می باشند.
  • اسناد HTML نیز صفحات وب نام دارند.

تگ های HTML

تگ های نشانه گذاری HTML را معمولا تگ های HTML صدا میزنند.

تگ های HTML کلمات کلیدی (نام تگ ها) هستند که توسط قلاب هایی مانند احاطه میشوند.

تگ های HTML معمولا به صورت جفت می آیند به صورت ...

اولین تگ دوتایی تگ شروع است، تگ دومی تگ پایانی است.

تگ پایانی مانند تگ شروع نوشته میشود، با یک اسلش قبل از نام تگ.

تگ شروع و پایانی را ، تگ باز و تگ بسته هم صدا می کنند.محتوا

HTML عناصر

"تگ های HTML" و "عناصر HTML" اغلب هر دو برای توصیف استفاده میشوند.

به بیان دقیقتر، یک عنصر HTML همه چیز بین تگ شروع و تگ پایانی است، از جمله این تگ ها:این یک پاراگراف است.

مرورگرهای وب

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

مرورگر تگ های HTML را نمایش نمیدهد، بلکه از این تگ ها برای چگونگی نمایش محتوا استفاده میکند:

صفحه ساختار HTML

در زیر تصویری از ساختار صفحه HTML نمایش داده شده است:

این یک سرنویسه (عنوان).
این یه پاراگرافه.
اینم یه پاراگراف دیگه.
ورژن های (نسخه) HTML

از همان روزهای اولیه وب تا به امروز، نسخه های بسیاری از HTML ارائه شده اند که به شرح زیر میباشند:

[th]ورژن ها[/th][th]سال ها[/th]
HTML1991
HTML+1993
HTML 2.01995
HTML 3.21997
HTML 4.011999
XHTML 1.02000
HTML52012
XHTML52013
فراخوان

به مرورگر کمک میکند تا صفحه وب را به درستی نمایش دهد.

با توجه به جدول بالا میدانیم که اسناد و ورژن های بسیار مختلفی از HTML در وب وجود دارند، و یک مرورگر تنها در صورتی میتواند یک سند HTML را 100% به درستی نمایش دهد که نسخه ی HTML استفاده شده در سند را بشناسد(شناسایی کند).

فراخوان های متدال

HTML5

کد:

<!DOCTYPE html>

HTML 4.01

کد:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0

کد:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

پایان بخش اول

در این بخش سعی شد بر روی مفاهیم پایه و یا به قول معروف Basic بحث بشه.

متاسفانه خیلی از قسمت های آموزشی که قرار داده بودم به درستی نمایش داده نشد.

از این به بعد آموزش ها رو به صورت PDF در میارم و قرار میدم.

بخش اول:

معرفی و آشنایی با HTML

حجم 356 KB

کد:

https://rozup.ir/up/farshad-t3/temp/HTML5_intro.pdf

رمز فایل pdf:

farshad-t3

بخش دوم:

ادیتور های HTML

حجم 271 KB

کد:

https://rozup.ir/up/farshad-t3/temp/HTML%20Editors.pdf

در بخش های بعدی سعی میشه بیشتر در مورد تگ های HTML بحث بشه.

منتظر نظرات و پیشنهادات شما هستم و سعی میکنم هر روز تایپیک رو آپدیت کنم.

در ضمن اگر آموزش ها مشکلی دارند حتما بگید تا اصلاح بشند.

غلط املایی-فونت ها-رنگ ها مشکلی دارن-زیاد زیبا نیست-چرا زیاد جذاب نیست-چرا عکس کم میذاری

به مرور زمان سعی میکنم همه رو درست کنم و روی صفحه نگاری آموزش ها بیشتر کار کنم.

نقل قول از onlylover

ممنون خیلی خوبه

کاش یکی پیدا میشد نحوه کامل ترجمه و ریپ زدن قالب خارجی و تبدیل به قالب رزبلاگ رو میزاشت برای همه

شما آموزش های من رو دنبال کنید حتما یاد میگیرید.

بخش سوم

بنیاد HTML

حجم 207 KB

کد:

https://rozup.ir/up/farshad-t3/temp/HTML%20Basic.pdf

در ارائه ی این آموزش ها سعی کردم که زیاد در مورد جزئیات توضیح ندم.

دلیل این کار هم اینه که باید خرده خرده موضوعات براتون شفاف بشه و همینطور مسائل کوتاه تر به نظر بیان و درکش آسون تر بشه.

حالا چند نکته در مورد افزایش مهارتهاتون:

مثال ها رو خودتون تایپ کنید.

با برنامه پیش برید.

یک دفترچه تهیه کنید و هر تگی رو که یاد میگیرید، به همراه توضیحات و جزئیات ثبت کنید.

بخش چهارم:

عناصر HTML

حجم 368 KB

کد:

https://rozup.ir/up/farshad-t3/temp/HTML%20Elements.pdf

سلام بچه ها

امروز رو آموزش نگذاشتم چون فردا امتحان فیزیک دارم.

بعد از امتحانات منتظر آموزهای جدید باشید.

آموزش ها رو دوباره از اول باز نویسی میکنم، ایندفعه تمرکزم رو روی کیفیت آموزش ها گذاشتم پس ممکنه دیر آپ کنم.

دوست دارم یه خورده کارم رو توسعه بدم و کلا آموزش طراحی وب بذارم.

البته تایپیک های جدیدی برای مباحث جدید باز میکنم.

امیدوارم مدیران و شما کاربران هم تو این راه کمکم کنید.

مطالبی که در این تایپیک ارائه میشه:

آموزش HTML

معرفی ساختار HTML

آشنایی با تکنولوژی های HTML5

معرفی تگ های کاربردی HTML

معرفی Attribute های تگ ها

آشنایی با انواع فرم در HTML

حالا اگه کم و کسری داره بیان کنید.

در آینده هم پس از فراگیری HTML به گرافیک وب که شامل (مباحث اولیه,رنگ ها در طراحی گرافیک وب,تصویر در طراحی وب,برش دهی قالب گرافیکی وب سایت,متن در طراحی قالب گرافیکی) و کدنویسی هم که شامل (آموزش CSS, jQuery,قالب سازی WordPress) میشه بپردازم.

نظری نیست؟

پست های مرتبط

کسی میدونه چجوری بجای متن ادامه مطلب تصویر بگذاریم ؟؟؟؟؟؟؟؟

  • mmehrabi
  • پنجشنبه 03 مرداد 1398 - 2:42

فایل SVG چیست؟

  • guilty
  • سه شنبه 01 مرداد 1398 - 3:07

آموزش سئو کردن قالب وبلاگ

  • irmec
  • پنجشنبه 27 تیر 1398 - 10:41

حل مشكل من = تبليغات 30 تشكر

  • ariamone
  • پنجشنبه 10 خرداد 1397 - 12:47

ابزار آنلاین تست و مشکل یابی کدهای سی اس اس

  • irthem
  • پنجشنبه 10 خرداد 1397 - 12:46

تغییربک گراند

  • maloomi
  • چهارشنبه 29 فروردین 1397 - 10:26

تغییرات در قالب مورد نظرم (تشکر+بنر و پاپ آپ به مدت 3 ماه یا بیشتر)

  • raise
  • چهارشنبه 23 اسفند 1396 - 16:05

کد های بهینه سازی قالب

  • mr-graphic
  • چهارشنبه 23 اسفند 1396 - 16:01

کمک کنید در مورد قالبم+تشکر

  • paye-6
  • چهارشنبه 23 اسفند 1396 - 16:00

درست کردن قالب

  • buyoriginal
  • چهارشنبه 23 اسفند 1396 - 15:59

کسی بلده اموزش ویرایش css قالب سایت رابگه

  • eshghdoone
  • چهارشنبه 23 اسفند 1396 - 15:58

کد تغیر رنگ منو قالب

  • kandoo
  • چهارشنبه 23 اسفند 1396 - 15:57

آموزش ویدیویی ترجمه قالب به سیستم سایت ساز رزبلاگ - بخش دوم

  • wizardzx
  • چهارشنبه 23 اسفند 1396 - 15:57

آموزش ترجمه قالب به رزبلاگ ( بخش اول ) -

  • wizardzx
  • چهارشنبه 23 اسفند 1396 - 15:56

درخواست قرار دادن امکان حالت من در قالب

  • basiji
  • چهارشنبه 23 اسفند 1396 - 15:56

کسی میدونه فیکس کردن قالب برای تمام رزولیشن ها چجوریه؟

  • blackwizard
  • چهارشنبه 23 اسفند 1396 - 15:54

آموزش ساخت و طراحی قالب رزبلاگ (کمک کنید)

  • victor
  • چهارشنبه 23 اسفند 1396 - 15:53

آخرین مطالب و بهترین مطالب بصورت اسلید شو در رزبلاگ

  • ehsan-al
  • چهارشنبه 23 اسفند 1396 - 15:52

برای تغییر اسلایدر قالب به کمکتون نیاز دارم

  • shahbazi
  • چهارشنبه 23 اسفند 1396 - 15:52

درخواست ایجاد قالب مشابه

  • monarc0
  • چهارشنبه 23 اسفند 1396 - 15:44