lesson 2 | Typography


這篇主要是講排版,就是在你看網(wǎng)頁入蛆、博客响蓉、論壇這些的時(shí)候,注意文字的字體哨毁、行距枫甲、重點(diǎn)標(biāo)出等是否合乎邏輯,以及易讀性。

如何利用markdown清晰想幻、準(zhǔn)確地表達(dá)觀點(diǎn)粱栖,版式排列合乎邏輯,美感同時(shí)也很重要脏毯。

哈哈哈闹究!感覺在講平面的知識(shí)了。

發(fā)現(xiàn)一句很喜歡的話:

A picture may be worth a thousand words, but you have to know a thousand words to replace it.


Dive Into Typography

The basic of font

  • 基本概念
    1食店、Size(大性佟)
    2、Ascender(上部)
    3吉嫩、Descender(下部)
    4价认、Counter(計(jì)數(shù)o,p這些)
    5自娩、X Height(高度用踩,不含2,3)

然后還有一些字距椒功、對(duì)齊方式(左對(duì)齊捶箱、右對(duì)齊,居中等)动漾、襯線和非襯線等。

推薦常用11~12號(hào)字體荠锭,正確運(yùn)用粗體和斜體旱眯,以及輔助顏色來進(jìn)行強(qiáng)調(diào)。

忽然想起了喬布斯那段在斯坦福的演講证九,輟學(xué)后仍舊在學(xué)校學(xué)習(xí)完了有關(guān)字體的課程删豺,多年以后設(shè)計(jì)Mac時(shí),才都把這些曾經(jīng)的結(jié)合在一起愧怜,因此Mac才擁有了這么漂亮的字體呀页。(大致意思就是這樣..具體已忘記)

kerning Game(字距游戲)

是不是每章都有個(gè)小游戲!純靠眼力分?jǐn)?shù)好低...冬天手僵拥坛!


Better web typography in 13 simple steps(網(wǎng)頁上字體排版的13個(gè)步驟蓬蝶,或者說技巧,涉及到一些html和css知識(shí)看不太懂)

  • Find out what your fonts can do
  • Subset cleverly
  • Figuring out numerals(弄清楚數(shù)字)
    一套字體可以有多種數(shù)字組合猜惋,數(shù)字也是文字中重要的一部分丸氛,也要注意使用的地方和場(chǎng)合。
  • Don’t fake styles
  • But when you do, fake well
  • Be careful with copy-pasting text
    這個(gè)確實(shí)是著摔,直接復(fù)制的時(shí)候容易出差錯(cuò)缓窜。每次都需要復(fù)查才行,直接復(fù)制md格式會(huì)稍微好一些。
  • earn your HTML entities
  • Quote correctly(正確引用)
  • Know your dashes(知道你的重點(diǎn))
  • Define relationships, not absolute dimensions(活用排版吧)
  • Take control over line breaks
  • Space with care(空格)
  • Going further

還要思考一些除了形以外的東西禾锤,字體含義等私股。


The Amazing New Mobile Web

UX Design Guidelines For Smartphones

  • 移動(dòng)設(shè)備帶來的限制
    1、形式限制
    2恩掷、輸入限制(各種指令)

3庇茫、工藝限制(屏幕啦,電池這些也會(huì)限制交互的設(shè)計(jì))
4螃成、數(shù)據(jù)傳輸和價(jià)格

一般設(shè)計(jì)的慣例

  • 移動(dòng)端優(yōu)先
    本來就是移動(dòng)端為主嘛旦签,從移動(dòng)端出發(fā)去設(shè)計(jì),出發(fā)點(diǎn)寸宏。
  • 行為和原型
    就是兩大系統(tǒng)的設(shè)計(jì)指南吧宁炫,ios和android,同時(shí)還要根據(jù)用戶的期望氮凝,不能完全創(chuàng)新羔巢。
  • 鼓勵(lì)創(chuàng)新
    盡可能在保證體驗(yàn)的情況下,多去創(chuàng)新罩阵,提升效率竿秆。
  • 提供及時(shí)反饋鏈接
    相當(dāng)于用戶調(diào)研了,不斷糾正中前進(jìn)稿壁。

響應(yīng)式網(wǎng)頁設(shè)計(jì)(RWD幽钢,Responsive Web Design)

集中創(chuàng)建頁面的圖片排版大小,可以智能地根據(jù)用戶行為以及使用的設(shè)備環(huán)境(系統(tǒng)平臺(tái)傅是、屏幕尺寸匪燕、屏幕定向等)進(jìn)行相對(duì)應(yīng)的布局。

意思就是可以根據(jù)設(shè)備來進(jìn)行網(wǎng)頁的布局的調(diào)整喧笔,是自動(dòng)的帽驯,直接識(shí)別移動(dòng)設(shè)備!

技術(shù)手段就是:彈性化和響應(yīng)式圖片书闸,頁面布局根據(jù)設(shè)備來調(diào)整尼变,圖片也隨隨之調(diào)整分辨率。

這篇有好多技術(shù)內(nèi)容浆劲,看不懂....


Tools


一些UI設(shè)計(jì)工具推薦嫌术,挺多PS的,本身知道點(diǎn)梳侨,PS最終重要的一部分也是管理了蛉威,不僅僅只是做~


Typography in Product Design

就是強(qiáng)調(diào)文字排版在產(chǎn)品設(shè)計(jì)、網(wǎng)頁設(shè)計(jì)中的重要性走哺,很多具體的內(nèi)容實(shí)際是屬于平面的知識(shí)蚯嫌。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子择示,更是在濱河造成了極大的恐慌束凑,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,042評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件栅盲,死亡現(xiàn)場(chǎng)離奇詭異汪诉,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)谈秫,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,996評(píng)論 2 384
  • 文/潘曉璐 我一進(jìn)店門扒寄,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人拟烫,你說我怎么就攤上這事该编。” “怎么了硕淑?”我有些...
    開封第一講書人閱讀 156,674評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵课竣,是天一觀的道長。 經(jīng)常有香客問我置媳,道長于樟,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,340評(píng)論 1 283
  • 正文 為了忘掉前任拇囊,我火速辦了婚禮迂曲,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘寂拆。我一直安慰自己奢米,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,404評(píng)論 5 384
  • 文/花漫 我一把揭開白布纠永。 她就那樣靜靜地躺著,像睡著了一般谒拴。 火紅的嫁衣襯著肌膚如雪尝江。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,749評(píng)論 1 289
  • 那天英上,我揣著相機(jī)與錄音炭序,去河邊找鬼。 笑死苍日,一個(gè)胖子當(dāng)著我的面吹牛惭聂,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播相恃,決...
    沈念sama閱讀 38,902評(píng)論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼辜纲,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起耕腾,我...
    開封第一講書人閱讀 37,662評(píng)論 0 266
  • 序言:老撾萬榮一對(duì)情侶失蹤见剩,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后扫俺,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體苍苞,經(jīng)...
    沈念sama閱讀 44,110評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,451評(píng)論 2 325
  • 正文 我和宋清朗相戀三年狼纬,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了羹呵。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,577評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡疗琉,死狀恐怖冈欢,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情没炒,我是刑警寧澤涛癌,帶...
    沈念sama閱讀 34,258評(píng)論 4 328
  • 正文 年R本政府宣布,位于F島的核電站送火,受9級(jí)特大地震影響拳话,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜种吸,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,848評(píng)論 3 312
  • 文/蒙蒙 一弃衍、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧坚俗,春花似錦镜盯、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,726評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至恩闻,卻和暖如春艺糜,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背幢尚。 一陣腳步聲響...
    開封第一講書人閱讀 31,952評(píng)論 1 264
  • 我被黑心中介騙來泰國打工破停, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人尉剩。 一個(gè)月前我還...
    沈念sama閱讀 46,271評(píng)論 2 360
  • 正文 我出身青樓真慢,卻偏偏與公主長得像,于是被迫代替她去往敵國和親理茎。 傳聞我的和親對(duì)象是個(gè)殘疾皇子黑界,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,452評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案管嬉? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,734評(píng)論 1 92
  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,737評(píng)論 25 707
  • Swift版本點(diǎn)擊這里歡迎加入QQ群交流: 594119878最新更新日期:18-09-17 About A cu...
    ylgwhyh閱讀 25,322評(píng)論 7 249
  • 《最真實(shí)的你》 你的模樣 看起來有模有樣 卻是個(gè)假象 你的面具 看起來冠冕堂皇 卻令人荒唐 你的性子 看起來理所應(yīng)...
    詩人安閱讀 175評(píng)論 0 0
  • 從上個(gè)周五開始菠剩,開始有意識(shí)地養(yǎng)成一種習(xí)慣,早睡早起离唬,每天盡量9點(diǎn)半到10點(diǎn)準(zhǔn)備睡覺扰楼,早上5點(diǎn)半起床呀癣。 這個(gè)周因?yàn)橄?..
    花手鞠閱讀 339評(píng)論 0 0