(美术设计体现於部落格)

上传人:wm****3 文档编号:51945578 上传时间:2018-08-17 格式:PPT 页数:21 大小:642KB
返回 下载 相关 举报
(美术设计体现於部落格)_第1页
第1页 / 共21页
(美术设计体现於部落格)_第2页
第2页 / 共21页
(美术设计体现於部落格)_第3页
第3页 / 共21页
(美术设计体现於部落格)_第4页
第4页 / 共21页
(美术设计体现於部落格)_第5页
第5页 / 共21页
点击查看更多>>
资源描述

《(美术设计体现於部落格)》由会员分享,可在线阅读,更多相关《(美术设计体现於部落格)(21页珍藏版)》请在金锄头文库上搜索。

1、(美術設計體現於部落格)璧卉零影關於網頁的視覺概論 關乎部落格的視覺禮貌或視覺暴力版面留白空間處理 空白所指的是背景顏色,或是所謂圖像與背景的關係 的背 景部分 留白的空間讓頁面有了格式,凸顯版面重要部份 版面視覺平衡的考量 視覺比重:物件的大小、亮度深色物件比淺色物件重、 以 及紋路或內文的密度 視覺對比:元素之間的對比過大,則容易造成反效果, 使整體 失去和諧與平衡 視覺諧調:物件之間大小比例的關係 仍然是版面編排整體效果對稱式的平衡 規規矩矩對稱的版面,比如說左右兩半或是上下部分彼此 相 似,甚至有些設計者把頁面上的每個元素向中央對齊 靜態的,比較無法引導讀者的目光去搜尋頁面上的其他元

2、素 不對稱式的平衡 藉由技巧性地安排不同視覺比重的各種元素來達成,利如: 一段很長的文字就可以用一個深色的圖形來平衡 一系列的小元素可以用一個大的元素來平衡 一個不對稱或是非制式的組合方式可以使頁面在視覺上顯 得較生動活潑 仍然是版面編排整體效果網頁設計前後的一致性 例如使用一個固定的標題圖示、一種特別的版面安排、 或是一組特定的 色系 保持訊息的連貫,求取統一感,方便讀者閱讀與搜尋 http:/www.wretch.cc/blog/leftpocket網頁主題顏色 色彩過多與不及 純文字的文件,讀者的閱讀也不會被圖像所干擾 人們通常期望一個 部落格能夠圖文並茂 太多的顏色比顏色不足還糟糕 使

3、用限量的色塊(palette) 選擇一個色系,可以包含和諧色與對比色 選擇在色盤中屬於同範圍的顏色 網頁主題顏色顏色的對比 淡色系列的背景有助於整體和諧 文字和背景圖案間應有適當的對比 背景與主體明度對比為 3:1 到 5:1 之間為宜 色彩的變化 有助於瀏覽者了解網頁的內容與主題 所謂的色彩概論色彩的三種屬性:色相、明度、彩度 基礎色相:紅、橙、黃、綠、青、紫 伊登十二色相環伊登十二色相環任何一色,左右兩邊共三個顏 色都稱類似色。 所以,類似色配色的感覺?任何一色,以一百八十度對比 的顏色叫對比色也叫補色。所以,運用對比配色的感覺 ? 色彩的明度與彩度有彩色與無彩色兩大類。黑、灰、白等色全無

4、色素,稱為無彩色而無彩色以外的色相稱為有 彩色。 色彩有明暗的現象,這種明暗的屬性叫做明度。白色最亮黑色最暗,利用白、灰、黑按層次配置成階梯狀的排列,稱之為明度階段,常見的明度階段,有九階或十一階,分為最高明度、高明度、中明度、低明度、最低明度。彩度是色彩鮮濁的程度,色相環上任何一個顏色,都是最鮮豔的色 稱之為純色。 在純色中加白色,明度會提高但彩度會降低;反之在純色中加入黑色 ,明度降低彩度亦降低。常見的有九個階段。 感謝張麗華老師色相、明度、彩度互相作用以 產生色彩的調子和感覺感謝張麗華老師色彩機能同樣的顏色在不同的背景裡會產生不同的視覺效果感謝張麗華老師人類共通的情感?暖色 寒色 興奮色

5、 沈靜色 前進色 後退色 輕色 重色 強色 弱色回原色大辭典 http:/www.colordic.org/ 色JavaScript遊D. project http:/www.hi-ho.ne.jp/douton/index.html如何用:以色JavaScript遊D. project為例,HP配色ColorMatch5KHTML色見本關於網頁配色的網站 關於配色後的小東西摩尼網頁教學中心http:/.tw/easypage/css.phpCss捲軸產生器進無名修改CSS樣式表改部落格捲軸與回應欄的捲軸 (無名樣式結構表http:/hit1205.ispaz.blogdns.org/css/

6、wretchCSS/)部落格上貼貼紙用貼紙宣傳部落格、串連同好、經營社群。像這個 常看到的貼紙: 看這個部落格http:/ 一個可以交換貼紙和聯播的地方:Oui-blog當我們blog在一起http:/www.oui- 連結書籤的簡單語法通常是這樣的,稍稍翻譯成中文是這樣: (注意:語法是一長條 )這些部落格貼紙貼法這樣貼無名小站: 資料夾管理新增資料夾,名稱可填想連結的名稱按確定 資料夾內的連結管理,新增連結名稱處直接貼上語法 描述填上想填的網址貼上要連結的網址樂多日誌: 至上傳檔案、圖片選項自訂檔名ok後,點選檔案標題按右鍵複製圖片 網址先貼在記事本上新增插入欄位追加連結書籤標題列直接貼入

7、 語法URL貼上要連結的網址選擇另開視窗追加儲存更新blog網 頁使用Blogger: 同樣得把圖抓進有連結blogger的相本或先貼進文章裡,取得圖示網址, 進範本區更改連結書籤語法即可。 跟貼貼紙道理一樣的文章裡圖片連結以無名小站為例:為何無名上點貼紙不開新視窗?文章裡連結網站為什麼也不開新視窗?貼圖後,照片有框框不美觀,怎麼把框框拿掉?重點在於語法裡的: target=“_blank”以及border=“0”無名小站與flickr相簿 付費的金卡會員才能貼flickr badge,免費會員和其他會員可用貼貼紙方式 做連結。如果還想貼別的無名小站貼時鐘:時鐘網址:http:/ 可。無名論壇http:/www.wretch.cc/lib/forum_sel.php樂多blog裝潢班: http:/ 圖片裁切好像素大小,例如:長500像素x180像素,上傳至相簿 樣式管理網誌設計小幫手橫幅背景圖片挑圖微調各種設定再存檔 離開 有可能因為樣版原設計的關係,除非改CSS,設計小幫手有時有其限制, 試了才知道。做GIF檔,會動的banner: 使用軟體:Ulead GIF Animator 5政大學生可至校園授權軟體網頁下載PhotoImpact8或10安裝即有此軟體 。將要的照片調成大小一樣,使用動畫精靈製作即可。

展开阅读全文
相关资源
正为您匹配相似的精品文档
相关搜索

最新文档


当前位置:首页 > 生活休闲 > 社会民生

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号