طراحی سایت و سئو در مشهد| طراحی سایت و سئو | آموزش سئو | سئو در مشهد |طراحی اپلیکیشن | طراحی اپلیکیشن موبایل | طراحی سایت | تجارت الکترونیک | بازاریابی شبکه ای | شبکه های اجتماعی | آموزش بوت استرپ |آموزش html| آموزش css|آموزش jquery| آموزش php |اندوروید | طراحی گیم | طراحی سایت |

جلسه اول فریم ورک Bootstrap

فریم ورک چیست؟

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



مزیت استفاده از فریم ورک

  1. یکسری کد از قبل آماده است که طراح از آنها استفاده می کند در نتیجه سرعت طراحی قالب افزایش می یابد.
  2.  اکثر فریم ورک ها با مرورگرهای معروف مانند ie , Chrome , Mozilla سازگار هستند و در تمام آنها به یک شکل هستند و به هم ریخته نیستند.
  3.  اکثر فریم ورک ها قابلیت رسپانسیو بودن را دارند یعنی به شما امکان رسپانسیو کردن قالبی که آن را طراحی می کنید را می دهد و این مزیت با توجه به دیوایس های در حال گسترش، رسپانسیو بودن اهمیت پیدا می کند.
  4.  قائدتا یکسری کدهای استاندارد از قبل آماده هست که قالب ظاهری استاندارد پیدا می کند ، از میان تمام فریم ورک ها، فریم ورک bootstrap بسیار معروف است و بسیار مورد استفاده برنامه نویسان قرار می گیرد و دلیل آن جلوه و ظاهر بهتر آن و امکان بیشتری را در اختیار طراح قرار می دهد، یادگیری آن سخت نیست و راحت می توان آن را آموخت و سایر مزیت هایی که دارد bootstrap را از سایر فریم ورک ها مبرا می کند.

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

 کتابخانه bootstrap کجاست؟

    به سایت بوت استرپ مراجعه کنید و فایل bootstrap را از آن دانلود کنید، که شامل سه فولدر css , js , font می باشد . که باید bootstrap.min.css از فایل css و bootstrap.min.js از فایل js را به پروژه متصل کنید.

  نمونه ای از کد bootstrap

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
</head >
<body>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>

</body>
</html>

 توضیحات:

   فایل های script را معمولا در قسمت head صفحه html قرار می دهند اما بهتر است که در قسمت body گذاشته شوند زیرا هنگامی که در head بگذاریم ابتدا کدهای اسکریپت را اجرا می کند و بعد صفحه به نمایش در می آید، اما اگر در قسمت پایین body نوشته شود ابتدا صفحه را اجرا می کند و بعد استیکرها را به سمت کاربر می فرستد.
در واقع لود کلی صفحه تغییر نمی کند فقط اون لحظه ای که قالب را به کاربر نشان داده می شود متفاوت است. ابتدا اسکریپت Jquery را به صفحه اضافه کنید و بعد از آن Jquery بوت استرپ را اضافه کنید.


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


نام
تلفن
ایمیل


مطالب پیشنهادی

مشهد، احمد آباد، ابتدای ملاصدرا،ساختمان صدرا

09150021672

Hiva Afarinesh Copyright © 2016