零基礎(chǔ)，怎么自學(xué)好前端？如果想在前端入門，建議先打好基礎(chǔ)，比如HTML，CSS，JavaScript。你應(yīng)該模仿一些金典網(wǎng)頁，并嘗試編寫自己的網(wǎng)頁和互動動畫。如果在寫作過程中遇到問題，可以多百度一下，

零基礎(chǔ)，怎么自學(xué)好前端？

如果想在前端入門，建議先打好基礎(chǔ)，比如HTML，CSS，JavaScript。你應(yīng)該模仿一些金典網(wǎng)頁，并嘗試編寫自己的網(wǎng)頁和互動動畫。如果在寫作過程中遇到問題，可以多百度一下，或者請教一些有經(jīng)驗(yàn)的人。堅(jiān)持前端基礎(chǔ)1-2個(gè)月應(yīng)該沒問題。

其次要注意基礎(chǔ)理論的積累，比如css盒子模型，布局，轉(zhuǎn)場和動畫，定位這些常用的理論。對于javascript，你要熟悉邏輯運(yùn)算的語法和數(shù)組語法，因?yàn)閖avascript在很多場景下都是在處理邏輯。也可以嘗試寫旋轉(zhuǎn)木馬、換卡、拼圖等游戲。，可以加強(qiáng)你對代碼邏輯的理解。之前寫過關(guān)于高級javascript的文章，你也可以參考一下。

前端進(jìn)階需要了解底層知識，如js閉包、閉包的優(yōu)缺點(diǎn)、瀏覽器垃圾收集機(jī)制、dom更新原理及性能優(yōu)化、原型與原型鏈、對象與繼承等。，這個(gè)應(yīng)該很好理解。

如果后期想做到高級前端，可以通讀javascript高級編程，然后了解基本的數(shù)據(jù)結(jié)構(gòu)和算法，比如冒泡排序、快速排序、Hill排序、鏈表、二叉樹等。熟悉vue、react等主流框架。并能獨(dú)立負(fù)責(zé)項(xiàng)目。

前端架構(gòu)需要非常熟悉前端工程流程，比如配置前端開發(fā)工作流，比如webpack和gulp，知道如何封裝團(tuán)隊(duì)公共組件庫和類庫，比如使用rollup、自動部署、sh

怎樣在網(wǎng)頁中做出精彩的文字排版？

所以這里 這就是訣竅！

1.唐 不要使用太多字體

建議網(wǎng)站排版時(shí)字體類型不要超過三種，否則網(wǎng)站會顯得松散不專業(yè)。不僅字體太多會造成這個(gè)問題，字體太大也會破壞頁面的布局。

通常，字體類型的數(shù)量被限制在最低限度(兩種是很多的，一種通常就足夠了)，整個(gè)網(wǎng)站堅(jiān)持同樣的原則。如果使用多種字體，請確保兩種字體協(xié)調(diào)一致。以下面的字體組合為例。格魯吉亞和凡爾登相輔相成，相對和諧。與右邊的巴斯克維爾和Impact相比會有明顯的，無襯線Impact明顯超過巴斯克維爾 的視覺沖擊。

在中英文排版中，建議您中文使用標(biāo)準(zhǔn)中文字體，英文、數(shù)字、字符均使用。標(biāo)準(zhǔn)英文字體。以下圖為例，供參考。

左:中文(漢儀橫幅黑)英文(DIN Next LT Pro)標(biāo)點(diǎn)使用半角字符右:中文(漢儀橫幅黑)英文(漢儀橫幅黑)標(biāo)點(diǎn)使用全角字符。

2.盡量使用標(biāo)準(zhǔn)字體。

Google Web Font或者Typekit里面有很多有趣的字體，國內(nèi)有字體庫的字體嵌入服務(wù)。對于國內(nèi)設(shè)計(jì)師來說，痛苦的是漢字很有體驗(yàn)，一個(gè)字體幾兆甚至更多，會增加用戶瀏覽網(wǎng)站的加載時(shí)間。另一方面，大寫和小寫26個(gè)字母以及帶有數(shù)字標(biāo)點(diǎn)符號的總共幾百個(gè)K的英語字體在網(wǎng)頁中易于使用。

盡可能選擇一種標(biāo)準(zhǔn)字體(近幾年網(wǎng)頁中可以使用思源、方平、Arial、Calibri或其他常見的在屏幕上易讀的粗體字體，如果沒有特別的概念指導(dǎo)，盡量避免使用襯線字體，如宋體)。不是每個(gè)用戶都能在終端上看到相同的字體，這意味著用戶可能看不到您選擇的合適字體。用戶對標(biāo)準(zhǔn)字體更熟悉，可以更快地閱讀特殊字體，少量字體可以做成。svg格式。好的排版會讓用戶更關(guān)注內(nèi)容本身而不是字體類型。

3.限制一行文本的長度

確保每行的字符數(shù)是文本可讀性的關(guān)鍵。設(shè)計(jì)者不僅要定義文本的寬度，還需要根據(jù)用戶的可讀性來定義。太寬-這會使單行文本太長，對讀者來說很難閱讀。;他的眼睛集中在課文上。因?yàn)殚L時(shí)間閱讀容易連載，在大段文字中很難找到正確的行。太短-它會使用戶 眼睛經(jīng)常會回到下一行文字，打破讀者的閱讀節(jié)奏，長時(shí)間閱讀會造成視覺疲勞。太短還會傾向于向讀者傳遞一個(gè)信號，讓讀者在閱讀當(dāng)前行之前跳到下一行，這可能會忽略潛在的重要單詞。

對于移動設(shè)備，每行應(yīng)該有30-40個(gè)字符(半角)，顯示多少字取決于不同分辨率、文本寬度和字體大小的屏幕。設(shè)計(jì)原則是:保證用戶能流暢地閱讀文字，文字不能太小也不能太大。以iOS(手機(jī))為例，文字的最小字號不能小于24px，太小了用戶看不清。以百度為例，可以作為參考。

4.選擇一種多字重且屏幕顯示良好的字體。

用戶會通過不同屏幕分辨率的終端設(shè)備訪問你的網(wǎng)站，大多數(shù)用戶界面都需要各種大小的文本(標(biāo)題、字幕、文字、注釋等。).選擇可以在不同屏幕分辨率的設(shè)備上運(yùn)行良好的字體，以確保其不同大小的字體具有較高的可讀性和可用性(UsabiLity)也很重要

近兩年流行的思源粗體和方平字體都是不錯(cuò)的選擇。當(dāng)然，個(gè)人認(rèn)為漢儀Banner Black在家族字體數(shù)量、字體質(zhì)量、屏幕顯示、紙張打印等方面并不遜色于前兩種字體。參與過思源黑體設(shè)計(jì)的設(shè)計(jì)師都表示，思源黑體還是比較粗糙的字體。同樣，為了保證屏幕上的易讀性，盡量避免使用襯線，雖然它們很漂亮。

5.使用識別度高的字體。

選擇英文字體時(shí)，有些字體的個(gè)別字母容易混淆，尤其是 "我 "和 "L "(如下圖)；以及單詞之間的間距。很多中文字體在使用較小字體時(shí)會粘在一起(上圖)，不容易分辨；所以在選擇字體類型的時(shí)候，請檢查你選擇使用的字體，確保不會給用戶和產(chǎn)品造成不必要的損失。

6.避免在界面的大段中使用大寫字母。

唐 不要在所有文本中使用大寫字母，除非強(qiáng)迫用戶閱讀大寫字母、首字母和有特殊含義的縮寫。與小寫字母相比，大量大寫字母會嚴(yán)重減少用戶 閱讀效率和樂趣。

7.將行距控制在字體的1.5至2.0倍之間。

在文字排版中，我們還有一個(gè)專門的術(shù)語來表示行距:行距(或行高)。為了保證文字的可讀性和可讀性，使文字形成線性的閱讀體驗(yàn)，在網(wǎng)頁設(shè)計(jì)中，行距通?？刂圃谧痔?中文字體)的1.5-2.0倍之間。英文字體建議使用默認(rèn)行距，或者根據(jù)默認(rèn)行距進(jìn)行微調(diào)。

8.適當(dāng)?shù)念伾珜Ρ韧ǔ?，盡量避免使用相同或相似的顏色作為文本和背景。

文字越明顯，用戶瀏覽和閱讀的速度就越快。當(dāng)然，也要學(xué)會通過文字顏色、大小、背景的顏色關(guān)系來控制視覺層次。小字與背景的對比度至少要達(dá)到4.5 :1，大字(14px/18px以上)與背景的對比度要保持3:1。

灰色通常作為輔助色。根據(jù)我自己的項(xiàng)目經(jīng)驗(yàn)，有必要分享一套我一直在用的灰色，需要明確區(qū)分信息層次。

9.避免將文本涂成紅色或綠色。

色盲和色弱是我必須照顧的一些用戶，尤其是男性(8%的男性是色盲)。建議使用其他區(qū)分重要信息(下劃線、粗體等。).避免分別使用紅色和綠色來傳達(dá)信息。因?yàn)榧t綠色盲是最常見的色盲形式。(現(xiàn)在想想，那些孩子 s鞋可以 找不到司機(jī)牌照因?yàn)槭羌t綠盲討厭分分鐘制定紅綠燈規(guī)則的人？當(dāng)然，這只是一個(gè)玩笑。使用交通燈是因?yàn)楣鈱W(xué)在物理學(xué)中傳播。原因，此處不解釋)

雖然我們在日常生活中總是告訴用戶綠色表示正確操作，紅色表示錯(cuò)誤操作，但是讓 s反思一下我們有沒有考慮到色盲用戶的操作和體驗(yàn)。也許我們可以考慮另一種表達(dá)對錯(cuò)的？

10.避免文本閃爍

閃爍的文本或內(nèi)容可能會讓一些用戶感到不舒服，對于普通用戶來說，可能會分散他們的注意力或讓他們感到煩躁。

雖然網(wǎng)頁設(shè)計(jì)還有很多需要我們注意的地方，但是最后我想和大家分享一個(gè)想法，排版在網(wǎng)頁設(shè)計(jì)中是非常重要的。做出正確的排版可以讓你的網(wǎng)站感覺耳目一新，而糟糕的排版會分散用戶的注意力，傾向于關(guān)注自己的感受而不是內(nèi)容。排版的關(guān)鍵是信息層次清晰，便于用戶閱讀，保證文字可讀性。字符的排版不應(yīng)該增加用戶 認(rèn)知從眾，從而達(dá)到尊重內(nèi)容和用戶的目的。