標你妹上傳文件失敗

『壹』 國內有沒有好用的UI設計標注工具

說下目前市面上的一些標注工具的優缺點好壞：

PxCook:（我的評價：4.5星）

先說我用過還不錯的標注工具，也是我目前在用的工具。操作形式和MarkMan有些許相似，不過交互體驗上高出了一個檔次。主要表現在支持智能的拖放標注，移動設備單位切換等方面上。並且它是為數不多的PS和Sketch都支持的標注工具。

優點：

成熟：跨平台——支持Windows和Mac

成熟2：支持PS和Sketch。

交互特別智能，也方便，一拖一放就標注完了。

相當需要說的一點：對於PSD文件或者Sketch進行了修改之後，PxCook里的標注會自動進行更新，免除了手動操作的過程。這是後面很多軟體沒有的。

支持移動設備的多單位切換。

對於應用了圖層樣式的圖層而言，它會忽略圖層樣式的尺寸，比較符合我們開發人員思路。

對於應用了顏色疊加的文本，標注時候，顏色值首先是正確的。

對於應用了顏色疊加，同時嵌套了組也對組應用了顏色疊加的文本標注顏色值也是正確的，以上兩點很重要，因為我發現很多設計師喜歡通過這種方式來修改文本顏色。

缺點：

不能支持多個文件同時進行標注。

對於圖層樣式等信息，不能進行詳細查看。

價格：免費

點擊這里和UI設計

Assistor PS:（我的評價：3星）

韓國推出的一款綜合類設計輔助工具。其中也提供了標注功能。其流程為通過控制PS進行標注，類似於插件但並非插件。可謂開創了自動標注的先河，基本操作就是通過先選中圖層，然後在插件面板中點擊生成標注，標注會以一個新的圖層的方式存在在你的設計稿中。只不過該軟體已許久不再更新和維護了。
點擊這里和UI設計小夥伴尋找更合適的標注工具

優點：

較為智能，不用手動去對像素了。

支持字體等標注，以及支持基本的顏色疊加識別。

支持Windows和Mac。

l 缺點：

僅支持PS。

對標注圖層的設定有些欠妥：生成的標注是單獨的圖層，管理起來不方便；可以對同一個圖層點擊多次標注，這樣就創建了多個相同的標注圖層……

不能同步更改，如果設計稿改了，那標注改起來很不方便，先要找到對應的標注圖層刪掉，然後再重新標注。

速度慢（運算速度），比如我點一下標注，在PS里需要算幾秒才能標出一個距離。

會把圖層的效果（比如投影等）也算到尺寸里？！在大多數情景下感覺似乎不太符合開發人員的思路。

對於帶有混合模式以及透明度的顏色疊加的文本進行標注時，顏色值取值不正確。最終結果應該是黑色，但是標注結果卻是紅色。

對於嵌套了組，同時對組也應用了顏色疊加之後，的文本標注取值也不對。最終結果應該是綠色，標注結果也變成了紅色。

價格：由於公司被收購，從100usd/年變免費。

標你妹啊：（我的評價：3.5星）

這是一款在線的非標注工具，更適合開發人員，可以及時動態看到設計稿的相關標注信息，只需要把PSD上傳上去即可，它會在伺服器上去分析你的PSD然後提供和標注相關的數據。

優點：

交互方式更加流暢和直觀，操作響應程度很快。

對於移動單位標注的切換更加直觀和方便。

對於應用了圖層樣式的圖層而言，它會忽略圖層樣式的尺寸，比較符合開發人員思路。

缺點：

安全的擔心：需要上傳PSD文件，對於一部分人和公司，文件的保密性可能是不能逾越的鴻溝，同時對PSD文件體積有限制。

只支持PSD文件。

上傳受到網速限制，那些大文件真是要很久啊，不太符合國情。

有bug：對於一部分psd文件無法正常解析。

對於進行了顏色疊加的文本，得到的顏色值是錯誤的。

外面如果再嵌套了一個組，得到的顏色就錯的更加離譜了。

價格：免費

MarkMan：（我的評價2.5星）

MarkMan是我最早接觸過的標注工具，那時候標注需要的不多，作為一個可以為所有圖片格式提供通用標注的軟體來講，MarkMan是個不錯的選擇，早期版本中是不支持移動端單位的，不過大概在幾年前吧，他們加入了單位切換。問題在於，交互。他們後來加入的所有功能都放在了右鍵菜單里，用起來並不是那麼方便，不過作為元老級產品，MarkMan是很贊的。直到他們把免費版變為了收費版後，就沒見他們怎麼更新過了。

優點：

入場比較早，做得比較早

為常見圖片格式提供通用基本的標注，滿足基本需求

缺點：

標注方式不智能，只能說是滿足基本需求

部分功能（比如單位切換）在右鍵菜單里，很不方便，交互不夠簡潔明了。

價格：60rmb每年

Dorado：（我的評價：2星）

Dorado是後來騰訊出的一個標注工具，這個應該是繼MarkMan之後一個同樣在當時比較方便的標注工具了，好像和MarkMan之間有一段小風波。不過我們不討論它，單純客觀來評價這個軟體。他基本功能和MarkMan差不多，但是他的體積非常的小。

優點：

為常見圖片格式提供通用基本的標注，滿足基本需求

體積小巧，只有幾百K，而且是綠色的不用安裝。

支持的圖像格式更多。

缺點：

只有Windows版本，沒有Mac版本。

還是標注方式不夠智能，僅滿足基本需求

價格：免費

Parker：（我的評價：2.星）

Parker是以插件形式進行輔助標注的工具。支持PS和Sketch，要分別為兩個工具去單獨安裝插件Parker插件。基本操作與Assistor PS特別像，甚至連一些Bug和處理也一樣[Microsof1] ，詳見如下文中提到的缺點。

優點：

滿足基本標注需求。

較為智能，不用手動去對像素了。

支持字體等標注，以及支持基本的顏色疊加識別。

缺點：

生成的標注是單獨的圖層，管理起來並不方便，並且可以對同一個圖層點擊多次標注，這樣就創建了多個相同的標注圖層。

如果設計稿修改了，那標注修改起來不方便，先要找到對應的標注圖層刪掉，然後再重新標注。

運算速度較慢，比如點一下標注，在PS里需要算幾秒才能標出一個尺寸。

會把圖層的效果（比如投影等）也算到尺寸里，感覺不太符合大多數開發情景。

對於這種帶有混合模式以及透明度的顏色疊加的文本進行標注時，顏色值取值不正確。最終結果應該是黑色，但是標注結果卻是紅色。

對於嵌套了組，同時對組也應用了顏色疊加之後，的文本標注取值也不對。最終結果應該是綠色，標注結果也變成了紅色。

價格：60rmb一次性付費。

以上就是龐姿姿的回答，希望對你有所幫助。

『貳』 WEB前端目前的主要學習內容是什麼

這里根據行業變化和企業用人需求整理了一份web前端學習路線，主要學習以下內容，希望可以幫到你~

第一階段：專業核心基礎

階段目標：

1. 熟練掌握HTML5、CSS3、Less、Sass、響應書布局、移動端開發。

2. 熟練運用HTML+CSS特性完成頁面布局。

4. 熟練應用CSS3技術，動畫、彈性盒模型設計。

5. 熟練完成移動端頁面的設計。

6. 熟練運用所學知識仿製任意Web網站。

7. 能綜合運用所學知識完成網頁設計實戰。

知識點：

1、Web前端開發環境，HTML常用標簽，表單元素，Table布局，CSS樣式表，DIV+CSS布局。熟練運用HTML和CSS樣式屬性完成頁面的布局和美化，能夠仿製任意網站的前端頁面實現。

2、CSS3選擇器、偽類、過渡、變換、動畫、字體圖標、彈性盒模型、響應式布局、移動端。熟練運用CSS3來開發網頁、熟練開發移動端，整理網頁開發技巧。

3、預編譯css技術：less、sass基礎知識、以及插件的運用、BootStrap源碼分析。能夠熟練使用 less、sass完成項目開發，深入了解BootStrap。

4、使用HTML、CSS、LESS、SASS等技術完成網頁項目實戰。通過項目掌握第一階段html、css的內容、完成PC端頁面設計和移動端頁面設計。

第二階段：Web後台技術

階段目標:

1. 了解JavaScript的發展歷史、掌握Node環境搭建及npm使用。

2. 熟練掌握JavaScript的基本數據類型和變數的概念。

3. 熟練掌握JavaScript中的運算符使用。

4. 深入理解分之結構語句和循環語句。

5. 熟練使用數組來完成各種練習。

6.熟悉es6的語法、熟練掌握JavaScript面向對象編程。

7.DOM和BOM實戰練習和H5新特性和協議的學習。

知識點：

1、軟體開發流程、演算法、變數、數據類型、分之語句、循環語句、數組和函數。熟練運用JavaScript的知識完成各種練習。

2、JavaScript面向對象基礎、異常處理機制、常見對象api，js的兼容性、ES6新特性。熟練掌握JavaScript面向對象的開發以及掌握es6中的重要內容。

3、BOM操作和DOM操作。熟練使用BOM的各種對象、熟練操作DOM的對象。

4、h5相關api、canvas、ajax、數據模擬、touch事件、mockjs。熟練使用所學知識來完成網站項目開發。

第三階段：資料庫和框架實戰

階段目標：

1. 綜合運用Web前端技術進行頁面布局與美化。

2. 綜合運用Web前端開發框架進行Web系統開發。

3. 熟練掌握Mysql、Mongodb資料庫的發開。

4. 熟練掌握vue.js、webpack、elementui等前端框技術。

5. 熟練運用Node.js開發後台應用程序。

6. 對Restful，Ajax，JSON，開發過程有深入的理解,掌握git的基本技能。

知識點：

1、資料庫知識，範式，MySQL配置，命令，建庫建表，數據的增刪改查，mongodb資料庫。深入理解資料庫管理系統通用知識及MySQL資料庫的使用與管理，為Node.js後台開發打下堅實基礎。

2、模塊系統，函數，路由，全局對象，文件系統，請求處理，Web模塊，Express框架，MySQL資料庫處理，RestfulAPI，文件上傳等。熟練運用Node.js運行環境和後台開發框架完成Web系統的後台開發。

3、vue的組件、生命周期、路由、組件、前端工程化、webpack、elementui框架。Vue.js框架的基本使用有清晰的理解，能夠運用Vue.js完成基礎前端開發、熟練運用Vue.js框架的高級功能完成Web前端開發和組件開發，對MVVM模式有深刻理解。

4、需求分析，資料庫設計，後台開發，使用vue、node完成pc和移動端整站開發。於Node.js+Vue.js+Webpack+Mysql+Mongodb+Git，實現整站項目完整功能並上線發布。

第四階段：移動端和微信實戰

階段目標：

1.熟練掌握React.js框架，熟練使用React.js完成開發。

2.掌握移動端開發原理，理解原生開發和混合開發。

3.熟練使用react-native和Flutter框架完成移動端開發。

4.掌握微信小程序以及了解支付寶小程序的開發。

5.完成大型電商項目開發。

知識點：

1、React面向組件編程、表單數據、組件通信、監聽、聲明周期、路由、Rex基本概念。練使用react完成項目開發、掌握Rex中的非同步解決方案Saga。

2、react-native、開發工具、視圖與渲染、api操作、Flutter環境搭建、路由、ListView組件、網路請求、打包。練掌握react-native和Flutter框架，並分別使用react-native和Flutter分別能開發移動端項目。

3、微信小程序基本介紹、開發工具、視圖與渲染、api操作、支付寶小程序的入門和api學習。掌握微信小程序開發了解支付寶小程序。

4、大型購物網站實戰，整個項目前後端分離開發；整個項目分為四部分：PC端網頁、移動端APP、小程序、後台管理。團隊協作開發，使用git進行版本控制。目期間可以擴展Three.js 、TypeScript。

『叄』 web前端都學習哪些內容

這里根據行業變化和企業用人需求整理了一份web前端系統全面的學習路線，主要學習以下內容：

第一階段：專業核心基礎

階段目標：

1. 熟練掌握HTML5、CSS3、Less、Sass、響應書布局、移動端開發。

2. 熟練運用HTML+CSS特性完成頁面布局。

4. 熟練應用CSS3技術，動畫、彈性盒模型設計。

5. 熟練完成移動端頁面的設計。

6. 熟練運用所學知識仿製任意Web網站。

7. 能綜合運用所學知識完成網頁設計實戰。

知識點：

1、Web前端開發環境，HTML常用標簽，表單元素，Table布局，CSS樣式表，DIV+CSS布局。熟練運用HTML和CSS樣式屬性完成頁面的布局和美化，能夠仿製任意網站的前端頁面實現。

2、CSS3選擇器、偽類、過渡、變換、動畫、字體圖標、彈性盒模型、響應式布局、移動端。熟練運用CSS3來開發網頁、熟練開發移動端，整理網頁開發技巧。

3、預編譯css技術：less、sass基礎知識、以及插件的運用、BootStrap源碼分析。能夠熟練使用 less、sass完成項目開發，深入了解BootStrap。

4、使用HTML、CSS、LESS、SASS等技術完成網頁項目實戰。通過項目掌握第一階段html、css的內容、完成PC端頁面設計和移動端頁面設計。

第二階段：Web後台技術

階段目標:

1. 了解JavaScript的發展歷史、掌握Node環境搭建及npm使用。

2. 熟練掌握JavaScript的基本數據類型和變數的概念。

3. 熟練掌握JavaScript中的運算符使用。

4. 深入理解分之結構語句和循環語句。

5. 熟練使用數組來完成各種練習。

6.熟悉es6的語法、熟練掌握JavaScript面向對象編程。

7.DOM和BOM實戰練習和H5新特性和協議的學習。

知識點：

1、軟體開發流程、演算法、變數、數據類型、分之語句、循環語句、數組和函數。熟練運用JavaScript的知識完成各種練習。

2、JavaScript面向對象基礎、異常處理機制、常見對象api，js的兼容性、ES6新特性。熟練掌握JavaScript面向對象的開發以及掌握es6中的重要內容。

3、BOM操作和DOM操作。熟練使用BOM的各種對象、熟練操作DOM的對象。

4、h5相關api、canvas、ajax、數據模擬、touch事件、mockjs。熟練使用所學知識來完成網站項目開發。

第三階段：資料庫和框架實戰

階段目標：

1. 綜合運用Web前端技術進行頁面布局與美化。

2. 綜合運用Web前端開發框架進行Web系統開發。

3. 熟練掌握Mysql、Mongodb資料庫的發開。

4. 熟練掌握vue.js、webpack、elementui等前端框技術。

5. 熟練運用Node.js開發後台應用程序。

6. 對Restful，Ajax，JSON，開發過程有深入的理解,掌握git的基本技能。

知識點：

1、資料庫知識，範式，MySQL配置，命令，建庫建表，數據的增刪改查，mongodb資料庫。深入理解資料庫管理系統通用知識及MySQL資料庫的使用與管理，為Node.js後台開發打下堅實基礎。

2、模塊系統，函數，路由，全局對象，文件系統，請求處理，Web模塊，Express框架，MySQL資料庫處理，RestfulAPI，文件上傳等。熟練運用Node.js運行環境和後台開發框架完成Web系統的後台開發。

3、vue的組件、生命周期、路由、組件、前端工程化、webpack、elementui框架。Vue.js框架的基本使用有清晰的理解，能夠運用Vue.js完成基礎前端開發、熟練運用Vue.js框架的高級功能完成Web前端開發和組件開發，對MVVM模式有深刻理解。

4、需求分析，資料庫設計，後台開發，使用vue、node完成pc和移動端整站開發。於Node.js+Vue.js+Webpack+Mysql+Mongodb+Git，實現整站項目完整功能並上線發布。

第四階段：移動端和微信實戰

階段目標：

1.熟練掌握React.js框架，熟練使用React.js完成開發。

2.掌握移動端開發原理，理解原生開發和混合開發。

3.熟練使用react-native和Flutter框架完成移動端開發。

4.掌握微信小程序以及了解支付寶小程序的開發。

5.完成大型電商項目開發。

知識點：

1、React面向組件編程、表單數據、組件通信、監聽、聲明周期、路由、Rex基本概念。練使用react完成項目開發、掌握Rex中的非同步解決方案Saga。

2、react-native、開發工具、視圖與渲染、api操作、Flutter環境搭建、路由、ListView組件、網路請求、打包。練掌握react-native和Flutter框架，並分別使用react-native和Flutter分別能開發移動端項目。

3、微信小程序基本介紹、開發工具、視圖與渲染、api操作、支付寶小程序的入門和api學習。掌握微信小程序開發了解支付寶小程序。

4、大型購物網站實戰，整個項目前後端分離開發；整個項目分為四部分：PC端網頁、移動端APP、小程序、後台管理。團隊協作開發，使用git進行版本控制。目期間可以擴展Three.js 、TypeScript。