- Photoshop淘寶天貓網店設計裝修從入門到精通
- 蔣珍珍
- 2508字
- 2020-11-28 17:16:17
2.4 文字應用:網店文字應用技巧
在網店裝修畫面中,文字的表現與商品展示同等重要,它可以對商品、活動、服務等信息進行及時的說明和指引,并且通過合理的設計和編排,讓信息的傳遞更加準確。本節將對網店裝修中的文字設計和處理進行詳細的講解。
2.4.1 字體風格的設計與運用
當我們登入了一個店鋪首頁的時候,你是否會有意或無意地留意到屬于這個店鋪的特定的字體設計或者使用,從而影響到你對這個店鋪最直觀的感受,是精致、優雅、科幻、古典,還是覺得粗糙難看呢?
字體風格形式多變,如何利用文字進行有效的設計與運用,是把握字體更改最為關鍵的問題。當對文字的風格與表現手法有了詳盡的了解后,便能有助于我們進行字體設計。在網店裝修中,常見的字體風格有線型、手寫型、書法型、規整型等,不同的字體可以表現出不同的風格。
專家指點
商品圖片與文字兩者組合形成文案,文字的字體風格也對文案的情感傳達有著重要的影響作用。
1.線型字體
線型字體是指文字的筆畫每個部分的寬窄都相當,表現出一種簡潔、明快的感覺,在網店裝修設計中較為常用。常用的線型字體有“方正細圓簡體”“幼圓”等,如圖2-32所示。

圖2-32 線型字體
2.手寫型字體
手寫型字體是一種使用硬筆或者軟筆純手工寫出的文字。手寫體文字代表了中國漢字文化的精髓。這種手寫體文字,大小不一、形態各異,在計算機字庫中很難實現錯落有致的效果。手寫體的形式因人而異,帶有較為強烈的個人風格。
在網店中使用手寫體,可以表現出一種不可模仿的隨意和不受局限的自由性。有時為了迎合畫面整個的設計風格,適當地使用手寫型字體,可以讓店鋪的風格表現更加淋漓盡致,如圖2-33所示。

圖2-33 手寫型字體
3.書法型字體
書法型字體,就是書法風格的分類。書法字體,傳統講共有行書字體、草書字體、隸書字體、燕書字體、篆書字體和楷書字體6種,也就是6個大類。在每一大類中又細分若干小的門類,如篆書又分大篆、小篆,楷書又有魏碑、唐楷之分,草書又有章草、今草、狂草之分。
書法型字體是中國獨有的一種傳統藝術,字體外形自由、流暢,且富有變化,筆畫間會顯示出灑脫和力道,是一種傳神的精神境界。在網店裝修的過程中,為了迎合活動的主題,或者是配合商品的風格,很多時候使用書法型字體可以讓畫面中文字的外形設計感增強,表現出獨特的韻味,如圖2-34所示。

圖2-34 書法型字體
4.規整型字體
規整型字體是指利用標準、整齊外形的字體,可以表現出一種規整的感覺。這樣的字體也是網店裝修中較為常用的字體,它能夠準確、直觀地傳遞出商品和店鋪的信息。
在網店的版面構成中,利用規整型字體,并通過調整字體間的排列間隔,結合不同長短的文字可以很好地表現出畫面的節奏感,給人以大氣、端正的印象,如圖2-35所示。

圖2-35規整型字體
專家指點
除了上述介紹了幾種較為常用的字體外,還有圖形文字、花式文字、意象文字等,它們的外形都各有特點,且風格迥異。
2.4.2 文字編排對頁面的影響
為了讓網店的畫面布局變得更有調理,同時提高整體內容的表述力,從而利于顧客進行有效的閱讀以及接受其主題信息,在裝修中還需要考慮整體編排的規整型,并適當加入帶有裝飾性的設計元素,用來提升畫面美感,讓文字編排更加具有設計感。
要做到這些要求,必須深入了解網店的文字編排規則,即文字描述必須符合版面主題的要求、段落排列的易讀性以及整齊布局的審美性。
1.文字描述必須符合版面主題的要求
在網店裝修設計中,文字編排不但要達到主題內容的要求,其整體排列風格還必須要符合設計對象的形象,才能保證版面文字能夠準確無誤地傳達出信息,如圖2-36所示。

圖2-36 準確性的文字編排
2.段落排列的易讀性
在網店的文字編排設計中,易讀性是指通過特定的排列方式使文字能帶給顧客更好的閱讀體驗,讓顧客閱讀起來更加順遂、流暢。
在實際的網店裝修過程中,可以通過寬松的文字間隔、設置大號字體、多種不同字體進行對比閱讀的方式,讓段落文字之間產生一定的差異,使得文字信息主次清晰,增強文字的易讀性,讓顧客更快地抓住店鋪或商品的重點信息,如圖2-37所示。

圖2-37 易讀性的文字編排
3.整齊布局的審美性
對網店來說,頁面的美感是所有設計工作中必不可缺的重要因素。整齊布局的審美性就是指通過事物的美感來吸引顧客,使其對畫面中的信息和商品產生興趣。在字體編排方面,設計者可以對字體本身添加一些帶有藝術性的設計元素,以從結構上增添它的美感,如圖2-38所示。

圖2-38 整齊布局的審美性
2.4.3 設計文字的合理分割
在網店的裝修設計中,運用合理的文字分割方式,可以對圖文進行合理的規劃,并使它們之間的關系得到有效協調,從而把握好商品或者模特圖片與文字的搭配效果。根據切割走向的不同,可以將文字的編排手法劃分為垂直分割和水平分割兩種方式。
1.垂直分割
垂直分割包括左圖右文和左文右圖兩種類型。
● 左圖右文:通過垂直切割將版面分列成左右兩個部分,把商品或模特圖片文字分別排列在版面的左邊與右邊,從而形成左圖右文的排列形式,使版面產生由左至右的視覺流程,符合人們的閱讀習慣,在結構上可以給顧客帶來順遂、流暢的感覺,如圖2-39所示。

圖2-39 左圖右文
● 左文右圖:該分割方式與左圖右文相反,而是將文字放在畫面的左側,把商品或者模特的圖片放在右側,如圖2-40所示。左文右圖的分割方式可以借助圖片的吸引力,使畫面產生由右至左的視覺效果,與人們的閱讀喜好恰好相反,可以在視覺上給顧客帶來一種新奇的感覺,也是網店裝修的首頁海報中常用的一種方式。

圖2-40 左文右圖
2.水平分割
水平分割主要包括上文下圖和上圖下文兩種類型。
● 上文下圖:在文字的編排中,通過水平切割將畫面劃分成上下兩個部分,同時將文字與圖片分別排列在視圖的上部和下部,從而構成上文下圖的排列方式,可以使視覺形象變得更為沉穩,給人帶來一種上升感,以增強版面整體的表現力,如圖2-41所示。

圖2-41 上文下圖
專家指點
文字與圖片的結合應用,在店面的頁面設計中,需要注重兩者之間的編排,不同的分割方式,能給畫面帶來不同的效果。
● 上圖下文:將畫面進行水平分割,分別將圖片與文字置于畫面的上端與下端,從而構成上圖下文的編排方式,可以從形式上增強它們之間的關聯性,同時借助特殊的排列位置,還能增強文字整體給人的視覺帶來的安穩、可靠的感受,從而增強顧客對版面信息的信賴度,如圖2-42所示。

圖2-42 上圖下文
- Moodle 2.0 E/Learning Course Development
- AutoCAD 2014 中文版從入門到精通
- UG NX 9.0中文版 基礎教程 (UG工程師成才之路)
- Maya 2019三維動畫基礎案例教程
- ADOBE FLASH PROFESSIONAL CS6 標準培訓教材
- NHibernate 3.0 Cookbook
- VRP11/3ds Max虛擬現實制作標準實訓教程
- OpenCart 1.4 Template Design Cookbook
- Linux Shell Scripting Cookbook
- 中文版Photoshop CC基礎培訓教程
- 中文版3ds Max 2016/VRay效果圖制作技術大全
- Choosing an Open Source CMS: Beginner's Guide
- 深入淺出WebAssembly
- Drupal 7
- 中文版Flash CC實例教程