پرداخت
سبد خرید : 0
پشتيباني : 09389373085
امروز سه شنبه ۱۶ آذر ۱۳۹۵
تخفیف های روزانه تا 50% فقط با عضویت در کانال تلگرام سایت ! ورود به کانال x

آموزش HTML5 – جلسه اول - قالب خبری وردپرس | تابناک وب

منتشره شده در بهمن ۲۵, ۱۳۹۳
آموزش HTML5 – جلسه اول

با عرض سلام خدمت شما کاربران گرامی تابناك وب

امروز با افتخار اعلام می داریم که بروز ترین آموزش زبان برنامه نویسی HTML5 رو براتون آموزش میدیم که از اول HTML5 رو یاد خواهیم داد و یاد خواهید گرفت که بر اساس آخرین استاندارد های وب جهانی و وب سایت w3schools هست.

خب اول آموزش بگم اگه قدم به قدم با ما پیش برید به خوبی HTML را یاد خواهید گرفت و بعد از آن به سراغ زبان های دیگر خواهیم رفت. 

شما با HTML می توانید وب سایت خودتان را بسازید با سلیقه و مطالب خودتان!

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

  • HTML مخفف شده ی کلمات Hyper Text Markup Language
  • زبان برنامه نویسی HTML شامل تگ ها می باشد که هر تگ خصوصیات مخصوص خود را دارد و کار خاصی می کند.

خب سریع میریم سراغ آموزش اولین جلسه و اولین مثال همراه با توضیحات:

[php]
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>

<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>

</html>

[/php]

 

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

تمام محتویات و کدهای زبان برنامه نویسی HTML باید بین دو تگ <html></html> قرار داده شود.

اطلاعات صفحه وب و برخی المان های دیگر باید بین دو تگ <head></head> قرار بگیرد که محتویات این تگ در معمولا در حالت عادی به جز عنوان صفحه به کاربر نمایش داده نمی شود.

حتما بخوانید   چگونه شناسه عددی فیسبوک رو دریافت کنم ؟

عنوان صفحه وب ما بین دو تگ <title></title> قرار میگرد که خود ایت تگ نیز در داخل تگ <head></head> قرار می گیرد(به مثال توجه شود).

تمام محتویات صفحه بین دو تگ <body></body> قرار میگیرد.

برای نمایش هدینگ یا همان عنوان ها از تگ <h1></h1> که معمولا تا عدد ۶ استفاده می شود. برای مثال <h3></h3> که متناسب با عددشان بزرگ هستند که ۱ بزرگترین و ۶ کوچکترین هست.

هم چنین برای نمایش بند ها و پاراگراف ها از تگ <p></p> استفاده می شود.

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

ساختار تگ های HTML

ساختار تگ های HTML به صورت زیر هست:

[code lang=”js”]<span class="crayon-o"><</span><span class="crayon-v">tagname</span><span class="crayon-o">></span><span class="crayon-v">content</span><span class="crayon-o"><</span><span class="crayon-o">/</span><span class="crayon-v">tagname</span><span class="crayon-o">></span>[/code]

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

خب کمی هم به مرورگرها اشاره میکنیم. مرورگرهای وب مانند گوگل کروم – فایرفاکس – سافاری و اینترنت اکسپلورر نخست کدهارو میخونن و سپس به کاربر نمایش میدن. اما همانطور که شما تجربه کرده اید مرور تگ ها رو نشون نمیده و محتوای تگ ها رو بر اساس همون تگ و خاصیت هایی که برنامه نویس در طراحی اون سایت بهش اختصاص داده نشون میده.

حتما بخوانید   اشتباهات رایج در طراحی وب سایت

یه نکته هم اینکه مرورگر محتویات و کدهای داخل تگ <body></body> رو به کاربر نمایش میده و معمولا تگ <head></head> برای خرده کاری های سئو و فراخوانی فایل های دیگه و اطلاعاتی که معمولا برای منابع دیگه آماده شده است رو شامل میشه به بیان دیگر و ساده تر محتویات تگ هد بیشتر در کدنویسی و موتورهای جستجوگر و ارتباط وب سایت با شبکه های اجتماعی و… به کارگرفته میشه و زیاد به کاربر مربوط نمیشه گرچه کاربر اون اطلاعات رو دریافت میکنه.

تگ <!DOCTYPE>

این تگ برای معرفی نوع زبان برنامه نویسی یا بهتره بگم ورژن HTML کدنویسی شده است. HTML نیز مانند هر زبان دیگر یا نرم افزار نسخه ها و ورژن های متفاوتی داره که آخرینش تاکنون ۵ هست که به شما آموزش میدیم!

اما چند نوع از این تگ رو ببینید:

[php]
<!DOCTYPE html>

<!DOCTYPE HTML>

<!doctype html>

<!Doctype Html>

[/php]

خب مثل من برای شما هم سوال شد که اینا چه تفاوتی با هم دارن؟! یادتون هست که چند سطر بالاتر گفتم HTML ورژن های متفاوتی داره؟! خب یه چند تا مثال میزنم:

HTML5

 

[php]

<!DOCTYPE html>
[/php]

 

HTML 4.01



دیدگاه کاربران ۰
  • نظرات شما پس از بررسي و تاييد نمايش داده مي شود.
  • لطفا نظرات خود را فقط در مورد مطلب بالا ارسال کنيد.

css.php