本教程向大家介紹了如何使用Illustrator制作細(xì)節(jié)豐富的網(wǎng)頁404錯(cuò)誤頁面過程，講解的非常詳細(xì)，并且作者還介紹了提高效率的技巧，教程非常實(shí)用，是AI學(xué)習(xí)者不可錯(cuò)過的一個(gè)學(xué)習(xí)機(jī)會(huì)，轉(zhuǎn)發(fā)過來，希望大家一起來學(xué)習(xí)吧。

最終效果：

在以下步驟中，您將學(xué)會(huì)如何利用 Adobe Illustrator創(chuàng)建404頁面

接下來，您將學(xué)習(xí)如何利用一個(gè)簡(jiǎn)單的路徑，陰影效果和一些基本的手段來添加時(shí)尚的圓角。你將會(huì)用到外觀面板創(chuàng)建Search字段以及4個(gè)黃色按鈕。

一、創(chuàng)建新文檔然后設(shè)置網(wǎng)格

首先ctrl+n創(chuàng)建新文件，從單位下拉菜單中選擇像素，在寬度框中輸入600，在高度框680，然后單擊高級(jí)按鈕，從上至下依次選擇RGB，屏幕(72ppi)，并勾選使新建對(duì)象與像素網(wǎng)格對(duì)齊，然后單擊確定。

啟用網(wǎng)格(視圖–顯示網(wǎng)格)和對(duì)齊網(wǎng)格(視圖–對(duì)齊網(wǎng)格)。編輯>選項(xiàng)>指南>網(wǎng)格，enter 5 in the Gridline every box and 1 in the Subdivisions box。不要被滿屏的網(wǎng)格嚇到而望而卻步，要學(xué)會(huì)用快捷鍵，這將會(huì)使你的工作變得容易的多

打開信息面板(窗口–信息)來實(shí)時(shí)確定你鼠標(biāo)所在的位置。不要忘了將計(jì)量單位選擇為像素(編輯—首選項(xiàng)—單位—常規(guī))，這些都能顯著提高你的工作效率哦。

二、制作主體形狀

① 選擇矩形工具(M)。點(diǎn)擊填色(X)，然后選擇填充并將其顏色設(shè)置在R =252 G =186 B =3，點(diǎn)擊填充后面的描邊并選擇無。然后創(chuàng)建一個(gè)275 x 400px的矩形。矩形對(duì)齊網(wǎng)格會(huì)方便你的操作。

② 利用直接選擇工具，重新選擇黃色矩形，在上方控制面板中的corner選擇10像素

③ 確保你的圓角矩形保持被選中，注意看外觀面板(窗口—外觀)，選擇描邊，并設(shè)置顏色R=232 G=146 B=0。然后點(diǎn)擊“描邊”文字，彈出菜單，將粗細(xì)設(shè)置為1像素，并檢查對(duì)齊描邊內(nèi)側(cè)按鈕。

④ 保證你的矩形依然是被選中的，注意看外觀面板，然后用添加新描邊按鈕增加第二個(gè)描邊。選擇這個(gè)新的描邊，然后設(shè)置其為黑色(R= 0，G =0 B=0)，從彈出的描邊面板中使對(duì)齊描邊向外側(cè)對(duì)齊。

繼續(xù)在該描邊面板中操作，點(diǎn)擊“不透明度”，會(huì)彈出透明面板，改變混合模式為柔光，降低不透明度為5%。

⑤ 使用矩形工具(M)，創(chuàng)建一個(gè)275px *80px的形狀，設(shè)置填充顏色為黑色，并把它作為第一張圖片。保證新的形狀保持選擇，降低其不透明度為20%，改變混合模式為柔光。切換到直接選擇工具(A)，選擇第一張圖像突出了兩個(gè)錨點(diǎn)，觀察控制面板，在角落框中輸入“10px”。最終顯示應(yīng)該像在第二幅圖像上。

⑥ 使用矩形工具(M)，創(chuàng)建一個(gè)275 *80px的形狀，設(shè)置填充顏色為黑色，并把它作為第一張圖片。確保這種新的矩形保持選中，降低其不透明度為10%，改變混合模式為柔光。

⑦ 使用矩形工具(M)，創(chuàng)建一個(gè)275 X75像素的形狀，設(shè)置填充顏色為黑色，并把它作為第一張圖片。請(qǐng)確保您的新的矩形選擇，降低其不透明度為5%，改變混合模式為柔光。

三、劃成三個(gè)部分

① 選擇編輯>首選項(xiàng)>指南和網(wǎng)格，并在網(wǎng)格線輸入1。使用鋼筆工具(P)創(chuàng)建一個(gè)273像素的水平路徑。將它如下圖所示，并添加1px的描邊然后顏色設(shè)置為R =232 G =146 B =0。

② 接下來，你需要確保你的水平路徑是完全對(duì)齊像素網(wǎng)格。取消選擇它，效果>扭曲和變換>變換。垂直拖動(dòng)滑塊0.5px，然后單擊確定。

啟用像素預(yù)覽(視圖>像素預(yù)覽)。請(qǐng)確保您的水平路徑仍處于選中狀態(tài)，并選擇效果>風(fēng)格化>陰影。進(jìn)入如下圖所示的屬性，然后單擊確定。

③ 選擇編輯>首選項(xiàng)>指南和網(wǎng)格，并在網(wǎng)格線輸入5。使用矩形工具(M)，創(chuàng)建一個(gè)275 *10px的矩形，確保它沒有設(shè)置描邊顏色，然后選擇填充.

打開漸變面板(窗口>漸變)，然后點(diǎn)擊漸變縮略圖默認(rèn)的黑色到白色的線性漸變。保持你的矩形被選中，然后注意看漸變面板。設(shè)置角度為0度，然后選擇黑色的漸變滑塊，然后換上白色(R =255 G =255 B =255)。此時(shí)注意漸變條，點(diǎn)擊它來添加一個(gè)新的漸變滑塊。選擇這個(gè)新的滑塊，設(shè)置它的顏色為黑色，集中在位置框中(從漸變面板)，并將其設(shè)置為50%。

④ 復(fù)制你的蒙版路徑(Ctrl-C>Ctrl-F)，選擇復(fù)制將它向上拖動(dòng)80像素。請(qǐng)確保您的副本保持選中，注意看透明度面板上選擇遮罩，并與如下圖所示的取代現(xiàn)有的線性漸變。請(qǐng)記住，從漸變圖像的白色數(shù)字代表位置百分比。你的新路徑看起來應(yīng)該如下圖。

⑤ 復(fù)制您的頂部，蒙版路徑(Ctrl-C >Ctrl-F)，選擇復(fù)制將它拖動(dòng)75PX起來。請(qǐng)確保您的副本保持選中，注重透明度面板上選擇的遮罩，并與如下圖所示的取代現(xiàn)有的線性漸變。最后你的新路徑看起來應(yīng)該如下圖。