Menu
97 35 94 66  info@samiaco.ir
15

مسابقه CSS Grid در طراحی سایت

مسابقه CSS Grid در طراحی سایت

طراحی CSS Grid در حال تبدیل شدن به استاندارد جدید برای طراحی سایت می باشد بسیاری از طراحان در بخش های متعدد سایت برای انعطاف پذیری CSS Grid و نمایش زیبای آن در انواع دیوایس های اینترنتی از آن بهره می گیرند . برخی از طراحان اعتقاد دارند که CSS Grid جایگزین مناسبی طرح بندی جداول و یا Flexbox می باشند برخی دیگر از این ویژگی CSS برای طرح های پیشرفته چاپی استفاده می کنند اما چرا CSS Grid به این خوبی بین طراحان سایت محبوب شده است ؟ شاید می توان یک علت آن را پشتیبانی تمامی مرورگرها از این ویژگی CSS دانست واقعیت این است که طراحان امروزه نیز با ویژگی های در CSS مواجه می شوند که توسط تمامی مرورگرها پشتیبانی نمی شود و یا به درستی اجرا نمی گردد . ما در ادامه به برخی از ویژگی ها و نمونه های CSS Grid می پردازیم . اولین طرحی که ما می خواهیم به آن بپردازیم برنده مسابقه CSS Grid سال 2017 شده است جیمز کلارک ، این طراح با طراحی CSS Grid در سایتی که برای مسابقه آماده کرده بود توانست نظر بیشتر متخصصان را به خود جلب نماید . اساسا کلارک بر روی حرکت کردن صفحات در سایت تحقیق می رد و توانست حرکت بین صفحات سایت را به صورت متفاوت توسط طرح بندی CSS Grid ایجاد نماید همچنین طوری صفحات طراحی شده اند که تمرکز بر روی هر صفحه کاملا مشهود می باشد . شما می توانید از این لینک طرح مورد نظر را مشاهده نمایید .


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


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


REN AYSHA

شاید این طرح را در دموی فیلم های متعدد دیده باشید ولی جالب است بدانید این طرح ها می توان با استفاده از CSS Grid ایجاد نمود . این طرح نیز در مسابقه CSS Grid توانست نظرها را به سمت خود جلب نماید چرا که بخش های متعدد آن از این ویژگی استفاده کرده اند .

تعداد امتيازات: (1) Article Rating
تعداد مشاهده خبر: (46)
کد خبر: 2364


  • مسابقه CSS Grid در طراحی سایت