شیفتگی روزافزون وب به طراحی مسطح منجر به رد سریع تصنعی مانند سایه های رها شده، به نفع ظاهری تمیزتر و مبتنی بر شکل. اما این موضوع طراح را با یک مشکل مواجه میکند: چگونه میتوانید با رعایت اصول طراحی مسطح، سبک تایپ کنید تا پر جنب و جوش باشد؟
یک راه حل، علاقه مجدد به حروف رنگی است. در استفاده گسترده در چاپ بلوک چوبی قرن نوزدهم، چهرههای رنگی از چندین رنگ برای تعریف مناطق مختلف استفاده میکنند. این رویکرد مخالف طراحی لوگوی مدرن است، که در آن به ما آموزش داده شده است که اشکال باید در یک لحن واحد کار کنند.
مزایای طرحهای رنگی این است که عمق، تأکید و شخصیت را اضافه میکنند. بدون نیاز به تزیین متن سرزده تر مانند سایه ها.
یکی از بهترین نمونههای آن سوداکروم است. طراحی شده توسط Dan. Rhatigan و Ian Moore، Sodachrome از دو فونت مجزا تشکیل شده است. یکی که در آن سری ها به سمت چپ اشاره می کنند و دیگری که در آن به سمت راست اشاره می کنند. این دو فونت بهصورت جداگانه تنظیم شدهاند، بهطور مشخصی نامتعادل به نظر میرسند، با این حال با رنگهای مختلف روی هم قرار میگیرند، آنها یک سری slab جذاب ایجاد میکنند. مزیت اضافی سوداکروم این است که همپوشانی بین دو رنگ، چهره سومی را ایجاد میکند که یک sans-serif مدرن در قلب طراحی است. علاقه بصری در Sodachrome توسط تعامل بین این سه طرح مختلف ایجاد می شود.
سوداکروم اثر دن راتیگان و یان مور.
توسعه فونت های رنگی برای استفاده در وب تا حدودی یک چالش است. در حالی که طرحهایی مانند ناکسویل لیزا لونرگان از طرحهای بسیار سنتی رومی پیروی میکنند، طرحهایی مانند دان به آسانی در قالبهای طرح بردار جا نمیشوند.
نوکسویل اثر لیزا لونرگان.
پیگمنت اثر مارک فرومبرگ.
تایپها، حتی چهرههایی به سبک گرانج، بهعنوان طرح کلی طراحی شدهاند. خطوط را می توان مقیاس، رنگ و با فاصله به هر نحوی که طراح انتخاب می کند، تغییر داد. OpenType (OT)، TrueType (TT)، Web Open Font Format (WOFF) و تقریباً هر فرمت موجود دیگر به این روش کار می کند. این بدان معنی است که یک طرح رنگی را نمی توان در یک فایل مشخص کرد. با این حال، به شرطی که حروف رنگی به صورت دو فایل فونت جداگانه ارائه شود، میتوانیم به راحتی یکی را روی دیگری قرار دهیم.
CSS حتی به ما این امکان را میدهد که با استفاده از ویژگی content عنوان را در سبکها کپی کنیم و از دوبرابر کردن محتوا در نشانهگذاری جلوگیری کنیم که تأثیر منفی بر سئو و دسترسی خواهد داشت.
قالب اصلی این است:
و در CSS:
h1
{
font-family:"چند فونت رنگی A";
رنگ: rgba (50، 0، 0، 0.5)؛
موقعیت:نسبی;
}
h1: بعد از
{
font-family:"بعضی فونت رنگی B";
رنگ: rgba (0، 50، 50، 0.5)؛
موقعیت: مطلق;
چپ: 0;
محتوا:"هر عنوان قدیمی";
}در حال حاضر، فقدان فونتهای رنگی که برای استفاده از وب تولید میشوند، احتمالاً به این معنی است که استفاده از آنها برای سایتهایی مانند وبلاگهایی که به سربرگهای متعدد نیاز دارند، یک قدم بسیار دور است. اما برای نشانوارهها یا سرصفحههایی که به ندرت تغییر میکنند، در جایی که استفاده از یک تصویر قابل قبول است، حروف رنگی روشی پر جنب و جوش و جذاب برای تنظیم نوع است که زیباییشناسی صافی را حفظ میکند.
آیا با حروف رنگی کار کرده اید؟ با چه مشکلات فنی مواجه شدید؟ در نظرات به ما اطلاع دهید.
بدون دیدگاه