آموزش طراحی سایت و سئو سایت

آموزش طراحی سایت و سئو سایت

آموزش طراحی سایت و سئو سایت

آموزش طراحی سایت و سئو سایت

  • ۰
  • ۰


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

 

<!DOCTYPE html>

<html>

<head>

<script>

function loadXMLDoc()

{

var xmlhttp;

if (window.XMLHttpRequest)

  {// code for IE7+, Firefox, Chrome, Opera, Safari

  xmlhttp=new XMLHttpRequest();

  }

else

  {// code for IE6, IE5

  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

  }

xmlhttp.on-readystatechange=function()

  {

  if (xmlhttp.readyState==4 && xmlhttp.status==200)

    {

    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

    }

  }

xmlhttp.open("GET","ajax_info.txt",true);

xmlhttp.send();

}

</script>

</head>

<body>

 

<div id="myDiv"><h2>Let AJAX change this text</h2></div>

<button type="button" on-click="loadXMLDoc()">Change Content</button>

 

</body>

</html>

 

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

 

 

AJAX در طراحی وب سایت

  • الهام صدر
  • ۰
  • ۰

فرم در طراحی سایت



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

 

<form>

<input type="radio" name="sex" value="male" checked>Male

<br>

<input type="radio" name="sex" value="female">Female

</form

در نمونه  form فرم بالا از دو نوع female و  male  از نوع type=”radio” می باشد که در صورت بین دو گزینه می بایست تنها یکی را انتخاب نماید. Type=”submit”موجب نمایش گزینه ای برای ارسال اطلاعات دورن فرم خواهد شد. در فرم متد می تواند نوع ارسال را تعیین نماید که از دو فرمت get  و post می تواند باشد.

 

<form action="action_page.php" method="GET">

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

action_page.php?firstname=Mickey&lastname=Mouse

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

<form action="action_page.php">

First name:<br>

<input type="text" value="Mickey">

<br>

Last name:<br>

<input type="text" name="lastname" value="Mouse">

<br><br>

<input type="submit" value="Submit">

</form

در کد بالا کاربر نام و نام خانوادگی خود را در فرم درج می نماید و سپس به واسط submit ارسال می نماید. type="text" امکان نوشتن نام و نام خانودگی را برای کاربر طراحی سایت شما فراهم می آورد. فرم ها در واقع ارسال کننده داده و اطلاعات از کاربر به سمت صاحب طراحی سایت خواهد شد.

 

 

فرم در طراحی سایت

  • الهام صدر
  • ۰
  • ۰

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


<!-- Write your comments here -->


همانطور که مشاهده می نمایید کامنت comments با این علامت <!-- آغاز شده است و در انتها نیز --> را دررج می نمایید و در این میان پیام خود را منظور می گردانیم تا کدنویسی صفحه طراحی سایت ما برای افرادی که قصد ادیت در کدنویسی را داشته باشند به راحتی این امر را به انجام رسانند.

 

کامنت شرطی در طراحی سایت


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


<!--[if IE 8]>
.... some HTML here ....
<![endif]-->


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

 

 

کامنت گذاشتن در طراحی سایت

 

 

  • الهام صدر
  • ۰
  • ۰

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

 

div.ex1 {
    width: 500px;
    margin: auto;
    border: 3px solid #8AC007;
}

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

div.ex2 {
    max-width: 500px;
    margin: auto;
    border: 3px solid #8AC007;
}

 

در کد بالا div تعیین شده پهنا ثابتی ندارد اما در عین حال پهنای بخش مورد نظر از 500 پیکسل ببیشتر نخواهد شد.

 

 

Max-heigth در طراحی سایت

 

Max-heigth نیز مشابه Max-width خواهد بود اما این تغییر اندازه را در ارتفاع دارد. در این صورت صفحه طراحی سایت شما در بخش تعیین شده ارتفاعش از حدی بیشتر نخواهد شد. متغییر بودن div در ارتفاع و پهنا می تواند موجب نمایش حرفه ای تر از طراحی سایت شما شود که خود موجب جلب توجه و نظر کاربر خواهد شد که در نتیجه سئو سایت و بهینه سازی سایت را مورد تاثیر خود قرار می دهد.

 

div.ex2 {
    max-height: 500px;
    margin: auto;
    border: 3px solid #8AC007;
}

 

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

 

 

Max-widthو Max-heigth در طراحی سایت

 

 

  • الهام صدر