個人主頁界面設計

個性化個人主頁界面設計教學內容：1、規(guī)劃個人主頁設計方向2、確定個人主頁設計風格，繪制草圖3、草圖修改、改進4、完成個人主頁設計教學目的：設計風格突出的圖標教學重點：規(guī)劃個人主頁設計方向教學難點：確定個人主頁設計風格課時：3課時教學過程：一、 清點人數(shù)，整頓教學秩序 二、導入新課門戶網(wǎng)站，是指通向某類綜合性互聯(lián)網(wǎng)信息資源并提供有關信息服務的應用系統(tǒng)。門戶網(wǎng)站最初提供搜索服務、目錄服務，后來由于市場競爭日益激烈，門戶網(wǎng)站不得不快速地拓展各種新的業(yè)務類型，希望通過門類眾多的業(yè)務來吸引和留住互聯(lián)網(wǎng)用戶，以至于目前門戶網(wǎng)站的業(yè)務包羅萬象，成為網(wǎng)絡世界的“百貨商場”或“網(wǎng)絡超市”。商務網(wǎng)站就是指有關商業(yè)內容的網(wǎng)站可以使用網(wǎng)站進行經(jīng)營，商務網(wǎng)站是指一個企業(yè)、機構或公司在互聯(lián)網(wǎng)上建立的站點，該站點主要是宣傳企業(yè)形象，發(fā)布產(chǎn)品信息、宣傳經(jīng)濟法規(guī)、提供商業(yè)服務。商務網(wǎng)站不同于個人站點，個人站點是基于個人的目的而建設的。一般來說，個人網(wǎng)站沒有贏利性質，僅僅是出于設計者的個人愛好去設計和組織網(wǎng)站的內容。在電子商務中，網(wǎng)站是其擁有者和用戶交流及溝通的窗口是買賣雙方信息交匯和傳遞的渠道，是企業(yè)展示其產(chǎn)品和服務的舞臺，是企業(yè)體現(xiàn)其企業(yè)形象和經(jīng)營戰(zhàn)略的載體。商務網(wǎng)站是企業(yè)展開電子商務的基礎設施和信息平臺，是實施電子商務的公司或商家與服務對象之間的交互界面，是電子商務系統(tǒng)運轉的承擔者和表現(xiàn)者。網(wǎng)站界面設計尺寸要求 頁面標準按800*600分辨率制作，實際尺寸為778*434px，一般也可以為770*434px，最大寬度不要超過780px；頁面長度原則上不超過3屏，寬度不超過1屏。但實際上大多網(wǎng)站為了增大信息量，至少都有5屏8屏。還要具體情況具體對待；每個標準頁面為A4幅面大小，即8.5X11英寸；全尺寸banner為468*60px，半尺寸banner為234*60px，LOGO為88*31px，另外120*90，120*60也是小圖標的標準尺寸；每個非首頁靜態(tài)頁面含圖片字節(jié)不超過60K，全尺寸banner不超過14K；文字大小一般為12px或者14px。關于第一屏所謂第一屏，是指我們到達一個網(wǎng)站在不拖動滾動條時能夠看到的部分。那么第一屏有多“大”呢？其實這是未知的。一般來講，在800*600的屏幕顯示 模式(這也是最常用的)下，在IE安裝后默認的狀態(tài)(即工具欄地址欄等沒有改變)下，IE窗口內能看到的部分為778px*435px，一般來講，我們以 這個大小為標準就行了，畢竟，在無法適合所有人的情況下，我們只能為大多數(shù)考慮了。5、標準化要求 logo 及中英文標準字體 網(wǎng)頁中不提倡制作大于100k的flash網(wǎng)站標準色 背景色使用白色或淺色鏈接圖標(尺寸pixels: 88x318x60 ) 6、網(wǎng)站尺寸規(guī)范 頁面標準按800*600分辨率制作，實際尺寸為778*434px,要求在1024*768分辨率時居中表示,頁面邊框過渡要柔和很多站長都有這樣迷惑，在進行網(wǎng)站建設中界面布局設計時，界面界面的寬度尺寸都比較迷茫，800*600尺寸及1024*768尺寸的分辨率下，界面應該設計為多少像素才合適呢？太寬就會出現(xiàn)水平滾動條了，下面我們就界面設計的標準尺寸進行講解。界面設計標準尺寸：1、800*600下，界面寬度保持在778以內，就不會出現(xiàn)水平滾動條，高度則視版面和內容決定。2、1024*768下，界面寬度保持在1002以內，如果滿框顯示的話，高度是612-615之間。就不會出現(xiàn)水平滾動條和垂直滾動條。3、在ps里面做界面可以在800*600狀態(tài)下顯示全屏，頁面的下方又不會出現(xiàn)滑動條，尺寸為740*560左右4、在PS里做的圖到了網(wǎng)上就不一樣了，顏色等等方面，因為WEB上面只用到256WEB安全色，而PS中的RGB或者CMYK以及LAB或者HSB的色域很寬顏色范圍很廣，所以自然會有失色的現(xiàn)象。頁面標準按800*600分辨率制作，實際尺寸為778*434px頁面長度原則上不超過3屏，寬度不超過1屏每個標準頁面為A4幅面大小，即8。5X11英寸全尺寸banner為468*60px，半尺寸banner為234*60px，小banner為88*31px另外120*90，120*60也是小圖標的標準尺寸每個非首頁靜態(tài)頁面含圖片字節(jié)不超過60K，全尺寸banner不超過14K標準界面廣告尺寸規(guī)格：一、120*120，這種廣告規(guī)格適用于產(chǎn)品或新聞照片展示。二、120*60，這種廣告規(guī)格主要用于做LOGO使用。三、120*90，主要應用于產(chǎn)品演示或大型LOGO。四、125*125，這種規(guī)格適于表現(xiàn)照片效果的圖像廣告。五、234*60，這種規(guī)格適用于框架或左右形式主頁的廣告鏈接。六、392*72，主要用于有較多圖片展示的廣告條，用于頁眉或頁腳。七、468*60，應用最為廣泛的廣告條尺寸，用于頁眉或頁腳。八、88*31，主要用于界面鏈接，或網(wǎng)站小型LOGO。廣告形式 像素大小 最大尺寸 備注BUTTON 120*60（必須用gif） 7K15*50（必須用gif） 7K通欄 760*100 25K 靜態(tài)圖片或減少運動效果430*50 15K超級通欄 760*100 to 760*20 共40K 靜態(tài)圖片或減少運動效果巨幅廣告 336*280 35K585*120豎邊廣告 130*300 25K全屏廣告 800*600 40K 必須為靜態(tài)圖片，F(xiàn)LASH格式圖文混合 各頻道不同 15K彈出窗口 400*300（盡量用gif） 40KBANNER 468*60（盡量用gif） 18K懸停按鈕 80*80（必須用gif） 7K流媒體 300*200（可做不規(guī)則形狀） 30K 播放時間小于5秒60幀（1秒/12幀）界面中的廣告尺寸：1、首頁右上，尺寸120*602、首頁頂部通欄，尺寸468*603、首頁頂部通欄，尺寸760*604、首頁中部通欄，尺寸580*605、內頁頂部通欄，尺寸468*606、內頁頂部通欄，尺寸760*607、內頁左上，尺寸150*60或300*3008、下載地址頁面，尺寸560*60或468*609、內頁底部通欄，尺寸760*6010、左漂浮，尺寸80*80或100*10011、右漂浮，尺寸80*80或100*100以上幾種說法可能有點小的出入，大家可以探討一下。IAB和EIAA發(fā)布新的網(wǎng)絡廣告尺寸標準在這6種格式中，除了去年iab發(fā)布的4種“通用廣告包”中的格式網(wǎng)站建設中的界面尺寸。是很重要的內容同類色 color of same kind 指色相性質相同，但色度有深淺之分。（是色相環(huán)中15夾角內的顏色） 如深紅與淺紅鄰近色所謂鄰近色，就是在色帶上相鄰近的顏色，例如綠色和藍色，紅色和黃色就互為鄰近色。 鄰近色之間往往是你中有我，我中有你。比如：朱紅與桔黃，朱紅以紅為主，里面略有少量黃色；桔黃以黃為主，里面有少許紅色，雖然它們在色相上有很大差別，但在視覺上卻比較接近。在色輪中，凡在60度范圍之內的顏色都屬鄰近色的范圍?；パa色三原色中，任何一種顏色即是其他兩種原色等量混合的補色。在色相環(huán)中，處于直徑位置的兩色互為補色。原色有三種，即紅、黃、藍，它們是不能再分解的色彩單位。三原色中每兩組相配而產(chǎn)生的色彩稱之為間色，如紅加黃為橙色，黃加藍為綠色，藍加紅為紫色，橙、綠、紫稱為間色。紅與綠、橙與藍、黃與紫就是互為補色的關系。由于補色有強烈的分離性，故在色彩繪畫的表現(xiàn)中，在適當?shù)奈恢们‘數(shù)剡\用補色，不僅能加強色彩的對比，拉開距離感，而且能表現(xiàn)出特殊的視覺對比與平衡效果。對比色在色相環(huán)中每一個顏色對面(180度對角)的顏色,稱為"對比色(互補色)".把對比色放在一起,會給人強烈的排斥感.若混合在一起,會調出渾濁的顏色.如:紅與綠,藍與橙,黃與紫互為對比色。也可以這樣定義對比色：兩種可以明顯區(qū)分的色彩，叫對比色。包括色相對比、明度對比、飽和度對比、冷暖對比、補色對比、色彩和消色的對比等。是構成明顯色彩效果的重要手段，也是賦予色彩以表現(xiàn)力的重要方法。其表現(xiàn)形式優(yōu)同時對比和相繼對比之分。比如黃和藍、紫和綠、紅和青，任何色彩和黑、白、灰，深色和淺色，冷色和暖色，亮色和暗色都是對比色關系。類似色在色輪上90度角內相鄰接的色統(tǒng)稱為類似色.例如紅紅橙橙.黃黃綠綠.青青紫紫等均為類似色.類似色由于色相對比不強給人有色感平靜、調和的感覺因此在配色中常應用 。http:/ichi.hk/html/三、作業(yè)：從圖形、文字、色彩、版式等方面搜集設計素材，從而確定設計風格的方向。要求：運用網(wǎng)格構成方法確定個人主頁界面的大體布局