طراحی سایت

همچنين مي‌توانيد نمونه‌هاي بيشتري را ببينيد که در واقع در Awwwards و Webby Awards جوايزي را براي طراحي عالي کسب کرده‌اند .

(توجه: من همچنين ليستي از قالب هاي وب سايت با جلوه هاي بصري عالي را در بخش بعدي طراحي واکنش گرا ارائه مي کنم، در صورتي که شما مانند من هستيد و نمي توانيد کدنويسي کنيد.)

در مورد بصري کافي است. بياييد کمي گيک تر شويم.

2. طراحي وب سايت فني (با نام مستعار "چيزهاي Geeky")
طراحي فني وب شامل موارد زير است:

طراحي واکنشگرا و سازگاري با موبايل
سرعت بارگذاري سريع
بهينه سازي موتور جستجو (SEO)
رمزگذاري SSL
معماري و ناوبري سايت
اگر هر يک از اين موارد باعث شد که بگوييد «چي؟»، نگران نباشيد. من همه آنها را به زبان عاميانه توضيح خواهم داد.

طراحي واکنشگرا و سازگاري با موبايل
با توجه به پست مجله اسمشينگ طراحي وب سايت واکنش گرا: چيست و چگونه از آن استفاده کنيم :

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

طراحي وب سايت ريسپانسيو

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

اگر فکر مي کنيد پيچيده به نظر مي رسد ... اين است.

اما مهم است. در واقع، گوشي‌هاي هوشمند اکنون بيش از 51 درصد از کل ترافيک آنلاين را تشکيل مي‌دهند و تبلت‌ها تنها بيش از 12 درصد را به خود اختصاص داده‌اند. و اين تعداد در حال افزايش است.

همچنين، گوگل به سازگاري با موبايل اهميت زيادي مي دهد. در واقع، آنها اکنون اولويت را براي رتبه بندي سايت هاي سازگار با موبايل قائل هستند (به روز رساني به نام Mobilegeddon ).

در نهايت، سازگاري با موبايل، تجربه کاربري بهتري را ايجاد مي کند. و در نهايت، همه چيز در مورد کاربر است. آنها کساني هستند که کيف پول خود را باز مي کنند تا تجارت شما را سرپا نگه دارند.

بنابراين يک غير طراح چه کاري بايد انجام دهد؟

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

تست موبايل پسند
بله، ما موبايل پسند هستيم!

علاوه بر استخدام يک طراح، بهترين کار شما اين است که قالب سايت خود را تغيير دهيد. اين ساده‌ترين و مقرون‌به‌صرفه‌ترين راه براي موبايل‌پسند و واکنش‌گرا کردن سايت شما است.

در اينجا چند الگوي سازگار با موبايل براي سازندگان سايت محبوب آورده شده است:

قالب هاي وردپرس سازگار با موبايل
قالب هاي Shopify سازگار با موبايل
قالب هاي BigCommerce سازگار با موبايل
قالب هاي مجنتو سازگار با موبايل
هيولا قالب براي پلتفرم هاي متعدد
سرعت بارگذاري سريع وب سايت
طبق نظرسنجي‌هاي انجام شده توسط Akamai و Gomez.com ، تقريباً نيمي از کاربران وب انتظار دارند که يک سايت در 2 ثانيه يا کمتر بارگذاري شود، و آنها تمايل دارند سايتي را که در عرض 3 ثانيه بارگذاري نشده است رها کنند!

اين به شما فضاي زيادي براي تکان دادن نمي دهد. اما اگر هنوز متقاعد نشده ايد، اين را دريافت کنيد:

تقريباً 79? از خريداران آنلاين که با عملکرد وب سايت مشکل دارند مي گويند که براي خريد دوباره به سايت باز نمي گردند و حدود 44? از آنها اگر تجربه خريد آنلاين ضعيفي داشته باشند به دوستان خود مي گويند.

به عبارت ديگر، اگر سرعت سايت شما ضعيف باشد، ضرر مي کنيد. زمان بزرگ.

بنابراين چگونه از سرعت بارگذاري سريع مطمئن مي شويد؟ اين را امتحان کن:

گوگل مانند تست سازگار با موبايل، تست سرعت صفحه نيز دارد . با اين حال، برخي معتقدند که خيلي دقيق نيست، بنابراين امتحان کردن Pingdom و GT Metrix نيز ضرري ندارد .

هر سه به شما ايده اي از آنچه که به سرعت بارگذاري شما آسيب مي زند، با پيشنهاداتي براي بهبود مي دهد.

تست سرعت صفحه

همانطور که مي بينيد، راه هاي زيادي براي بهبود سرعت بارگذاري سايت شما وجود دارد ، مانند کش کردن مرورگر و بارگيري محتواي بالاي صفحه (محتواي که بدون پيمايش صفحه به پايين مي بينيد).

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

مي توانيد از ابزاري مانند Gimp براي فشرده سازي تصاوير خود به صورت رايگان استفاده کنيد. ( در اينجا يک آموزش براي انجام اين کار وجود دارد.)

اندازه فايل تصوير قبل و بعد از Gimp

بهينه سازي موتور جستجو (SEO)
سئو به معناي بهينه سازي سايت شما براي نمايش در موتورهاي جستجو مانند گوگل است. اين نان و کره چيزي است که يک وب سايت خوب را مي check here سازد.

اگر درست انجام شود، مي‌تواند هر ماه هزاران ترافيک را بدون هيچ تلاش اضافي به سايت شما وارد کند.

اين کار ضعيف است، هيچ روحي شما را در گوگل پيدا نمي کند.

به گفته Jon Rognerud، چهار مرحله براي سئو وجود دارد . در اينجا برخي از نکات قابل اجرا جون آورده شده است:

بدانيد که چه کسي را هدف قرار داده ايد و تحقيقات کلمات کليدي را انجام دهيد .
صفحات سايت خود را با سئوي داخلي که آن کلمات کليدي را هدف قرار مي دهد، بهينه کنيد .
يک نقشه سايت قوي براي گوگل و بينگ ايجاد کنيد تا سايت خود را ايندکس کند.
اين بسيار ساده شده است و بسياري از فاکتورهاي سئوي ديگر نيز وجود دارد ، اما اين سه تاکتيک شما را در مسير خوبي براي نمايش در نتايج جستجو قرار مي دهد.

اين بخش بعدي از مشاوره طراحي وب به سئو و ايجاد اعتماد بين بازديدکنندگان کمک مي کند.

ايمن سازي سايت با رمزگذاري SSL
احتمالاً قفل سبز کوچک را در نوار آدرس خود در کنار يک وب سايت ديده ايد.

رمزگذاري SSL

اين رمزگذاري SSL ناميده مي شود.

گوگل به سايت‌هاي رمزگذاري‌شده يک تقويت جزئي سئو مي‌دهد . اما شايد مهمتر از آن، فاکتور اعتمادي است که به بازديدکنندگان شما مي دهد.

اين امر مخصوصاً زماني صادق است که شما هر چيزي را در وب سايت خود بفروشيد. مردم قبل از باز کردن کيف پول خود مي خواهند بدانند اطلاعات آنها ايمن است.

مهاجرت به SSL يک فرآيند حساس است. در اينجا راهنمايي براي انتقال سايت خود به SSL بدون آسيب رساندن به رتبه بندي جستجو ارائه شده است .

معماري و ناوبري سايت
اصل طراحي شماره 4 را به خاطر بسپاريد: ناوبري سايت واضحي داشته باشيد.

ناوبري به دو دليل مهم است:

سئوي بهتر (زيرا ايندکس کردن سايت شما را براي گوگل آسان تر مي کند).
قابليت استفاده بهتر (زيرا براي بازديدکنندگان آسان تر است که راه خود را پيدا کنند).
به ياد داشته باشيد که از "قانون سه کليک" استفاده کنيد : هر صفحه در سايت شما بايد با سه کليک از هر صفحه ديگري در سايت شما فاصله داشته باشد.

براي کمک به شما در اين زمينه، نقشه وب سايت خود را در نظر بگيريد. مي توانيد اين کار را با ابزاري مانند Slickplan انجام دهيد يا فقط از قلم و کاغذ استفاده کنيد. آنها به اين شکل هستند:


طراحی سایت با کیفیت بین المللی