6 Typography Golden Rules (NEED TO KNOW)

Поділитися
Вставка
  • Опубліковано 8 вер 2024

КОМЕНТАРІ • 139

  • @ummehabiba2036
    @ummehabiba2036 2 роки тому +16

    Body size text = 10-12pts
    In website design= 15-25 pixels
    Leading/Line spacing= 120-145x of font size
    primary heading= 180-200% of body text
    Secondary heading= 130-150% of body text

  • @trvest8129
    @trvest8129 3 роки тому +20

    I always have a hard time with these sets of rules. Especially, I'd call them suggestions since these rules vary from project to project. For instance in German, hyphenation is way more commonly used in body text than in English. Also, sizing is, in my opinion, more a matter of optical functionality, than numbers, since font sizes vary throughout. However if you're a beginner these things can be helpful.

  • @felipesnet
    @felipesnet 5 років тому +68

    I like the quiz at the end, it is like you are preparing to release a course :). Thanks for your videos

  • @4TheCreatives
    @4TheCreatives 4 роки тому +5

    Great golden rules. I like the points about the size of the type. Good standards to live by. Thanks for the tutorial.

  • @Sam-rg5hx
    @Sam-rg5hx 4 роки тому +10

    Again: Very helpful and smooth video :)
    Thanks for your effort, you're keeping me engaged to stick to graphic design!

    • @SatoriGraphics
      @SatoriGraphics  4 роки тому +1

      that's always awesome to read, thanks for the feedback Sandra

  • @EdwardSeeber
    @EdwardSeeber 5 років тому +5

    4/5 not a bad way to start a Friday 😎✨ thx for these vids, hope u have a great weekend

  • @ghostpaper
    @ghostpaper 5 років тому +3

    Great video, Satori! These are super helpful!

  • @nuxttux
    @nuxttux 5 років тому +4

    Always happy to learn about type or simply brush up. Thanks for sharing.

  • @MrMark893
    @MrMark893 5 років тому +3

    5/5. Great tips, especially for amateur designers.

  • @pixunPL
    @pixunPL 5 років тому +5

    I love quizie on the end of your videos. Thx for your hard work. Cheers!

  • @MrAAMNNITAllahabad
    @MrAAMNNITAllahabad 4 роки тому +4

    Satori either you know me personally or you want to provide max. value through your channel because this was the exact difficulty I was facing. haha.. Thanks man!
    Yours ardent follower

  • @eugenio9775
    @eugenio9775 5 років тому +9

    Great video!, to continue the conversation.... I worked many years in newspapers and many of these rules are different, Many newspapers use 8,5 to 9,5 or they use hyphenation with text aligned to the left and many other tricks to put more information.

    • @cleverediting3506
      @cleverediting3506 5 років тому

      Eugenio #logologic

    • @DarkPa1adin
      @DarkPa1adin 5 років тому

      @@SatoriGraphics 9pt is the lowest if you use huge fonts like Open Sans.
      And 10pt is the lowest for Times New Romans.
      Why can't typeface makers have a standard for all font size 12?

    • @EversonBernardes
      @EversonBernardes 3 роки тому

      Not only in newspapers, but magazines as well. Body text is usually around 10pt (typeface dependant, of course). 12pt for something like Frutiger, Myriad and even a lot of the more current serif faces that have larger x-height is absolutely immense.
      @DarkPa1adin because the size determines the width of the virtual bounding box surrounding the glyphs of a font, and usually encapsulates the widest glyph (traditionally a capital M, but not always). Wider typefaces of course end up smaller in height than narrower typefaces for a given size (but most designers end up fudging numbers a bit to keep some consistency).

  • @EclipsePRS
    @EclipsePRS 5 років тому +2

    Interesting video. When I got into print way back in the 90's (using Windows 3.11 and CorelDRAW 4 mind you), 8 point text was the "default" for main body text. It all depended on the font used, it's line weight and legibility. Even for web design, it was 8 points. What's changed now is the resolution of monitors and therefore display text is smaller at 8 points. Everything else, except for hyphenation, is relevant; just not a Golden Rule but more of a guideline.

    • @EclipsePRS
      @EclipsePRS 5 років тому

      @@SatoriGraphics You're welcome. I enjoy your videos, they're very informative. It's interesting to see how "graphic design" has changed over the years (and how much of it has remained the same).

  • @sidneyjohnson6895
    @sidneyjohnson6895 4 роки тому +4

    Satori, as always, your tutorials are smooth, concise, impacting with continuous value. I like the stretch in format to insert a quiz. A great tool to incorporate. It's like embedding facts and principles to help the viewer's design experience. Super - Nice!

  • @Slayermunch
    @Slayermunch 5 років тому +4

    Awesome video !! Also please make a video on negative space logos one more time. The last one was too good. But would love to see more of that.
    Thank you in advance.

  • @whit8494
    @whit8494 3 роки тому +1

    Thanks for providing clear information in such a simply creative way!!!

  • @brasiosteven9095
    @brasiosteven9095 5 років тому +2

    Thanks for this one. Hope you have a great weekend... Cant wait for Monday..

  • @user-ke5on8ys6v
    @user-ke5on8ys6v 12 днів тому +1

    Thanks for the education!

  • @neetabudhraja
    @neetabudhraja 5 років тому +2

    Awesome video..
    Thank u.. learnt new things today..
    All quiz answers were correct except for the last one.. i thought its related to alignment but it was test print..

  • @loomonda18
    @loomonda18 2 роки тому +2

    Practical 'rules' - thank you! Great as guidelines

  • @ashishsoni2431
    @ashishsoni2431 5 років тому +2

    Aweaome.......i learned 3 new rules

  • @alistoica6273
    @alistoica6273 5 років тому +2

    Lol, I needed some tips on type for a logo, and then you posted. I always find useful things on your channel, thanks!

  • @MrRobbish
    @MrRobbish 3 роки тому

    The end quiz is a very good idea... answers questions and reinforces the knowledge...

  • @phuongpham9971
    @phuongpham9971 2 роки тому +1

    thank you so much, thats all I need

  • @gusteixeira5011
    @gusteixeira5011 5 років тому +1

    Very good the Quiz at the End, makes you recall everything we saw from the beginning, as a piece of advice, It would be interesting to put one question of more expertise that you didn't talk about in the video just to spike the interest even more of the ones that are watching.
    Like a golden nugget of the video ;)
    I'm loving the Journey, keep at it !!

    • @gusteixeira5011
      @gusteixeira5011 5 років тому

      @@SatoriGraphics always glad to help, I'm cheering for you ;)

  • @mdrasel7674
    @mdrasel7674 4 роки тому +3

    Thank you for your hard-working, This is a very helpful tutorial for a new designer.

  • @tajzisstyletube2408
    @tajzisstyletube2408 4 роки тому +2

    Great to have this video ! Really helpful! Thanks :)

    • @SatoriGraphics
      @SatoriGraphics  4 роки тому +1

      Glad it was helpful Tajzi, enjoy your day 👍

  • @mrehan98
    @mrehan98 5 років тому +2

    Man your videos very well keep it up bro

  • @Initialgs
    @Initialgs 2 роки тому

    For body copy in general as far as print goes, 12pt is a little too clunky. Project depending. In the main I’d go for 9-10pt as an ideal for body copy. With the hit to print by the advent of online/digital, I’ve noticed many magazines have reduced not only how many pages, but actual size of the page to sub A4, with editors still demanding similar word counts, I’ve had to go as low as 8pt for body copy. So font choice becomes critical.
    Top tip, when printing on solid black with white text, avoid serif in regards to body copy, if possible, but whether you go for a serif or sans font, make sure you add a small hairline ‘trap’ or outline of default black of 0.1pt. Mainly to copy 11pt or under. It helps prevent bleed and register issues especially if you are placing your type on a rich black background.
    Keep up the great videos, no matter how experienced you are I always find something useful to take away, or reminded of something I’d forgotten… and I’ve been doing this since before DTP and my tool of choice was a huge set of drawers filled with Letraset.

  • @lightartorias552
    @lightartorias552 3 роки тому +1

    Really love the quiz at the end. Thank you!

  • @livumagoqwana
    @livumagoqwana 3 роки тому +1

    Super helpful super awesome 🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🤘🤘🤘🤘🤘

  • @NizNaj10
    @NizNaj10 5 років тому +2

    Great video! Thanks for the tips... love the quiz...

  • @zerokoolz11
    @zerokoolz11 5 років тому +2

    thank you alot this video is vey helpfull

  • @MARIOCHRISTOFORIDESDESIGNER
    @MARIOCHRISTOFORIDESDESIGNER 5 років тому +2

    Wonderful 🙏🌻👍👍My Super Friend we are very happy all of us see your posts useful as always thank you so much

  • @georgemallard4120
    @georgemallard4120 5 років тому +2

    Great, really helpful tips.

  • @AnnieLeestyle
    @AnnieLeestyle 5 років тому

    It's simple to know typography and very useful. Thank you very much!

  • @alisa_hanes
    @alisa_hanes Рік тому +1

    Thank you!

  • @infographie
    @infographie Рік тому +1

    Excellent

  • @benw9949
    @benw9949 3 роки тому +1

    Web pixels: Around when the CSS1 or CSS2 standard was created, they needed to settle on what physical size a CSS pixel was. It was set at 96 pixels per inch rather than 72 pixels per inch. (72dpi was the old Mac screen standard.) So at 96 pixels per inch, 8px = 6pt; 12px = 9pt = 0.125in; 16px = 12pt = 1/6in = 1 pica; 24px = 18pt = 0.25in; 32px = 24pt = 1/3in; and so on;
    Headlines: An alternative is to use a percentage of the 12pt common body text size. So 300% = 36pt; 250% = 30pt; 200% = 24pt; 150% = 18pt; 125% = 15pt; 100% = 12pt; 83.33% = 5/6 = 10pt; 75% = 9pt; 66.67% = 4/6 = 8pt; 50% = 6pt; However, making your headlines smaller than the body text size is not too sensible, and below 9pt gets into tiny mouse-print size; The same set of rules of thumb can help with doing super/subscripts and small-caps scaling.
    Doing business cards with type smaller than 8pt to 9pt is again in mouse-print range and can fill up the ink, especially in raised / embossed text;

  • @Adlip_Kun
    @Adlip_Kun 8 місяців тому +1

    Thanks for sharing

  • @gohanson9836
    @gohanson9836 2 роки тому +1

    I loved the quiz at the end.

  • @DarkPa1adin
    @DarkPa1adin 5 років тому +2

    Hope you can make a video on manual kerning especially for serif fonts!

    • @DarkPa1adin
      @DarkPa1adin 5 років тому

      @@SatoriGraphics I've seen your San serif ones tho

  • @gelamegeneishvili130
    @gelamegeneishvili130 3 роки тому

    Thanks man, your videos help a lot 🙏🏼

  • @thepecanlife5801
    @thepecanlife5801 3 роки тому

    I notice you refer to a 'half point size' as .5 when actually the Font point system is based on .12 = 1 point.
    Therefore, half a point size would be 9.6 - LOVE YOUR VIDEOS!

  • @izet1526
    @izet1526 3 роки тому

    love your course!

  • @EversonBernardes
    @EversonBernardes 3 роки тому

    12pt for body text is (of course, typeface dependant) immense.

  • @samuelbatsanarh2341
    @samuelbatsanarh2341 Рік тому

    Please can you do a video on how to correct some typography mistakes suck us river, widow, orphan etc in Ai.

  • @shyamprasadam
    @shyamprasadam 4 роки тому +1

    THANKS

  • @Jharries1971
    @Jharries1971 5 років тому +4

    Hi Tom, how about telling us more about you mate, I'm guessing you're English but now live in America, but did you go to design school or are you totally self-taught? Is this the only job you've ever had? I believe I'm not the only person who is interested in a bit of your background.

  • @NamanKhera
    @NamanKhera 5 років тому +2

    🔥🔥

  • @resheda_lshokairy
    @resheda_lshokairy 6 місяців тому

    This video is amazing
    Why did you stop doing quiz at the end of the video?

  • @Brianmuchiri
    @Brianmuchiri Рік тому +1

    Test printing an entire highway billboard For my current project that's how literal am taking this

    • @SatoriGraphics
      @SatoriGraphics  Рік тому +2

      lol! yeah that is quite a unique situation.
      Pro tip for printing and designing billboards. If the billboard is 800cm x 400cm, make your PSD document 80cm x 40cm and at something like 150ppi. You then tell the printer the design is a 10% scale, and so when they print it then need to enlarge the design. The result will be 15ppi which is fine for billboards. This helps with the problem of having huge PS files when working on billboards.

    • @Brianmuchiri
      @Brianmuchiri Рік тому

      @@SatoriGraphics thank you very helpful

  • @reB3732
    @reB3732 3 роки тому +1

    Like your style and voice...

  • @alefalefalef1
    @alefalefalef1 4 роки тому +60

    7th rule: Don't use Comic Sans ;)

    • @cferracini
      @cferracini 3 роки тому +11

      there is nothing wrong with comic sans if you use it for what it is supposed to be used: with comics, with childish illustrations, teaching dyslexic kids how to read

    • @MichaelSouhoka
      @MichaelSouhoka 3 роки тому +1

      Use Comic Neue for Comic Sans haters. It is the best alternative, and it's free too.

    • @stevenvanhulle7242
      @stevenvanhulle7242 3 роки тому

      ... or Algerian!

    • @thewellnessportal
      @thewellnessportal Рік тому

      Or Lobster 😂

    • @shubh6533
      @shubh6533 2 місяці тому

      😅

  • @cleverediting3506
    @cleverediting3506 5 років тому +2

    Nice
    #logologic

  • @marsdigital1438
    @marsdigital1438 4 роки тому

    thank u sir for good knowledge...

  • @sanawarnipun9479
    @sanawarnipun9479 5 років тому

    Awesome work man...

  • @rager8431
    @rager8431 2 роки тому

    Really, it was not a quick video if you are a learner. Thanks satori.

  • @sara.a1026
    @sara.a1026 4 роки тому +1

    THANKS!

  • @silaszindel8113
    @silaszindel8113 3 роки тому

    dope

  • @emolivera
    @emolivera 3 роки тому

    I would love to see some investigation about type perception and sizes (if it exists)

  • @innocentkboateng
    @innocentkboateng 5 років тому

    *super helpful video, 4/5 of the quiz isn't bad right? Thanks for sharing this*

  • @khadijaazeem1724
    @khadijaazeem1724 5 років тому

    Very helpful video

  • @priontohasanapu8422
    @priontohasanapu8422 5 років тому

    Great man

  • @vahinirai510
    @vahinirai510 5 років тому

    I got 3/5....😅 thanks for the quiz though.

  • @amxvid
    @amxvid 5 років тому +3

    How can I learn to make motion graphics like you?

  • @hendersonlamar
    @hendersonlamar 5 років тому +2

    "Leading" and "line spacing" are not the same thing, although they are commonly used interchangeably.

    • @shazibest4u
      @shazibest4u 4 роки тому

      Agreed

    • @kizune1
      @kizune1 3 роки тому

      What is the difference?

    • @hendersonlamar
      @hendersonlamar 3 роки тому +1

      @@kizune1 "Leading" is the space between the bottom of the descenders on one line and the top of the ascenders on the next line. The name comes from literal thin pieces of lead that were wedged in between lines of hot-metal type.
      "Line spacing," in contrast, is the space between the baseline of one line of type and the baseline of the next line of time - the point size of the text plus the point size of the leading.

    • @kizune1
      @kizune1 3 роки тому

      @@hendersonlamar Thank you for clarifying this for me.

  • @YashMehta85
    @YashMehta85 5 років тому

    👌👌👌

  • @junaidmughal3511
    @junaidmughal3511 5 років тому +1

    could you make tutorial or series on how to make editable mockup or rules in making an ediable mockup?

    • @junaidmughal3511
      @junaidmughal3511 5 років тому

      no prob. Instead of watching video on this topic from other I like the way you told about designs that why I requested.

  • @Bluntzngreschtl
    @Bluntzngreschtl 3 роки тому +2

    can someone recommend me magazins with good typography? :)

  • @miamiceprincess
    @miamiceprincess 3 роки тому

    Is tracking and kerning the same thing?

  • @noirberries
    @noirberries 2 роки тому

    when text is aligned to left, is it unprofessional to not make them equal length for each row? In another word, is it more professional to make each line neatly aligned at right and left?

  • @schwetang
    @schwetang 5 років тому

    Satori, what's your take on people who 'justify'?

    • @schwetang
      @schwetang 5 років тому

      @@SatoriGraphics , justify their text.

  • @devenderrawat3777
    @devenderrawat3777 3 роки тому

    12

  • @biswajitguchait4496
    @biswajitguchait4496 5 років тому +2

    How do get clients??

  • @devenderrawat3777
    @devenderrawat3777 3 роки тому

    heading

  • @md47bot
    @md47bot 5 років тому

    magazines use hyphens all the time

  • @rr7firefly
    @rr7firefly 3 роки тому

    Looks like David Carson doesn't follow these rules.
    I remember visiting a typesetting shop in San Francisco as desktop publishing was becoming popular. A few months later that business was gone. Just an empty space with sheets of paper strewn everywhere.

  • @Fabitalism
    @Fabitalism 5 років тому +2

    @0:35 sorry but this is a really false information. I print a lot of stuff in 5pt when the font is good for small sizes. Packaging uses 2-3 pt. in some cases for the backtext. Just a matter of the font you are using.
    Also that body text need to be between 10-12pt. is wrong. Printing a lot of scientific magazines and the body text is set in 8p and making it still readable. This also depence on the font.

  • @JellyOproduction
    @JellyOproduction 5 років тому +2

    first

  • @motionmarketer4762
    @motionmarketer4762 5 років тому +2

    My short term memory isn't good enough for the quiz

  • @kakekgaming007
    @kakekgaming007 2 місяці тому +1

    2024

  • @hasanamobay7543
    @hasanamobay7543 3 роки тому

    Is that dagogo??

  • @krystosnareofficial4473
    @krystosnareofficial4473 3 роки тому

    Peace

  • @roseraised7235
    @roseraised7235 5 років тому

    TEST PRINT

  • @SZEditor
    @SZEditor 3 роки тому +1

    Great Video Learned A Lot but the video was a bit boring

    • @SatoriGraphics
      @SatoriGraphics  3 роки тому +1

      yes it is one of my older videos, the style is different compared to now

    • @SZEditor
      @SZEditor 3 роки тому

      @@SatoriGraphics yes, your new video are much better

  • @ghozinaufal
    @ghozinaufal 4 роки тому

    Rekening piro bos tak bayar e

  • @nirmansarkar
    @nirmansarkar 4 роки тому +1

    You make a "typography" video but did not bother to align the 't' and the 'y' (where they meet) at the beginning of the video. Shows you only bother to make video for content and are not passionate about the subject.

    • @SatoriGraphics
      @SatoriGraphics  4 роки тому +3

      Oh I've been passionate about typography since my college years back in 2007. I am one man and rushing to make content often can lead to mistakes, mistakes I notice after uploading. With actual graphic design projects I have more time to revise the artwork

  • @Mxnbot
    @Mxnbot 2 роки тому

    ?

  • @welling1
    @welling1 2 роки тому

    People that strictly follow these rules usually produce horrible designs.

  • @neilrhyanllumpera8712
    @neilrhyanllumpera8712 Рік тому

    Body size text = 10-12pts
    In website design= 15-25 pixels
    Leading/Line spacing= 120-145x of font size
    Magazine & Website Desing Headings
    primary heading= 180-200% of body text
    Secondary heading= 130-150% of body text

  • @MegaRampro
    @MegaRampro 4 роки тому

    very very helpful video