بهترین وب سایت های ریسپانسیو
در سال 2012، طراحی وب ریسپانسیو واقعا به جریان اصلی رسید. دو سال بعد از این مقاله ممتاز اتیان مارکوت در فهرست A، این تنها یک مفهوم نبود. ما برخی از چراغ های برجسته را در طراحی وب ریسپانسیو خواندیم شما می توانید لیست را در انتهای مقاله پیدا کنید برای انتخاب بهترین وب سایت های ریسپانسیو که طی 12 ماه گذشته راه اندازی شده است، و در اینجا چیزی است که آنها با آن روبرو شده اند.
این یک ترکیب چشمگیر است که شامل پروژه های شخصی است که می توانند به راحتی بدون استفاده از سرویس گیرنده، گرد و غبار و کارهای نوآورانه را برای مایکروسافت، دیزنی، کریس و استارباکس و برخی از کارهای خانه دوستانه در آینده توسط BBC، The وب و زمان بعدی. در اینجا آنها، به ترتیب حروف الفبا ...
01 Ableton
"هرگز فورپورا را شجاعانه ندیدم!" طراح، سخنران و نویسنده Elliot Jay Stocks از کار Edenspiekermann برای توسعه نرم افزار موسیقی برلین Ableton خلاصه می کند. با این وجود، این کار با تصاویر جسورانه و پالت رنگ پر جنب و جوش همراه است. "
Stephanie Rieger، طراح و همکارش Yiibu، مشاوره طراحی تلفن همراه در ادینبورگ، موافق است: "این [یک] محل زرق و برق دار، سرگرم کننده و لذت بخش در برند است. قطعات سایت کمی سنگین اما با توجه به مخاطبان ، طبیعت مارک و نیاز به ترکیب موسیقی و ویدئو، من فکر می کنم آنها یک کار عالی انجام داده اند. اطمینان حاصل کنید که بسیاری از لمس های طراحی خلاقانه (و عملی) را شگفت زده می کنید، مانند برچسب های ستون چرخشی در جدول مقایسه نرم افزار بهتر است به صفحه نمایش های کوچکتر متصل شود. "
02. Adobe و HTML
طراح و توسعه دهنده استیفن هی، توضیح میدهد: "این سایت که محصولات مرتبط با وب را به نمایش گذاشته است، در واقع بیشتر از طرح طراحی سازگار است، نه یک طراحی واقعی پاسخگو". "عملکرد می تواند به طور قابل توجهی بهبود یافته و من علاقه مند به ناوبری گرفتن بیشتر از فضای در بالای صفحه در تلفن همراه نیست.
بهترین سایت های ریسپانسیو : Adobe و HTML
دلیل این که من این سایت را ذکر می کنم این است که هر دو طرح تطبیقی و محتوا سیگنال می دهند که ادوبی، نرم افزار طراحی نرمافزاری چاپ، شروع به تایید مدرن وب و نیازهای طراحان آن می کند. ادوبی با ریشه های طراحی آن، فرصتی را برای تبدیل این سایت به یک طراحی ریسپانسیو با گرافیک جذاب و کامل دارد. "
03. جداگانه رویداد
تیم Kadlec، طراح وب سایت و طراح طراحی ریسپانسیو ، می گوید: «رویداد تازه به تازگی طراحی شده است که نه تنها زرق و برق دار بلکه زیبا نیز طراحی شده است. "[توسعه دهندگان] هنگام استفاده از آیکون های SVG از آنها استفاده می کنند و در صورت نیاز به PNG می افتند.
بهترین وب سایت های ریسپانسیو: رویداد جداگانه
تصاویر به نظر می رسد تنبل هستند. به عنوان مثال، همانطور که در پایین صفحه رویدادی قرار می گیرید، می توانید تصاویر بلندگو را به صورت ضخیم در می آورید. این همه به علاوه یک طراحی جذاب و تمیز! "
04. BBC News
پل رابرت لوید، طراح در Clearleft و نویسنده ستون پاسخگو ماهانه .net، می گوید: "بهترین سایت ریسپانسیو 2012، وب سایت تلفن همراه بی بی سی است." "در حالی که هنوز به مرورگرهای دسکتاپ با توجه به طرح نرسیده است، در حس واقعی کلمه واکنش نشان می دهد.
بهترین وب سایت های ریسپانسیو : اخبار بی بی سی
"طراحی شده با ذهنیت اول تلفن همراه، آن را به اندازه کافی برای دیدار با ویژگی های مختلف دستگاه به زیبایی آن را به عنوان مثال فوق العاده از افزایش مترقی است. بحث زیادی در مورد تصاویر پاسخگو است، اما رویکرد بی بی سی است به شدت عملی است. ، که برای داستان سرفصلها و بارگیری مشروط به این معنی است که دستگاههای دارای قابلیت بیشتر قادر به دریافت تصاویر بهینه سازی شده برای داستان های دیگر می باشند. این سایت نه تنها از هر وسیله ای قابل دسترسی است، بلکه بسیار سریع نیز قابل دسترسی است.
"در سال آینده، من می خواهم تمرکز بیشتری بر عملکرد بر طراحی و طرح بندی بصری داشته باشم. در این رابطه، سایت موبایل بی بی سی نیویورک مثال خوبی برای دیگران است."
05. 2012 ساخت
ریگان ری، طراح سرگرد و یک سوم از پاراول، از یکی از قسمت های مورد علاقه ام سالیانه این است که آنچه را اندی مک میلان و کایلی میر برای محل جدید کنفرانس ساخت ارائه کرده اند، بشنوند.
بهترین وب سایت های ریسپانسیو : Build
"آنها برای نسخه 2012 پاسخ دادند و من فکر می کنم این بهترین تلاش آنها تا به امروز است."
06. محتویات
مات مارکی، طراح توسعه دهنده کار در گروه Filament در بوستون و بنیانگذار و رئیس انجمن های ریسپانسیو عکس ها می گوید: "محتویات مجله ممکن است مزیت ناعادلانه خود را با Ethan Marcotte خود را به عنوان مدیر خلاق خود داشته باشند، اما هیچ کس گفت انتخاب من باید منصفانه باشد." گروه برای W3C.
بهترین وب سایت های ریسپانسیو: محتویات
"محتویات دارای تایپوگرافی زیبا و طراحی کلی است که محتویات آنها را حفظ می کند - همانطور که انتظار می رود - جلو و مرکز هر اندازه است. طراحی شده توسط تصاویری از هر موضوعی که بسته به نقطه توقف در اطراف کپی را پوشش می دهد، پشتیبانی می شود. این طراحی را بهبود بخشیده، اما هرگز به عنوان یک حواس پرتی خدمت نمی کند. این یک لذت واقعی برای خواندن است و واقعا این چیزی است که این طراحی وب را در بر می گیرد. "
07. CSS-Tricks
"باز هم: انتخاب سایت با نام کریس Coyier در آن احساس کمی مانند چخوردن غذا، اما عادلانه بودن عادلانه است - این مرد یک جانور است و او با این طراحی مجدد جهنمی کار کرد. "مات مارکیو می خندد." کریس مقدار زیادی اطلاعات غلط از اطلاعات مفید را در سایت خود مدیریت می کند و با طراحی هایی که انجام نمی دهد فقط منطقی و قابل استفاده در هر اندازه صفحه است، اما دارای یک تن شخصیت است.
بهترین وب سایت های پاسخگو: CSS-Tricks
"ذکر این نکته در Codepen.io کریس (هنوز هم به طور کامل پاسخگو در هنگام ویرایش) می آید که یک ابزار فوق العاده مفید برای ایجاد دموی سریع و موارد آزمون است. در اینجا کارهای شگفت انگیزی وجود دارد."
08. کریز
"Currys ممکن است آنچه را که در نظر طراحی طراحی سایت های بسیاری از آژانس ها و سایت های شخصی است را نداشته باشد، اما من آن را برای اهمیت آن به استفاده گسترده از تکنیک های طراحی پاسخگو انتخاب می کنم. این اولین سایت بزرگ تجارت الکترونیک است. من دیدم که طراحی پاسخگو درک شده است، "توضیح می دهد جیمز جوان، مدیر خلاق در Offroadcode.
بهترین وب سایت های پاسخگو: کریس
"این تجربه خوبی در مورد طیف وسیعی از دستگاهها در مقایسه با مقادیر زیادی از محتواها و محصولاتی از تمام شکل ها و اندازه ها را فراهم می کند و شامل یک فرآیند خرید آسان برای استفاده می شود - همه در داخل یک پایگاه واحد است که به وضوح به خوبی در نظر گرفته شده توسط تیم وب Currys. "
09. dConstruct 2012
بن کالاهان، رئیس کمپانی Sparkbox، مستقر در اوهایو، می گوید: "به غیر از مجموعه ای از سخنرانان باور نکردنی، سایت دونستر، تجربه ای جذابی است که به خوبی طراحی شده است."
بهترین وب سایت های پاسخگو: DConstruct
"جزئیات مورد علاقه من از سایت ناوبری است. توجه داشته باشید iconographic iconography برای تجربه نمایش دیداری کوچکتر. این نشان می دهد که مراقبت های واقعی به منطقه هدف لمس داده شده است و نشان دهنده ارزش ضمنی [قرار داده شده] کسانی که بازدید سایت در دستگاه های کوچکتر - یک ذهنیت همراه اول. خوب انجامclearleft! "
10. Disney.com
اسکات جیل، طراح وب / توسعه دهنده در Filament Group می گوید: "هنگامی که یک سایت با پیچیدگی رسانه های دیزنی پاسخگو شد، واقعا روشی برای ارائه محتوای چند رسانه ای در وب را به نمایش گذاشت. "طراحی نامطلوب سایت، تمیز طراحی تصاویر غنی از فیلم های دیزنی و تلویزیون است که می تواند به صورت آنلاین در سایت مشاهده شده است، و استفاده خوبی از آژاکس و history.pushState باعث می شود برای انتقال ظریف، بدون jarring صفحه.
بهترین وب سایت های پاسخگو: Disney.com
"این سایت همچنین تعاملات متنی متفاوتی را ارائه می دهد، مانند چرخش های حرکتی حرکتی برای دستگاه های لمسی و صفحه غیرفعال - کشویی روی صفحه نمایش کوچک."
11. Fray، شماره 3
اسکات جله به یاد می آورد: "شماره 3 فری،" مجله اصلی داستان های اینترنتی "، طراحی مناسبی بود که من در سال جاری دیدم، و شاید هم مورد علاقه ام. "علاوه بر طرح پوشش زیبا پاسخگو، که در آن عناصر طراحی از آثار هنری پوشش در مجاورت طرح استفاده می شوند، هر یک از مقالات در این موضوع دارای طراحی منحصر به فرد خود با طراحی خاص خود است، بسیار شبیه به ما در مجلات چاپی، اما کمتر در وب
بهترین سایت های پاسخگو: Fray
بسیاری از طرح بندی CSS به خوبی به زیبایی تبدیل شده اند، مانند عنوان بریده شده و خط مقدم مقاله "برس"، و offset pullquotes در سراسر. فقط یک هشدار: موضوع سایت به سمت بزرگسالان است. "
12. Gov.uk
استفن هی می گوید: "طراحی Gov.uk به صورت بصری ساده است (عملا هیچ تصویری)، اما روشن است که هدف آن چیست: کمک به شما در پیدا کردن اطلاعات سریع. برای وب سایت های دولتی، این کار آسان نیست. من عاشق این سایت هستم نه تنها پاسخگو است، بلکه یک مثال کامل از اینکه محتوای و ساختار به خوبی تفکر می تواند منجر به یک تجربه کاربری واضح تر شود، صرف نظر از دستگاه مورد استفاده.
بهترین وب سایت های پاسخگو: Gov.uk
"این بسیار مهم است که دولت ها اطلاعات خود را به طور قابل دسترسی ارائه می دهند؛ من مطمئن هستم که سادگی این سایت نمونه ای از سازمان های دولتی خواهد بود".
13. وضعیت Heroku
Scott Jehl از انتخاب دوم خود می گوید: "Heroku یک سرویس استقرار برای برنامه های کاربردی وب است، بنابراین این سایت به سمت یک مخاطب بسیار فنی حرکت می کند." "سایت وضعیت Heroku صرفا یک مکان برای نظارت بر آپاچی سرویس است، با اطلاعیه های وضعیت برای هر حادثه فعلی و جدول زمانی گزارش ها.
بهترین سایت های پاسخگو: Heroku
"ارائه صفحه نمایش کوچک، محافظه کارانه است، اما بسیار کاربردی و معنایی غنی است، با یک لیست لیست طراحی شده به خوبی طراحی شده است. با این حال، در نمایشگاه های گسترده تر، جدول زمانی به تجسم داده های عمودی که حوادث جعبه هستند و با نقاط زمان با استفاده از بوم انحناء HTML5 خطوط قرمز، مطالب را جذاب تر می کند. "
14. Lotta Nieminen
"سایت هوشمندانه لوتا اکتشاف را تشویق می کند، به عنوان سمت چپ و راست روی صفحه نمایش محتوای ایزوله از بخش های مجاور،" سهام Elliot Jay سهام را مضطرب می کند.
بهترین وب سایت های پاسخگو: Lotta Nieminen
"من نیمی از این انتظار را داشتم که در عرضهای مختلف شکست بخورم، اما رفتار همیشه در همه زمان ها سازگار است و با استفاده از جاوا اسکریپت برای نمایش پشته و تغییر اندازه ستون های مختلف به طور قابل ملاحظه ای ترکیب می شود."
15. مایکروسافت
بن Callahan نشان می دهد "سایت جدید مایکروسافت به دلایل بسیاری به من هیجان زده است.
"برای دیدن یک غول مانند مایکروسافت در پشت طراحی وبسایت پاسخگو به این شیوه واقعا نشان می دهد که چقدر در دو سال گذشته پیشرفت کرده ایم. طراحی به روشنی سبک مترو را در بر میگیرد و به ما سطح پاکیزگی و فضا را میدهد که در اکثر موارد از دست رفته است سایت های شرکت های بزرگ نیز دارای مقدار قابل توجهی از ناوبری هستند که می تواند یک چالش واقعی برای استفاده در طیف گسترده ای از دیدگاه ها و مدل های تعامل باشد. من عاشق این واقعیت است که کشویی پشت سر گذاشته می شود یا [رویدادها] را به عنوان مخالف لمس می کند به: شناور.من معتقدم که ما در آینده نزدیک شاهد خواهیم بود که خیلی بیشتر از این ببینیم، حتی در قطعنامه های بزرگتر. خوب انجامparavelinc! "
ریگان ری که در سایت مشغول به کار بود می گوید: "ترنت و دیو برای ساختن شاخ پاراول خیلی مرطوب هستند، بنابراین من می خواهم یک بازی کوچک در این زمان هیجان انگیز برای مایکروسافت انجام دهم. من فکر می کنم این یک نمونه عالی است یک شرکت بزرگ اتخاذ طراحی پاسخگو. "
16. چند ضلعی
"دیو روپرت، مدیر توسعه Paravel و میزبان شرکت ShopTalk با کریس کوییر،" ستون چندینگانه یک سایت بازی بسیار جذاب غنی است که برادران بزرگش (IGN، Gamespot و غیره) را به شرم بر می دارد. " "گرافیک های بزرگ منجر به احساسات بازیگران من می شود. پست های داخلی یک ترکیب شگفت انگیز از جهت هنر و معماری پاسخگو است."
17. شورش
الیوت جی سهام سهام می گوید: "سایت های ساده، محور، یک صفحه ممکن است به نظر برسند که به راحتی به طراحی پاسخگو تبدیل می شوند، اما مهارت، در نظر گرفتن و چشم های مشتاق برای ایجاد همه چیز یکپارچه می شود.
18. کت و شلوار لاغر
بن کله هان می گوید: "در حالی که من هیچ روابط ضعیفی ندارم، به غیر از چندین دهه ی گذشته یکی از ذخایر ذخیره شده در یک ظرف ذخیره سازی، من فکر می کنم این سایت به زیبایی اجرا می شود." "این نیز تشویق برای دیدن تکنیک های پاسخگو در سایت های پیچیده تر استفاده می شود: در این مورد، تجربه تجارت الکترونیک. ناوبری در این سایت در تمام resolutions resolution viewport منحصر به فرد است، اما در پایان کوچک طیف فوق العاده خوب عمل می کند. طبیعت بصری آن کاملا مناسب برای یک فروشگاه از این اندازه است و با وجود استفاده از باقی مانده قابل استفاده است: شناور در دستگاه های لمسی. خوب انجامfalkowski! "
19. استارباکس
"Starbucks.com پاسخگو است عالی است، اما آنچه که برای ما الهام بخش تر است، راهنمای مبتنی بر وب است که با آن می آید"، Trent Walton، بنیانگذار Paravel، اشاره می کند. "این قدرت طرح مایع / پاسخگو را بسیار بهتر از یک فایل PSD یا PDF می کند."
20. تاتلی
"من فقط زمان غرق خطرناکی را در این فهرست گنجانده ام،" مت Matquis از این سایت خالکوبی موقت هشدار می دهد "بنابراین من از قبل به شما و / یا رئیس شما عذرخواهی می کنم. من از طریق مقدار شرم آور زمان مرور کردن طراحی شده در Tattly در سراسر دستگاه های مختلف، و من هرگز به دنبال تجربه من می توانم فقط در یک نقطه پایانی خاص. آنها کار بزرگی انجام شده مطمئن شوید که سایت خود را به خوبی به طیف وسیعی از اندازه دستگاه / پنجره، و شاید حتی مهمتر از همه، آنها به من یک روش مطمئن برای ساختن خودم را به عنوان یک بدبختی به من نشان می دهند. به هر حال، برای چند روز در یک زمان. "
21. وب بعدی
دیو روپرت می گوید: "در حالی که من هنوز از طرف نوار کناری چسبنده نیستم، این سایت بسیار شگفت انگیز است." "فضای خالی و تایپوگرافی یک محیط کاملا آرام را ایجاد می کنند. زمانی که از TNW بر روی یک رایانه لوحی بازدید می کنم خوشحال می شوم. احساس خوبی دارد و تجربه خواندن خوب است."
22. شکل طراحی
"ترنت والتون می گوید:" فرانک کیمورو در یک تجربه خواندن پاسخگو الهام بخش است ". "نسخه آنلاین از شکل طراحی خوشحال است که بخواند. ناوبری فصل غافلگیرانه خوب عمل می کند و مقیاس اندازه اندازه فونت media-query همه چیز را به خوبی مطابقت می دهد."
23. زمان
استفن هی، پس از پیروی از رهبر بوستون گلوب، زمان خود را در جهان وب سایت های خبره پاسخگو با اجرای آن تحریک کرده است. "واقعیت این است که یک وب سایت خبرنامه کمتر در جهان وجود دارد که به ما یک پیوند به" وب سایت کامل "را در تلفن همراه ارائه می دهد، اما اکنون به اندازه کافی خوب است، اما این سایت واقعا خوب به نظر می رسد: این هویت زمان از طریق و از طریق آن است. متن ممکن است کمی بر روی برخی از دستگاه ها باشد، اما توسعه دهندگان مقیاس را ترک کرده اند: همیشه یک ایده خوب است. بعضی از مراحل می تواند برای بهبود عملکرد، مانند ارائه تصاویر مقیاس کوچک انجام شود [اما] با این وجود، این یک قدم در جهت درست است. "
24. Pixelworkers United
جیمز یانگ می گوید: "من طرفدار سادگی جسور Pixelworker های متحده و طرح شبکه های جامد و درمان ناوبری برای صفحات کوچک به خوبی کار می کند. "همانطور که با سایت Currys، این یک سایت تجارت الکترونیک است که به راحتی می توانم کار اصلی خود را - خرید چیزهای خوب - بر روی هر دستگاه انجام دهم.
"شرم آور است که شما Shopify را برای تکمیل خرید خود پر می کنید و من دوست دارم حداقل یک صفحه تکمیل فرم پرداخت مارک را ببینم، اما هنوز هم بسیار آسان است که تی شرت خود را خریداری کنم."
"تجارت الکترونیک پاسخگو دشوار است، اما به نظر می رسد Pixelworkers آن را فاش کرده است،" دیو روپرت اضافه می کند. "صفحه اصلی بزرگ، صفحات محصول عالی، جریان بزرگ پرداخت. اگر شما دنبال ایجاد یک سایت تجارت الکترونیک پاسخگو فوق العاده،
