Categories: HTML اچ تی ام ال

آموزش HTML جلسه دوم – ساختار فایل HTML

جلسه پیش در مورد معنی و مفهوم و ابزار مورد نیاز برای کار کردن با HTML حرف زدیم.امروز می خواهیم در مورد ساختار HTML  صحبت کنیم.

ساختار یک فایل ساده در HTML باید به این صورت می باشد:


<!doctype html>
<html lang="en">
<head>

Document metadata

</head>
<body>

Document contents

</body>
</html>

doctype چیست؟

به استانداردی میگویند که باید در اول فایل HTML  تعریف شود . این خط باید بالای تگ HTML قرار گیرد.

تگ html  :

تگ والد ساختار HTML هست و همه ی تگ ها در زیر این تگ معرفی میشوند . از اصلی ترین فرزند های این تگ می شود به body و head اشاره کرد. همچنین از نظر استاندارد شما باید زبان صفحه وبتون رو در تگ html معرفی کنید . بطور مثال :


<html lang="en">

</html>

تگ head :

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


<head>

</head>

تگ body:

در این تگ تمام محتوا و تگ های فرزند قرار میگیرد و هر چیزی که در صفحه میبینید از اینجا خوانده میشود.


<body>
 <p>اینجا مطالب قرار میگیرد</p>
</body>

Metadata یا فراداده :

در اینجا با مثالی از کد های فرا داده شروع به توضیح خط به خط آن خواهیم کرد.


<head>
 <meta charset="utf-8">
 <title>زوپیرنت</title>
 <meta name="description"
 content="مرجع مقالات آموزشی و اخبار علمی">
 <meta name="keywords" content="زوپیرنت,مقالات آموزشی,اخبار علمی,طراحی وب,html,css">
</head>

charset یا زبان:

در اینجا به معرفی زبان تمام محتوای سایت میپردازیم که معمولا برای زبان فارسی بهترین گزینه utf-8 هست.


<meta charset="utf-8">

title یا عنوان :

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


<title>زوپیرنت</title>

description یا توضیحات :

این قسمت برای توضیح مختصری از سایتتون بکار خواهد رفت.بطور مثال اگر زوپیرنت رو سرچ کنید اولین گزینه که همین سایت هست نمایش داده خواهد شد و بعد از دیدن title شما description سایت رو در پایین آن خواهید دید.


<meta name="description" content="مرجع مقالات آموزشی و اخبار علمی">

keywords یا کلمات کلیدی :

شما با استفاده از این خاصیت می توانید به کاربران اجازه دهید که به سایتتون راحت تر مراجعه کنند.بطور مثال اگر سایتتون در زمینه ی فروش لباس هست و در کلمات کلیدی بزنید “لباس” کاربران با سرچ کردن لباس در گوگل به سایت شما خواهند رسید.


<meta name="keywords" content="زوپیرنت,مقالات آموزشی,اخبار علمی,طراحی وب,html,css">

بابک حبیبی

بابک حبیبی،دانشجوی لیسانس نرم افزار،برنامه نویس پی اچ پی،طراح وب،یه سری تخصص هم در شبکه و مباحث امنیتی دارم.

View Comments

Comments are closed.

Share
Published by
بابک حبیبی
Tags: HTMLWebdesignاچ تی ام الطراحی سایتطراحی وب

Recent Posts

  • اخبار سایت

شروعی دوباره برای زوپیرنت

با سلام. با عرض پوزش فراوان بدلیل غیبت طولانی ما که دلیل‌های ریز و درشتی داشت. خیلی خلاصه و سریع…

5 سال ago
  • اندروید

چگونه حافظه ی داخلی اندرویدتان را آزاد کنید

اکثر موبایل هایی که سیستم عامل اندروید بر رویشان نصب هست دارای حافظه داخلی محدودی هستند و بعد از مدتی…

6 سال ago
  • توییتر
  • فایرفاکس
  • فیس بوک

مدیریت تمام اکانت های شبکه های اجتماعیتان در یک برنامه

وقتی که فعالانه به زندگی مجازی بپردازید کم کم تعداد سایت های که عضو میشید زیاد خواهد شد مخصوصا سایت…

6 سال ago
  • PHP برنامه نویسی

آموزش PHP – حلقه ها – جلسه هفتم

در ادامه مبحث آموزش PHP امروز به آموزش حلقه ها می رسیم که با ذکر مثال دستوراتن While , for…

6 سال ago
  • بازی

چرا در هنگام بازی در ویندوز دچار مشکل می شوید؟

شاید برای شما پیش آمده باشد که بالاترین کارت گرافیک و قطعات سخت افزاری خوب دیگه ای را داشته باشید…

6 سال ago
  • ویکی پدیا

پربازدیدترین صفحات فارسی در ویکی پدیا ۲۰۱۲

با تمام شدن سال میلاد 2012 آماری از پر بازدید ترین صفحات ویکی پدیا در زبان ها مختلف ارائه شده…

6 سال ago