Which is the best font-set for browsing?

Hadden89

On 32'' 1920p LCD TV
Default DPI values
Zoom values usually between 65%-100%

I take the values found in settings as reference:

Min font size: 9px;
Standard: Times New Roman
Sans-Serif: Arial
Monospace: Consolas
Italic: Comic Sans MS(?)
Fantasy: Impact

Windows OS. Non system fonts are fine too (if free to use)

luetage

@Hadden89 The default fonts are almost never used, since most websites either load fonts for you, or define fonts that should be used, if they are found on your system.

Hadden89

@luetage True, didn't consider that.
Maybe worth inspecting on which sites fonts are better (here seems to be on Segoe UI) and replace with CSS when need.

cherylfahling

I use font-family: Montserrat, sans-serif !important; for everything. It's just a personal preference. It's easy for me to rad and I like the way it looks.

If I every get tired of it, I'll probably try the Poppins font next. I can usually find everything I need at Google Fonts, or fairly easily in a free fonts search.

Previous favorites include Muli, Roboto, SF Pro Rounded (Mac), and SF Pro Text (Mac).

LonM

I like arial, segoe is OK too. I prefer those to serif fonts.

I'm using a new font "cascadia" for mono, it seems alright, I don't know if it's the best.

Not being in a demographic helped by comic sans, if rather not see that at all. I'm not sure which cursive don't to replace it with.

I might advertise this feature request which may be of interest: https://forum.vivaldi.net/topic/40970/force-default-fonts

FitEyes

Not everybody will have the same font exposure. That means you're going to have a problem. The lovely font you have just selected will appear to your visitors as random.

Don't create a web secure alternative to a fallback! To know about fonts behavior (https://fontvilla.com/tumblr-font-generator). Windows-based devices might have one group. MacOS ones pull from another. Google’s own Android system uses its own as well.

Pesala

Like Verdana, BitStream Vera was designed for display on low resolution devices such as monitors. My own Verajja typefaces extend the glyph coverage to support Vietnamese, and include full sets of Miscellaneous Symbols and Dingbats.

The DejaVu fonts extend glyph coverage to Cyrillic and more.

serenasoto

Mostly I Prefer from this : Serif (e.g., Times New Roman, Garamond ) But You can Check More here : https://marketriva.com/9-best-fonts-to-use-for-websites/

baris.sehri

@Pesala I use verdana too. it's specifically designed for screens, and I think it's one of the most common best typefaces for screen displays.

I'm pairing verdana with georgia as my serif typeface. they are going very well together. especially on wikipedia.

as monospace my preference is andale mono.

I don't really understand why do we have cursive, and fantasy options in the preferences. cursive is actually script I believe?

barbudo2005

Give a try to Lato (Free):

https://www.fontsquirrel.com/fonts/lato

Pesala

@baris-sehri said in Which is the best font-set for browsing?:

Cursive is actually script I believe?
There are many different websites, and not all have to use the usual boring fonts just for the sake of legibility.

Imagine a children's story book online. Why not use joined up handwriting like Lucida Script, for example. Even Comic Sans has its uses, though many people hate it.

Websafe Fonts • 10 Best Script Fonts

I published a few: Hari • Mahakampa • Odana

Odana has some nice coloured glyphs.

jhontrew

This post is deleted!

silass11

Not every person will have a similar text style openness. That implies you will have an issue. The wonderful textual style you have quite recently chosen will appear to your guests as arbitrary.

Try not to make a web secure option in contrast to a fallback! To be familiar with text styles conduct. Windows-based gadgets may have one gathering. MacOS ones pull from another. Google's own Android framework utilizes its own also.

silass11

This post is deleted!

kichrot

@luetage said in Which is the best font-set for browsing?:

... since most websites either load fonts for you, or define fonts that should be used, if they are found on your system.

I prefer that on all sites the text is displayed in a font that is convenient for me to read.
For this purpose, I wrote the Tampermonkey script, which replaces the font on the page, which is set in the script variable. Naturally, the font should be installed in the system.
By past this, the script allows you to configure, under your eyesight and preferences, rendering the font, for this there are variables in the font, changing which by experimenting the font display is configured.

// ==UserScript==
// @name          Correction of readability of text and contrast of images in Chrome
// @name:ru       Исправление удобочитаемости текста и контрастности изображений в Chrome
// @description	  Userscript to improve the readability of text and contrast of images in the browser Google Chrome and its derivatives.
// @author        kichrot
// @match         *://*/*
// @include       *://*/*
// @run-at        document-start
// @grant         unsafeWindow
// @compatible    chrome
// @version       0.4.1
// ==/UserScript==

var weight = 0; /* The variable changes the weight of the font/Переменная изменяет толщину шрифта */
var weight_blur = 0.6; /* The variable changes the weight and blurs the borders of the font/Переменная изменяет толщину и размывает границы шрифта */
var lightens_font_color = 0.2; /* Variable lightens the color of the font/Переменная осветляет цвет шрифта*/
var font = 'Helvetica'; /* Variable assigns the font/Переменная назначает шрифт */
/* Verdana | Arial | Helvetica | HelveticaNeueCyr | Tahoma |Lato| Noto Sans | Open Sans | Manrope | Roboto | Montserrat */
var unit = 'px'; /* The variable assigns the unit of measure/Переменная присваивает единицу измерения */
/* px | em | ex | rem | vh | vw */

(function () {
    'use strict';
    var css = document.createElement('style');
    css.innerHTML += [`*{`,
                      `-webkit-text-fill-color:currentColor  !important;`,
                      //`-webkit-text-fill-color:transparent  !important;`,
                      `text-shadow:`+
                                    `-${weight}${unit} -${weight}${unit} ${weight_blur}${unit} rgba(250,250,250,${lightens_font_color}) /*белая тень наверх и влево */,`+
                                    `${weight}${unit} ${weight}${unit} ${weight_blur}${unit} rgba(250,250,250,${lightens_font_color}) /*белая тень вниз и вправо */,`+
                                    `${weight}${unit} ${weight}${unit} ${weight_blur}${unit} currentColor/*тёмная тень вверх и вправо*/,`+
                                    `-${weight}${unit} -${weight}${unit} ${weight_blur}${unit} currentColor  !important;/*тёмная тень вниз и влево*/`,
                      `-webkit-font-smoothing: subpixel-antialiased /*antialiased*/ !important;`,
                      `text-rendering: geometricPrecision !important;`,
    `}`,
    `*:not([class*=\"icon\"]):not([class*=\"ico\"]):not([class*=\"button\"]):not([class*=mjx]):not([class*=vjs]):not([class*=fa]):not([class*=ms-Button-icon]):not([class*=DPvwYc]):not([class*=bb]):not([class*=icon]):not([class*=ll]):not(i):not([role*=button]) {`,
                      `font-family: ${font} !important;`,
    `}`,
    `img {`,
                      `image-rendering: -webkit-optimize-contrast !important;`,
    `}`
    ].join("\n");
    document.documentElement.appendChild(css);
}) ();

Perhaps this script will come in handy and benefit anyone.

barbudo2005

@kichrot

It works. Thank you.

I use this CSS code in Stylus to display all text in the "Lato" font ( https://www.fontsquirrel.com/fonts/lato):

p,


* > p,
* p,
*.p,


[class *= "text"] > p,
[class *= "text"] p,
[class *= "text"].p,
p > strong,
p.strong,
p > span,
p.span,
p span,
font,

section,
article,
li span,
li,
tr > td



{font-size: 28px !important;
font-family: Lato !important;
font-style: normal !important;
font-weight: 400 !important;
text-align: justify !important;
line-height: 1.3 !important;}

But in certain sites the font-size 28px break the site, so your script is useful in such cases.

kichrot

@barbudo2005 said in Which is the best font-set for browsing?:

But in certain sites the font-size 28px break the site

Personally, I don’t understand why you are doing this?
If for scaling text, then this is not the best way. It is better to use the extension Zoom Page WE for these purposes, which allows you to scale the text on the site using a relative method.
If this extension seems too complicated for you, then I can at your request lay out a different extension for scaling text that has not been developed by the author for a long time and is absent from the extension store, but works perfectly.

barbudo2005

@kichrot

A question:

Why sometimes I have to reload the page to get the script to work?

Look this page :

http://unmomentoparalectura.blogspot.com/

Will have to do with the fact that the settings "Site Access" of Tampermonkey always revert to "Onclick"?

kichrot

@barbudo2005 said in Which is the best font-set for browsing?:

Look this page :
http://unmomentoparalectura.blogspot.com/

Checked. My script is working out normally on this site.

Will have to do with the fact that the settings "Site Access" of Tampermonkey always revert to "Onclick"?

Honestly, I don’t know what kind of mood you are writing about. Tampermonkey did not find such a setting.
It is possible that this is due to the fact that I have a Russian interface. Please show the screenshot of this setting in the Tampermonkey interface.

In any case, the script works out normally when there are no conflicts with other scripts and extensions that form the CSS table of page styles.
If other scripts or extensions make changes to the table, for the same parameters as our script, with the highest priority !important, then any conflicts are possible, on the principle: whoever had time and ate before.

NormaTaylors

This post is deleted!