تایپوگرافی در طراحی سایت کاربردهای زیادی دارد. تایپوگرافی (Typography) نوعی هنر و تیم تکنیک هایی هست که جهت خوانا و زیباتر شدن نوشته ها و متن های تارنما های اینترنتی بکار می رود. تایپوگرافی به ما امداد می کند که وب سایت هایی قشنگ و جالب داشته باشیم که کاربران هنگام بازدید از سایت و خواندن متون و نوشته ها، تشویق به ادامه خواندن آن ها شوند و مطالب به طور کامل خوانا و زیبا بنظر بیایند.
خوشبختانه امروزه ابزارها، اپ ها و نرم افزارهای متعددی (مانند: Google Fonts، Font Awesome،Adobe Typeface، Apple Typeface و...) در مشت طراحان وب سایت قرار گرفته که موجب شده قواعد تایپوگرافی هر چه بهتر در تارنما های اینترنتی پیاده سازی شده و جذابیت بصری آنها برای کاربران بیشتر خواهد شد.
تایپوگرافی چیست؟
همان گونه که اشاره کردیم تایپوگرافی در واقع مربوط به ظاهر نوشته ها می باشد. چه آن نوشته در وبسایت باشد و چه در روزنامه، خبرنامه، کتاب و ... در واقع کاربرد هنر تایپوگرافی امروزه بسیار گسترده می باشد البته یکیاز مهم ترین کاربردهای این هنر در ساخت وب سایت ها میباشد. تکنیک های تایپوگرافی مشمول موارد زیادی میشوند برای مثال:
· تایپ شکل (typefaces)
· سریف و سانزسریف (serif and sans serif)
· فاصله ها
· جهت ها
· کنتراست (تضاد)
· رنگ ها
در ادامه هرمورد از این موردها را به اعتنا رسیدگی و به کاربردهای آنها در دنیای وب می پردازیم:
- تایپ شکل (typefaces) :
تایپ شکل تیم ای از یک یا تعدادی نوع فونت است که شکل ظاهری کارکترهای الفبای گزینه استفاده را تشکیل میدهند. در حقیقت تعیین نوع فونت بکار رفته در متن های یک سایت دراین دسته قرار میگیرد و یکیاز مهم ترین اصول تایپوگرافی به شمار می رود. تا حدی که بسیاری از کارشناسان و متخصصین بهینه سازی وب سایت (که عبارتست از بهینه سازی سایت های اینترنتی جهت دیده شدن هر چه عالی در موتورهای جستجو مانند گوگل و یا بینگ) هم اهمیت این مسئله را گوشزد می کنند.
این آیتم برای طراحی وب در دنیای امروز التفات زیادی دارااست و به همین جهت تاکنون تعداد زیادی از انواع فونت ها جهت به کار گیری در وب طراحی و عرضه گردیده است. با امداد این فونت ها می قدرت متون را به زیبایی هر چه بیشتر در سایتها نوشت و جذابیت وبسایت را برای کاربران دوچندان کرد.
- سریف و سانس سریف (serif and sans serif) :
نوع اتوماتیک ها در تایپوگرافی به دو دسته تقسیم میشوند:
· سریف (حروفی که انتهای آنان دارای کشیدگی است)
· سانس سریف (حروفی که نگارش آنها بی آلایش تر است و انتهای آن ها سوای کشیدگی هست)
هیچ قاعده و قانون کلی جهت اینکه باید در کجا از فونت های سریف و کجا سانس سریف بهره مند شد، وجود ندارد. البته معمولا از متن های سریف در بعضا از تیترهای مهم و یا نوشته های نسبتا وقت گیر و متن نشریات استعمال میگردد و از سانس سریف بیشتر در متن های اینترنتی و کامپیوتری کوتاه و یا معدل اغلب استعمال میگردد.
در تگ های Html با به کار گیری از تگ font-family نوع فونت را می توان انتخاب کرد.
- فاصله ها:
یکی از نکات اساسی دیگر در تایپوگرافی یک سایت فاصله ها می باشد. فواصل میان لغت ها و حتی حروف یک واژه مداقه زیادی دارند و در دستورها Html با کمک تگ هایی مانند line height، word-spacing و letter-spacing می توان این فواصل را تنظیم کرد.
این فاصله ها گاهی تاثیر زیادی در جذابیت بصری متون از نگاه کاربران سایت ها داراهستند و در صورت تنظیم درست می توانند به زیبایی هر چه بیشتر سایت ها کمک زیادی کنند.
- جهت ها:
در دستورات زبان Html با استفاده از تگ هایی مانند text align، margin و padding براحتی می توان لغت ها، جملات و تیترها را جابجا کرد و در سمت راست، میانه و یا چپ متن قرار داد. این نکته به خصوص جهت قرار دادن برخی از متن ها در وسط یک خط اهمیت زیادی دارد.
- کنتراست (ناهمخوانی) :
یکی از زیباترین بخش های تایپوگرافی وبسایت های اینترنتی، ساخت تضاد (contrast) رنگ فونت ها و همچنین پیش زمینه میباشد. تصور کنید که عکسی در متن گذاشته می شود و یا تیتری که مشمول یکسری واژه و کلمه هست در بالای متن قرار داده می گردد که نیمه سمت راست آن دارای حروف قرمز رنگ با رنگ پیش موضوع آبیرنگ باشد و نیمه سمت چپ برعکس حروف آبیرنگ و رنگ پیش قضیه قرمز.
به این تکنیک ناهم خوانی یا کنتراست گفته میشود که در صورت استعمال بجا در سایت ها قادر است به ارتقا جذابیت بصری یک تارنما کمک کند. این تکنیک آنقدر میتواند مفید باشد که در بسیاری از وب سایت های آموزشی، خبری، خدماتی و حتی هنگام طراحی یک سایت فروشگاهی قادر است مورد استعمال قرار گیرد.
- رنگ ها:
آخرین موردی که در ارتباط تایپوگرافی تارنما ها میخواهیم تحقیق کنیم، به کارگیری درست از رنگ هاست. یکیاز بهترین کارهایی که امروزه طراحان تارنما های اینترنتی می توانند ایفا بدهند ساختوساز تنوع در رنگ متن، لینک ها و سایر موادسازنده وب می باشد. البته در این عمل نباید افراط کرد به دلیل آنکه به عنوان مثال در صورتی در برگه ای بیشتراز حد از رنگ های مختلف استفاده شده باشد، چشم مخاطب خسته شده و آن متن زیبایی خود را از دست میدهد.
بهترین کار این است که رنگ تیترها از یک نوع و رنگ باقی متن ها هم به رنگ دیگری باشند (مثلا خاکستری، سیاه و ...)
نکات اصلی تایپوگرافی وب سایت ها:
در نقطه نهایی چندین نکته مهم در این زمینه را به شما فراگیری می دهیم تا با رعایت آنها بتوانید وب سایت خود را هر چه زیباتر و کاربرپسند نمائید:
· همت نمایید در یک وب سایت از بیشتراز 3 نوع فونت استعمال نکنید. استعمال از فونت های زیاد در یک سایت درست نیست و چشم کاربر هنگام بازدید از وب سایت شما خسته میگردد و موجب سردرگمی می گردد
· بولد (BOLD) کردن تیترها و یا عبارات مهم درون متون قادر است به زیبایی هر چه بیشتر آن کمک کند.
· استفاده از متن آزمایشی "لورم ایپسوم" (lorem ipsum) به طراحان یاری می کند تا بطور آزمایشی این متن را در صفحه مورد نظر خود قرار دهند و بعد تنظیمات مورد نظر از جمله نوع فونت، رنگ پیش زمینه و حروف، فاصله ها و غیره را مطالعه کنند.
· هنگام طراحی صفحات وب و یا قرار دادن متن و عکس در آن ها به جهت ها، فاصله ها و همچنین امکان بکار بردن کنتراست رنگ ها توجه فرمایید. گاهی با یکسری تغییر تحول کوچک می توانید واحد سنجش بازدید از صفحات وب سایت را بیشتر و آنرا جذاب تر نمائید.
· استعمال مناسب از Bullet Point ها ، سر تیترها ، رعایت فواصل فی مابین لغات و جمله ها و همچنین رنگ و ناهمخوانی رنگ موجب هرچه جذاب تر شدن متون میگردد که این مسئله روی seo وب سایت شما نیز موثر می باشد
رعایت نکات مربوط به تایپو گرافی در طراحی وب سایت می تواند علاوه بر جذابیت، به کارایی و کاربرپسند بودن وب سایت نیز کمک بسیاری زیادی نماید. در حقیقت یکی از فاکتورهای ساخت وب سایت های حرفه ای استعمال صحیح از شکل ، اندازه و رنگ متنها میباشد که گاهی گزینه غفلت طراحان قرار می گیرد.
تایپوگرافی در طراحی سایت کاربردهای زیادی دارد. تایپوگرافی (Typography) نوعی هنر و تیم تکنیک هایی هست که جهت خوانا و زیباتر شدن نوشته ها و متن های تارنما های اینترنتی بکار می رود. تایپوگرافی به ما امداد می کند که وب سایت هایی قشنگ و جالب داشته باشیم که کاربران هنگام بازدید از سایت و خواندن متون و نوشته ها، تشویق به ادامه خواندن آن ها شوند و مطالب به طور کامل خوانا و زیبا بنظر بیایند.
خوشبختانه امروزه ابزارها، اپ ها و نرم افزارهای متعددی (مانند: Google Fonts، Font Awesome،Adobe Typeface، Apple Typeface و...) در مشت طراحان وب سایت قرار گرفته که موجب شده قواعد تایپوگرافی هر چه بهتر در تارنما های اینترنتی پیاده سازی شده و جذابیت بصری آنها برای کاربران بیشتر خواهد شد.
تایپوگرافی چیست؟
همان گونه که اشاره کردیم تایپوگرافی در واقع مربوط به ظاهر نوشته ها می باشد. چه آن نوشته در وبسایت باشد و چه در روزنامه، خبرنامه، کتاب و ... در واقع کاربرد هنر تایپوگرافی امروزه بسیار گسترده می باشد البته یکیاز مهم ترین کاربردهای این هنر در ساخت وب سایت ها میباشد. تکنیک های تایپوگرافی مشمول موارد زیادی میشوند برای مثال:
· تایپ شکل (typefaces)
· سریف و سانزسریف (serif and sans serif)
· فاصله ها
· جهت ها
· کنتراست (تضاد)
· رنگ ها
در ادامه هرمورد از این موردها را به اعتنا رسیدگی و به کاربردهای آنها در دنیای وب می پردازیم:
- تایپ شکل (typefaces) :
تایپ شکل تیم ای از یک یا تعدادی نوع فونت است که شکل ظاهری کارکترهای الفبای گزینه استفاده را تشکیل میدهند. در حقیقت تعیین نوع فونت بکار رفته در متن های یک سایت دراین دسته قرار میگیرد و یکیاز مهم ترین اصول تایپوگرافی به شمار می رود. تا حدی که بسیاری از کارشناسان و متخصصین بهینه سازی وب سایت (که عبارتست از بهینه سازی سایت های اینترنتی جهت دیده شدن هر چه عالی در موتورهای جستجو مانند گوگل و یا بینگ) هم اهمیت این مسئله را گوشزد می کنند.
این آیتم برای طراحی وب در دنیای امروز التفات زیادی دارااست و به همین جهت تاکنون تعداد زیادی از انواع فونت ها جهت به کار گیری در وب طراحی و عرضه گردیده است. با امداد این فونت ها می قدرت متون را به زیبایی هر چه بیشتر در سایتها نوشت و جذابیت وبسایت را برای کاربران دوچندان کرد.
- سریف و سانس سریف (serif and sans serif) :
نوع اتوماتیک ها در تایپوگرافی به دو دسته تقسیم میشوند:
· سریف (حروفی که انتهای آنان دارای کشیدگی است)
· سانس سریف (حروفی که نگارش آنها بی آلایش تر است و انتهای آن ها سوای کشیدگی هست)
هیچ قاعده و قانون کلی جهت اینکه باید در کجا از فونت های سریف و کجا سانس سریف بهره مند شد، وجود ندارد. البته معمولا از متن های سریف در بعضا از تیترهای مهم و یا نوشته های نسبتا وقت گیر و متن نشریات استعمال میگردد و از سانس سریف بیشتر در متن های اینترنتی و کامپیوتری کوتاه و یا معدل اغلب استعمال میگردد.
در تگ های Html با به کار گیری از تگ font-family نوع فونت را می توان انتخاب کرد.
- فاصله ها:
یکی از نکات اساسی دیگر در تایپوگرافی یک سایت فاصله ها می باشد. فواصل میان لغت ها و حتی حروف یک واژه مداقه زیادی دارند و در دستورها Html با کمک تگ هایی مانند line height، word-spacing و letter-spacing می توان این فواصل را تنظیم کرد.
این فاصله ها گاهی تاثیر زیادی در جذابیت بصری متون از نگاه کاربران سایت ها داراهستند و در صورت تنظیم درست می توانند به زیبایی هر چه بیشتر سایت ها کمک زیادی کنند.
- جهت ها:
در دستورات زبان Html با استفاده از تگ هایی مانند text align، margin و padding براحتی می توان لغت ها، جملات و تیترها را جابجا کرد و در سمت راست، میانه و یا چپ متن قرار داد. این نکته به خصوص جهت قرار دادن برخی از متن ها در وسط یک خط اهمیت زیادی دارد.
- کنتراست (ناهمخوانی) :
یکی از زیباترین بخش های تایپوگرافی وبسایت های اینترنتی، ساخت تضاد (contrast) رنگ فونت ها و همچنین پیش زمینه میباشد. تصور کنید که عکسی در متن گذاشته می شود و یا تیتری که مشمول یکسری واژه و کلمه هست در بالای متن قرار داده می گردد که نیمه سمت راست آن دارای حروف قرمز رنگ با رنگ پیش موضوع آبیرنگ باشد و نیمه سمت چپ برعکس حروف آبیرنگ و رنگ پیش قضیه قرمز.
به این تکنیک ناهم خوانی یا کنتراست گفته میشود که در صورت استعمال بجا در سایت ها قادر است به ارتقا جذابیت بصری یک تارنما کمک کند. این تکنیک آنقدر میتواند مفید باشد که در بسیاری از وب سایت های آموزشی، خبری، خدماتی و حتی هنگام طراحی یک سایت فروشگاهی قادر است مورد استعمال قرار گیرد.
- رنگ ها:
آخرین موردی که در ارتباط تایپوگرافی تارنما ها میخواهیم تحقیق کنیم، به کارگیری درست از رنگ هاست. یکیاز بهترین کارهایی که امروزه طراحان تارنما های اینترنتی می توانند ایفا بدهند ساختوساز تنوع در رنگ متن، لینک ها و سایر موادسازنده وب می باشد. البته در این عمل نباید افراط کرد به دلیل آنکه به عنوان مثال در صورتی در برگه ای بیشتراز حد از رنگ های مختلف استفاده شده باشد، چشم مخاطب خسته شده و آن متن زیبایی خود را از دست میدهد.
بهترین کار این است که رنگ تیترها از یک نوع و رنگ باقی متن ها هم به رنگ دیگری باشند (مثلا خاکستری، سیاه و ...)
نکات اصلی تایپوگرافی وب سایت ها:
در نقطه نهایی چندین نکته مهم در این زمینه را به شما فراگیری می دهیم تا با رعایت آنها بتوانید وب سایت خود را هر چه زیباتر و کاربرپسند نمائید:
· همت نمایید در یک وب سایت از بیشتراز 3 نوع فونت استعمال نکنید. استعمال از فونت های زیاد در یک سایت درست نیست و چشم کاربر هنگام بازدید از وب سایت شما خسته میگردد و موجب سردرگمی می گردد
· بولد (BOLD) کردن تیترها و یا عبارات مهم درون متون قادر است به زیبایی هر چه بیشتر آن کمک کند.
· استفاده از متن آزمایشی "لورم ایپسوم" (lorem ipsum) به طراحان یاری می کند تا بطور آزمایشی این متن را در صفحه مورد نظر خود قرار دهند و بعد تنظیمات مورد نظر از جمله نوع فونت، رنگ پیش زمینه و حروف، فاصله ها و غیره را مطالعه کنند.
· هنگام طراحی صفحات وب و یا قرار دادن متن و عکس در آن ها به جهت ها، فاصله ها و همچنین امکان بکار بردن کنتراست رنگ ها توجه فرمایید. گاهی با یکسری تغییر تحول کوچک می توانید واحد سنجش بازدید از صفحات وب سایت را بیشتر و آنرا جذاب تر نمائید.
· استعمال مناسب از Bullet Point ها ، سر تیترها ، رعایت فواصل فی مابین لغات و جمله ها و همچنین رنگ و ناهمخوانی رنگ موجب هرچه جذاب تر شدن متون میگردد که این مسئله روی seo وب سایت شما نیز موثر می باشد
رعایت نکات مربوط به تایپو گرافی در طراحی وب سایت می تواند علاوه بر جذابیت، به کارایی و کاربرپسند بودن وب سایت نیز کمک بسیاری زیادی نماید. در حقیقت یکی از فاکتورهای ساخت وب سایت های حرفه ای استعمال صحیح از شکل ، اندازه و رنگ متنها میباشد که گاهی گزینه غفلت طراحان قرار می گیرد.

لوکر استودیو و نحوه ایجاد گزارشهای سفارشی و زیبا برای ارائه دادههای سئو به مشتریان و مدیران