:: امیر یاوندحسنی ::

روزنوشت‌‌هایی در زمینه‌: فناوری اطلاعات، گرافیک، طراحی وب

روزنوشت‌‌هایی در زمینه‌: فناوری اطلاعات، گرافیک، طراحی وب

ویژه های وبلاگ
خبرنامه وبلاگ

آدرس ایمیلتان را وارد کنید:

شبکه های اجتماعی
تائيديه پرداخت با Payline

آموزش HTML - جلسه اول

جمعه, ۱۵ شهریور ۱۳۹۲، ۰۱:۳۷ ب.ظ

آموزش HTML

به‌وسیله‌ی زبان HTML شما می‌توانید وب‌سایت شخصی‌تان را راه‌اندازی کنید.

این آموزش هرآنچه درباره‌ی HTML مورد نیاز است، به شما می‌آموزد.

زبان HTML بسیار ساده است. از یادگیری آن لذت خواهید برد!

مقدمه:

سلام دوستان عزیز؛ این، اولین سری از مجموعه آموزش‌های برنامه نویسی تحت وب هستش که به روشی ساده و مفهومی ارائه می‌کنم تا همه افراد، حتی کسانی که هیچ‌گونه پیش زمینه‌ی قبلی در این موضوع ندارند، بتوانند به خوبی از آن استفاده کنند!

این مجموعه به آموزش و تشریح پایه‌ای ترین مسائل، درباره‌ی طراحی اصولی صفحات وب با استفاده از زبان HTML می‌پردازد.

چند نکته مهم که در تهیه و تدارک این آموزش لحاظ شده به شرح ذیل است:

  1. در ارائه این آموزش سعی بر این بوده تا حد امکان از منابع رفرنس (Refrense) و به‌روز استفاده شود.
  2. این آموزش به روش ارائه مطلب به‌وسیله مثال ارائه شده که روشی نوین و امتحان‌شده در امر آموزش برنامه‌نویسی تحت وب است.
  3. سعی بر این است که مطالب بر اساس سرفصل‌های آموزش بین‌المللی1 زبان HTML ارائه شود تا بیشترین کیفیت و بهره‌وری را به همراه داشته باشد!

معرفی زبان HTML:

HTML یک زبان برای تشریح صفحات وب است؛ برخی از مهم‌ترین دانستنی‌های زبان HTML از قرار ذیل می‌باشد:

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

تگ‌های HTML:

برچسب‌های نشانه‌گذاری در صفحات HTML را با نام عمومی تگ‌های HTML می‌شناسیم. تگ‌های HTML کلمات کلیدی (همان نام تگ‌ها) هستند که توسط دو براکت زاویه‌ای احاطه شده‌اند. (نظیر: <html>)

تگ‌های HTML معمولا جفت هستند. (تگ: <b> و <b/> یک مثال عالی از این مسئله است.) به تگ اول، تگ شروع (start tag) و به تگ دوم، تگ پایان (end tag) می‌گوئیم. تگ پایانی دقیقا مانند تگ اول نوشته می‌شود با این تفاوت که یک علامت "/" قبل از نام تگ می‌آوریم. به تگ‌های شروع و پایان، تگ‌های باز و بسته هم می‌گوئیم.

در حالت کلی یک تگ در زبان HTML به صورت زیر تعریف می‌شود:

<tagneme>Content</tagneme>

عناصر HTML:

عناصر و تگ‌های HTML اغلب برای توصیف چیز مشابهی به‌کار می‌روند. اما در یک تعریف دقیق‌تر از عناصر HTML داریم:

یک عنصر HTML شامل تگ‌های ابتدا و انتها و هر آن‌چه که بین این دو است می‌شود.

<p>This is a Paragraph</p>

عبارتی که در box بالا ذکر شده یک عنصر HTML است که در آن <p> و <p/> نقش تگ‌های ابتدا و انتها را دارند و عبارت "This is a Paragraph" نقش محتوای بین تگ‌ها را بازی می‌کند.

مرورگر‌های اینترنتی (Web Browsers):

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

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

ساختار اصلی یک سند HTML:

در شکل زیر ساختار پایه‌ای و اصلی یک سند HTML به نمایش درآمده است:

<html>
<body>
<h1>This a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>

در شکل بالا تگ‌ <html> اصلی‌ترین تگ‌ و چارچوب سند HTML است. تگ <body> وظیفه‌ی نمایش محتوای سند را برعهده دارد و هر تگی که بین تگ <body> قرار بگیرد در صفحه مرورگر نمایش داده می‌شود. ضمنا تگ‌ <h1> برای نمایش عنوان مطلب و تگ <p> جهت نمایش پاراگراف (بند) به کار می‌رود.

نسخه های ارائه شده از زبان HTML:

از روزهای اولیه وب تاکنون نسخه‌های نسبتا زیادی از HTML منتشر شده است؛ در جدول زیر سیر تکاملی زبان HTML را مشاهده می‌کنید:

سال ارائه نسخه HTML
1991  HTML
1993  HTML+
1995  HTML 2.0
1997  HTML 3.2
1999  HTML 4.01
2000  XHTML 1.0
2012  HTML5
2013  XHTML5

1. آموزش‌های بین‌المللی توسط مؤسسه W3Schools.com و به‌زبان انگلیسی ارائه شده است که یکی از منابع اصلی استفاده شده در این آموزش نیز است.

اگر این مطلب را می‌پسندید آن‌را در گوگل محبوب کنید:

نظرات  (۲)

ممنون از سایت خوب و آموزندتان
سلام جناب حسنی
خودم هم از این که وبلاگهایم خاک می خورند، ناراحتم. انشاءالله بتوانم مجدد فعالشان کنم.
اما وقتی به وبلاگهای شما مراجعه می کنم، انرژی میگیرم. وبلاگ خوبی دارید :)
پاسخ:
سلام؛ ممنونم!
ان‌شاءالله که بتوانیم شاهد فعالیت مجدد شما در این عرصه باشیم.

ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
تجدید کد امنیتی