design is the process designers use to build interfaces in software or computerized devices, focusing on looks or style
Contents
UX
UI
CX
SD
IxD
Pro
Laws icon
Laws
Laws
Rules icon
Rules
Rules
General terms icon
General terms Pro
General terms Pro
Research icon
Research
Research
Principles icon
Principles IxD
Principles IxD
Metrics icon
Metrics
Metrics
General terms icon
General terms SD
General terms SD
Experience type icon
Experience type
Experience type
User Feedback icon
User Feedback
User Feedback
Composition icon
Composition
Composition
General terms icon
General terms IxD
General terms IxD
Approach icon
Approach-CX
Approach-CX
Grid Type icon
Grid Type
Grid Type
Analytics icon
Analytics
Analytics
Approach icon
Approach-UX
Approach-UX
Elements icon
Elements
Elements
Typography icon
Typography
Typography
Production icon
Production
Production
Color icon
Color
Color
Testing icon
Testing
Testing
Structure icon
Structure
Structure
Ecosystem icon
Ecosystem
Ecosystem
2-second rule
3-Click Rule
60-30-10 Rule
8dp Grid
A/B Testing
Above the fold
Accessibility
Activity-centered design (ACD)
Actor
Adaptive design
Affinity map
Affordance
Agile
Alert
Alternative colors
Animation
Anti-pattern
Ascender
Aspect ratios
Autocomplete
B2B customer experience
B2C customer experience
Backdrop
Background color
Backward compatibility
Balance
Banner
Baseline
Benefit Map
Between-subjects design studies
Body
Bodystorming
Bottom navigation bar
Brand experience
Breadcrumbs
Breakdown Analysis
Breakpoint
Call to Action (CTA)
Cap line
Card Sorting
Charts
Checkbox
Chips
Chronemics
Clearly marked exit
Clickstream
Co-creation
Coach marks
Color Wheel
Column
Comparative analysis
Competitive analysis
Consistency
Container
Contextual action bar (CAB)
Contextual inquiry (CI)
Contextual interviews
Conversion rate
Corridor testing
Creeping Featurism
Customer Loyalty
Customer Satisfaction Score (CSAT)
Customer centricity
Customer churn
Customer effort score (CES)
Customer lifecycle (CLC)
Customer lifetime value (CLV)
Customer review
Dark patterns
Data-driven design
Date picker
Descender
Design concept
Design thinking
Dialog window
Dialogs
Diffusion of Invasions
Dropdowns
Early adopter
Educational Content
Emphasis
Empty states
End users
Entry tunnel
Error color
Experience map
Explicit destruction
Eye-tracking
Eyetracking
F-Shaped Pattern
Field studies
Filled icon
First Parkinson’s Law
First click testing
First-time user experience (FTUE)
Fixed grid
Floating action button (FBA)
Flow
Fluid grid
Focus groups
Frankensteining
Gantt chart
Getting Things Done
Golden ratio
Grid
Gutter
Hamburger icon
Headline
Heat map
Hick's law
Hierarchy
Hypothesis-driven design
Information architecture
Innovator’s Dilemma
Input text field
Interactive prototype
Iterative testing
Jakob’s Law
Justification
Kaikaku
Kerning
Keylines
Label text
Law of Prägnanz
Law of Uniform Connectedness
Law of similarity
Layout
Leading (Line spacing)
Legibility
Ligature
Look & Feel
Low-fidelity prototype
MVP (Minimum valuable product)
Maestro Concept
Margin 
Microtypography
Miller's law
Mind Map
Minimalism
Mockup
Navigation drawer
Net promoter score (NPS)
Occam’s Razor
Omnichannel
Onboarding
Open Innovation
Out-of-Box Experience
Overshoot
Padding
Page controls
Pareto Principle
Participatory design
Peak-end rule
Persona
Personalization
Picker
Placeholder
Pomodoro Technique
Pop-up
Postel's law
Primary color
Progress indicator
Prototyping
Proximity
Radio button
Readability
Real-time feedback
Red Route
Remote Testing
Requirements gathering
Responsive design
Retention
Retrospective Testing
Scenario
Scrim
Scroll bar
Search box
Secondary color
Serial Position Effect
Service Blueprinting
Service-oriented design
Side sheet
Sitemap
Sketching
Skeuomorphism
Slider
Snackbar
Spinner
Stakeholders interview
Steppers
Storyboarding
Stretchable surface
Strikethrough
Styleguide
Subtitles
Surveys
System usability scale (SUS)
Tab
Target audience
Task analysis
Taxonomy
Technophobia
Tesler's Law
Text area
Text button
The 10 minutes rule
The Eisenhower Matrix
Thinking Aloud Protocol
Toggle
Tooltip
Top app bar
Touchpoint
Tracking
Tree testing
True Intent Study
UI guidelines
UI regions
Underline
Unfilled icon
Usability
Usability testing
Use case
User behavior
User behavior analytics (UBA)
User engagement
User experience ecosystem (UXE)
User feedback loop
User flow
User story
User story map
User-centered design (UCD)
User-generated content
Vertical rhythm
Voice of customer (VoC)
Von Restorff Effect
Whitespace
Widget
Wireframe
Wizard of Oz experiment
World Wide Web Consortium (W3C)
X-height
Zeigarnik effect
Zen To Done
Tracking
Occam’s Razor
Minimalism
Early adopter
User feedback loop
Out-of-Box Experience
Requirements gathering
Focus groups
Touchpoint
Taxonomy
Column
Customer churn
Emphasis
Slider
Data-driven design
Activity-centered design (ACD)
First click testing
Affinity map
Customer Satisfaction Score (CSAT)
F-Shaped Pattern
Bottom navigation bar
Styleguide
User story map
Side sheet
Mind Map
Bodystorming
User behavior analytics (UBA)
Cap line
Personalization
Educational Content
Explicit destruction
True Intent Study
Frankensteining
MVP (Minimum valuable product)
Service Blueprinting
Red Route
Clearly marked exit
Chips
Tab
Benefit Map
Wireframe
Task analysis
Padding
Aspect ratios
Between-subjects design studies
User story
Low-fidelity prototype
Persona
Color Wheel
Peak-end rule
Adaptive design
Surveys
User experience ecosystem (UXE)
Text area
Customer Loyalty
Target audience
Leading (Line spacing)
Kerning
Spinner
Coach marks
Placeholder
User-generated content
Creeping Featurism
Postel's law
Toggle
Justification
Heat map
User-centered design (UCD)
Checkbox
Layout
First-time user experience (FTUE)
Getting Things Done
Alternative colors
Customer lifetime value (CLV)
Animation
Input text field
Hick's law
Whitespace
Onboarding
Scroll bar
User flow
Interactive prototype
Navigation drawer
Conversion rate
Pareto Principle
Stakeholders interview
Stretchable surface
Customer centricity
Overshoot
System usability scale (SUS)
Retention
Strikethrough
UI regions
Usability testing
Subtitles
Charts
World Wide Web Consortium (W3C)
Von Restorff Effect
Iterative testing
Scenario

Design with FlowMapp Tools

Try free our Tools for successful management and development of web projects

Legibility

Synonyms: 

Unlike the readability which is about the opportunity to comprehend the text block as a whole, legibility measures how easily you can distinguish each individual character one from another in a specific typeface. Readability is defined by the work of copywriter and designer, whilst legibility is the result of designer and developer work.

Legibility is not always connected with readability and vice versa. Sometimes letters are legible when staying separate but too hard to perceive in a word.

Tips & Tricks

Some features you can use to enhance your text legibility:

  • Mind the contrast between the text and the background. To make this work you can conduct a test: convert the paragraph to grayscale, and if it is difficult to read — try more contrast. However, using black text on white background may provide too much contrast in your text. It is usually better to apply shades of grey instead.
  • Choose a medium x-height. It should be not too low to cause a big difference with capital letters, and not too high to make it hard to distinguish capital and lowercase letters.
  • Use tracking to reduce the text density and increase legibility.
  • Adjust the kerning and check the space between particular letters: it is advised to keep the proportion to make a better legibility.
  • Try to check the point size. It is the space between the bottom of a descender and the highest point of the ascender in a typeface. Recommended size for the web is between 15 and 25 pixels. It could get hard to distinguish the letters with a smaller distance.
  • Don’t forget about the font weight: very bold or very thin typefaces are difficult to read.
  • Bigger counters help to recognize the character. The smaller the counter — the harder the text is to read. 
  • Character width can be also important: typefaces with average width are much easier to perceive.
  • Choose a simpler typeface: ones with complicated elements can make the text block look heavier.
  • Stroke contrast — the difference between thin and thick strokes in typeface — should be considered as well. Extreme contrast can reduce the legibility.
  • Sometimes sans serif is better than serif. For example, with numerals: sans serif is simpler and can make the figures more recognizable.
Better legibility & readability in the same size. By Mehmet Gozetlik

After all, don’t forget that the easiest way to make the most readable and legible text is to make it ‘transparent’ for the reader. Design doesn’t need to bring attention to itself and the main purpose here is to make the text perception easy and comfortable for your client.

FAQs

Design with FlowMapp Tools

Try free our Tools for successful management and development of web projects
Design Glossary
Legibility
Legibility measures how easily you can distinguish each individual character one from another in a specific typeface
Read more