بازاریابی اینترنتی در طراحی سایت

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

 

بازاریابی اینترنتی به واسط طراحی سایت

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

 

سئو سایت در بازاریابی اینترنتی

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

بازاریابی اینترنتی در طراحی سایت

سئو طراحی سایت برای مبتدی نونگار

سئو طراحی سایت برای افراد مبتدی شامل عنوانی با مجموعه ای از نکات سئو سایت است که در جهت پروسه بهینه سازی سایت قرار میگیرد. نکات سئو on-apge  و off-page آیتم هایی است که از شروع پروسه سئو سایت تا انتها قرار می گیرد. نکات سئو محتوا ، URL صفحات طراحی وب سایت ، فایل sitemap ، htaccess،  robotst.txtمواردی است که می بایست در پروسه سئو سایت تنظیمات گردند.

 

URL بهینه شده در سئو طراحی سایت

آدرس URL صفحات طراحی سایت در حالت بهینه می بایست تا حد ممکن کوتاه ، دربردارنده کلمات کلیدی و مرتبط با هدف ایجاد صفحه طراحی سایت انتخاب شود. وجود کلمات کلیدی در آدرس URL و به قولی خوانا بودن آدرس URL صفحات طراحی سایت کمکی در جهت رنکینگ صفحاتطراحی وب سایت شما خواهد بود.

 

سئو محتوای طراحی سایت

سئو محتوا می تواند دربردارنده نکات ریز و درشت بسیاری باشد که با لحاظ نمودن آنها می توانید در جهت تقویت رنکینگ طراحی سایت خود و یا همان سئو سایت گام موثری را بردارید.درج کلمات کلیدی در محتوای موجود در صفحات طراحی سایت، استفاده از تگ های H1 H2 H3 H4 و غیره ، درج تگ توضیحات ، لحاظ نمودن کلمات کلیدی در محتوا تمامی فاکتورهایی است که به عنوان سئو محتوا شناخته می شود و اثرگذاری شایانی در بهینه سازی سایت خواهد داشت.

 

لینک دهی داخلی و خارجی در سئو

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

 

سئو طراحی سایت برای مبتدی

آیا برند در سئو طراحی سایت و گوگل اثر دارد نونگار

 

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

 

آیا برندی شرکت ها در رنکینگ گوگل اثر دارد؟

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

 

نرخ کلیک در سئو سایت

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

 

آیا برند در سئو طراحی سایت و گوگل اثر دارد

 

تجربیات بک لینک در سئو طراحی سایت

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

 

خرید لینک و بک لینک در سئو سایت

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

 

خرید لینک به تنهایی در سئو سایت کفی نیست

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

 

تجربیات بک لینک در سئو طراحی سایت

آنالبز وضعیت بک لینک طراحی سایت

آنالیز وضعیت بک لینک طراحی سایت که در پروسه سئو سایت و بهینه سازی سایت کاربرد می یابد می تواند دربردارنده اطلاعاتی از وضعیت بک لینک و لینک های داخلی و خارجی طراحی وب سایت شما باشد که به واسط بسیاری از سایت های آنلاین بک لینک چکر قابل دستیابی است. اطلاعاتی از قبیل تعداد بک لینک ها ، تعداد لینک های فالو ، تعداد لینک نوفالو ، تعداد دامین هایی که بک لینک طراحی سایت ما درج شده است، تعداد لینک های متنی ، تعداد لینک های تصویری و غیره که تمامی به واسط سایت های آنلاین بررسی وضعیت سئو سایت قابل تحلیل می باشد. در ادامه لیستی از طراحی سایت ها که آنالیز وضعیت بک لینک و سئو سایت را به صورت آنلاین در اختیار کاربران قرار می دهند را بیان می نماییم.

 

majestic.com چک بک لینک در سئو سایت

سایت majestic.com تعداد بک لینک ، تعداد لینک های فالو ، تعداد لینک نو فالو ، تعداد دامین ارجاعی ، تعداد ip ارجاعی ، تناسب لینک ها برحسب کلمات کلیدی ، لیستی از سایت هایی که از طراحی سایت ما لینک دارند، معتبرترین صفحات طراحی وب سایت ما و دیگر اطلاعات سودمند را در خصوص بک لینک و سئو سایت ارائه می نماید.

Ahrefs.com در آنالیز وضعیت بک لینک سئو

سایت Ahrefs.com نیز به صورت آنلاین اطلاعات سودمندی را در خصوص وضعیت بک لینک ، تعداد لینک ها ، میزان لینک فالو و نوفالو ، اعتبار دامین طراحی سایت شما ، درصد بک لینک ها بر حسب نوع دامنه و نیز نمایش اطلاعات بک لینک در فرمت نمایش نموداری را فراهم می نماید که دریافت وضعیت بک لینک شما را در سیر زمانی مشخص می نماید که خود کمک شایانی در تحلیل وضعیت سئو سایت و بهینه سازی سایت شما خواهد بود.

SEOMoz / Open Site Explorer در آنالیز بک لینک

سایت Open Site Explorer نیز اطلاعات سودمندی را در خصوص تعداد لینک های داخلی ، تعداد لینک های خارجی ، تعداد بک لینک ها بر حسب نوع کلمه کلیدی طراحی سایت شما، اعتبار دامنه طراحی وب سایت شما ، اعتبار صفحات طراحی سایت شما در ترتیب نزولی و غیره را فراهم می نماید که تمامی در جهت آنالیز وضعیت سئو سایت و بهینه سازی وب سایت شما می باشد.

 

آنالبز وضعیت بک لینک طراحی سایت

اثر کاربرپسند بودن طراحی سایت در سئو

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

 

 

کاربرپسند بودن طراحی سایت

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

 

 

محتوا در سئو طراحی سایت

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

 

دسترس پذیری در بهینه سازی وب سایت

دسترسی آسان کاربر به صفحات طراحی سایت شما در معنای دسترس پذیری طراحی وب سایت معنا می یابد که می تواند کاربر را به صفحه دلخواه خود هدایت نماید و یا حتی موجب شود که کاربر صفحات بیشتری از طراحی سایت شما را مشاهده نماید که در نتیجه میزان bounce rate طراحی سایت شما کاهش می یابد که خود اثرگذاری مثبتی را در سئو سایت و بهینه سازی وب سایت خواهد داشت.

فاکتور اعتبار در سئو طراحی سایت

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

 

سئو درونی صفحات طراحی سایت

سئو درونی صفحات طراحی سایت که با عنوان سئو on-page معنا می یابد می توان در ارتباط با تولید و انتشار محتوا با در نظر گرفتن فاکتورهای سئو سایت و بهینه سازی سایت همراه باشد. انتشار محتوای با کیفیت که با تعداد مناسب حجم کلمات و همچنین با درج کلمات کلیدی طراحی سایت همراه باشد می تواند افزایش اعتبار را به طراحی سایت شما اهدا نماید.

 

بک لینک با کیفیت در سئو سایت

تولید بک لینک با کیفیت که به واسط گرفتن لینک از سایت های معتبر ایجاد خواهد شد می تواند اعتبار را به طراحی سایت شما اهدا نماید. در مقابل تعداد بک لینک ها به کیفیت و اعتبار طراحی سایت هایی که لینک از آنها گرفته می شود توجه نمایید. همچنین در نظر داشته باشید که از سایت هایی با اعتبار منفی و سایت هایی که به کپی نمودن مطالب دیگر سایت ها اقدام می نمایند لینک دریافت نمایید زیرا که اعتبار منفی و سئو منفی نیز به واسط بک لینک بی کیفیت قابل انتقال می باشد.

 

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

شبکه های اجتماعی محل مناسبی برای انتشار محتوا طراحی سایت خواهند بود. علاوه بر هدایت کاربران به سمت طراحی سایت ها موجب اعتبار بخشیدن به طراحی سایت می شود که اثر مثبت را در سئو سایت خواهد داشت.

 

عدم لینک اسپمی

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

 

 

طراحی سایت و چندین موتورجستجوگر در یک پنل

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

 

<script language="JavaScript">

 

function startSearch(){

searchString = document.searchForm.searchText.value;

if(searchString != ""){

searchEngine = document.searchForm.whichEngine.selectedIndex + 1;

finalSearchString = "";

 

if(searchEngine == 1){

finalSearchString = "http://www.altavista.digital.com/cgi-bin/query?pg=q&what=web&fmt=.&q=" + searchString;

}

if(searchEngine == 2){

finalSearchString = "http://av.yahoo.com/bin/query?p=" + searchString + "&hc=0&hs=0";

}

if(searchEngine == 3){

finalSearchString = "http://www.excite.com/search.gw?trace=a&search=" + searchString;

}

if(searchEngine == 4){

finalSearchString = "http://www.hotbot.com/?SW=web&SM=MC&MT=" + searchString + "&DC=10&DE=2&RG=NA&_v=2&act.search.x=89&act.search.y=7";

}

if(searchEngine == 5){

finalSearchString = "http://www.infoseek.com/Titles?qt=" + searchString + "&col=WW&sv=IS&lk=noframes&nh=10";

}

if(searchEngine == 6){

finalSearchString = "http://www.lycos.com/cgi-bin/pursuit?adv=%26adv%3B&cat=lycos&matchmode=and&query=" + searchString + "&x=45&y=11";

}

if(searchEngine == 7){

finalSearchString = "http://netfind.aol.com/search.gw?search=" + searchString + "&c=web&lk=excite_netfind_us&src=1";

}

 

location.href = finalSearchString;

}

}

 

 

// -->

</script>

 

<basefont face="Verdana, Arial, sans-serif">

 

<form name="searchForm">

 

<table width=320 border cellpadding=3 cellspacing=2 bgcolor=444444>

 

<tr>

<td bgcolor=lightblue><font size=1 face="Verdana, Arial, sans-serif">Search for:<br>

<td bgcolor=lightblue><font size=1 face="Verdana, Arial, sans-serif">Search from:

<td bgcolor=lightblue>&nbsp;

 

<tr>

<td bgcolor=navajowhite><input style="background: dddddd" name="searchText" type="text">

<td bgcolor=navajowhite>

<select style="background: dddddd" name="whichEngine">

<option selected>Altavista

<option>Yahoo!

<option>Excite

<option>Hotbot

<option>Infoseek

<option>Lycos

<option>AOL Netfind

</select>

<td bgcolor=navajowhite><input type="button" value="Send" on-Click="startSearch()">

 

</select>

</table>

</form>

به آسانی با درج کد بالا در تگ <body>   در طراحی سایت خود این امکان را برای کاربران سایت خود درج نمایید. همچنین می توانید موتورهای جستجوگر دیگری را نیز مطابق نظر خود به قطعه کد بالا اضافه نمایید.

طراحی سایت و چندین موتورجستجوگر در یک پنل

طراحی سایت و پنل Drop downبا Ajax نونگار

در طراحی سایت می توانید با بهره گیری از زبان های مختلف امکانات متفاوت را در صفحه وب سایت فراهم نماییم. با افزودن قابلیت های جدید می توانید بر زیبایی طراحی سایت خود بیفزایید و موجب جلب نظر کاربران سایت خود شوید که در نتیجه آن در سئو سایت خود تاثیر مثبتی را شاهد خواهید بود. زبان Ajax  یکی از زبان های پرکاربرد در طراحی سایت می باشد. ممکن است شما در صدد باشید با ایجاد پنل  drop downو با بهره گیری از زبان  Ajaxقابلیت زیبایی را در طراحی وب سایت خود لحاظ نمایید. با کلیک بر روی پنل می توانید پیغام پنهانی را به کاربران وب سایت خود نمایش دهید. در اینجا قصد داریم کد لازم برای ایجاد این قابلیت در طراحی سایت را به نمایش بگذاریم.

<script type="text/j-avascript" src="/demo/jquery-1.2.2.pack.js"></script>

 

<style type="text/css">

 

#dropdownpanel{ /*Outermost Panel DIV*/

position: absolute;

width: 100%;

left: 0;

top: 0;

visibility:hidden;

}

 

#dropdownpanel .contentdiv{ /*Div containing Ajax content*/

background: black;

color: white;

padding: 10px;

}

 

#dropdownpanel .control{ /*Div containing panel button*/

border-top: 5px solid black;

color: white;

font-weight: bold;

text-align: center;

background: transparent url("panel.gif") center center no-repeat; /*change panel.gif to your own if desired*/

padding-bottom: 3px; /* 21px + 3px should equal height of "panel.gif" */

height: 21px; /* 21px + 3 px should equal height of "panel.gif" */

line-height: 21px; /* 21px + 3px should equal height of "panel.gif" */

}

 

</style>

 

<script type="text/j-avascript" src="/demo/jkpanel.js">

 

/***********************************************

* Drop Down Panel script- by JavaScript Kit (www.javascriptkit.com)

* This notice must stay intact for usage

* Visit JavaScript Kit at http://www.javascriptkit.com/ for this script and 100s more

***********************************************/

 

</script>

 

 

با آسانی با درج کدهای بالا می توانید قابلیت پنل پنهانی را در طراحی سایت خود درج نمایید و با جلب توجه خاص کاربر به طراحی وب سایت خود در سئو وب سایت خود تاثیر مثبتی را برجا گذاشته باشید.

طراحی سایت و پنل Drop downبا Ajax

طراحی سایت وایجاد فرم با قابلیت Pop up

ممکن است شما در طراحی سایت خود ملزم به درج فرمی برای گرفتن اطلاعاتی از کاربران باشید. این فرم ها می توانند با قابلیت ها و ایفکت های زیبا در طراحی وب سایت شما پیاده سازی شوند. فرض نمایید شما قصد دارید با کلید کاربر بر روی فیلد خاص اطلاعاتی را به صورت Pop up به نمایش بگذارید و موجب هدایت کاربر در درج اطلاعات شوید. اگر کاربر در صفحه سایت ما احساس سردرگمی کند دیگر تمایلی به رجوع دوباره نخواهد داشت که این روند تاثیر منفی در سئو سایت خواهد داشت. بدین منظور می توانید از زبان های html و css در صفحه طراحی سایت مورد نظر بهره گیرری نمایید. در اینجا نمونه ای از درج این کد در طراحی وب سایت را به نمایش می گذاریم. کد css زیر را در تگ head  صفحه طراحی سایت خود درج نمایید.

<style>

form div.dynamiclabel{ /* div container for each form field with pop up label */

  display: block;

  margin: 30px;

  font: 16px;

  position: relative;

}

 

form div.dynamiclabel input[type="text"], form div.dynamiclabel textarea{

  width: 320px;

  padding: 10px;

  border: 1px solid #c3c3c3;

  border-radius: 7px;

}

 

form div.dynamiclabel textarea{

  height: 200px;

}

 

 

form div.dynamiclabel label{ /* pop up label style */

  position: absolute;

  left: 0;

  background: lightyellow;

  border: 1px solid yellow;

  border-radius: 2px;

  padding: 3px 10px;

  box-shadow: 4px 1px 5px gray;

  font-weight: bold;

  -webkit-backface-visibility: hidden;

  top: 10px; /* initial top position of label relative to dynamiclabel container */

  -moz-transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);

  -webkit-transition: all 0.4s ease-in-out; /* Safari doesn't seem to support cubic-bezier values beyond 0 to 1, so use keyword value instead */

  -o-transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);

  transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);

  opacity: 0;

  z-index: -1;

}

 

 

form div.dynamiclabel > *:focus{ /* when user focuses on child element inside div.dynamiclabel */

  border: 1px solid #45bcd2;

  box-shadow: 0 0 8px 2px #98d865;

}

 

 

form div.dynamiclabel > *:focus + label{ /* label style when user focuses on child element inside div.dynamiclabel */

  opacity: 1;

  z-index:100;

  top: -35px; /* Post top position of label on focus relative to dynamiclabel container */

  -ms-transform: rotate(-3deg);

  -moz-transform: rotate(-3deg);

  -webkit-transform: rotate(-3deg);

  transform: rotate(-3deg);

}

 

</style>

 

 

و حال کد html زیر را در بخشی از صفحه وب سایت و در تگ <body> که در صدد درج فرم هستید درج نمایید.

<form>

  <div class="dynamiclabel">

    <input id="name" placeholder="Name" type="text">

    <label for="name">Name</label>

  </div>

 

  <div class="dynamiclabel">

    <input id="email" placeholder="Email Address" type="text">

    <label for="email">Email Address</label>

  </div>

 

  <div class="dynamiclabel">

    <textarea id="feedback" placeholder="Feedback"></textarea>

    <label for="feedback">Feedback</label>

  </div>

</form>

به آسانی با درج کدهای بالا فرم زیبایی را درصفحه طراحی سایت خود ایجاد نمایید و موجب جلب نظر کاربران شوید.

 

طراحی سایت وایجاد فرم با قابلیت Pop up