آموزش سئو - طراحی و Design یک وب سایت
بسم الله الرحمن الرحیم
آموزش SEO
دوره آموزشی سئو
طراحی و Design یک وب سایت
طراحی و Design یک وب سایت یکی از مهمترین بخش های جذب کاربران است، در طراحی وب سایت باید به گونه ای عمل شود که کاربر در نگاه اول (first impression) نظرش نسبت به سایت شما جلب شود.
اگر دقت کرده باشید سایت هایی وجود دارند که از لحاظ محتوا مطالب بسیار خوبی را ارائه می کنند اما وقتی شما به آنها مراجعه می کنید پس از چند لحظه آن ها را ترک می کنید و علتش را نامانسب بودن مطالب بیان می کنید، اما سایت هایی وجود دارند که مطابی را شبیه به همان سایت به شما ارائه می کنند اما شما احساس می کنید ابن سایت مطالب بسیار سودمندتری دارد! علتش چیست؟
علتش ناخودآگاه انسان است که آشفتگی و بی نظمی را تشخیص می دهد، بی نظم بودن منوها، صفحات، لینک ها و مطالب باعث می شود، شما آن چه را دوست دارید نتوانید به خوبی ببینید از همین رو این سایت را سریع ترک خواهید کرد.
در گذشته وب سایت ها بسیار ساده ابتدایی بودند و بعد از سال ها طرح ها و روش های مختلفی برای نمایش اطلاعات در صفحات ایجاد شده اند که این روش ها را به صورت مختصر بررسی می کنیم.
بسم الله الرحمن الرحیم
آموزش SEO
دوره آموزشی سئو
طراحی و Design یک وب سایت
طراحی و Design یک وب سایت یکی از مهمترین بخش های جذب کاربران است، در طراحی وب سایت باید به گونه ای عمل شود که کاربر در نگاه اول (first impression) نظرش نسبت به سایت شما جلب شود.
اگر دقت کرده باشید سایت هایی وجود دارند که از لحاظ محتوا مطالب بسیار خوبی را ارائه می کنند اما وقتی شما به آنها مراجعه می کنید پس از چند لحظه آن ها را ترک می کنید و علتش را نامانسب بودن مطالب بیان می کنید، اما سایت هایی وجود دارند که مطابی را شبیه به همان سایت به شما ارائه می کنند اما شما احساس می کنید ابن سایت مطالب بسیار سودمندتری دارد! علتش چیست؟
علتش ناخودآگاه انسان است که آشفتگی و بی نظمی را تشخیص می دهد، بی نظم بودن منوها، صفحات، لینک ها و مطالب باعث می شود، شما آن چه را دوست دارید نتوانید به خوبی ببینید از همین رو این سایت را سریع ترک خواهید کرد.
در گذشته وب سایت ها بسیار ساده ابتدایی بودند و بعد از سال ها طرح ها و روش های مختلفی برای نمایش اطلاعات در صفحات ایجاد شده اند که این روش ها را به صورت مختصر بررسی می کنیم.
طراحی وب سایت به روش سنتی
در این روش فقط یک بنر یا تصویر در بالای وب سایت قرار داشت که معرف سایت بود و از هیچ جلوه بصری دیگری برای نمایش اطلاعات استفاده نمی شد، به همین دلیل برای وب سایت هایی که میخواستند خود را به شکلی زیبا معرفی کنند اصلا مناسب نبود.
طراحی وب سایت با فلش
در این روش برای جذابیت دادن به صفحات از انیمشن ها و فایل های SWF که خروجی نرم افزار فلش هستند، استفاده می شد، در آن زمان که بنده سن سالی نداشتم شرکت ها و سازمان هایی که وب سایت های جذاب می خواستند کل سایتشان را با فلش طراحی می کردند که افکت های صدا و تصویر زیبایی در آن ها استفاده می شد. اما این روش معایب زیادی داشت، بزرگترین عیب آن استفاده از نرم افزار فلش بود، اگر کاربر بر روی مرورگر (Browser) خود نرم افزار فلش را نصب نکرده بود هیچ مطلبی را مشاهده نمی کرد علاوه بر این مشکل به دلیل تبدیل شدن تمامی اطلاعات بر روی یک فایل فلش که امکان دسترسی به محتوای داخلی آن توسط موتورهای جستجو نبود، وب سایت ساخته شده با فلش عملا توسط هیچ موتور جستجویی نمی توانست خوانده شود، در نتیجه سئو (SEO) هیچ معنایی نداشت.
همچنین این سایت ها نمی توانستند مطالب زیادی را ارائه بدهند و فقط برای معرفی یک سازمان و یا شرکت مناسب بودند.
طراحی وب سایت به روش بنرهای متحرک
برای حل مشکلات روش قبل وب سایت های طراحی شده با فلش تبدیل به وب سایت هایی شدند که فقط تصویر header آنها فلش بود.
اما همچنان مشکل نیاز به Flash Player وجود داشت.
طراحی وب سایت ها با افکت های jQuery
پس از سال ها کتابخانه هایی برای ایجاد جلوه های زیبای بصری بر روی تصاویر و متون معرفی شدند، این کتابخانه ها به شما اجازه می دادند تصاویری را برای Header سایت خود انتخاب کنید و آن ها را افکت های زیبا تغییر دهید و همچنین بخش های مختلف مانند Menu و متون را به صورت جذاب با انمیشن های زیبا به کاربران نشان دهید. این تغییرات شروع یک تحول در وب سایت ها بود.
طراحی وب سایت با انیمیشن (Animated Design)
این روش ادامه و تکامل روش قبلی می باشد، که برای ایجاد جذابیت بر روی بخش های مختلف سعی می شود متن ها، تصاویر و تمامی عناصر درون صفحه به صورت انیمیشن و پویا حرکت خواهند کرد که باعث جذب بیشتر کاربران می شود.
طراحی وب سایت به روش ریسپانسیو (Responsive Design)
در این روش می توانید علاوه بر استفاده از جلوه های بصری و انیمیشن وب سایت خود را به گونه ای طراحی کنید که تمامی کاربران با تمامی مرورگرها (Browser) اعم از مرورگرهای تلفن همراه و یا تبلت و در واقع می توان گفت کاربران با هر صفحه نمایشی می توانند وب سایت شما را به خوبی مشاهده کنند. این ویژگی نه تنها به تعداد کاربران شما اضافه خواهد نمود بلکه یکی از معیارهای موتورهای جسجو برای Ranking وب سایت شما است.
طراحی وب سایت تک صفحه (One Page Design)
بسیاری از افراد وقتی یک وب سایت را مشاهده می کنند بدون دنبال کردن و استفاده از منو ها تمایل دارند اطلاعات مورد نیاز خود را از صفحه اول دریافت کنند. با توجه به همین نیاز روشی برای نمایش زیبای اطلاعات در یک صفحه به نام طراحی تک صفحه ای یا One Page Design به وجود آمد.
این روش بسیار روش مناسبی برای شرکت ها و سازمان هایی است که میخواهند تجارت خود را به صورت زیبا و قابل فهم به کاربرانشان معرفی کنند.
طراحی وب سایت به روش ابتدا محتوا (Content First)
اما پس از همه ی این جلوه ها و روش ها مجددا روشی مد نظر قرار گرفته است که به آن Content First می گویند در این روش به جای استفاده از جلوه ها و افکت ها سعی می کنند بیشتر توجه کاربر را به متون جلب کنند و بدون سرگرم کردن کاربر با افکت ها و انیمیشن ها، مطالب مورد نظرش را به او انتقال دهند.
هر یک از این روش ها متناسب برای یک موضوع خاص است مثلا روش Content First برای وب سایت های بازی و سرگرمی اصلا مناسب نیست زیرا کاربران این سایت ها بیشتر کودکان هستند، پس نمی توان از این روش برای آنها استفاده کرد، بلکه می بایست از ترکیب کردن سایر روش ها با یکدیگر وب سایت مورد نظر را ایجاد کرد.
اما برای وب سایت های علمی بهتر است به جای استفاده از جلوه های ویژه مطالب به شکل منظمی ارائه شوند، در نهایت برای این وب سایت ها بهتر است از روش Content First استفاده شود.
بخش طراحی وب سایت یکی از مهمترین بخش های سئو (SEO) می باشد، در نتیجه بهتر است از افرادی بخواهید برای شما طراحی سایتتان را انجام دهند که به مباحث کاربری و سئو (SEO) آشنا باشند، زیرا در غیر این صورت هیچ یک از گام های بعدی بهینه سازی وب سایت به نتیجه نخواهد رسید.
در زیر تصویر یک Template زیبا که متعلق به یک شرکت معتبر اروپایی (متعلق به دوستان وب سایت ما) است را برای شما قرار داده ام، هر چند این عکس نمی تواند جلوه ها و افکت های زیبای وب سایتش را نشان دهد اما می توانید حدس بزنید این وب سایت با یک وب سایت ساده چقدر تفاوت دارد، من نیز به نوبه خودم هرگاه این سایت مشاهده می کنم واقعا لذت می برم.
وقتی شما یک اتومبیل زیبا، خانه زیبا و... را مشاهده می کنید ناخودگاه حس اعتماد و اطمینان به شما دست می دهد وب سایت شما نیز باید دارای همین ویژگی ها باشد در غیر این صورت کاربران شما، شما را حرفه ای نخواهند دید.
علاوه بر زیبایی مانند هر محصول دیگری می بایست استاندارد های تولید رعایت شود، Template شما نیز باید دارای استانداردهای مناسب باشد تا موتورهای جستجو بتوانند اطلاعات لازم را از سایت شما دریافت کنند و همچنین وب سایت شما را رنک بندی نمایند.
موتورهای جستجو (search engine) بسیار هوشمند عمل می کنند اما با تمام هوشمندیشان در نهایت یک نرم افزار هستند و نمی توان آنها را با یک انسان مقایسه کرد که می تواند مطالب مورد علاقه خود را به هر شکلی پیدا کند و آنها را مطالعه کند. اگر طراحی وب سایت شما به شکلی پیچیده و نامفهوم باشد، موتورهای جستجو (search engine) نمی توانند مطالب وب سایت شما را بررسی و ارزیابی کنند، در نتیجه صفحات وب سایت شما به صورت کارامد و مناسب Index گذاری نخواهد شد و شما نمی توانید رنک مناسبی دریافت کنید.
در طراحی یک وب سایت، می بایست موارد زیادی را در نظر گرفت، که رنگ شناسی یکی از آنها است.
طبیعتا یک وب سایت خبری با یک وب سایت بازی و سرگرمی (Entertainment) از لحاظ طراحی و بخش ها بسیار متفاوت هستند، از همین منظر بسیار بهتر خواهد بود اگر در طراحی و گرافیک وب سایت خود از افراد متخصص این حوزه کمک بگیرد، زیرا آنها می دانند که مثلا برای یک سایت خبری هیچگاه نباید از رنگ های قرمز و صورتی (رنگ های محرک و هیجانی) استفاده شود بلکه باید از رنگ آبی که در ذهن انسان حس اعتماد را ایجاد می کند استفاده کرد.
اما بر عکس برای سایت های تفریح و سرگرمی بهتر است از رنگ های جذاب استفاده شود، شاید این مطالب به نظر بی اهمیت باشند اما ابزارهایی هستند که در شرکت های بزرگ از آنها برای واکنش کاربران در برخورد با یک وب سایت استفاده می شود ( نوعی عینک های خاص که رفتار شبکه عصبی را بررسی می کنند) نتیجه ای که از این ازمایش ها بدست آمده بیانگر این مطلب است که بیشتر کاربران وقتی با سایتی غیر حرفه ای برخورد می کنند حتی بدون داشتن هیچ دلیلی آن سایت را ترک می کنند و فقط عنوان می کنند این سایت مطالب مناسبی ندارد.
همان کاربران وقتی با سایتی که به صورت ارگونامیک (website ergonomics) طراحی شده و شامل همان مطالب سایت قبل است برخورد می کنند مدت زمان بیشتری را در آن سایت سپری می کنند و عنوان می کنند که این سایت مطالب مناسبی دارد.
همانطور که مشاهده می کنید در تصویر سمت راست حرکات موس کاربران ثبت شده است و در تصویر سمت چپ محل هایی که کاربران در آن کلیک کرده اند.
نقاطی که پر رنگ تر هستند یعنی کاربران بیشتری در آن نقاط قرار داشته اند، بر اساس همین مفهوم می توانید متوجه شوید داشتن Google Rank یک چقدر تاثیر دارد، زیرا تنها چند لینک اول توسط کاربران کلیک می شود، در نتیجه سایر وب سایت ها حتی اگر بهترین خدمات را هم داشته باشند هرگز دیده نمی شوند، این وب سایت ها مانند مجتمع های تجاری می مانند که در بیابان تاسیس شوند و هیچکس به آنها مراجعه نکند، در این صورت بهترین خدمات را هم اگر ارائه دهند موفق نخواهند بود.
ابزارها و منابع لازم برای انجام سئو را انشالله در یک مقاله در پایان همین دوره معرفی خواهیم کرد، یکی از این ابزارها، همین ابزار بالا است که مانند سایر ابزار ها متاسفانه در ایران افراد با آن آشنا نیستند و سئو را تنها به رعایت کلمات کلیدی و سایر مباحث مرتبط می کنند، اما انشالله قصد خواهیم داشت شما را با ابزارهای جدید و روش های صحیح انجام سئو آشنا کنیم، پس مقالات را دنبال کنید تا به بخش مورد نظر برسیم.
ذهن انسان آشفتگی و بی نظمی را در هر محیطی تشخیص می دهد پس سعی کنید ساختار وب سایت خود را به شکلی طراحی کنید که کاربران برای یافتن مطالب خود با یک نگاه ساده بتوانند اطلاعات مورد نظرشان را پیدا کنند.
سایت stackoverflow.com یک مثال خوب در این زمینه است، اگر دقت کرده باشید در این سایت برای مشخص کردن پاسخ صحیح سوالات از یک علامت تیک (Tick) برای تعیین پاسخ صحیح استفاده شده است، در نتیجه نیازی نیست شما تمامیپاسخ ها را بررسی کنید، می توانید این سایت را با دقت بررسی کنید، البته موارد زیادی در این سایت رعایت شده است که میتوانید آنها را شخصا بررسی کنید، زیرا بیان تمامی موارد بسیار زمان گیر است و از حوصله این مقاله خارج است.
محتوای اصلی صفحه شما باید دارای (density) چگالی 10% باشد و حجم (weigh) کلمات شما بیش از 200 کلمه باشد.
با یک مثال چگالی کلمات کلیدی و حجم کلمات را در سئو (SEO) بیان می کنیم.
چگالی کلمات کلیدی
اگر شما یک مطلب داشته باشید که در آن 400 کلمه وجود داشته باشد و یکی از کلمات کلیدی شما در آن مطلب 100 بار تکرار شده باشد، چگالی (density) کلمه کلیدی شما برابر با 25% خواهد بود (تعداد یک کلمه کلیدی تقسیم بر تعداد کل کلمات * 100). طبیعتا چنین متنی هیچگاه وجود نخواهد داشت زیرا معمولا تعداد تکرار یک کلمه کلیدی در مطالب بسیار کم خواهد بود، همچنین اگر با کلمات و جملات به صورتی برخورد شود که تعداد تکرار کلمات کلیدی زیاد شود ممکن است از نگاه موتورهای جستجو (search engine) شما یک Spam در نظر گرفته شوید، پس هیچگاه برای افزایش رنک خود سعی نکنید تعداد تکرار کلمات کلیدی خود را بیهوده در مطالب زیاد کنید.
Density
به تعداد کلمات کلیدی استفاده شده در هر Post گفته می شود، Density همان چگالی کلمات کلیدی است.
حجم کلمات (weigh)
در مثال بالا قید کردیم که 400 کلمه در مطلب ما وجود دارد پس حجم کلمات (weigh) مطلب ما 400 خواهد بود.
رضا میرداماد
سلام