jquery در طراحی سایت

jquery در طراحی سایت

در این مقاله از سری مقالات آموزشی طراحی سایت یه بررسی jquery  در طراحی سایت می پردازیم .

بی شک یکی از مهم ترین ابزار ها برای طراحی سایت jquery است .

jquery یکی از کتابخانه های قوی و پرکاربرد javascript است .

برای استفاده از این کتابخانه دو راه وجود دارد یا باید از سایت jquery.com فایل jquery را

دانلود کنید و به پروژه اضافه کنید یا این که از CDN آن استفاده کنید .

شعار این کتابخانه این است که کمتر بنویس بیشتر کار کن !!!

این شعار به این معنی است که وقتی بخواهیم در JS یک تابع بنویسیم که یک رویداد را مشخص می کند

دارای مثلا ۱۵ خط برنامه نویسی است همین کار را با jquery می توان با ۴ خط برنامه نویسی انجام داد .

در طراحی سایت هر چه قدر تعداد خط های برنامه نویسی کمتر باشد هم برای سایت بهتر است هم برای طراح آن .

در ادامه این مقاله به بررسی کاربرد های jquery در طراحی سایت می پردازیم .

این کتبخانه به قدری قدرتمند و پرکاربرد است

که هر در سمت کاربر و هم در سمت سرور سایت از آن استفاده می شود .

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

طراحی منوی ریسپانسیو

با استفاده از امکانات و افکت هایی که jquery در اختیار طراحان قرار می دهد

به راحتی می توانند منوهای زیبا و ریسپانسیو طراحی کنند.

که این امر در طراحی سایت بسیار مهم و ضروری است .

چون منو سایت یکی از مهم ترین و اصلی ترین قسمت های سایت است .

طراحی اسلایدشو

با توجه به قابلیت مسیر یابی و  دستکاری در عناصر html  توسط jquery و همچنین افکت هایی که دارا می باشد .

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

طراحی اسلایدشو زیبا بسیار مهم است چون یکی از اولین قسمت هایی که کاربر با آن روبه رو می شود و

او را تحت تاثیر قرار می دهد اسلایدشو است .

طراحی دکمه بازگشت به بالا

بسیاری از سایت ها دارای مطالب زیادی هستند

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

این کار برای کاربر خوشایند نیست .

طراحان سایت با استفاده از jquery می توانند دکمه ای را طراحی کنند

که کاربر به راحتی بتواند در پایین صفجه به ابتئا صفحه انتقال یابد .

این دکمه برای کاربران خیلی دوست داشتنی است .

 

8 نکته برای انتخاب بهترین نام دامنه یا دامین

8 نکته برای انتخاب بهترین نام دامنه یا دامین

امروز در طراحی سایت اسپیناس در خصوص نکات مهم در انتخاب دامنه صحبت خواهیم کرد.

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

 

• تایپ کردن آن آسان باشد : آسان بودن نوشتن دامنه بسیار مهم است.شما نباد از کلمات مخفف در دامنه استفاده کنید چون اینگونه پیدا کردن شما سخت تر است.

 

• دامنه کوتاه باشد:اگر دامنه شما بلند یا پیچیده باشد ریسک از دست دان مشتری ها را بپذیرید. ساده و کوتاه درست است.

 

• استفاده از کلمات کلیدی خوب است : اگر در دامنه خود از کلمات کلیدی استفاده کنید برای شما مفید خواهد بود. اگر فرضا کار شما فروش لوازم ورزشی است sportsale یا … مفید است.

 

• منطقه خودتان را هدف بگیرید : اگر کار شما مثلا یک فروشگاه محلی است استفاده از نام شهر شما در دامنه خوب است.

 

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

 

• دامنه باید آسان در یاد بماند : میلیون ها دامنه در جهان ثبت شده اند و روزانه هزاران عدد به این تعداد اضافه میشود . پس استفاده از دامنه ای که به آسانی در حافظه میماند بسیتر مهم است.

 

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

 

• از اکستنشن مناسب و مرتبط استفاده کنید . در کشور ما .com .ir  و .net محبوب ترین ها هستند. برخی برای این که دامنه مورد نظر را ثبت کنند از اکستنشن های عجیب و غریب استفاده میکنند که چندان مفید نیست . پسوند های عجیب اثر منفی دارد.

 

طراحی سایت اسپیناس

راهنمای قدم به قدم بالا بردن رنک سایت در گوگل ( قسمت هفتم)

راهنمای قدم به قدم بالا بردن رنک سایت در گوگل ( قسمت هفتم)

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

این قسمت هفتم است و قسمت های قبلی را میتوانید در قسمت مقاله های طراحی سایت اسپیناس پیدا کنید.

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

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

 

Title tag ها را بهینه کنید :

 

این تگ ها در واقع عنوان عای محتوا هستند که در موتور های جست و جو نمایش داده میشوند.

دقت کنید که title tag  ها جامع ، منحصربه فرد و و کلمات کلیدی را شامل شود.

Title tag و کلمات کلیدی را زیاد تکرار نکنید.

 

اگر یه وبسایت فروشگاهی دارید فرمول title tag  به این شکل است.

نام محصول |   دسته ی محصول  |  نام برند

استفاده از (-) و   (  |  )  مفید است.

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

 

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

 

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

 

محتوای به هم مرتبط تولید کنید :

 

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

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

 

متن بهتر است داستانی باشد :

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

 

وب سایت های معروف در توسعه طراحی سایت

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

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

یا سایت های تولید کننده ماژول های وب هستند . در این وب سایت ها ماژول های پر کاربرد برای وب سایت طراحی می کنند و در سایت قرار می دهند تا توسعه دهندگان از آن استفاده کنند .

وب سایت w3schools

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

این وب سایت یک وب سایت آموزشی است که در آن تمام زبان های برنامه نویسی تحت وب آموزش داده می شود .

این وب سایت زبان های html , css , javascript , jquery , angular js , sql , php , asp به طور کامل آموزش می دهد .

در این وب سایت توسعه دهندگان مطالب را آموزش می بینند

و در همان جا له صورت انلاین کد را تست می کنند و می توانند آن را ویرایش کنند .

که این قابلیت بسیار مفید است .

وب سایت bootsnip

یکی دیگر از وب سایت های مفید و معروف در توسعه طراحی وب سایت ، سایت bootsnip است .

این وی سایت یک وب سایت تولیید کننده است .

این وب سایت ماژول های پر کاربرد و مفید در طراحی وب سایت را در سایت قرار می دهد

و توسعه دهندگان از این ماژول ها استفاده می کنند .

تمامی این ماژول هایی که در سایت قرار داده می شوند تمامابر پایه bootstrap  نوشته می شود و

کاملا ریسپانسیو هستند . دیگه چه بهتر از این برای طراحان !!!

وب سایت stackoverflow

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

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

و دیگر توسعه دهندگان به این سوال جواب می دهند .

این وب سایت در حال حاضر به قدر معروف و پر بازدید شده

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

 

رویکردهای آینده طراحی سایت

رویکردهای آینده طراحی سایت

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

موارد کلی که میتوان بیان کرد به این شرح است:

1. کاهش استایل های مربوط به hover در طراحی سایت

حتما تعجب کرده اید که چرا این المان باید کم رنگ شود در حالی که در حال حاضر در طراحی سایت از آن زیاد استفاده میشود. ولی آن چه که بررسی های جهانی نشان میدهد این است که کاربران علاقه زیادی به تغییر در المان ها هنگامی که موس روی آن میرود ندارند. جدا از آن ابزار های لمسی مثل موبایل … دیگر امکان hover در آن ها وجود ندارد چون چیزی به عنوان موس برای آن ها تعریف نشده است!

2. کم رنگ شدن jqueryدر طراحی سایت

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

3. مرگ کامل طراحی مجدد برای موبایل

در قدیم برای اینکه در موبایل و گوشی های کوچک سایت به خوبی نمایش داده شود طراحان مجبور بودند سایت را مجدد برای گوشی طراحی کنند ولی با وجود css جدید و یا فریم ورک هایی مثل bootstrap شما این امکان را دارید که هنگام طراحی نسخه کامپیوتر نسخه های دیگر را نیز طراحی کنید بدون هیچ گونه هدر رفت وقت و هزینه مجدد برای طراحی سایت مجدد

4. اهمیت بیشتر تصاویر و چند رسانه ای

در html5 و css3 به بیشترین چیز هایی که توجه شده است المان های متحرک و چند بعدی به اجزا و تصاویر است و این نشان دهنده این موضوع است که ذوند پیش روی طراحی سایت به سمت سایت هایی با زیبایی زیاد و حرکت های انیمیشنی میرود.

5. استفاده کمتر از svg ها

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

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

صنعت در نسل امروز به مست اینترنت و سایت ها در حرکت است و شما خواه و ناخواه مجبور هستید از این تکنولوژِی برای پیشرفت کار خودتان استفاده کنید

با مقالات طراحی سایت اسپیناس همراه باشید تا با تکنولوژی های روز دنیا در طراحی سایت آشنا شوید

افزونه های مفید مرورگر در طراحی سایت

مرورگر های جدید افزونه های مفیدی برای طراحی سایت و طراحان قرار داده اند . مرورگر های chrome  و mozila دو تا از بهترین مرورگر های قدرتمند و مفید برای طراحی وب سایت می باشد .

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

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

افزونه Alexa Traffic Rank

این افزونه توسط وب سایت Alexa تهیه شده برای مرورگر کروم تهیه شده است .

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

از امکانات دیگر این افزونه تست سرع وب سایت و هم چنین وب سایت های مشابه این وب سایت است .

این افزونه برای طراحان وب سایت بسیار مفید است .

افزونه Page Ruler

این افزونه هم برای هر دو مرورگر کروم و موزیلا طراحی شده است . اما افزونه page ruler که برای کروم طراحی شده بسیار قوی تر و راحت  تر است .

با استفاده از این افزونه می توان اندازه عناصر موجود در صفحه را به دست آورد .

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

افزونه Eye Dropper

این افزونه هم برای هر دو مرورگر کروم و موزیلا طراحی شده اما افزونه Eye Dropper که برای موزیلا طراحی شده است قوی تر و راحت تر است .

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

این افزونه رنگ قسمت مرود نظر را گرفته و در دو فرمت هگزا دسیمال و rgb  به کاربر تحویل می هد .

افزونه FireBug

یکی از مهم ترین و کاربردی ترین افزونه ها در طراحی وب سایت که کمک شایانی به طراح می کند ، افزونه firebug است .

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

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

پشتیبانی در طراحی سایت

یکی از مهم ترین مراحل طراحی سایت مرحله پشتیبانی وب سایت است . در این مرحله واحد پشتیبانی سایت به مشکلات و تغییرات جزئی سایت می پردازد .

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

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

سیستم پشتیبانی تلفنی

این سیستم یکی از قدیمی ترین سیستم های پشتیبانی در شرکت های طراحی سایت است .

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

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

در این سیستم به راحتی مشتری با پشتیبان صحبت کرده و مشکلات رفع می شود .

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

سیستم پشتیبانی تیکتینگ

یکی از جدید ترین سیستم های پشتیبانی در طراحی سایت سیستم تیکتینگ است .

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

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

هر زمان که مشتری نیاز به پشتیبانی داشته باشد وارد پنل خود می شود و اقدام به ثبت تیکت می کند .

در زمان ثبت تیکت مشتری واحد مورد نظر خود را انتخاب می کند و هم چنین اولویت آن را هم از نظر ضروری بودن مشخص می کند .

 

ده اشتباه رایج در حوزه طراحی سایت

ده اشتباه رایج در حوزه طراحی سایت

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

طراحی سایت های بسیار ضعیف ، محتوای نا مربوط و کپی شده و… همگی باعث شکست ها و هدر رفتن سرمایه های بسیاری شد.

امروز در طراحی سایت اسپیناس ۱۰ مورد از اشتباهات که راه را برای شکست شما در این راه هموار تر میکنند میپردازیم.

 

• عدم استفاده از وبسایت رسپانسیو :

 

• با رشد استفاده مردم از گوشی های هوشمند ، در حال حاضر حدود ۵۶ ٪ وبگردی ها روی گوشی انجام میگیرد و این امار نشان میدهد که بیشتر با گوشی ها در اینترنت گشت و گذار میکنند تا با کامپیوتر های شخصی

 

• استفاده از قالب های اماده یا سایت ساز ها :

 

• شرکت های زیادی از نرم افزار های (drag and drop )   و طراحی سایت  استفاده میکنند. با این ابزار شما میتوانید در عرض چند دقیقه یک وبسایت زیبا تحویل بگیرید ! خوب مشکل کجاست ؟ وجود هزاران خط کد اضافه ، ارور ها وخطا ها و عملکرد ضعیف سایت به مرور زمان . اگر مشکل بودجه دارید میتوانید از قالب های اماده خریدنی ( قالب های فارسی نشده که توانایی اپدیت مستقیم دارند ) استفاده کنید. البته بهتر است که وبسایت از صفر و برای شما طراحی شود. شرکت های زیادی هستند که این کار را به خوبی انجام میدهند.

 

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

امنیت در وب سایت های وردپرس

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

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

< a href=”https://wordpress.org/” rel=”nofollow”>وردپرس به دلیل open source بودن تامین امنیت آن کمی مشکل تر لز بقیه وب سایت ها است .

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

طراحی سایت وردپرس

طراحی وب سایت وردپرس در تمام دنیا به یک صورت انجام می شود  به این معنی که قالب وردپرس به یک شکل است . به عبارت دیگر تمام وب سایت های وردپرس شامل یک سری فایل های مشابه است مانند wp-admin , wp-content , wp-include این فایل ها در تمامی وب سایت های وردپرس وجود دارد .

این یکی از مهم ترین نقاط ضعف وردپرس است اما نگران نباشید وردپرس چیزی نیست که با این بادها بلرزد !!!

برای هکر ها این یک امتیاز محسوب می شود که یه وب سایت دارای یک سری فایل های مشخص باشد که درون این فایل ها هم open source باشد . چه چیزی بهتر از این !!!

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

تامین امنیت سایت وردپرس

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

افراذ زیادی هستند که از پایین بودن امنیت وب سایت های وردپرس حرف می زنند و چون این وسط یکی دو بار وب سایت ها شون هک شده از این سیستم شکایت می کنند که امنیت خوبی ندارد .

در طراحی سایت ، طراحی سیستم مدیریت محتوا بسیار سخت است و هر سیستم مدیریت محتوایی دارای مشکلات و مزایایی می باشد اما این که بخش مدیریت وب سایتمان را باز بزاریم و رمزمان را ۱۲۳۴۵۶ ست کنیم و کلمه عبور هم admin تعیین کنیم عملا وب سایت مان را به امان خدا سپارده ایم و بعد که هک شد خطا را بر گردن سیستم مدیریت می گذاریم .

در این جا به برخی نکات امنیتی در طراحی وب سایت وردپرس اشاره می کنیم .

۱- از هاست امنی استفاده کنیم . هاست برای وب سایت همچون خانه می ماند هر چه قدر این خانه امن تر و مستحکم تر باشد وب سایت هم در امنیت بیشتری قرار دارد .

۲- از نام کاربری admin استفاده نکنید . تعیین کردن نام کاربری با این نام کاری بسیار اشتباه است .

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

۴- پوشه admin را رمزگذاری کنید . این فایل داری محتوای بسیار مهمی است و رمز گذاری آن خیلی مناسب است .

۵- از تم های رایگان استفاده نکنید .

۶- html را در نظرات غیر فال کنید . این کار باعث جلوگیری از حملات xss می شود .

۷- همه چیز را به روز کنید .

۸- یک نسخه پشتیبان تهیه کنید .

استفاده از bootstrap در طراحی وب سایت

استفاده از bootstrap در طراحی وب سایت

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

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

به عبارت دیگر چگونه می توان یک وب سایت را طراحی کرد که با دستگاه های مختلفی با اندازه های متفاوتی ، کاربران بتوانند به راحتی سایت را بازدید کنند و ظاهر زیبای وب سایت در اندازه های متفاوت به هم نریزد .

در این مقاله به بررسی این چالش و معرفی bootstrap به عنوان یکی از راه حل های آن می پردازیم .

استفاده از  css media query

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

روال کار این روش به این صورت است که تعیین می کنیم در فلان سایز مورد نظر فلان عنصر html این استایل ها را داشته باشد .

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

ریسپانسیو کردن وب سایت با bootstrap

یکی از محبوب ترین و قدرتمند ترین روش ها برای ریسپانسیو کردن طراحی سایت استفاده از فریم ورک bootstrap است . بوت استرپ فریم ورکی قوی برای html , css , javascript است .

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

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

بوت استرپ کل صفحه رو به 12 ستون تقسیم می کند که طراحی می تواند تعیین کند که یک عنصر از چند تا از این ستون ها استفاده کند . همچنین بوت استرپ دارای 4 سایز مختلف است lg , md , sm , xs   طراح به راحتی می تواند تعیین کند که در فلان سایز این عصر چه تعداد از این ستون را به خود اختصاص دهد .

نتیجه گیری

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