??現在app手機網站開發設計市場非常的火熱，很多企業都有設計app手機網站的需求，那么app手機網站設計技巧是怎樣的？網站設計和手機app設計有什么區別呢？下面新網就給大家具體說明一下。

??app手機網站設計技巧是怎樣的？

??1，字體大小對比

??在桌面方面，我們可能會使用字體大小差異較大的單詞組合。移動端的屏幕較小，屏幕中包含的文字較小。小屏幕上相同字體大小的差異將被放大。

??原因是我們在使用這兩種設備時有不同的觀看距離。我們的眼睛遠離桌面屏幕，反之亦然，因此我們應該在移動端使用較小的字體大小對比度。通常，界面設計的電話版本使用的字體大小是Web版本的兩倍。

??2，字體粗細變化

??不要在PS中使用粗體文本。它不僅破壞了字體本身的美感，還改變了文本的原始字寬，并影響了段落內文本的對齊。合理的方法是使用字體本身的字體粗細來控制。當然，設計渲染中的字體邊緣定義與實際設備中顯示的字體不完全相同。

??3，字體顏色對比與背景對比

??使用移動設備的環境是復雜的并且不限于室內。它可能在室外，甚至暴露在強烈的陽光下。應該確保文本不能識別背景中的困難，即使是弱者也能正常閱讀。WCAG 2.0中推薦的色彩對比度應高于4.5:1（AA級），以確保更多人和環境可以輕松閱讀。

??4，文字間距設置

??除非您對布局有特殊要求，否則請勿更改字體的字體間距。字體設計者已經考慮了適合這種字體的字體間距。如果您不滿意，可以更改字體。

??5，文本和光柵化系統

??在移動設備的小屏幕上，一些網頁與不均勻間距（右對齊等）無關將變得突出。以Lofter為例，Lofter是一款優雅而優雅的網易應用程序，但其文章文本界面略有缺陷：如圖6所示，文本在容器的左側和右側對齊

??手機APP原型圖設計需要注意的幾點

??1、留白

??界面中的留白的區域一般不會放置任何視覺元素。大量的留白可以讓本來凌亂的界面看起來簡約而吸引人——它讓界面元素周圍都空出來，讓這些元素更加醒目，脫穎而出。留白讓界面顯得更加富于呼吸感，也更加簡潔。

??用好留白，能讓界面以非侵略性的方式來區分不同的區域和元素。

??2、顏色對比

??顏色對比是最強大的設計手法之一，如果用的好，它能給你帶來醒目而帥氣的設計。創造性地使用色彩的差異來區分不同的內容，這其中的關鍵是要控制兩種顏色的對比度。不僅要可以在視覺上容易區別，并且不能讓人覺得突兀產生出戲感。如果顏色對比控制得好，應該能讓用戶更加快速便捷地獲取信息。

??3、陰影和高度

??暗影和高度都能在UI界面上創造出“深度”，相當于是讓元素在Z軸高度上產生差異。最典型的就是Material Design 的設計，谷歌日歷的設計很好地展現了怎么借助陰影和空間，非強制性地區分不同的部分。

??陰影的另外一個作用是用來區別重疊內容的“高度差”，呈現相互關系，讓其中的某個部分吸引用戶的注意力。

??4、圖片內容無需單獨的分隔控件

??圖片內容使用網格來呈現的時候，其實是無需專門的線或許其他東西來分隔的，因為網格本身就已經起到了視覺區分的作用了。圖片之間的留白和副標題都起到區別的作用。

??網站的設計和手機app的設計有哪些區別?

??規范上：

??比如WEB的字體大小跟APP的字體大??；

??比如WEB的按鈕高度一般是多少，APP的按鈕高度一般是多少；

??之所以有這方面的差別主要是因為屏幕尺寸導致，手機上1080P也就5.5-6寸，電腦上1080P就11到21寸都有；

??內容分布上：

??電腦屏幕寬，有時候可以允許雙流，多流的內容分布；

??手機屏幕窄，所以基本都是單流；

??設計過程中交互一定要考慮這一點。

??app手機網站設計技巧是怎樣的？大家在做app手機網站設計的時候，就可以按照上面的技巧去做，同時還需要注意一些要點的問題，這樣才能制作出讓人滿意的app手機網站來，如有需要，可以找新網。