تایپوگرافی چیست : چه در تلفن های ما ، چه در کتاب ها و چه در وب سایت ها ، ما دائماً کلمات نوشته شده را هضم می کنیم. از جزوات آموزشی گرفته تا مغازه ها ، نوع در اطراف ما وجود دارد. ما اغلب بر قدرت کلمه نوشته شده تأمل می کنیم ، اما به ندرت نقش طراح را در شبیه سازی لحن کلمه یا جمله در نظر می گیریم.
در پشت صحنه ، یک طراح وقت گذاشته است تا رابطه بین ظاهر متن و آنچه متن می گوید را در نظر بگیرد. در واقع ، خلق و خو ، جو و احساسات مختلف را می توان به سادگی از طریق انتخاب نوع بیان کرد. اما در واقع تایپوگرافی چیست – و چرا اینقدر حیاتی است؟
در این مقاله ، ما همه چیز را که باید در مورد تایپوگرافی بدانید ، برمی داریم. ما با تعریف تایپوگرافی ، شامل تاریخ مختصری از ریشه های آن شروع می کنیم. سپس به مزایای تایپوگرافی خوب و تأثیر آن بر کاربران شما می پردازیم. در نهایت ، ما عناصر مختلفی را که شامل تایپوگرافی هستند ، و معنی همه آنها را بررسی خواهیم کرد.
1. تایپوگرافی چیست؟
بیایید با اصول اولیه شروع کنیم: در واقع تایپوگرافی چیست؟ در اصل ، تایپوگرافی هنر چیدمان حروف و متن به گونه ای است که نسخه را خوانا ، واضح و از نظر بصری برای خواننده جذاب کند. تایپوگرافی شامل سبک ، ظاهر و ساختار فونت است که هدف آن برانگیختن احساسات خاص و انتقال پیام های خاص است. به طور خلاصه ، تایپوگرافی چیزی است که متن را زنده می کند.
در ویدئوی زیر ، الگا ، مربی طراحی CareerFoundry UI توضیح می دهد که چرا تایپوگرافی اهمیت دارد – و چه تفاوتی برای کاربران شما ایجاد می کند.
قدمت تایپوگرافی را می توان به قرن یازدهم ، در طول نوآوری در نوع متحرک ، باز کرد. قبل از عصر دیجیتال ، تایپوگرافی یک هنر تخصصی مرتبط با کتاب ها و مجلات و در نهایت آثار عمومی بود. اولین نمونه تایپوگرافی را می توان در انجیل گوتنبرگ مشاهده کرد ، که انقلاب تایپوگرافی را در غرب آغاز کرد. واقعیت جالب: سبک نوع مورد استفاده در کتاب مقدس گوتنبرگ اکنون با نام Textura شناخته می شود و امروزه آن را در منوی کشویی فونت در برنامه های اصلی دسکتاپ خواهید یافت!
سریع به روزهای مدرن بروید ، جایی که تایپوگرافی بیشتر با دنیای دیجیتال و چاپ همراه است. با پیدایش اینترنت ، انفجاری خلاقانه در هنر تایپوگرافی بوجود آمد. ناگهان طراحان وب فراوانی از فونت ها و گزینه های تایپ در اختیار داشتند که از نظر بصری تایپوگرافی را بیش از هر زمان دیگری متنوع می کند.
2. چرا تایپوگرافی مهم است؟
تایپوگرافی بسیار فراتر از انتخاب فونت های زیبا است: این یک جزء حیاتی در طراحی رابط کاربر است. تایپوگرافی خوب یک سلسله مراتب بصری قوی ایجاد می کند ، یک تعادل گرافیکی در وب سایت ایجاد می کند و تن کلی محصول را تعیین می کند. تایپوگرافی باید کاربران شما را راهنمایی و آگاه سازد ، خوانایی و دسترسی را بهینه کرده و تجربه کاربری عالی را تضمین کند.
بیایید کمی عمیق تر بررسی کنیم که چرا تایپوگرافی اینقدر مهم است.
تایپوگرافی به رسمیت شناخته شدن نام تجاری است
تایپوگرافی خوب نه تنها شخصیت وب سایت را ارتقا می دهد ، بلکه کاربران شما به طور ناخواسته شروع به مرتبط کردن حروف تایپ شده در سایت شما با نام تجاری شما می کنند. تایپوگرافی منحصر به فرد و سازگار به شما کمک می کند تا یک کاربر قوی پیدا کنید ، با کاربران خود اعتماد کنید و به پیشبرد نام تجاری خود کمک کنید.
تایپوگرافی بر تصمیم گیری تأثیر می گذارد
تایپوگرافی تأثیر عمیقی بر نحوه هضم و درک کاربران از اطلاعات منتقل شده توسط متن دارد. نوع چشم نواز بسیار قانع کننده تر از فونت های ضعیف است که پیام متن را تقویت نمی کند.
تایپوگرافی توجه خوانندگان را به خود جلب می کند
تایپوگرافی خوب می تواند تفاوت بین شخصی باشد که یک دقیقه یا نیم ساعت در وب سایت شما بماند. مهم این است که وب سایت شما از نظر بصری تحریک کننده و به یاد ماندنی باشد و تایپوگرافی نقش مهمی در این فرایند ایفا می کند.
3. عناصر مختلف تایپوگرافی
برای شروع تایپوگرافی ، ابتدا باید با هشت عنصر اصلی طراحی تایپی آشنا شوید.
فونت ها و حروف تایپ
در مورد تفاوت بین حروف تایپ و فونت نوعی سردرگمی وجود دارد ، بسیاری از آنها این دو را مترادف تلقی می کنند. حروف تایپ یک سبک طراحی است که شامل تعداد بیشماری از شخصیت ها در اندازه ها و وزن های مختلف است ، در حالی که یک فونت یک نمایش گرافیکی از شخصیت متن است. به بیان ساده تر ، یک نوع حروف خانواده ای از فونت های مرتبط است ، در حالی که فونت ها به وزن ، عرض و سبک های تشکیل دهنده یک حروف اشاره می کنند.
سه نوع اصلی حروف تایپ وجود دارد: serif ، sans-serif و تزئینی. برای حفظ رابط کاربری ساده و ساده ، یک طراح خوب هرگز بیش از سه فونت استفاده نمی کند – و فونت های تزئینی را به حداقل می رساند. اکثر طراحان UI فونت های serif را با فونت های sans-serif جفت می کنند ، مانند قرار دادن متن اصلی در یک فونت serif و قرار دادن عنوان شما در یک فونت sans-serif یا برعکس.
تضاد
مانند سلسله مراتب ، کنتراست به انتقال ایده ها یا پیامهایی که می خواهید بر خوانندگان خود تأکید کنید کمک می کند. صرف مدتی روی کنتراست ، متن شما را جالب ، معنی دار و جلب توجه می کند. اکثر طراحان با بازی در انواع مختلف حروف ، رنگ ها ، سبک ها و اندازه ها برای ایجاد تأثیر و شکسته شدن صفحه ، تضاد ایجاد می کنند.
ثبات
حفظ یکپارچگی حروف برای جلوگیری از رابط گیج کننده و آشفته کلیدی است. هنگام انتقال اطلاعات ، ضروری است که از همان سبک فونت استفاده کنید ، بنابراین خوانندگان شما بلافاصله آنچه را که می خوانند درک کرده و متوجه الگو می شوند. در حالی که بازی تا حدی با سطوح سلسله مراتبی خوب است ، اما ایجاد یک سلسله مراتب ثابت از حروف تایپ (یک فونت سازگار برای سرصفحه ها ، دیگری برای زیرعنوان) و عمل به آن مطلوب است.
فضای سفید
فضای سفید که اغلب به عنوان “فضای منفی” نامیده می شود ، فضای اطراف متن یا گرافیک است. اغلب نادیده گرفته می شود و معمولاً مورد توجه کاربر قرار نمی گیرد ، اما استفاده صحیح از فضای سفید تضمین می کند که رابط کاربری بدون مشکل و متن قابل خواندن است. فضای سفید حتی می تواند توجه را به متن جلب کند و یک تجربه کلی از نظر زیبایی را ارائه دهد. فضای سفید اغلب به صورت حاشیه ، پد یا مناطق بدون متن یا گرافیک ظاهر می شود.
هم ترازی
تراز کردن فرآیند یکپارچه سازی و ترکیب متن ، گرافیک و تصاویر برای اطمینان از وجود فضای مساوی ، اندازه و فاصله بین هر عنصر است. بسیاری از طراحان رابط کاربری حاشیه ایجاد می کنند تا اطمینان حاصل شود که لوگو ، سرصفحه و متن متن با یکدیگر همسو هستند. هنگام تراز کردن رابط کاربری خود ، توجه به استانداردهای صنعت خوب است. به عنوان مثال ، تراز کردن متن شما به راست برای خوانندگانی که از چپ به راست می خوانند ، غیرعادی به نظر می رسد.
رنگ
رنگ یکی از هیجان انگیزترین عناصر تایپوگرافی است. اینجاست که طراحان واقعاً می توانند خلاقانه عمل کرده و رابط کاربری را به سطح جدیدی ارتقا دهند. با این حال ، رنگ متن را نباید نادیده گرفت: میخ زدن رنگ فونت شما می تواند متن را برجسته و لحن پیام را منتقل کند – اما اشتباه گرفتن آن می تواند منجر به رابط کاربری نامرتب و متن شود که با رنگ های سایت در تضاد است.
رنگ دارای سه جزء اصلی است: ارزش ، رنگ و اشباع. یک طراح خوب می داند که چگونه بین این سه جزء تعادل ایجاد کند تا متن هم چشم نواز باشد و هم خوانا ، حتی برای کسانی که دارای نقص بینایی هستند. اغلب ، طراحان با مشاهده متن در مقیاس خاکستری (بدون رنگ) و انجام ترفندها در صورتی که متن بیش از حد تیره یا بیش از حد روشن در برابر رنگ پس زمینه باشد ، آن را آزمایش می کنند.
سلسله مراتب
ایجاد سلسله مراتب یکی از مهمترین اصول تایپوگرافی است. سلسله مراتب تایپوگرافی با هدف ایجاد تمایز واضح بین قطعات برجسته ای از کپی که باید به آنها توجه شود و ابتدا خوانده شوند و کپی متن استاندارد ، ایجاد شود. در عصر توجهات کوتاه مدت که توسط رسانه های اجتماعی ایجاد شده است ، از طراحان خواسته می شود که مختصر باشند و حروف تایپی ایجاد کنند که به کاربران اجازه می دهد اطلاعات لازم را در مدت زمان کوتاهی مصرف کنند.
سلسله مراتب را می توان با استفاده از اندازه ، رنگ ، کنتراست و تراز ایجاد کرد. به عنوان مثال ، اگر یک خط کپی با نماد علامت تعجب در ابتدا دارید که به رنگ قرمز و بزرگتر از نسخه قبلی است ، این یک سرنخ تصویری برای خوانندگان است که این یک فراخوان برای اقدام است. معمولی ترین نمونه سلسله مراتب تایپی اندازه است: سرفصل ها همیشه باید بزرگتر از عناوین فرعی و متن استاندارد باشند.
4. چگونه حروف مناسب را برای وب سایت خود انتخاب می کنید؟
اکنون که ما با عناصر مختلف تایپوگرافی آشنا شده ایم ، بیایید در مورد روند انتخاب حروف تایپ برای رابط کاربری خود صحبت کنیم. با وجود فونت ها و حروف تایپی مختلف برای انتخاب ، احساس غرق شدن آسان است. انتخاب صحیح به چیزهای بیشتری بستگی به دیدن چیزهای زیبا دارد. در اینجا چند نکته مهم وجود دارد:
به شخصیت فکر کنید
چگونه می خواهید کاربران شما هنگام ورود به وب سایت شما چه احساسی داشته باشند. آیا می خواهید از فضایی دوستانه تقلید کنید؟ آیا می خواهید سایت دارای سطح بالا ، استقبال ، بازیگوش یا جدی باشد؟ ضروری است که تایپوگرافی منعکس کننده شخصیت برند یا محصول باشد. یک نقطه شروع خوب در مواجهه با این چالش این است که ویژگی های اصلی نام تجاری خود را مشخص کنید و شروع به جمع آوری انواع حروف که منعکس کننده این ویژگی ها است کنید. از آنجا می توانید متوجه یک روند شوید.
در مورد لحن فکر کنید
به همان اندازه مهم است که چگونه فونت با لحن پیام هماهنگ شود. به عنوان مثال ، اگر می خواهید اطلاعات جدی یا مهمی را منتقل کنید ، یک فونت کمتر سبک یا تزئینی انتخاب کنید که هم به وضوح خوانا باشد و هم حواس پرتی را محدود کند.
در عملکرد کوتاهی نکنید
عملکرد نیز به همان اندازه حیاتی است: هیچ چیز بدتر از وب سایتی نیست که بسیار زیبا به نظر برسد اما کاملاً ناخوانا باشد و شما را مجبور به کلیک روی دکمه اشتباه یا چرخاندن اشتباه به دلیل نامشخص بودن دستورالعمل ها کند. هنگام تصمیم گیری در مورد نوع حروف در رابط کاربری خود ، سبک ، زیبایی و صدا را کنار بگذارید و در مورد خوانا بودن ، خواندن و دسترسی فونت فکر کنید. آیا متن بدون فشار قابل خواندن است؟ آیا شخصیت ها به اندازه کافی متمایز هستند؟
عملکرد را در نظر بگیرید
یکی از مواردی که بسیاری از طراحان اغلب از آن غافل می شوند ، انتخاب نوع حروف مناسب برای مرورگر وب است. کتابخانه های فونت متداول مانند فونت های Google فایل های فونت مبتنی بر وب را ارائه می دهند که می توانند بدون هیچ مشکلی در مرورگر به طور کامل ارائه شوند. نکته حرفه ای: هنگام بارگیری فونت های وب ، هرگز مجموعه کاراکترهای بیشتری از آنچه که نیاز دارید بارگیری نکنید. به این ترتیب از اضافه وزن جلوگیری می کنید!
الهام گرفته
اگر مطمئن نیستید از کجا شروع کنید ، کمی وقت بگذارید تا ببینید دیگران چه کار می کنند. چشم خود را به تایپوگرافی که در اطراف خود می بینید باز کنید. آیا می توانید به الگوهای مشابه توجه کنید؟ آیا می توانید نمونه های خوب و بد تایپوگرافی را ببینید؟ حتی دنبال کردن هشتگ های تایپوگرافی در رسانه های اجتماعی یا جستجوی تایپوگرافی در Pinterest ، ایده های خوبی از آنچه در آنجا وجود دارد به شما می دهد. برای الهام بیشتر می توانید به این هشت گرایش تایپوگرافی نگاه کنید.
کمی وقت بگذارید تا آزمایش شود
بهترین راه برای رمزگشایی از کدام فونت برای رابط کاربری شما استفاده می شود؟ آزمایش ، آزمایش و آزمایش! با جمع آوری بازخورد مفید از کاربران واقعی ، بینش واضح تری از آنچه که کار می کند ، چه چیزی نیست ، چه چیزی خوانا است و چه چیزی غیرقابل تصور یا دست و پا گیر است به دست خواهید آورد.
5. نتیجه گیری
تایپوگرافی اغلب نادیده گرفته می شود ، اما جزء مهمی در طراحی رابط کاربر است. تسلط بر تایپوگرافی شما را در راه تبدیل شدن به یک طراح UI فوق العاده می بیند! اگر مطمئن نیستید از کجا شروع کنید ، چرا به وب سایت های مورد علاقه خود سر نزنید و یادداشت نگاری کنید که برای چه نوع حروفی رفته اند.
منبع با دوربین
بیشتر بخوانید:
سریال رچد | بهترین کتاب های ادبیات آمریکا | ایوان آیوازوفسکی کیست بیوگرافی آیوازوفسکی و هنرمند | نقد فیلم پدرخوانده 1 | The Godfather | عزیمتی به عظمت هنر هفتم | بهترین فیلم های اسکارلت جوهانسون | بهترین فیلمهای جنیفر انیستون | هارولد رابینز | بهترین فیلم های چارلی چاپلین | فیلم قاصد