中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx

十三、 優(yōu)化圖像

我們的設(shè)計(jì)稿基本完成，下面我們需要針對(duì)不同對(duì)象設(shè)定各自的優(yōu)化參數(shù)和輸出格式。
1、 根據(jù)不同的輸出質(zhì)量要求及各部分功能，分別設(shè)定各自的切片，注意切片應(yīng)盡可能劃分整齊、簡(jiǎn)單。
2、 選中左邊人像部分的切片，打開(kāi)優(yōu)化面板，設(shè)定輸出格式為JPEG，質(zhì)量為60。
3、 我們可以切換到2-Up預(yù)覽窗口觀察優(yōu)化前后的結(jié)果，如下圖所示：

4、 對(duì)于上面創(chuàng)建的兩個(gè)動(dòng)畫(huà)，我們已經(jīng)設(shè)置了輸出類(lèi)型為Animated GIF。
5、 我們還可以對(duì)文檔正中的切片設(shè)定為文字切片，及將來(lái)輸出時(shí)此部分輸出為文字內(nèi)容。
6、 選中文檔中間部分的切片，打開(kāi)Object面板，在對(duì)象類(lèi)型里選擇Text，在下部的窗口輸入最終的文字內(nèi)容。需要注意的是，您在這里不僅可以輸入普通的文字內(nèi)容，還可以輸入標(biāo)準(zhǔn)的HTML格式內(nèi)容，如我們輸入的<center>和<font color=”white”>。這樣最終的輸出結(jié)果將根據(jù)這里的定義自動(dòng)格式化文本。如下圖所示：

十四、 輸出HTML文件到Dreamweaver

我們的設(shè)計(jì)文檔已經(jīng)完成，可以將其輸出為HTML文件，并轉(zhuǎn)到Dreamweaver中繼續(xù)進(jìn)行編輯。
1、 選擇文件菜單下的Export Preview，打開(kāi)輸出優(yōu)化面板，在優(yōu)化面板中，所有沒(méi)有使用切片的會(huì)自動(dòng)使用缺省的輸出設(shè)置。選擇輸出格式為GIF格式，色彩數(shù)為128色。
2、 點(diǎn)擊Export，保存類(lèi)型選擇“Html and Images”；HTML選項(xiàng)里選擇“Export HTML File”；Slices選項(xiàng)里選擇“Export Slices”。
3、 在Option選項(xiàng)中可以進(jìn)行更詳細(xì)的設(shè)置，選擇General標(biāo)簽，確定在HTML style選項(xiàng)中Dreamweaver被選擇。
4、 切換到Table標(biāo)簽，在"Space from"中選擇“1-Pixel Transparent SpacerNested Tables”。
5、 在Empty Cell區(qū)域，在彈出菜單中選擇“Spacer Image”。
6、 切換到Document Specific面板，勾選下部的“Multiple Nav Bar HTML Pages”，這樣建會(huì)為每個(gè)按鈕所對(duì)應(yīng)的欄目輸出各自的頁(yè)面。
7、 點(diǎn)擊確定將文件輸出。查看輸出的文件如下圖所示：

十五、 在Dreamweaver中進(jìn)行往返表格編輯

1、 啟動(dòng)Dreamweaver，在您的輸出文件夾中打開(kāi)剛才輸出的Example.htm在中間的表格單元中選擇文本，并改變其中的內(nèi)容，在這段文本的最上端加入一句話(huà)“企業(yè)理念”，然后改變文字的顏色為淺灰色。此時(shí)文本的樣式如下圖所示：

2、 選擇整個(gè)表格使用文檔窗口底部的快速標(biāo)簽選擇器選擇<table>標(biāo)簽。
3、 打開(kāi)屬性面板，注意此時(shí)的屬性面板左上方有Fireworks Table標(biāo)簽，點(diǎn)擊右下方的Edit編輯按鈕。

4、 此時(shí)會(huì)啟動(dòng)Fireworks4，并打開(kāi)Example.png文檔。注意此時(shí)文檔窗口頂端有“Edit From Dreamweaver”標(biāo)志，如下圖所示：

5、 選中文檔中間的文本切片，打開(kāi)Object面板，我們可以看到剛才在Dreamweaver中隊(duì)文字所作的修改已經(jīng)反映在了這里，相應(yīng)的HTML代碼也已經(jīng)添加。如下圖所示：

6、 我們現(xiàn)在在Fireworks中作一點(diǎn)小修改，在“卡爾松服飾有限公司”下方增加文字“2001.4”。
7、 點(diǎn)擊文檔窗口頂部的"Done"按鈕，這將返回DW，你將看到圖片被更新了，但文檔切片部分的文字格式化信息依然存在。

寫(xiě)在后面的話(huà)

到這里，我們的這個(gè)網(wǎng)頁(yè)設(shè)計(jì)實(shí)例教程介紹完了。需要指出的是，我們最終輸出的是整個(gè)頁(yè)面，在Dreamweaver中可編輯的部分只有中間一小部分，但Fireworks能做到的并不僅僅是這樣，作為一個(gè)實(shí)例我們只是介紹了利用Fireworks進(jìn)行頁(yè)面設(shè)計(jì)時(shí)，可以做到的方方面面。但是具體到實(shí)際應(yīng)用，我們應(yīng)該根據(jù)具體的內(nèi)容設(shè)計(jì)您的版面，而且盡可能的多利用Fireworks的局部輸出功能，將一個(gè)頁(yè)面分成多個(gè)部分輸出，這樣可以使頁(yè)面具有更大的靈活性和可操作性。例如本例我們可以將整個(gè)頁(yè)面分為上中下三部分單獨(dú)輸出，上部的導(dǎo)航條與動(dòng)畫(huà)作為一部分輸出，中間部分還可以分為左右兩部分，下部的版權(quán)信息可以單獨(dú)作為一部分，或者可以在Dreamweaver中輸入單獨(dú)的文字。最后將這些單獨(dú)輸出的部分在Dreamweaver中利用表格組裝起來(lái)，這樣可以最大限度的保持頁(yè)面的適應(yīng)性和靈活性。此外還可以將一些可以作為背景圖片使用的內(nèi)容以圖片輸出，如頁(yè)面主要部分的直線紋理可以單獨(dú)輸出為一個(gè)背景圖片，并在Dreamweaver中定義為單元格的背景。關(guān)于本教程，朋友們有什么疑問(wèn)可以到http://www.95time.cn/bbs討論。

出處：藍(lán)色理想
責(zé)任編輯：藍(lán)色

上一頁(yè) 創(chuàng)建變形動(dòng)畫(huà)/創(chuàng)建實(shí)時(shí)動(dòng)畫(huà) 下一頁(yè)

◎進(jìn)入論壇Photoshop、Fireworks版塊參加討論