讓圖像說更多：DIV + 照片的變化處理

讓影像視覺投 射出意義！

圖像畫面的細微變化，不是為了悅目，而是要呈現出更多豐富意義。

DIV + 圖像背景圖 + 文字寫作 的整合性寫作技法

DIV + 背景圖 + 文字的圖文寫作之前後對比#1

---

為什麼不直接對影像進行變化作用，而是要把影像以背景圖的方式塞到DIV，再對DIV進 行變化作用呢？

before

after

那是因為，把圖像以背景圖方式塞到DIV中，可以「圖文整合」表達出更多層次的、可以互動的圖像豐富意義。只要你有能力掌握DIV…

寫作 v.s. 排版#2

---

數位文本的寫作是一種「有版型概念下的寫作」，換言之，在下筆之前即要構思區塊文本之內異質媒材之間的「排版」關係。

例如，陰影的使用，代表「立體化」；立體化代表「對象化」的強調。對象化，代表對描述客體的加重意義。
圓框化，代表對圖像在意義上的一種柔化的意義呈現。
圖像細微的變化所產生的「意義感受」和文字的寫作搭配起來，會形成豐富層次的意義表達。

數位文本創作者，用傳統的平面術語而言，應是作者、文編和美編的三合一。這並不是媒體競爭環境中對工作人員精簡需求下而來的工作者「多技能」要求，而是數位多媒材文本多重形構寫作概念下的「必要寫作技能」。

#1

網路寫作的「視覺性」

網路文本要重視「視覺性」， 或著說網路新聞的記者要有「為視覺效果而寫作」的能力。
--Stovall(2004),Web Journalims.

Artwick 強調，記者在構思新聞的結構時要有「視覺化的思考」（thinking visually）（Artwick, 2004: 151）。強調「視覺化」指的是要重視數位文本的「呈現樣態」，用傳統平面的術語，亦即是要重視「版型」，而並不是要多用圖像或是濫用圖像，這是一般所常被（學生）誤解的。

因之，視覺化寫作所強調的，即是「版型」的概念對創作者在寫作過程所提出的新要求；如果在螢幕閱讀中掃瞄是最重要的閱讀行為，那麼「版型」之於數位文本的創作，在重要性上就更勝於在其他媒介之上。

而照片處理，就是數位文本「版型寫作」模式的必要寫作技能。

陰影、圓角效果語法範例#3

---

「照片處理的前後對比#1」這一文本區塊的完整語法：

<div style="-webkit-box-shadow: 2px 4px 5px gray; background-image: url(https://c1.staticflickr.com/3/2853/33832379760_80526cd4f4_b.jpg); border-radius: 25px; float: right; height: 202px; margin: 10px; width: 270px;">

<span style="font-size: 130%;">after</span></div>

<div style="background-image: url(https://c1.staticflickr.com/3/2853/33832379760_80526cd4f4_b.jpg); height: 202px; margin: 10px; width: 270px;">

<span style="font-size: 130%;">before</span></div>

語法說明：

㊟style="-webkit-box-shadow: 2px 4px 5px gray;"，這是陰影框的語法。2px 指陰影 x 軸右移2px，4px 指陰影 y 軸下移 4px， 5px 是指陰影的擴散範圍。gray 是指陰影的顏色，灰色。

㊟style="border-radius: 25px;"，這是圓角框的語法。25px 是指彎曲度。

使用kompozer的影音教學：





影音教學中的CSS：

<style>
.divshadow {
-webkit-box-shadow: 2px 2px 2px gray;
}

.divradius {
border-radius: 25px;
}
</style>

對圖像的處理，有二種思考方法，一是對圖像本身進行後製處置。二、把圖像以背景圖方式塞入DIV，再對DIV進行變化操作。第二種方法是我們在此所要強調的，建議常以此種方式來思考對圖像的使用。

當創作有枯竭之感時…

新聞是一種「創作」，本來就是，一種有特定規則的創作。

但正如我課堂講的，網路新聞的「閱讀性」，已從「時間性」轉往「空間性」，也就是我愛談的「排版寫作」。

換言之，形式是要帶入對意義的表達過程。

就這點而言，亦即就「空間性」的構思而言，往往易有靈感「枯竭」之感。

來，請看這本…
《前衛藝術理論》
Theorie der Avantgarde
http://www.books.com.tw/products/0010069676

請你不要想去「讀懂它」，真的。你功力遠遠不夠。
但要去翻一下，
前衛藝術，或是現代藝術（以及可能的當代藝術），
有很多範例，
光是作品本身就會給你很多想像。
讓你敢「跨出去」。

補上這本http://www.books.com.tw/products/0010551638
《當代藝術這麼說》

---