網(wǎng)頁美工設計-字體設計.ppt

項目3網(wǎng)頁字體設計 任務1千變?nèi)f化的字體設計課件 建議2學時 學習目標 1 了解網(wǎng)頁字體以及字體的編排 2 掌握網(wǎng)頁字體的設計原則 3 掌握不同風格的字體在不同頁面中的應用 4 學會常見字體的特效設計 知識準備 了解網(wǎng)頁中的字體 案例欣賞 下圖為以字體為主的網(wǎng)頁 知識準備 了解網(wǎng)頁中的字體 案例分析 1 表現(xiàn)形式 用字體和簡易圖形作為網(wǎng)頁界面的主要表現(xiàn)目標 2 色彩運用 色彩上采用黑色 橙色和灰色相結(jié)合的設計方式 3 欄目設置 依據(jù)易用性原則 設置了網(wǎng)站的各要素 4 動態(tài)效果設計 當鼠標點擊導航 圖片和具體內(nèi)容時 輕松進入站點 簡單 明了 易于操作 知識準備 了解網(wǎng)頁中的字體 理論概要 1 字體設計 字體 字號 字體的粗細 字距和行距 2 字體編排設計 兩端對齊 一端對齊 居中對齊 文字繞圖 自由編排 3 字體的風格 動感活力 穩(wěn)重規(guī)范 隨意瀟灑 活潑可愛 雅致端莊 簡單大方 4 文字編排中常見的設計方式 5 字體色彩設計 6 網(wǎng)頁字體的設計原則 字體 字號 字體的粗細 字距和行距 兩端對齊 一端對齊 居中對齊 文字繞圖 自由編排 動感活力 穩(wěn)重規(guī)范 隨意瀟灑 活潑可愛 雅致端莊 簡單大方 同等重量 級別的內(nèi)容 文字大小 粗細的變化需統(tǒng)一 以便瀏覽者分清主從關(guān)系 更好的理解文字內(nèi)容和所傳達的信息 運用通欄方式編排文字 頁面顯得規(guī)整有序 更利于瀏覽者閱讀 運用分欄方式編排文字 可豐富網(wǎng)頁版面 字體編排與網(wǎng)站色彩 風格需統(tǒng)一 例如女性網(wǎng)站可選用秀麗的細體字 男性網(wǎng)站可選用挺拔的粗體字 兒童網(wǎng)站可選用可愛的藝術(shù)字 藝術(shù)字體的運用可增添頁面的獨特魅力 特立獨行的藝術(shù)字可給瀏覽者強烈的視覺沖擊力 從而加深對網(wǎng)站得印象 不同程度的傾斜字體可以給瀏覽者不同的視覺效果 并為網(wǎng)頁注入新的活力 增添網(wǎng)頁的動感和韻味 對比色的運用 多種顏色字體的配置效果 利用強調(diào)色突出網(wǎng)站的特別信息 字體是網(wǎng)頁的重要組成部分 字體設計的好壞直接影響網(wǎng)頁的美觀及內(nèi)容的有效傳播 所以設計字體的時候要遵循以下幾個基本原則 設置字體時 盡可能使用通俗易懂的常用字體 避免繁雜凌亂 防止字體失去可讀性功用 設置字體時 不宜選擇過多種字體 以3種以內(nèi)為宜 設置字體時 根據(jù)實際情況選擇字號 不宜過大或過小 設置字體時 字體要與網(wǎng)站的主題統(tǒng)一 以便更好的傳遞信息 任務1 千變?nèi)f化的字體設計 本任務是修改網(wǎng)頁中文字的字體 字號和位置 如下圖所示 任務分析 本任務將是修改網(wǎng)頁中文字的字體 字號和位置 感受網(wǎng)頁中千變?nèi)f化的文字效果 該圖為一美容機構(gòu)網(wǎng)站的局部截取圖 從網(wǎng)站的布局 圖片的配置到色彩的整體搭配都非常美觀 但是由于網(wǎng)頁中文字的使用不當 使網(wǎng)頁看起來失色不少 在視覺傳達的過程中 文字除了傳遞信息的功能外 還具有傳達情感的功能 因此它必須有視覺上得美感 設計精良 美觀的文字使人感到愉悅 從而獲得良好的心理反應更好的發(fā)揮功效 任務實施 1 打開素材圖片 2 修改文字字體 3 修改文字字號 4 修改文字位置 5 改變字體顏色 參照教材中 任務實施 嘗試操作 完成網(wǎng)頁中字體的修改 拓展探索 根據(jù)任務1的實例 重新設計編排網(wǎng)頁中的文字 要求字體的設計與網(wǎng)頁的整體風格既和諧統(tǒng)一 又要富有一定的變化 從而起到有效傳遞