آموزش تگ کانوس (canvas) – قسمت چهارم (پایانی)

مشاوره رایگان

برای مشاوره در زمینه
سایت و سئو
با ما تماس بگیرید.

شبکه های اجتماعی ما
دوره سئو مقدماتی

یک دوره مقدماتی و رایگان سئو که بسیار پربار و سرشار از تجربه مدرس و با کیفیت بالا تهیه شده تا بتوانید در زمان کمتری وب سایت را سئو کنید.

879 نفر
3 دقیقه
گروه آموزش طراحی سایت
بروزرسانی در: اسفند 15, 1392

فهرست مطالب

عکسها در کانواس canvas images

برای اضافه کردن یک عکس در عامل کانواس باید از متد زیر پیروی کندی.

Drw Image (image. x.y)

مثال زیر نحوه درج یک عکس در عامل کانواس را نشان میدهد.

[html]</p>
<p dir="RTL" align="right">var c= document . get Elememt by ID( "my canvas");</p>
<p dir="RTL" align="right">Var   ctm= c.get contemt("2d");</p>
<p dir="RTL" align="right">Var   img = document. Get Element by ID ("scream") ,</p>
<p dir="RTL" align="right">Ctm. Draw Image ( img. 10/ 10);</p>
<p dir="RTL" align="right">[/html]

توضیحات:

خط شماره 3 شی ء img  را تگی با خصوصیت  id= scream  ایجاد خواهد کرد.

و در نهایت در خط شماره 4 شی ء img  را در کانواس ایجاد می کند.

جایگزین متن و عکس temt image Replxce. Ment موتورهای جستجو اصولا مطالب متنی را در اینترنت جستجو می کنند و نمی توانند موضوع و محتوای یک عکس را درک کنند. برای همین اکثر طراحان وب سعی بر استفاده متون کلیدی در متن صفحات وب دارند.

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

خب تا اینجا فهمیدیم که باید متنهایی کلیدی و اصلی را در تگ <h1> قرار دهیم. حال اگر بخواهیم به جای متن “طراحی وب سایت ادینرم” در تگ <h1>  یک عکس گرافیکی را به جای این متن قرار دهیم کلیه خدمات اصولا موتورهای جستجو برای سایتمان را از دست خواهیم داد، چون اصلا موتورهای جستجو محتوای یک عکس را متوجه نمی شوند و نمی توانند تشخصی دهند که این عکس دارای چه مبتنی است. خب پس اگر بخواهیم از این عکس گرافیکی بعنوان سربرگ استفاده کنیم و خدمات موتورهای جستجو را نیز هماره داشته باشیم راه حل چیست؟

راه حل  temt image Replace ment است.

عکس مورد نظر خود را به عنوان پس زمینه تگ <h1> یا هر تگ مورد نظر تعیین کرده و سپس متن درون تگ را از کادر کاملا خارج کرده تا دیده نشود.

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

به جای درج عکس توسط تگ img  از کد  زیر استفاده می کنیم.

[html]</p>
<p dir="RTL"></h1> طراحی وب سایت ادینرم  <  h1   class= " logo" > html</p>
<p dir="RTL" align="right">CSS</p>
<p dir="RTL" align="right">. Logo{</p>
<p dir="RTL" align="right">Temt – indent : – 999 px;</p>
<p dir="RTL" align="right">Width: 100 px ;</p>
<p dir="RTL" align="right">Height: 100px ;</p>
<p dir="RTL" align="right">  no-repeat # FFF;("آدرس عکس" ) Dackground : url</p>
}

[/html]

به این صفحه رتبه دهید
بدون دیدگاه
انتشار: فروردین 7, 1393
طراحی سایت خود را به ما بسپارید!
همین حالا برای مشاوره رایگان اقدام کنید.
طراحی سایت خود را به ما بسپارید!
همین حالا برای مشاوره رایگان اقدام کنید.
گروه آموزش طراحی سایت

دیدگاه ها بسته شده اند.

آیا نیازمند راهنمایی هستید؟
همین حالا برای مشاوره رایگان اقدام کنید
با پر کردن فرم، یک قدم به رشد آنلاین نزدیک‌تر شوید!
فرم درخواست مشاوره

برای راحتی شما عزیزان می‌توانید اطلاعات خود را در کادر زیر وارد کنید تا کارشناسان ما با شما تماس بگیرند

مشاوره رایگان
پیمایش به بالا