بینش را در مورد صنعت وب توسعه دهنده نزدیک کنید

مقاله با در نظر گرفتن مسائل روزمره و رشد حرفه ای توسعه دهندگان وب ، بررسی مسئولیت ها ، مهارت ها ، ابزارها و همچنین چشم انداز شغلی.

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

توسعه دهندگان وب چه کسانی هستند و چه کاری انجام می دهند؟ یکی از مقاله های قبلی ما در Tubik Blog قبلاً کمی از آن رونمایی کرده استاصول کارشان، امروز بیشتر برویم. بسیاری از افراد تصور می کنند که توسعه دهندگان وب فقط جنبه فنی ساخت وب سایت ها را فراهم می کنند ، اما این کار فراتر از این تعریف ساده است. متخصصان این حوزه همچنین لازم است نیازهای کاربر را تجزیه و تحلیل کنند تا اطمینان حاصل شود که محتوای مناسب ، گرافیک و ساختار اساسی ایجاد شده و حفظ می شود تا اهداف کاربران و صاحبان وب سایت را برآورده کند.

مسئولیت های توسعه دهنده وب چیست؟

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

مسئولیت های روزانه شامل موارد زیر است:

• کدگذاری به یک یا چند زبان برنامه نویسی یا اسکریپت نویسی ، مانند PHP ، Java ، Ruby یا JavaScript.
• اشکال زدایی ، اصلاح مجدد و بهینه سازی کد موجود ؛
• رفع اشکالات در پروژه های موجود ؛
• آزمایش ویژگی های جدید به طور کامل برای اطمینان از انجام صحیح وظیفه در همه موارد.
• آزمایش عملکرد برنامه وب یا وب سایت ایجاد شده ؛
• ایجاد و آزمایش رابط های برنامه برنامه (API) برای برنامه های کاربردی برای تبادل داده ؛
• تبدیل م writtenلفه های نوشتاری ، گرافیکی ، صوتی و تصویری به قالب های سازگار وب ؛
• مشارکت در ایجاد طراحی UX (منطق و انتقال) و UI (عملکرد طراحی بصری) در همکاری نزدیک با طراحان در مراحل پیش از توسعه ؛
• ساخت و نگهداری پایگاه داده
• تصمیم گیری در مورد بهترین ابزارها ، فناوری ها ، زبان ها و چارچوب های پروژه ؛
• برنامه ریزی و نمونه سازی از برنامه های جدید یا وب سایت ها ؛
• به روز بودن در مورد روندها و پیشرفت های جدید در توسعه وب.
• اطلاع رسانی به طراحان ، توسعه دهندگان و کارکنان پروژه برای به روزرسانی پیشرفت ؛
• جمع آوری نیازها و خواسته ها از مشتریان و کاربران.

این لیست می تواند طولانی تر و طولانی تر ادامه یابد و با تنوع آن کاربران و مشتریان را متحیر کند.

یک توسعه دهنده وب چه باید بداند؟

یک توسعه دهنده وب (به ویژه توسعه دهنده جلویی) باید بداند چگونه محتوای وب را از طریق کد به روشی کاربرپسند فعال کند. این کار جنبه چالش برانگیزی برای توسعه و نگهداری وب سایت فراهم می کند. این وب سایت نباید برای کاربران پیشرفته خیلی ساده باشد و همچنین نباید آنقدر پیچیده باشد که مبتدی در روند گشت و گذار به راحتی از دست برود. این نکته ای است که به طراحان و توسعه دهندگان UX / UI توصیه می شود از یکدیگر حمایت کنند و تلاش و دانش و مهارتهای حرفه ای خود را متحد سازند. همکاری موثر این طرفین معمولاً منجر به ایجاد یک محصول وب کارآمد کاربر پسند می شود که در آن طراحی راه های پیچیده ای برای پشتیبانی از قابلیت استفاده و هماهنگی ارائه منطقی و تصویری پیدا می کند در حالی که توسعه روش های زیبایی را برای فعال سازی و حفظ آن راه حل ها در وب سایت های زنده تعیین می کند.

Hyper-Text Markup Language (HTML) ، JavaScript (JS) و Cascading Style Sheets (CSS) پایه و اساس توسعه front-end هستند. HTML زبان اصلی است که برای ساخت و نمایش وب سایت یا برنامه وب استفاده می شود. JS رابط های کاربری را فراهم می کند و تعامل وب سایت را افزایش می دهد. CSS برای نگاه و طراحی وب سایت در صفحه گسترده ای که با HTML نوشته شده استفاده می شود. این زبان ها برای ساخت جلوی وب سایت ضروری هستند.

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

-HTML
-XHTML
-CSS
-Javascript
فلش
-Microsoft سیلورلایت

یک توسعه دهنده back-end فناوری را ایجاد می کند که طرف کاربر وب سایت را به سمت سرور خود متصل می کند. قسمت انتهایی وب سایت شامل یک سرور ، یک برنامه کاربردی و یک پایگاه داده است. در تلاش برای ایجاد ارتباط سرور ، برنامه و پایگاه داده با یکدیگر ، توسعه دهندگان back-end از زبانهای سمت سرور مانند PHP ، Java ، Ruby ، ​​.NET و دیگران برای ساخت یک برنامه و ابزارهایی مانند MySQL ، Oracle و SQL Server برای پیدا کردن ، ذخیره ، حذف یا تغییر داده ها و ارسال آنها به کاربر با کد سمت مشتری.

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

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

-PHP
-C ++
-C
-C #
-Java
-Python
-Ruby
-Erlang

و اینها چند نمونه از ابزارهای پرکاربرد است ط :

-MySQL
-PostgreSQL
-MongoDB
-Microsoft SQL Server
-Oracle
-Sybase -SAP
HANA
-IBM DB2

چه مهارت هایی برای توسعه دهندگان وب مفید است؟

بر اساس روال روزمره در Tubik Studio ، به راحتی می توان گفت که توسعه دهندگان وب باید تنوع گسترده ای از دانش فنی را در حوزه هایی مانند زبانهای سمت مشتری و توسعه ، زبانهای سمت سرور و توسعه ، چارچوب برنامه های وب و رابطه ای به نمایش بگذارند. سیستم های مدیریت پایگاه داده (RDBMS) و همچنین تجربه کار با سیستم های کنترل نسخه و درک معماری برنامه های وب ، امنیت وب و رمزگذاری.

بیایید مهارت ها و ویژگی هایی را که می تواند برای افرادی که توسعه وب را به عنوان حوزه حرفه ای خود انتخاب می کنند مفید باشد ، دقیق تر بررسی کنیم.

مهارت های ارتباطی خوب

توسعه دهندگان باید بسته به هر مورد خاص و تصمیم گیری در مورد م mostثرترین موارد ، برای انواع مختلف ارتباطات آماده باشند:

• رو در رو؛
• تلفن؛
• پست الکترونیک؛
• چت آنلاین؛
• شبکه های اجتماعی؛
• انواع برنامه های پیام فوری

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

انعطاف پذیری و سازگاری

وب سایت ها و شرایط مورد نیاز ممکن است با گذشت زمان تغییر کنند. مشتریان می توانند به دلایل مختلف ناسازگار باشند ، ملاحظات یا جزئیات مهم را تغییر می دهند ، شاید با تغییر شغل خود. انعطاف پذیری و انعطاف پذیری مهم است ، در عین حال محدودیت هایی را تعیین می کند تا دامنه پروژه خیلی زیاد خزش نکند. به این معنی:

- نیاز به یادگیری زبان های جدید ، چارچوب ها ، مهارت ها و غیره

- آماده بودن برای قبول مسئولیت های اضافی

- برخورد با شرایطی که پروژه ای که روی آن کار می کنید لغو شده است

- سازگار با تغییرات ساعات کاری شما

- توانایی کار مستقل و در تیم های مختلط

- به روز بودن با ابزارهای جدید ، روش های کدگذاری و غیره

تعیین اولویت ها

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

رویکرد منطقی برای حل مسئله

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

توجه به جزئیات

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

چشم انداز شغلی چیست؟

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

پس از رسیدن به سطح حرفه ای پیشرفته ، موقعیت بعدی توسعه دهنده سرب ، سرب فنی یا رئیس توسعه است. به طور کلی ، این تبلیغات شامل مدیریت تیمی از توسعه دهندگان وب و کمک به استراتژی فنی و اهداف سازمان است. این همچنین به معنای کاهش میزان کار کدگذاری واقعی است. مرحله بعدی می تواند یک پست ارشد یا حتی در سطح هیئت مدیره باشد ، به عنوان مثال مدیر ارشد فنی (CTO) یا معاون فناوری.

خط پایین

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

 

5 روش برتر طراحی وب ریسپانسیو از SEO شما سود می برد

هنوز فکر می کنید که چرا شما باید یک سایت مناسب موبایل داشته باشید؟ در اینجا پنج مزیت برتر SEO برای داشتن یک طراحی وب ریسپانسیو آورده شده است.

ما اکنون در یک دوره همراه اول زندگی می کنیم و به سمت یک شاخص همراه اول حرکت می کنیم .

به این دلیل که مصرف کنندگان به تلفن های هوشمند و تبلت ها اعتیاد دارند. و این به زودی تغییر نمی کند.

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

چرا به طراحی ریسپانسیو نیاز دارید؟

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

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

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

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

به گفته برخی ، تعداد کسانی که نتوانسته اند خود را با تقاضای محیط ریسپانسیو تطبیق دهند ، به 60 درصد می رسد.

این باید باعث نگرانی کسب و کارها شود (ذکر یک انگیزه قوی برای طراحان وب که بدنبال کار هستند!).

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

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

اگر هنوز پاداش SEO از ارتقا to به یک طراحی ریسپانسیو برای تلفن همراه را نگرفته اید ، در اینجا پنج دلیل وجود دارد که چرا باید اکنون اقدام خود را انجام دهید.

1. قابلیت استفاده سایت بهبود یافته است

اگر کاربران نتوانند به راحتی در وب سایت شما پیمایش کنند ، بعید به نظر می رسد که در آن جا بمانند.

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

امتیازات خوب استفاده منجر به تکرار بازدیدکننده و افزایش تبدیل می شود. همانطور که در بالا ذکر شد ، گوگل در تلاش است تا سوالات کاربر را تأمین کند.

طراحی وب با قابلیت ریسپانسیو به تلفن همراه برای تجربه مثبت کاربر بسیار اساسی است و Google قرار است به سایتهایی که با چنین تجربه ای ملاقات کاربران می کنند پاداش دهد.

تجربه مشتری و قابلیت استفاده از سایت را نمی توان بیش از حد تأکید کرد. مشاغل و آژانس های بازاریابی دیجیتال باید در هنگام تبدیل و تجربه مشتری هوشیار باشند.

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

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

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

2. سرعت صفحه سریعتر

زمان بارگذاری صفحه یک عامل رتبه بندی شناخته شده و شناخته شده است.

هر وب سایتی باید برای بارگیری در اسرع وقت بهینه شود تا به شانس رتبه بندی خوب آن در نتایج موتور جستجو کمک کند.

پیام ثابت گوگل در طول سال ها این بوده است که سایت های پر بار در نتایج جستجو مورد علاقه قرار می گیرند.

این فقط یکی از دلایل زیادی است که Google توصیه می کند از طراحی وب ریسپانسیو استفاده کنید.

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

3. کاهش نرخ گزاف گویی

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

Google ممکن است مدت زمان کوتاه (ترک یک سایت تقریباً به همان سرعتی که به آن مراجعه کرده اید) را تفسیر کند به این معنی که محتوایی که جستجوگر در سایت شما پیدا کرده مربوط به نیازهای آنها نیست.

نتیجه این وب سایت تنظیم منفی در رتبه بندی آنها در نتایج موتور جستجوی گوگل برای آن س quال خواهد بود.

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

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

4. محتوای تکراری کمتر

همانطور که الگوریتم های گوگل هوشمند هستند ، هنوز هم از شما مهم است که کدام یک از مطالب وب سایت شما مهم است.

کسانی که تصمیم گرفته اند در مسیر یک سایت جداگانه برای موبایل گام بردارند ، در مدیریت مسائل تکراری محتوای مشکل دارند. استفاده از یک وب سایت جداگانه برای مشتری تلفن همراه خود نیاز به استفاده از URL جداگانه دارد.

مشکل این است که محتوای موجود در آدرس دسک تاپ و تلفن همراه یکسان است ، حتی اگر URL متفاوت باشد.

این محتوای تکراری می تواند به رتبه بندی شما آسیب جدی برساند. اگر برای Google روشن نکنید که کدام یک از محتوای حیاتی است و اطمینان حاصل کنید که محتوای آن نمایه می شود ، آنها باید برای شما تصمیم بگیرند.

نتیجه تقریباً همیشه رتبه بندی پایین تر در نتایج جستجو است. (اکثر سایت های تلفن همراه جداگانه در موتورهای جستجو رتبه خوبی ندارند زیرا آنها به عنوان همتای دسک تاپ خود متعارف هستند ، این یکی دیگر از مزایای ریسپانسیو است: شما می توانید SEO خود را روی یک سایت متمرکز کنید.)

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

5. اشتراک اجتماعی تقویت شده

طراحی وب ریسپانسیو ساخته شده است تا اشتراک گذاری اجتماعی را برای غالب ترین جمعیت آنلاین - کاربران تلفن همراه آسان کند.

اگرچه رسانه های اجتماعی می توانند به سئو کمک کنند ، اما اشتراکات اجتماعی تأثیر مستقیمی در رتبه بندی نخواهد داشت. اما به رشد مخاطبان کمک می کند.

مخاطبان بیشتر می توانند به معنای بازدید و تعامل بیشتر و همچنین تقاضای جستجوی بیشتر برای نام تجاری شما باشند - که قطعاً باعث توجه Google خواهد شد.

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

تفکر پیش رو: از قبل برنامه ریزی با توجه به کاربران موبایل

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

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

همه اینها با ارائه یک استراتژی واضح تر ، به تلاش شما در زمینه جستجوگرها کمک می کند.

شما در تلاش برای دستیابی به چه کسی و تلاش برای دستیابی به آنها خواهید بود که پایه ای در تلاش شما برای ریسپانسیو در زمینه طراحی وب خواهد بود و منجر به یک استراتژی سئو موثر در جستجوگرها برای وب سایت شما خواهد شد.

SEO طراحی وب ریسپانسیو

ویل کریچلو در ماه نوامبر اعلام کرد که وبلاگ Distilled با یک طراحی ریسپانسیو جدید به روز شده است ، اما اخیراً به نظرم رسید که ما هرگز به جزئیات این که چرا طراحی وب ریسپانسیو بسیار عالی است ، پرداختیم. طراحی ریسپانسیو طی چند ماه گذشته یکی از موضوعات داغ در بازاریابی آنلاین بوده است ، اما آیا واقعاً قرار است این یک استاندارد صنعتی شود؟

پاسخ کوتاه: بله

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

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

چگونه کار می کند؟

خیلی درست به نظر می رسد ، درست نیست؟ همه چیز با یک نظریه نسبتاً ساده از ایتان مارکوت در مقاله ای تحت عنوان " طراحی وب ریسپانسیو " در سال 2010 آغاز شد . صفحات وب ریسپانسیو به جای ایجاد یک صفحه وب واحد با عرض 800 پیکسل و متمرکز شدن روی صفحه ، از عناصری تشکیل شده اند که بر اساس عرض صفحه مرورگر اندازه ، شکل و قرار می گیرند. عناصر با استفاده از پرس و جوهای رسانه CSS اندازه صفحه را تعیین می کنند.

بیایید با استفاده از 9 عنصر مستطیل شکل با برچسب A – I با یک مثال ساده در یک شبکه شروع کنیم. در یک صفحه کوچک ، مانند رایانه لوحی یا رایانه قدیمی با پیکسل کمتر ، عناصر خود را در شبکه 3 * 3 نمایش می دهند:

وقتی صفحه گسترده تر باشد ، این عناصر می توانند گسترش پیدا کنند:

هنگامی که باریک تر می شود ، آنها می توانند:

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

وقتی صفحه کوچک می شود ، عناصر به طور متفاوتی روی هم قرار می گیرند:

برای مثال تعاملی تر ، به www.microsoft.com بروید و با تغییر صفحه مرورگر از آن لذت ببرید.

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

این نمای دسک تاپ آنهاست:

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

رفتن به نمای رایانه لوحی به اندازه iPad:

هنگامی که صفحه نمایش در هر دو طرف فضای زیادی ندارد ، Smashing Magazine تبلیغات و جستجو را در سمت راست نگه می دارد ، اما ناوبری را به روشی هوشمندانه و قابل توجه به بالای صفحه منتقل می کند ، اما فضای زیادی را اشغال نمی کند .

در اینجا نمای تبلت Kindle Fire آنها به شرح زیر است:

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

و اکنون ، بر روی تلفن همراه:

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

همانطور که مشاهده می کنید ، طراحی وب ریسپانسیو به شما کنترل شگفت انگیزی می دهد. با برخی از خلاقیت ها ، یک طراحی وب ریسپانسیو می تواند تقریباً همه چیز را از PC-optimized به mobile-optimized ، به هر چیزی در این بین تبدیل کند.

چرا طراحی ریسپانسیو برای سئو خوب است

بنابراین اکنون می دانید که طراحی ریسپانسیو ایده هوشمندانه ای است که با تنظیم صحیح ، از نگهداری وب و ایجاد محتوا می کاهد. اما این چگونه به SEO کمک می کند؟

قابلیت استفاده

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

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

محتوای تکراری

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

رتبه بندی برای جستجوهای تلفن همراه

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

پیوند ساختمان

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

تشخیص زود هنگام فرزندخواندگی

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

• http://blogs.adobe.com/digitalmarketing/digital-marketing/mobile/responsive-web-design-and-web-analytics/
• http://inspirationfeed.com/inspiration/website-inspiration/60-examples-of-responsive-website-design/
• http://www.clicknewz.com/5984/benefits-of-responsive-web-design-examples/
• و البته Microsoft و Smashing Magazine از این پست.

نتایج

همانطور که احتمالاً حدس می زنید ، اگر سایت شما قبلاً برای رایانه لوحی و / یا تلفن همراه بهینه نشده بود ، شاهد کاهش نرخ گزاف گویی از آن دستگاه ها خواهید بود. ما شاهد انتشار تأثیرات مثبت به سایت اصلی نیز بوده ایم. در سایت یکی دیگر از مشروبات الکلی ، اجرای طراحی وب ریسپانسیو بازدیدها را در طول یک ماه بیش از 400٪ افزایش داد:

این یک نمونه افراطی است. تغییر به طراحی وب ریسپانسیو در وبلاگ Distilled همان تأثیر را نداشت. با این حال ، نتایج مانند این نشان می دهد ، در شرایط مناسب ، طراحی وب ریسپانسیو می تواند نتایج شگفت انگیزی را به همراه داشته باشد.

منفی ها

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

زمان را تنظیم کنید

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

صفحات بزرگ

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

به همین دلیل سایت هایی مانند NYTimes.com و CNN.com دارای نسخه های جداگانه موبایلی هستند که فقط قسمت کوچکی از کل مقاله ها و پیوندهایی را که در نسخه دسک تاپ خود دارند نمایش می دهند. اگر سایتی دارید که از این نظر عظیم است - و به همین معنای بزرگ است - با نسخه های جداگانه موبایل و دسک تاپ همراه باشید.

تجربه کاربر موبایل

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

بنابراین ، آیا طراحی وب ریسپانسیو برای سایت شما مناسب است؟

اگر سایت شما خیلی بزرگ یا پیچیده است و به یک سایت موبایل احتیاج دارد ، احتمالاً از آن آگاه هستید (و احتمالاً قبلاً یک سایت موبایل شگفت انگیز داشته اید که نباید باهاش ​​اشتباه کرد). اما ، اگر سایت موبایلی ندارید یا یک سایت ساده دارید و نمی دانید سوئیچ به یک طراحی وب پاسخگو ارزش دارد ، چه می کنید؟ شما می خواهید کمی تحقیق در Google Analytics انجام دهید:

آیا حتی به سایت موبایل هم احتیاج دارم؟

با رفتن به گزارش نمای کلی موبایل ، که یک گزارش استاندارد در بخش مخاطبان است ، در بخش کشویی تلفن همراه شروع کنید. اگر تعداد بازدید از تلفن همراه و رایانه لوحی کمتر از 5٪ از کل بازدید شما باشد ، احتمالاً لازم نیست نگران ایجاد یک سایت مخصوص موبایل باشید (هنوز: این تعداد فقط در حال رشد است).

اگر بیش از این است ، روی مجموعه هدف یا مجموعه معیارهای تجارت الکترونیکی - از هرکدام برای ردیابی تبدیل ها استفاده می کنید - در بالای صفحه ، در زیر تب Explorer کلیک کنید:

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

سایت موبایل من چگونه به صفحه نمایش آنها نگاه می کند؟

به گزارش های استاندارد> مخاطبان> تلفن همراه> دستگاه ها بروید و بعد اصلی را به "وضوح صفحه" تغییر دهید. با کلیک روی کشویی دیگر در سمت راست خط سایر ابعاد اصلی که می توانید استفاده کنید ، می توانید آن را درست بالای جدول تغییر دهید. 10 رایج ترین وضوح صفحه را که توسط بازدید کنندگان شما استفاده می شود ، امتحان کنید. سایت موبایل شما چگونه به آنها نگاه می کند؟  برای دیدن سایت خود در دستگاه های مختلف از Screenfly استفاده  کنید. شاید تعجب کنید که چند تبلت یا تلفن بزرگ شاهد یک سایت بیش از حد ساده هستند که چندان جذاب نیست. حتی اگر یک سایت موبایل دارید که در 50٪ بازدید از تلفن همراه عالی به نظر می رسد ، اگر در 50٪ دیگر بد به نظر می رسد ، باید طراحی وب ریسپانسیو را در نظر بگیرید.

آیا سایت موبایل من به بازدیدکنندگان آنچه می خواهند می دهد؟

به نرخ گزاف گویی تلفن همراه در بخش گزارشات استاندارد> تلفن همراه> نمای کلی نگاه کنید. وقتی بازدیدکنندگان روی سایت تلفن همراه شما فرود می آیند ، آیا چیزی باعث می شود آنها سریعتر از میز کار بروند؟ بازدیدکنندگان موبایل باید تقریباً همان نرخ گزاف گویی بازدیدکنندگان دسک تاپ را داشته باشند.

اگر وقت دارید ، حسابرسی کامل سئو موبایل را انجام دهید تا واقعاً تشخیص دهید نسخه موبایل سایت شما به چه صورت است. Aleyda Solis یک راهنمای عالی حسابرسی تلفن همراه در مورد وضعیت جستجو نوشت .

بهترین گزینه شما: به آرامی به سمت طراحی وب ریسپانسیو حرکت کنید

اگر می خواهید به آرامی به سمت طراحی وب ریسپانسیو حرکت کنید یا در حال حاضر سایت موبایل بسیار خوبی در آن وجود دارد ، در نظر بگیرید که سایت خود را به گونه ای ریسپانسیو بداند که برای دسک تاپ و تبلت بهینه شود ، اما هنوز نه برای موبایل. طراحی آسان تر خواهد بود ، اما شما اولین نکته فنی را می فهمید و برای کاربران تبلت تبدیل بهتری خواهید داشت (که احتمالاً هنوز برای آن بهینه سازی نکرده اید).

Ethan Marcotte توضیح می دهد که چگونه برنامه نویسی در مقاله اصلی خود کار می کند و توسعه دهندگان برای ایجاد CMS های محبوب (برای وردپرس ، دروپال و جوملا ) تم ایجاد کرده اند .

توجه داشته باشید که اجرای فنی نسبتاً پیشرفته است و تعدادی اشتباه کوچک وجود دارد که باید مراقب آنها باشید:

1. از تصاویر فشرده استفاده کنید

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

2. طراحی برای تمام اندازه های صفحه نمایش

بسیاری از طراحان می خواهند برای یک اندازه تلفن همراه ، یک اندازه تبلت و یک اندازه دسکتاپ طراحی کنند و فقط یک طراحی "ریسپانسیو" ایجاد می کنند که سایت را به طرح دیگری برای اندازه های استاندارد تبدیل می کند. اما ما تلفن های همراه کوچک و بزرگ ، تبلت هایی به اندازه Kindle Fires تا 10 اینچ Samsung Galaxy Tabs و نمایشگرهای رومیزی به اندازه 30 اینچ داریم. طراحی ریسپانسیو بیشتر به اندازه تغییر اندازه عناصر موجود در یک صفحه است زیرا پیکسل های شما بیشتر از این است که یک طرح را به دیگری بکشید. همانطور که طراح استفان هی می گوید ، "ابتدا با صفحه کوچک شروع کنید ، سپس آن را گسترش دهید تا به نظر برسد. زمان قرار دادن نقطه انفصال است! "

3. همیشه تمام مطالب را نشان دهید

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

4. بهینه سازی برای لمس

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

5. تست روی همه مرورگرها

روزهای خوب گذشته را به خاطر می آورید ، وقتی از نیاز به آزمایش وب سایت خود در IE و Firefox شکایت کردید؟ اکنون شما باید:

دسکتاپ:

• IE9 برای ویندوز 7
• IE10 برای ویندوز 8 (که Flash را اجرا نمی کند)
• فایرفاکس
• کروم
• سافاری

تبلت / موبایل

• سافاری
• مرورگر پیش فرض اندروید
• Chrome بتا
• دلفین
• اپرا
• فایرفاکس

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

اما ارزشش را دارد

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

آیا هرکدام از شما سوییچ کرده است؟ توصیه ای برای کسانی که این کار را نکرده اند؟