تایپوگرافی در طراحی سایت

folder_openعمومی
تایپوگرافی در طراحی سایت

تایپوگرافی در طراحی سایت

نوشتن در طراحی سایت کاربردهای زیادی دارد. تایپوگرافی (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 ها ، سر تیترها ، رعایت فواصل بین کلمات و پاراگراف ها و همچنین رنگ و تضاد رنگ موجب هرچه جذاب تر شدن متن ها می گردد که این موضوع روی سئو وب سایت شما نیز تاثیر گذار است.

برنامه نویسی/طراحی وب سایت/ انجام پروژه سئو

برای کسب اطلاعات بیشتر با ما تماس بگیرید.

برنامه نویسی،طراحی سایت،طراحی وب سایـت،طراحی سایت فروشگاهی،طراحی سایت شرکتی،طراحی سایت دولتی،طراحی سایت سازمان ها،طراحی سایت خبری،طراحی سایت خصوصی،طراحی سایت نظامی،طراحی سایت ورزشی،طراحی سایت آموزشگاهی،طراحی سایت آموزش آنلاین،طراحی سایت فروش آنلاین،طراحی سایت b2b،سئو،پروژه سئو،انجام پروژه سئو،بهینه سازی وب سایت،افزایش رتبه گوگل،سئو داخلی،سئو خارجی،سئو در اصفهان،سئو تخصصی،سئو اینستاگرام،طراحی اپلیکیشن،ساخت نرم افزار موبایل،برنامه نویسی اندروید(android)،برنامه نویسی آیفون(ios)،دیجیتال مارکتینگ،ساخت نرم افزار حسابداری،ساخت نرم افزار های کامپیوتر،انجام پروژه های شبکه های اجتماعی،افزایش فالور اینستاگرام،ادمین اینستاگرام

طراحی وب سایت ارزان در ایران

سایت در اصفهان

طراحی سایت در تهران

سئو در اصفهان

 

Tags: , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ,

Related Posts

فهرست