چگونه یک وب سایت جذاب داشته باشیم

تست کردن تجربه کاربری در طراحی سایت جذاب

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

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

استفاده از فضای Whitespace

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

تاثیر فونت روی طراحی سایت جذاب

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

استفاده از سایه های CSS3

برای ارتقاء طرح باید دو ویژگی متفاوت را مد نظر قرار دهید. Box-shadow برای ساخت div و Box محبوبیت زیادی دارد. وقتی از این افکت ها برای container, wrapper یا box که در صفحه های داخلی هستند استفاده می کنید باعث ایجاد طرح های سه بعدی می شوید که جذابیت آن ها را بیشتر می کند.

روش دیگر استفاده از CSS3 text-shadow است، جالب است بدانید کمپانی اپل جزء نفرات اولی بود که از این ویژگی در طرح ها بهره می برد. وقتی این قابلیت را به متن اضافه می کنید می توانید رنگ فونت جالبی طراحی کنید. (برای مثال استفاده از سایه سیاه در متن سفید یا استفاده از سایه ی روشن برای متن مشکی)

استفاده از Texture ها و قالب های تکرار شونده

اگر به طراحی اکثر سایت ها نگاهی بیاندازید متوجه می شوید که اکثرا فقط از طرح رنگی استفاده کرده اند، برای اینکه شما در نظر مخاطب متفاوت به نظر برسید باید از قابلیت ویژه ای مثل اضافه کردن texture به پس زمینه استفاده کنید. برای این ایده راهکاری کاربردی در وب وجود دارد که رایگان است. با بهره گرفتن از برنامه Noise Texture Generator علاوه بر جذاب تر شدن فضای وبسایت همچنین روی تمامی مرورگر ها قابل اجرا خواهد بود.

استفاده از این برنامه کاملا راحت است شما می توانید رنگ پس زمینه و مقدار دلخواه نویز را انتخاب کنید سپس برنامه یک کاشی پویا برای پس زمینه وب سایت شما درست می ک��د که می توانید از آن استفاده کنید همچنین اگر می خواهید الگو ها و ساختاری مختلف را ببینید بهتر است به subtle pattern نگاهی بی اندازید.

استفاده از CSS3 Gradient

الان که صبحت از پس زمینه شد بهتر است CSS3 gradiant را هم مطرح کنیم. کار با این ویژگی به قدری آسان است که حتی می توانید از Adobe Photoshop هم استفاده نکنید. زمانی که از gradiant خود را می سازید میتوانید آن را در تمام قسمت های صفحه استفاده کنید مثل بدنه، Menu، Footer و هر قسمتی که نیاز به این شیب رنگ داشته باشد.

استفاده از Bootstrap

Bootstrap بیشتر شبیه یک چارچوب و قالب برای توسعه دهندگان وب محسوب می شود که از Button، Link، ستون ها و هزاران قالب از پیش تعیین شده تشکیل شده است. بیشتر استفاده ای که بوت استرپ دارد در صفحه های فرود یک سایت است.

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

استفاده از HTML5 kichstart برای داشتن سایتی جذاب

نام HTML5 kichstart برای اکثر توسعه دهندگان آشنا است. یک کتابخانه در بحث Front-end محسوب می شود که بیشتر تاکید آن روی زیبایی شناسی عناصر است. اگر زمان اضافه دارید و همچنین از صبر بالایی برخوردارید می توانید از این کتابخانه جذاب تست بگیرید. لازم به ذکر است که Kichstart روی همه پروژه ها استفاده نمی شود اما زمانی که از آن استفاده کنید می توانید به مقدار زیادی در زمان صرفه جویی کنید.

استفاده از عکس های پس زمینه ی عجیب

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

نتیجه گیری

با اینکه ایده های بیشتری در این زمینه وجود دارد اما سعی شده کاربردی ترین آن ها در دسترس شما مخاطب عزیز قرار بگیرد. طراحان و همچنین توسعه دهندگان Front-end برای اینکه بتوانند در امر طراحی سایت جذابیت را به کار خود اضافه کنند با نکاتی که در راستای این موضوع مطرح شده می توانند تکنیک های مفیدی از این مقاله پیدا کنند. برای پیاده سازی این ایده ها نهایتا 1 الی 2 ساعت وقت نیاز است. امیدواریم که در موضوع جذابیت توانسته باشیم به شما کمک کرده باشیم.

منبع

https://rayapars.ir/