تایپوگرافی در طراحی وب سایت کاربردهای زیادی دارد. تایپوگرافی (Typography) نوعی هنر و مجموعه تکنیک هایی میباشد طراحی سایت که جهت خوانا و زیباتر شدن نوشته ها و متن های وب سایت های اینترنتی بکار می رود. تایپوگرافی به ما کمک می کند که وبسایت هایی زیبا و جذاب داشته باشیم که کاربران هنگام بازدید از سایت و قرائت متن ها و نوشته ها، تشویق به ادامه خواندن آنها شوند و مطالب تماما خوانا و قشنگ بنظر بیایند.
خوشبختانه امروزه ابزارها، نرمافزار ها و نرم افزارهای متعددی (مانند: Google Fonts، Font Awesome،Adobe Typeface، Apple Typeface و...) در چنگ طراحان وب سایت قرار گرفته که موجب شده قواعد تایپوگرافی هر چه بهتر در وب سایت های اینترنتی پیاده سازی شده و جذابیت بصری آنان برای کاربران بیشتر گردد.
تایپوگرافی چیست؟
همانگونه که اشاره کردیم تایپوگرافی در واقع مربوط به ظاهر نوشته ها هست. چه آن نوشته در تارنما باشد و چه در روزنامه، روزنامه، کتاب و ... در واقع کاربرد هنر تایپوگرافی امروزه بسیار تبارک می باشد ولی یکی مهم ترین کاربردهای این هنر در ساخت وب سایت ها میباشد. تکنیک های تایپوگرافی شامل مورد ها زیادی میگردند از جمله:
· تایپ شکل (typefaces)
· سریف و سانزسریف (serif and sans serif)
· فاصله ها
· جهت ها
· کنتراست (ناهم خوانی)
· رنگ ها
درپی هر کدام از این مفاد را به اعتنا مطالعه و به کاربردهای آنان در دنیای وب میپردازیم:
- تایپ شکل (typefaces) :
تایپ شکل مجموعه ای از یک یا تعدادی نوع فونت است که شکل ظاهری کارکترهای الفبای آیتم استفاده را تشکیل می دهند. در حقیقت تعیین نوع فونت بکار رفته در متن های یک سایت دراین شرکت قرار میگیرد و یکی مهم ترین اصول تایپوگرافی به شمار می رود. تا حدی که اکثری از کارشناسان و متخصصین سئو وبسایت (که عبارتست از seo تارنما های اینترنتی جهت دیده شدن هر چه خوب در موتورهای جستجو مانند گوگل و یا بینگ) هم اهمیت این موضوع را گوشزد می کنند.
این گزینه برای ساخت وب سایت در دنیای امروز عنایت زیادی دارااست و به همین جهت تاکنون تعداد زیادی از انواع فونت ها جهت استفاده در وب طراحی و عرضه گردیده است. با کمک این فونت ها می توان متن ها را به زیبایی هر چه بیشتر در سایتها نوشت و جذابیت وبسایت را برای کاربران دوچندان کرد.
- سریف و سانس سریف (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 ها ، سر تیترها ، رعایت فواصل در میان کلمات و جملهها و همچنین رنگ و تضاد رنگ موجب هرچه جالب تر شدن متن ها میگردد که این مسئله روی سئو تارنما شما نیز موثر می باشد
تایپوگرافی در طراحی وب سایت کاربردهای زیادی دارد. تایپوگرافی (Typography) نوعی هنر و مجموعه تکنیک هایی میباشد طراحی سایت که جهت خوانا و زیباتر شدن نوشته ها و متن های وب سایت های اینترنتی بکار می رود. تایپوگرافی به ما کمک می کند که وبسایت هایی زیبا و جذاب داشته باشیم که کاربران هنگام بازدید از سایت و قرائت متن ها و نوشته ها، تشویق به ادامه خواندن آنها شوند و مطالب تماما خوانا و قشنگ بنظر بیایند.
خوشبختانه امروزه ابزارها، نرمافزار ها و نرم افزارهای متعددی (مانند: Google Fonts، Font Awesome،Adobe Typeface، Apple Typeface و...) در چنگ طراحان وب سایت قرار گرفته که موجب شده قواعد تایپوگرافی هر چه بهتر در وب سایت های اینترنتی پیاده سازی شده و جذابیت بصری آنان برای کاربران بیشتر گردد.
تایپوگرافی چیست؟
همانگونه که اشاره کردیم تایپوگرافی در واقع مربوط به ظاهر نوشته ها هست. چه آن نوشته در تارنما باشد و چه در روزنامه، روزنامه، کتاب و ... در واقع کاربرد هنر تایپوگرافی امروزه بسیار تبارک می باشد ولی یکی مهم ترین کاربردهای این هنر در ساخت وب سایت ها میباشد. تکنیک های تایپوگرافی شامل مورد ها زیادی میگردند از جمله:
· تایپ شکل (typefaces)
· سریف و سانزسریف (serif and sans serif)
· فاصله ها
· جهت ها
· کنتراست (ناهم خوانی)
· رنگ ها
درپی هر کدام از این مفاد را به اعتنا مطالعه و به کاربردهای آنان در دنیای وب میپردازیم:
- تایپ شکل (typefaces) :
تایپ شکل مجموعه ای از یک یا تعدادی نوع فونت است که شکل ظاهری کارکترهای الفبای آیتم استفاده را تشکیل می دهند. در حقیقت تعیین نوع فونت بکار رفته در متن های یک سایت دراین شرکت قرار میگیرد و یکی مهم ترین اصول تایپوگرافی به شمار می رود. تا حدی که اکثری از کارشناسان و متخصصین سئو وبسایت (که عبارتست از seo تارنما های اینترنتی جهت دیده شدن هر چه خوب در موتورهای جستجو مانند گوگل و یا بینگ) هم اهمیت این موضوع را گوشزد می کنند.
این گزینه برای ساخت وب سایت در دنیای امروز عنایت زیادی دارااست و به همین جهت تاکنون تعداد زیادی از انواع فونت ها جهت استفاده در وب طراحی و عرضه گردیده است. با کمک این فونت ها می توان متن ها را به زیبایی هر چه بیشتر در سایتها نوشت و جذابیت وبسایت را برای کاربران دوچندان کرد.
- سریف و سانس سریف (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 ها ، سر تیترها ، رعایت فواصل در میان کلمات و جملهها و همچنین رنگ و تضاد رنگ موجب هرچه جالب تر شدن متن ها میگردد که این مسئله روی سئو تارنما شما نیز موثر می باشد

تفاوت PPC با seo (سئو)