نماهای گرافیکی سایت اولین نقطه قابل توجه در طراحی سایت می باشد. فراهم نمودن تصاویر گرافیکی زیبا در صفحه وب سایت موجب جلب توجه کاربر خواهد شد که به دنبال آن ترافیک را به سمت وب سایت ما روانه خواهد نمود که ادامه این روند در سئو سایت ما تاثیرگذار خواهد بود. می توانید تصاویر موجود در صفحه را با تغییراتی در کدهای طراحی سایت آن، در هنگام قرارگیری موس بر روی آن در فرمت دیگر به نمایش بگذاریم برای مثال با قرار گیری موس بر روی آن شفافیت عکس تغییر نماید. این امکان با تغییر در کدهای طراحی وب سایت صفحه امکان پذیر می باشد. در زبان css3 خصیصه opacityاین امکان را در طراحی سایت شما فراهم می نماید. همچنین در قابلیت جذاب تر می توانید فیلترهای مختلف بر روی عکس خود فراهم نمایید. در زیر مثالی از بکارگیری این کد در صفحه طراحی سایت شما درج شده است.
img {
opacity: 0.4;
filter: alpha(opacity=40); /* For IE8 and earlier */
حال می خواهیم با قرارگیری موس بر روس عکس شفافیت عکس و یا همان opacity عکس تغییر کند. بدین منظور کدهای زیر را در طراحی سایت برای تصاویر انتخاب می نماییم.
img {
opacity: 0.4;
filter: alpha(opacity=40); /* For IE8 and earlier */
}
img:hover {
opacity: 1.0;
filter: alpha(opacity=100); /* For IE8 and earlier */
به اسانی با درج کدهای بالا و استفاده از خصیصه opacity جذابیت خاص تری را به عکس های موجود در طراحی سایت خود ببخشید و با جلب توجه و نظر کاربر در سئو وب سایت خود گام موثری را ایفا نمایید.
منبع: طراحی سایت
