طراحی وب سایت

طراحی سایت

هنگامی که به طراحی سایت یا طراحی مجدد وب سایت می پردازیم، می توان از زیبایی شناختن آن راحت شد. “این سایه ای از آبی فقط به نظر نمی آید …. آیا آبی بودن این نبود که آرم در سمت راست صفحه نمایش باشد؟ …. چطور ما یک GIF انیمیشن متحرک را در وسط صفحه قرار داده ایم؟
با این حال، اگر واقعا میخواهید چیزی را با وبسایتتان انجام دهید (به عنوان مثال، آگاهی از نام تجاری، تولید سرب و غیره)، باید بیشتر تمرکز کنید تا اینکه وب سایت شما چگونه ظاهر شود.

طراحی وب سایت: در دنیایی که مردم بیش از یک میلیارد وب سایت دارند که می توانند به طور بالقوه روی آن قرار بگیرند، باید مطمئن شوید که طراحی وب سایت شما برای قابلیت استفاده (وب سایت شما آسان است) و تجربه کاربر (که چگونه تعامل لذت بخش با وب سایت شما برای کاربران واقعی)
راهنمایی رایگان خود را به طراحی وب در اینجا برای راهنمایی بیشتر در مورد طراحی یک وبسایت دوستانه دانلود کنید.
در حال حاضر، سالها می توانید سالها مطالعه کنید که از قابلیت استفاده و UX استفاده می کند، اما به خاطر اینکه شما یک نقطه پرش را به شما ارائه می کنیم، لیست زیر را برای راهنمایی های مفید در مورد پروژه بعدی طراحی وب خود قرار داده ایم.(طراحی وب سایت)

۸ دستورالعمل طراحی وب سایت برای تجربه کاربر استثنایی

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

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

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

رنگ ها از بیش از حد استفاده نکنید کتاب “تعامل کامپیوتر و انسان” توصیه می کند که حداکثر پنج رنگ (به علاوه یا منهای دو) رنگ مختلف را در طراحی وب سایت خود داشته باشید.
تایپ قلمهای انتخابی شما باید حداقل قابل خواندن باشد. و هنگامی که به رنگها می آید نباید بیش از حد استفاده کنید. توصیه عمومی این است که از حداکثر سه تایپیک مختلف در حداکثر سه اندازه متفاوت استفاده کنید.
گرافیک فقط از آنها استفاده کنید اگر آنها به یک کاربر یک کار را انجام می دهند یا یک کار خاص انجام می دهند (فقط اضافه کردن گرافیک به صورت غیر عادی).
در اینجا یک مثال عالی از طراحی صفحه اصلی ساده از Rockaway Relief است:

طراحی سایت وردپرس۲- سلسله مراتب بصری

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

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

در مثال زیر از Spotify، می توانید ببینید که Call-to-Action “Get Spotify Free” روی سلسله مراتب بصری نشسته است. برای شروع، آن را در سمت چپ صفحه (بیشتر بازدید کنندگان وب سایت ها را از چپ به راست). علاوه بر این، تنها عنصر بالای آن است که از رنگ بنفش تیره استفاده می کند که به طور طبیعی توجه شما را جلب می کند.

طراحی وب سایت

۳- قابلیت هدایت

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

در اینجا چند نکته برای بهینه سازی ناوبری سایت شما وجود دارد:

ساختار ناوبری اولیه خود را ساده (و در بالای صفحه خود) نگه دارید.
شامل ناوبری در پایین صفحه سایت شما.
از هر صفحه (به جز صفحه اصلی) از کیسه های پخت و پز استفاده کنید تا مردم از پیگیری ناوبری خود آگاه باشند.
یک جعبه جستجو را در بالای سایت خود قرار دهید تا بازدیدکنندگان بتوانند با کلمات کلیدی جستجو کنند.
گزینه های ناوبری زیادی را در یک صفحه ارائه ندهید.
خیلی عمیق حفاری نکن در بیشتر موارد، بهتر است که ناوبری خود را به بیش از سه سطح عمیق نگه دارید. (برای دیدن وضوح بیشتری در اطراف مسطح در مقابل Navs عمیق، این مقاله را بخوانید.)
پیوندها را در کپی صفحه خود قرار دهید و لینک هایی را که منجر به آنها می شود روشن کنید.
اشاره گر دیگر: هنگامی که شما در مورد آنچه که سایت اصلی (بالا) ناوبری خود را تعیین می کند، پایدار باشید. برچسب ها و موقعیت ناوبری شما باید در هر صفحه سایت شما باقی بماند. در اینجا یک مثال از وب سایت InVision است:

طراحی سایت

و این ما را به اصل بعدی ما هدایت می کند …

 

۴- سازگاری

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

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

در مثال زیر، می توانید ببینید که Airbnb از همان طرح برای همه صفحات “راهنما” (یک روش معمول) استفاده می کند. فقط تصور کنید اگر از صفحه “راهنما” طرح خاص خود، طرح منحصر به فرد داشتید، از دیدگاه بازدید کننده چطور می توانستید. (به احتمال زیاد نتیجه شستشوی شانه ها خواهد شد.)

طراحی وب سایت

۵- قابلیت دسترسی

طبق گزارش comScore، میزان مصرف اینترنت در سال ۲۰۱۳ تا ۲۰۱۵ به میزان ۳۰ درصد افزایش یافته است. در همین حال، مصرف اینترنت هوشمند اینترنت در طول مدت مشابه ۷۸ درصد افزایش یافته است. درایو اینجا: برای ارائه یک تجربه کاربری واقعا عالی، سایت شما باید با دستگاه های مختلف (و سیستم عامل ها و مرورگرها) که بازدید کنندگان شما از آنها استفاده می کنند سازگار باشد.

در سطح بالا، این به معنای سرمایه گذاری در یک ساختار وب سایت است که بسیار انعطاف پذیر است – مانند طراحی پاسخگو. با یک سایت پاسخگو، محتوا به طور خودکار تغییر می یابد و تغییر می کند تا متناسب با ابعاد هر دستگاهی باشد که یک بازدید کننده از آن استفاده می کند. (مشتریان بازاریابی HubSpot: با استفاده از طراحی پاسخگو ساخته شده، محتوای HubSpot ساخته شده بر روی COS به طور خودکار برای بازدیدکنندگان از هر دستگاه بهینه سازی شده است.)

طراحی وب سایت

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

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

این ما را به اصل بعدی ما هدایت می کند …

 

۶- عادت
کنوانسیون های طراحی وب خاصی وجود دارد که طی سال ها کاربران اینترنت به طور فزاینده آشنا هستند. چنین کنوانسیون ها عبارتند از:

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

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

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

طراحی فروشگاه

در تصویر بالا، شما می توانید (از چپ به راست) آیکون های خرید سبد خرید از آمازون، Wayfair، و بهترین خرید را ببینید.

 

۷- اعتبار
در نهایت، با استفاده از کنوانسیون های طراحی وب – عناصر طراحی و استراتژی هایی که بازدید کنندگان قبل از آن آشنا هستند می توانند به سایت شما اعتبار بیشتری نشان دهند. و اگر شما در تلاش برای ساختن یک سایت که بهترین تجربه ممکن را فراهم می کند، اعتبار (a.k.a. میزان اعتماد سایت شما) می تواند راه طولانی را طی کند.

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

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

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

 

۸- کاربر مرکزیت

در پایان روز، قابلیت استفاده و تجربه کاربر بر روی ترجیحات کاربران نهایی قرار می گیرد. (پس از همه، اگر شما برای آنها طراحی نمی کنید … برای شما طراحی شده است؟)

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

در اینجا چند ابزار تست کاربر برای شروع کار شما وجود دارد:

تخم مرغ دیوانه از این ابزار برای ردیابی چندین دامنه تحت یک حساب استفاده کنید و بینش های مربوط به عملکرد سایت خود را با استفاده از چهار ابزار هوشمند مختلف – نقشه گرما، نقشه پیمایش، پوشش، و پلاتیت، آشكار كنید.
Loop11 از این ابزار برای ایجاد تست قابلیت استفاده آسان – حتی اگر هیچ تجربه HTML نداشته باشید.
کاربر مست می باشد پرداخت Richard Littauer به مست و بررسی سایت شما. آیا من را باور نمی کنی؟ ما آن را آزمایش کردیم آن را چک کنید
(برای ابزارهای مفیدتر حتی بیشتر بخوانید).

با توجه به ویتامین T، ۶۸ درصد از بازدیدکنندگان موفق به تبدیل شدن نمی شوند زیرا فکر نمی کنند که شما در مورد تجربه خود دچار مشکل می شوید. بنابراین، به عنوان آخرین نکته کاربرد / UX خرد، شروع به مراقبت بیشتر! خود را به کفش بازدید کنندگان سایت خود قرار دهید و آنها را در هر مرحله از راه خود نگه دارید.