B2B行業網站頁面元素之間的對齊標準

            2015-10-08  來自: 陜西印象信息技術有限公司 瀏覽次數:3821

                網頁里各種元素水平方向的對齊方式主要有:左對齊、右對齊、居中對齊和兩端對齊等4種方式,常用的為左對齊、居中對齊,右對齊和兩端對齊基本很少使用,尤其是兩端對齊,筆者認為一般只在平面設計的時候會使用。

                1、頁面各種元素對齊方式的基礎知識

                A、左對齊在網站布局中是***常見的對齊方式:它整齊一致并且安全,因為大家對這種對齊方式很熟悉并且也樂意接受,所以對任何設計來說,左對齊都是***險的對齊方式。

                B、在高品質網頁設計中,好的對齊方式占了很大的比重:當物品排成一行時,通常看上去感覺***。因此,使用不同的對齊方式來建立對比是較難的而且要更謹慎的使用,但是如果做的好的話是非常有效的。比如:在文章中,我們常常是用左對齊的文本段落和居中對齊的標題來混合起來,這是使用不同的對齊方式建立對比的***hao例子。

                C、從用戶視線行為來分析對齊方式:用戶的視線常常是從上到下,從左到右,那么框架之間***hao的就要左右對齊,上下對齊,讓視線更流暢。導航頁的內容鏈接,當用戶看完一個鏈接后,會接著看下一個鏈接,左對齊仍然是***hao的方式。

                2、框架與框架之間的對齊方式

            第1部分講了,用戶的視線常常是從上到下,從左到右,那么框架之間***hao的就要左右對齊,上下對齊,讓視線更流暢。但是有時左邊框架的內容更高,右邊要放2個模塊才可能和左邊一樣多,這個時候我們***要確保右邊2個模塊或多個模塊剛好和左邊的一個框架對齊,這樣看起來才更統一。

                3、內容與小圖標之間的對齊方式

            標題欄上的小圖標與標題欄名稱、內容鏈接左邊的小圖標等,都是采用上下居中對齊,左邊左對齊的方式,一般內容鏈接左邊都有一個小圖標,小圖標右邊的標題也要左對齊。而且整站上下不同的框架之間,也要上下對齊。

                4、產品圖片、人物圖片等與內容的對齊方式

                這種方式分為兩種,水平對齊方式與居中對齊方式。

                A 文字放圖片下方:這種方式一般為居中對齊,因為如果左對齊,文字如果少了,會顯的比較難看,尤其是人物圖片,只有一個人名。

                B 文字放圖片右邊:文字水平方向要左對齊,因為用戶看了圖片,就要看圖片周圍的文字,如果采用右對齊或居中對齊,都會使視線不連貫。垂直方向要兩端對齊,看起來更規整,一般是標題和導讀內容與圖片兩端對齊。

            更多的對齊方式在《B2B行業門戶網站設計開發實戰研究報告》第四章第四節里做了詳細闡述。

                5、信息錄入提交表單頁面

                在表單頁面使操作區域對齊,將大大提升用戶完成任務的效率,所以輸入框左對齊是***的,當用戶輸入完一個框后,接著往下一個框,可以節省用戶的時間。但是作為提示輸入內容的文字,則要右對齊***hao,因為提示語言有的多有的少,會造成提示語言和輸入框之間產生空白區域,加重了用戶的認知負擔,用戶***花相當多的時間以便在標簽和輸入框之間移動視線。

                操作過程中,用戶更關注輸入框本身,而不是標簽。用戶眼睛關注點的轉移速度是非常快的,并且即使不從頭閱讀標簽也能明白它的意思,對于用戶的行為分析,本文作者在《B2B行業門戶網站策劃實戰研究報告》里做了詳細的闡述。


            聯 系 人:劉經理

            業務咨詢:18165398160(同微信)

            服務監督:18966660101(同微信)

            客服電話:029-88412862

            法律顧問:李寶特律師團隊

            聯系地址:西安市碑林區南關正街中貿廣場15號樓2單元9F

            CopyRight ? 版權所有: 陜西印象信息技術有限公司 網站地圖 XML 備案號:陜ICP備09025595號-1

            陜公網安備 61010302000938號


            掃一掃訪問移動端
            无限资源一日本片好2019,无限资源韩国日本,无限资源日本官网_无限资源日本2019版