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

سودمندی از الگوی کارت در طراحی سایت بسیار برای شما مفید خواهد بود به دلیل اینکه شما می توانید به راحتی کارت ها را برای همه صفحه نمایش ها طراحی کنید به خصوص در دستگاه های تلفن همراه، به طور مثال وب سایت Pinterest  را ببینید که از این تکنولوژی به نحو احسن و زیبا در سایت خود استفاده می کند همچنین Facebook  و Twitter  نیز در برخی از المان های خود آن از این کارت ها بهره جسته اند و در بیشتر وب سایت ها دیگری می توانید این تکنولوژی را ببینید.

ما در این مقاله بررسی می کنیم که کارت ها چگونه در طراحی سایت رشد کردند؟ رابط کاربریشان چگونه است؟ در چه اندازه مفید هستند؟ در واکنش گرا بودن سایت چه تاثیراتی دارند؟ و در آینده این تکنولوژی به کجا می رود؟

برای درک این موضوع شما باید اول متوجه شوید که کارت ها دقیقا چی هستند.

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

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

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

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

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

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

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

مزیت دیگر کارت ها این است که در زمانی که شما با موبایل به مرور این سایت ها مشغول هستید هر کارت انقدر فضا دارد که به راحتی و با کلیک بر روی آن به صفحه مورد نظری بروید یا با عکس مورد نظر کارت را باز کنید، خیلی وقت ها شده است در زمان مرورگری با موبایل شما برای کلیلک بر روی متنی کوچک به دردسر افتاده اید!!

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

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

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

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

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

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