در این مطلب قصد داریم بگوییم یک وبسایت را چگونه طراحی کنید که هم حرفه ای به نظر برسد و هم به خوبی کار کند. در حالی که بخش عمده ای از طراحی وب سایت تان در نهایت به شما بستگی دارد، اما باید در نظر داشته باشید که هنگام ساخت یک وب سایت، مواردی مهم و ضروری وجود دارد که باید انجام دهید و یا حتی باید از آنها پرهیز کنید:
بخش اول- طراحی وبسایت
مشخص کنید آیا میخواهید از وبسایت سازها استفاده کنید یا خیر.
اگر قرار است وب سایت را از ابتدا ایجاد کنید، به درک نسبی از برنامه نویسی HTML نیاز دارید، هرچند شما با استفاده از سرویسهای هاست رایگان مانند Weebly، Wix، WordPress یا Google Sites هم می توانید یک وب سایت ایجاد کنید. اما طراحان وبسایت‌ها بیشتر مایلند که سایت را از ابتدا با استفاده از کدهای HTML طراحی کنند.
• اگر قصد دارید وبسايت خود را کدنویسی کنيد، بايد به HTML و CSS مسلط باشید.
• اگر هم شخصا قصد صرف زمان و انرژی برای ایجاد وب سایت ندارید، می توانید یک طراح را برای ایجاد سایت خود
استخدام کنید. بعلاوه می‌توانید از فریلنسرها که دستمزدی بین 30 تا بیش از 100 دلار در ساعت دارند، استفاده کنید.
سایت را طرح ریزی کنید .
قبل از اینکه حتی وبسایت را باز کنید، باید بدانید میخواهید وبسایت چند صفحه داشته باشد، محتوای هر صفحه چیست و یا حتی صفحه بندی صفحات مهم مانند صفحه “درباره ما” را بدانید.
در نظر داشته باشید که به جای اینکه صرفاً محتوا را تعیین کنید، بهتر است تصویر کلی از هر یک از صفحات آن را ترسیم کنید.
•
از طراحی‌های معمول استفاده کنید.
در عین اینکه برای طراحی باید ایده های جدیدی داشته باشید، اما در عین حال باید اصول اولیه طراحی که کاربران به آن عادت کرده‌اند را رعایت کنید، مانند:
• نوار راهنمای سایت (به عنوان مثال، تب برای صفحات مختلف) باید در بالای صفحه قرار بگیرند.
• اگر از نماد منو (☰) استفاده می کنید، باید آن را در گوشه بالا سمت چپ صفحه قرار دهید.
• اگر از نوار جستجو استفاده می کنید، باید بالای آن را صفحه نزدیک به سمت راست قرار دهید.
• لینک های کمکی (به عنوان مثال صفحه “درباره ما” و یا صفحه “تماس با ما”) باید در پایین هر صفحه قرار بگیرند.
ثبات داشته باشید.
هر فونت ، پالت رنگ، تم و یا هرگزینه‌ای که انتخاب می‌کنید، سعی کنید که این انتخاب‌ها در وب سایت به همان منوال باقی بماند. زیرا مثلا وقتی فونت یا رنگ مورد استفاده در صفحه “درباره ما” با یک صفحه دیگر، مثلا صفحه اصلی متفاوت باشد خیلی ناجور به نظر می‌آید.
• اگر رنگ صفحه اصلی سایت را از رنگهای سرد انتخاب کرده اید، نباید از رنگ های روشن و جیغ برای صفحه بعدی استفاده کنید.
• به یاد داشته باشید که استفاده از رنگهای جیغ و درخشان، به ویژه هنگامی که رنگها در حالت پویا (به عنوان مثال حرکتی) نشان داده میشوند، ممکن است برای برخی از کاربران عصبی کننده باشد. اگر تصمیم به استفاده از چنین رنگ‌هایی در سایت خود دارید، هشداری برای این موارد قبل از باز شدن صفحات برای کاربران قرار دهید.
اضافه کردن راهنما
قرار دادن لینک مستقیم صفحات مهم سایت در بالای صفحه اصلی به بازدیدکنندگانی که نخستین بار است از سایت شما استفاده می کنند، در یافتن محتوایی که مدنظرشان است، کمک می‌کند. البته بسیاری از وبسایت سازها به طور پیش فرض این پیوندها را اضافه می کنند.
• مهم است مطمئن شوید که هر صفحه وب سایت، با یک کلیک کردن در دسترسی است، نه اینکه فقط از طریق آدرس صفحه قابل دسترس باشند.
در طراحی از رنگهای مکمل استفاده کنید.
مانند هر نوع طراحی، در طراحی وبسایت هم ترکیب رنگ مهم است. به همین دلیل، انتخاب رنگ های زمینه‌ای که با هم بخوانند بسیار مهم است.
• اگر نمی دانید از کجا شروع کنید خب: سیاه، سفید و خاکستری ترکیب خوبی است.
در طراحی وب سایت طراحی‌های مینیمال را در نظر بگیرید.
سبک مینیمال رنگ های خنثی، گرافیک ساده، صفحات متنی سیاه‌سفید، با کمترین تزیینات ممکن را می‌طلبد. استفاده از این سبک، روش ساده‌ای برای ایجاد وب سایتی است که با کمترین کارها در عین حال حرفه ای و جذاب به نظر برسد.
• بسیاری از وبسایت سازها تم‌های “مینیمال” دارند که می توانید هنگام تنظیم وبسایت آن را انتخاب کنید.
• جایگزینی برای مینیمالیسم، “بروتالیسم” است که شامل خطوط خشن، رنگ های درخشان، متن‌های بُلد و کمترین تصاویر است. نسبت به سبک مینیمال افراد کمتری از سبک بروتالیسم استفاده می کنند، اما بسته به محتوای وبسایت ، ممکن است بهتر باشد به این سبک فکر کنید.
در طراحی وب سایت انتخاب های انحصاری داشته باشید.
استفاده از خطوط مستقیم و عناصر ثابت یک قمار بی‌خطر است، اما استفاده از سبک منحصر به فرد، هم به طراحی وب سایت شما شخصیت مجزا می‌دهد و هم به ماندگاری سایت کمک می‌کند.
• از تخطی از رویه‌های معمول، قرار دادن نامتقارن عناصر برای طراحی وب سایت یا استفاده از عناصر دارای تشابه برای ایجاد ظاهری خاص، نترسید.
• هرچند طراحی‌های دایره‌ای مطلوب‌ترند؛ اما طرح‌های ظریف، با گوشه‌های تیز و عناصر زاویه‌ای (طراحی‌هایی که با عنوان ” card-based ” شناخته میشوند) طراحی‌های ملایم‌تری برای طراحی وب سایت هستند.
بخش دوم- عملکرد وب سایت را بهبود دهید
در طراحی وب سایت نگاهی به ویژگی‌های تلفن‌همراه داشته باشید.
کاربران از مرورگرهای نسخه موبایل بیش از مرورگرهای دسکتاپ استفاده می‌کنند، این بدین معناست که، توجهی که باید بر روی نسخه موبایلی داشته باشید، دسته کم باید برابر با نسخه دسکتاپی باشد. بیشتر وبسایت سازها به طور خودکار یک نسخه موبایلی هم ایجاد می‌کنند، با این حال در خصوص نسخه تحت موبایل این موارد را مدنظر داشته باشید:
• اطمینان حاصل کنید که کلیدها (به عنوان مثال تگ لینک‌ها) بزرگ و برای لمس شدن درجای مناسب قرار گیرند.
• از ویژگی‌هایی که نمی توانند در تلفن همراه مشاهده شوند (به عنوان مثال، فلش و غیره) اجتناب کنید.
• طراحی یک اپ موبایلی برای وبسایت خود را در نظر داشته باشید.
در طراحی وب سایت از استفاده بیش از حد عکس در هر صفحه اجتناب کنید.
هم برای مرورگرهای دسکتاپی و هم برای مرورگرهای موبایلی بارگذاری صفحه‌هایی که تعداد زیادی عکس یا ویدیو را نمایش می دهند، زمان‌بر است. گرچه تصاویر در طراحی وبسایت مهم هستند، اما استفاده بیش‌ازحد عکس می‌تواند سبب طولانی‌تر شدن بارگیری صفحات شود، که ممکن است مردم را از بازدید سایت منصرف کنند.
• به طور کلی، مخاطب انتظار دارد صفحات وبسایت شما در زیر چهار ثانیه بارگذاری شود.
صفحه “تماس با ما” را اضافه کنید.
اگر دقت کرده باشید تقریبا تمام سایت ها دارای یک صفحه “تماس با ما” هستند که شامل اطلاعات تماسی (مثلا شماره تلفن و یا آدرس ایمیلی) است؛ برخی از سایت‌ها حتی دارای یک فرم پرسش در این صفحه هستند. اضافه کردن یک صفحه “تماس با ما” برای کاربران یک مسیر ارتباطی مستقیم با شما را فرراهم می‌کند. این مسیر به شما یک شانس برای یافتن و حل اختلالات بالقوه را می‌دهد.
یک صفحه مخصوص 404 ایجاد کنید.
هنگامی که کسی یک صفحه خاص در وبسایت شما را بازکند که یا تنظیم نشده و یا وجود ندارد، یک صفحه «404 خطا» نمایش داده می‌شود. اکثر مرورگرها صفحه پیش فرض 404 عمومی دارند، اما شما می‌توانید صفحه 404 خود را ویژه خودتان تعریف کنید؛ اگر چنین کاری کردید، دقت کنید جزئیات زیر در آن وارد شده باشد:
• پیغام خطای دلخواه (به عنوان مثال، “تبریک می گیم – صفحه خطای ما را پیدا کردید!”)
• لینک بازگشت به صفحه اصلی
• لیستی از لینک های بیشتر مشاهده شده
• تصویر یا لوگو سایت.
در صورت امکان از نوار جستجو استفاده کنید.
اگر نحوه ساخت وب سایت امکان اضافه کردن یک نوار جستجو را پشتیبانی می‌کند، به شدت توصیه می‌کنیم این کار را انجام دهید. این مسیر به کاربران شما اجازه می‌دهد به سرعت بتوانند یک صفحه یا آیتم خاص را بدون نیاز به کلیک از طریق گزینه‌های راهنما، پیدا کنند.
• نوارهای جستجو همچنین برای زمانی که مخاطب می خواهد یک واژه عمومی را بدون دردسر اضافی جستجو کند، مفید است.
بیشتر زمان خود را بر روی صفحه اصلی صرف کنید.
وقتی کسی صفحه اصلی سایت شما را باز می‌کند، باید بلافاصله متوجه شود موضوع اصلی سایت چیست. علاوه بر این، تمام عناصر صفحه خانه باید سریعا بارگیری شوند، از جمله گزینه های راهنما و هر تصویری.
صفحه اصلی شما باید ویژگی‌های زیر را داشته باشد:
• مسیری برای یک تعامل (به عنوان مثال دکمه‌ای برای کلیک یا فرمی برای پر کردن)
• منو یا نوار ابزار
• گرافیکی جذاب (مثلا یک عکس تک، یک ویدیو، یا مجموعه انگشت شمار از عکس همراه با متن)
کلمات کلیدی کلماتی متناسب با خدمات، موضوع یا هدف سایت شماست.
وب سایت خود را در چند مرورگر تست کنید.
فوق العاده مهم است که مرورگرهای مختلف بتوانند ویژگی‌های وب سایت شما را درست نمایش دهند. قبل از گسترش وبسایت، وبسایت خود را در هر یک از سیستم عامل‌های ویندوز و Mac، iPhone و Android و مرورگرهای زیر چک کنید:
• Google Chrome
• Firefox
• Safari (فقط iPhone و Mac)
• Microsoft Edge و Internet Explorer (فقط Windows)
• مرورگرهای داخلی بر روی مدل‌های مختلف موبایل‌های Android (به عنوان مثال Samsung Galaxy ، Google Nexus و غیره)
به روز رسانی را تا رسیدن به رشد وب سایت ادامه دهید.
روندهای طراحی، لینک ها، عکس ها، مفاهیم و کلمات کلیدی با گذر زمان تغییر می کنند، بنابراین شما باید وبسایت را متناسب با تغییرات به روز نگهدارید. این بدان معناست که لازم است حداقل هر سه ماه یک بار وبسایت خود را در کنار سایر وب سایتهای مشابه به روزرسانی کنید(حتی ترجیحا بیشتر).
در این راستا شاید دوست داشته باشید مطلب “چگونه برنامه نویسی یاد بگیریم” را هم مطالعه کنید.