کد اطلاعات شما
Male
Female
Hello
Male
Female
Hello
Male
Female
Hello
آموزش html جلسه دوم
با ادامه آموزش اچ تی ام خود در افشار تمر با شماییم.
عنوان صفحه و اسکریپت ها و استایل ها و متاتگ ها و بیس از استاندارد ترین کد های این بخش هستند
پیش از شروع آموزش بگم که استاندارد ترین کد هایی که باید داخل بخش head استفاده بشه اینها هستند :
title، style، meta، link، script ، base
+++++++++++ عنوان صفحه +++++++++++
حتما
وقتی وبی رو باز میکنید توی قسمت بالای مرورگر دیدید که قبل لود سایت متن
هایی میاد که این متن ها نشون دهنده عنوان سایت یا عنوان مطلب مربوطه هست.برای نمایش عنوان در مروگر باید از تگ تایتل <title> استفاده کنیم و در داخل این تگ هر چیزی رو بنویسیم به عنوان ، عنوان صفحه در مرورگر نشون میده
<title>متن عنوان صفحه</title>
سئو: در سئو عنوان صفحه
مهم ترین قسمت هست که در ایندکس تاثیر زیادی داری و پس از عنوان مطالبتون
با استفاده از خط تیره - به ادامه عنوان مطالبتون تو گوگل اضافه میشه
پس
عنوان وب خود رو کاربردی بزنید مثلا افشار تمر در نوع خود کلمه بی مفهومی
هست ولی اگر قبل آن (تم و قالب) اضافه شود در نمایش جستجو وب های تفریحی
تو گوگل دارای امتیاز ویژه خواهید شد.
+++++++++++ متاتگ ها +++++++++++
از متاتگ ها برای دادن اطلاعاتی از صفحه سایت به موتور های جستجو و مرورگرهای وب استفاده میکنند
برای درج متاتگ ما از تگ meta که خود بسته می شود (<meta></meta>)استفاده میکنیم .
سئو: در سئو خود بسته شدن متاتگ بسیار مهم بوده و برای جلوگیری از بروز خطا در سیستم وایلد اهمیت دارد
ما در متاتگ میتوانیم از چندین صفت استفاده کنیم :
name : با این صفت میتونیم نوع داده رو تعیین کنیم مثلا بگیم این متاتگ شامل کلمات کلیدی(Keywords) یا توضیحات صفحه(Description) یا ... که هر کدوم رو باید به انگلیسی بنویسیم هست!
http-equiv : اینم عین دستور بالاست فقط فرقش اینه که تو صفت بالا خودمون میتونیم از متغییر های دلخواه مثل Designer استفاده کنیم ولی در این صفت باید از متغییر های تعیین شده استفده کنیم.
content : از این صفت پس از استفاده از یکی از دو صفت بالا استفاده میکنیم که شامل محتویات متغییر تعیین شده هست.
charset : این صفت هم همونطور که تو بخش 1 با encoding آشنا شدید وظیفه اون رو داره و باعث میشه مرورگر ها زبان فارسی رو بخونن و باید در هر صفحه ای قبل از همه متاتگ ها وجود داشته باشه.
base این تگ که معمولا خیلی از چشم افتاده و استفاده نمیشه کاربردش اینه که برای تمام لینک هاتون یه هدف میده مثلا شما تو تگ بیس ادرستون رو http://afshar-themer.blog.ir تعیین کنید هر لینکی تو صفحتون تعیین کنید بدون http باشه قبل اون لینک عبارتی که تعیین کردیم رو اضافه میکنه
name : با این صفت میتونیم نوع داده رو تعیین کنیم مثلا بگیم این متاتگ شامل کلمات کلیدی(Keywords) یا توضیحات صفحه(Description) یا ... که هر کدوم رو باید به انگلیسی بنویسیم هست!
http-equiv : اینم عین دستور بالاست فقط فرقش اینه که تو صفت بالا خودمون میتونیم از متغییر های دلخواه مثل Designer استفاده کنیم ولی در این صفت باید از متغییر های تعیین شده استفده کنیم.
content : از این صفت پس از استفاده از یکی از دو صفت بالا استفاده میکنیم که شامل محتویات متغییر تعیین شده هست.
charset : این صفت هم همونطور که تو بخش 1 با encoding آشنا شدید وظیفه اون رو داره و باعث میشه مرورگر ها زبان فارسی رو بخونن و باید در هر صفحه ای قبل از همه متاتگ ها وجود داشته باشه.
base این تگ که معمولا خیلی از چشم افتاده و استفاده نمیشه کاربردش اینه که برای تمام لینک هاتون یه هدف میده مثلا شما تو تگ بیس ادرستون رو http://afshar-themer.blog.ir تعیین کنید هر لینکی تو صفحتون تعیین کنید بدون http باشه قبل اون لینک عبارتی که تعیین کردیم رو اضافه میکنه
مثلا میشه باهاش عکس گذاشت و ... .
ما از صفت های زیر میتونیم داخل این تگ استفاده کنیم:
href : ادرس لینک پیش فرض برای اضافه کردن به ابتدای لینک های صفحه
target : نحوه باز شدن لینک هایی که هدف مند می شوند را نشان میدهد.
<base href="http://afshar-themer.blog.ir/images/" target="_blank">
<base href="http://afshar-themer.blog.ir/images/" target="_blank">
link از این تگ برای برقراری ارتباط بین دنیای html با دیگر زبان ها از جمله css و txt استفاده می شود
که متداول ترین استفاده ان برای استایل شیت(css)یا(stylesheet) و فایکون (ایکون کنار عنوان سایت در مرورگر)یا(favicon) می باشد .
<"link rel="stylesheet" type="text/css" href="style.css">
<"link rel="shortcut icon" href="favicon.ico">
<"link rel="stylesheet" type="text/css" href="style.css">
<"link rel="shortcut icon" href="favicon.ico">
style از این تگ برای فراخوانی استایل شیت به صورت داخلی استفاده میشه یعنی
این که به جای این که کدهای css خودمون رو تو یه فایل style.css با تگ
link فراخوانی کنیم از تگ style استفاده میکنیم و کدهای css خودمون رو توش
مینویسم.
سئو: در اصل سئو و رفع خطای قالب توصیه شده از این تگ استفاده نکنیم یا کم تر استفاده کنیم .
<style/>کدهای مربوط به زبان سی اس اس<style>
پس بهتر از به جای این کار سی اس اس را در یک سایت مانند persiangig.com آپلود کرده و لینک آن را به صورت کد زیر در تگ <head> قرار دهیم
<"link rel="stylesheet" type="text/css" href="YOURLINK.css">
<style/>کدهای مربوط به زبان سی اس اس<style>
پس بهتر از به جای این کار سی اس اس را در یک سایت مانند persiangig.com آپلود کرده و لینک آن را به صورت کد زیر در تگ <head> قرار دهیم
<"link rel="stylesheet" type="text/css" href="YOURLINK.css">
script از این تگ برای ارتباط بین زبان html و JavaScript به دو روش مختلف استفاده میکنیم.
روش اول مسابه خاصیت link هست که فایل جاوا اسکریپتمون رو به وسیه کد زیر از یک لینک فراخوانی میکنیم
<script type="text/javascript" src="script.js"></script>
روش دوم هم مثل خاصیت style هست که تگ script رو مینویسیم و توش کدهای جاوا اسکریپتمون رو قرار میدیم
<script/>کدهای مربوط به زبان جاوا اسکریپت<script>
<script type="text/javascript" src="script.js"></script>
روش دوم هم مثل خاصیت style هست که تگ script رو مینویسیم و توش کدهای جاوا اسکریپتمون رو قرار میدیم
<script/>کدهای مربوط به زبان جاوا اسکریپت<script>
اگر مشکلی ، نظری یا هر حرفی دارید خوشحال میشیم تو نظرات بیان کنید
نظرات شماست که باعث پایداری سایت افشار تمر است.
نام مجازی