设计师再也不敢说我们程序员做的界面丑了 - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
请不要在回答技术问题时复制粘贴 AI 生成的内容
forsigner
V2EX    程序员

设计师再也不敢说我们程序员做的界面丑了

  •  8
     
  •   forsigner
    forsigner 2016-03-11 11:09:30 +08:00 12951 次点击
    这是一个创建于 3503 天前的主题,其中的信息可能已经有所发展或是发生改变。

    标题党了来了,哈哈

    有时候,我们想给网站的 Logo 、 Slogan 、标题、活动页等的中文自定义字体,我们可以使用 @font-face 引入 Web 字体,但是完整的中文字体库都是 8M 10M 吓死人。

    百度的 Fontmin,解决了提取部分字体的问题,他可以在 10M 的字体文件提取文字,然后把文件变成几 KB 。

    我们可以通过 Fontmin cli 或者 [Fontmin App],但是必须写脚本或者要安装,不是很方便。

    我基于 Fontmin 写了 Web App ,叫 Web-Fontmin,可以方便地提取字体,然后下载对应的 Web font 和 Style ,欢迎吐槽建议 Star 。

    Github: Web-Fontmin -- 字体子集化,在线提取你需要的字体。
    Preview: http://fontmin.forsigner.com/

    Screenshot:

    page-1
    page-2

    典型应用场景: (如自定义 blog 的 title 字体)

    fexo

    第 1 条附言    2016-03-11 12:06:51 +08:00
    漂亮的免费字体下载:
    http://www.sentyfont.com/download.htm
    81 条回复    2018-09-05 10:12:31 +08:00
    likezun
        1
    likezun  
       2016-03-11 11:21:47 +08:00
    支持 ie6 吗?
    forsigner
        2
    forsigner  
    OP
       2016-03-11 11:26:25 +08:00
    @likezun 支持的
    ![imag]( )

    图片来之 font-spider
    aivier
        3
    aivier  
       2016-03-11 11:27:37 +08:00
    Adobe Typekit

    根据网页内容从服务器上获取对应的只包含网页内字符的字体
    jasperchou
        4
    jasperchou  
       2016-03-11 11:29:27 +08:00
    字体总算不是一块大石头了。。。。
    run2
        5
    run2  
       2016-03-11 11:43:26 +08:00
    但关键是用那么多个性的字体的同时有授权么 -。-
    finab
        6
    finab  
       2016-03-11 11:45:09 +08:00
    !以前贼羡慕英文能随意的使用各种字体。
    aksoft
        7
    aksoft  
       2016-03-11 11:45:15 +08:00   1
    还是丑。。。
    aksoft
        8
    aksoft  
       2016-03-11 11:46:19 +08:00
    不过可以。。我喜欢
    IOfeng
        9
    IOfeng  
       2016-03-11 11:48:55 +08:00
    66666
    allenhu
        10
    allenhu  
       2016-03-11 11:50:13 +08:00 via Android
    标题党
    iTakeo
        11
    iTakeo  
       2016-03-11 11:56:43 +08:00 via iPhone
    字体没有版权的用不了
    forsigner
        12
    forsigner  
    OP
       2016-03-11 12:07:22 +08:00
    @allenhu 你对了
    forsigner
        13
    forsigner  
    OP
       2016-03-11 12:07:51 +08:00
    @aivier 有免费,这个不错: http://www.sentyfont.com/download.htm
    magicolor
        14
    magicolor  
       2016-03-11 12:08:07 +08:00
    嗯 …… 还是丑 …… 布局还是不太讲究
    forsigner
        15
    forsigner  
    OP
       2016-03-11 12:08:43 +08:00
    @sobigfish 不商用的没事的吧...
    tabris17
        16
    tabris17  
       2016-03-11 12:11:41 +08:00
    能否打乱字体和编码的对应顺序?这样就可以做一个字体加密了
    realpg
        17
    realpg  
    PRO
       2016-03-11 12:23:26 +08:00
    @forsigner 谁告诉你不商用就免费的……
    wawehi
        18
    wawehi  
       2016-03-11 12:29:34 +08:00
    字体上传了,下载按钮在哪儿啊?
    rubyvector
        19
    rubyvector  
       2016-03-11 12:42:32 +08:00
    挺好的东西
    auzeonfung
        20
    auzeonfung  
       2016-03-11 12:54:02 +08:00
    arens
        21
    arens  
       2016-03-11 13:13:14 +08:00
    之前用过阿里的 iconfont 的一个插件,和你的是一个意思,只包你想要特殊处理字体的字库,但这样只能用作个别地方吧,可以全文都用字库吗?
    swen
        22
    swen  
       2016-03-11 13:28:27 +08:00
    有一款插件叫 font-spider 蛮好用~可惜现在没更新了~
    forsigner
        23
    forsigner  
    OP
       2016-03-11 14:06:14 +08:00
    @realpg 我错了...
    m939594960
        24
    m939594960  
       2016-03-11 14:14:19 +08:00
    http://www.youziku.com/ 支持所有浏览器啊
    songkaiape
        25
    songkaiape  
       2016-03-11 14:15:57 +08:00
    页面做的很好看,另外问下,前端开发一般用哪些开发工具?
    bfl008
        26
    bfl008  
       2016-03-11 14:17:34 +08:00
    不丑,是丑爆了。
    zzutmebwd
        27
    zzutmebwd  
       2016-03-11 14:19:09 +08:00
    http://www.youziku.com/ 很多年前就有这个了吧
    plqws
        28
    plqws  
       2016-03-11 14:19:42 +08:00
    什么时候设计丑不丑和字体有那么大关系了?幽灵按钮配合草书字体真的是丑出 GN-Z11 星系
    forsigner
        29
    forsigner  
    OP
       2016-03-11 14:20:21 +08:00
    @wawehi 是因为我 Nginx 忘记设置 client_max_body_size ,爆上传文件过大,现在可以了再试试,谢谢提醒哈,
    Justineo
        30
    Justineo  
       2016-03-11 14:21:38 +08:00
    新蒂那些字体里有些免费下载的也有需要付费使用的。
    forsigner
        31
    forsigner  
    OP
       2016-03-11 14:22:18 +08:00
    @bfl008 瞎说什么大实话~
    Justineo
        32
    Justineo  
       2016-03-11 14:23:49 +08:00
    @swen 字蛛底层用的就是 fontmin 。
    ikw
        33
    ikw  
       2016-03-11 14:40:01 +08:00
    看到下面那个主题就感觉肯定是 lz ,拉上去一看果然是。

    真是合口味 XD
    TangMonk
        34
    TangMonk  
       2016-03-11 14:48:13 +08:00
    好看!
    forsigner
        35
    forsigner  
    OP
       2016-03-11 15:00:17 +08:00
    @finab 现在还得羡慕
    lwbjing
        36
    lwbjing  
       2016-03-11 15:00:18 +08:00
    赖斯... 之前自己拼的太累...
    forsigner
        37
    forsigner  
    OP
       2016-03-11 15:00:53 +08:00
    @aksoft 丑的可以接受 haha~
    forsigner
        38
    forsigner  
    OP
       2016-03-11 15:01:26 +08:00
    @tabris17 不知道字体加密有什么用
    dilidili
        39
    dilidili  
       2016-03-11 15:02:21 +08:00
    有木有去看过腾讯的字蛛?
    xcc3641
        40
    xcc3641  
       2016-03-11 15:02:21 +08:00
    又出精品 赞!
    forsigner
        41
    forsigner  
    OP
       2016-03-11 15:02:44 +08:00
    @songkaiape 看看 npmjs.org 流行什么就对了
    xcc3641
        42
    xcc3641  
       2016-03-11 15:03:24 +08:00
    手机下 好像格式出问题了
    v1024
        43
    v1024  
       2016-03-11 15:07:48 +08:00
    那么,你这个轮子有什么优势?

    http://font-spider.org/
    sciooga
        44
    sciooga  
       2016-03-11 15:23:07 +08:00
    我一般直接用 Fontmin 的客户端 http://ecomfe.github.io/fontmin/
    特别需要单独编辑字体的时候百度还有一个轮子 http://font.baidu.com/editor/

    当然,楼主干得漂亮
    forsigner
        45
    forsigner  
    OP
       2016-03-11 15:54:19 +08:00
    @dilidili 字蛛也是提取字体,提取 html 文件中出现过的字体,但是网页内容一般是动态输出内容,字蛛局限太大,还不如直接用 Fontmin 来得快和方便
    forsigner
        46
    forsigner  
    OP
       2016-03-11 15:57:01 +08:00
    @v1024 font-spider 只是对 fontmin 的基础上加了一点功能,作用是提取文件中出现过的文字,用 gulp-fontmin 可以非常容易是完成 font-spider 的功能的,我只是写了一个 fontmin 在线版工具而已。
    hqs123
        47
    hqs123  
       2016-03-11 15:59:17 +08:00
    好文艺感觉(*^__^*)
    laosb
        48
    laosb  
       2016-03-11 16:19:12 +08:00
    标题党。一个字体不能决定设计。
    LeoDev
        49
    LeoDev  
       2016-03-11 16:40:27 +08:00
    兄台我极其想盗用你的首页( http://fontmin.forsigner.com/)
    forsigner
        50
    forsigner  
    OP
       2016-03-11 16:53:11 +08:00
    @LeoDev 可以啊
    forsigner
        51
    forsigner  
    OP
       2016-03-11 16:54:01 +08:00
    @laosb 对的 但是标题党下也有干货的
    forsigner
        52
    forsigner  
    OP
       2016-03-11 16:55:08 +08:00
    @hqs123 活捉一个文艺女程序媛
    forsigner
        53
    forsigner  
    OP
       2016-03-11 16:55:57 +08:00
    @sciooga 百度那个功能强大复杂,适合发烧友玩家
    xiaobubobo
        54
    xiaobubobo  
       2016-03-11 16:56:27 +08:00
    动手能力不错,但是乱用字体还是丑,好的设计师没那么多花里胡哨的字体。
    fhefh
        55
    fhefh  
       2016-03-11 17:08:32 +08:00
    nice~~ mark
    wweir
        56
    wweir  
       2016-03-11 17:26:23 +08:00
    最讨厌这些作死的乱用字体。阅读就是阅读,我在认认真真的阅读,结果你来个漫画体之类的。还有一些强制宋体的网页更是恶心,导致我现在电脑都是不装宋体
    evannan
        57
    evannan  
       2016-03-11 17:29:18 +08:00   1
    丑不丑是审美问题,不然再好的素材都能用成 X... 哈哈~
    tabris17
        58
    tabris17  
       2016-03-11 17:35:09 +08:00
    @forsigner 防审查
    LeoDev
      &nbs; 59
    LeoDev  
       2016-03-11 17:36:50 +08:00
    @forsigner
    谢谢哈~
    forsigner
        60
    forsigner  
    OP
       2016-03-11 17:39:50 +08:00
    @wweir 别激动~ 乱用字体大家都讨厌啊,我帖子里说了,主要应用场景在 Logo 、 Slogan 、标题等地方
    chousb
        61
    chousb  
       2016-03-11 17:43:34 +08:00
    果然很漂亮
    forsigner
        62
    forsigner  
    OP
       2016-03-11 17:52:37 +08:00
    @tabris17 这个应该不行,每个文字对应唯一 Unicode
    forsigner
        63
    forsigner  
    OP
       2016-03-11 18:15:13 +08:00
    @evannan 对的,一般来说设计师的什么决定了他的设计功力
    forsigner
        64
    forsigner  
    OP
       2016-03-11 18:17:22 +08:00
    @xcc3641 这个工具在手机没法用的,就懒得兼容了
    tabris17
        65
    tabris17  
       2016-03-11 18:50:11 +08:00
    @forsigner 是唯一的,只是映射顺序打乱
    unboy
        66
    unboy  
       2016-03-11 19:34:52 +08:00
    恩,这个很棒!
    litianyou
        67
    litianyou  
       2016-03-11 20:50:15 +08:00
    难道你们不知道有一个网站叫做“有字库”吗?
    貌似这个是国内第一个
    forsigner
        68
    forsigner  
    OP
       2016-03-11 21:23:36 +08:00
    @jasperchou 形象生动
    forsigner
        69
    forsigner  
    OP
       2016-03-11 21:34:08 +08:00
    @zwpaper 其实我做 web-fontmin 就是为了让 fexo 主题使用者可以方便的修改博客名称字体,默认中文字体太难看了
    toono
        70
    toono  
       2016-03-11 22:24:11 +08:00
    很棒
    forsigner
        71
    forsigner  
    OP
       2016-03-11 23:08:25 +08:00 via iPad
    @tabris17 这会导致字体错乱吧,明明是这个字却显示为其他字
    sneezry
        72
    sneezry  
       2016-03-11 23:15:59 +08:00
    中文字体真没几个是开源的,所以一直不敢随便用 Orz
    forsigner
        73
    forsigner  
    OP
       2016-03-12 09:36:47 +08:00
    @sneezry 这个确实蛋疼
    livia313
        74
    livia313  
       2016-03-12 09:53:45 +08:00
    第一张图好好看
    Lattez
        75
    Lattez  
       2016-03-12 10:43:59 +08:00
    好用!赞一个
    tabris17
        76
    tabris17  
       2016-03-12 18:37:44 +08:00
    @forsigner 要的就是这个目的。虽然说对 SEO 不友好,但是可以防拷贝和防审查
    forsigner
        77
    forsigner  
    OP
       2016-03-12 19:36:35 +08:00
    @livia313 也就是说第二张不好看...
    forsigner
        78
    forsigner  
    OP
       2016-03-12 19:37:07 +08:00
    @Lattez thx~
    forsigner
        79
    forsigner  
    OP
       2016-03-12 19:39:42 +08:00
    @tabris17 百度的 fontEditor 应该可以做到这个,楼上有人提到
    Mavious
        80
    Mavious  
       2016-03-17 06:26:44 +08:00 via Android
    方正晶黑,采取笔画拼接技术的黑体,体积狠小狠小哦。
    ningcool
        81
    ningcool  
       2018-09-05 10:12:31 +08:00
    网站打不开了?
    关于     帮助文档     自助推广系统     博客     API     FAQ     Solana     1476 人在线   最高记录 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 30ms UTC 16:43 PVG 00:43 LAX 09:43 JFK 12:43
    Do have faith in what you're doing.
    ubao snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86