PS網(wǎng)頁設(shè)計(jì)與制作

1、PS網(wǎng)頁設(shè)計(jì)與制作（主頁）1、 教材分析設(shè)計(jì)制作網(wǎng)頁的方法有很多，所用軟件也各不相同，在本次拓展課程教學(xué)中，采用Photoshop設(shè)計(jì)網(wǎng)頁。本課是第四課時(shí)，在之前的課中，教師介紹了網(wǎng)頁大小、圖片素材的保存及處理方法，學(xué)生已了解有關(guān)網(wǎng)頁的相關(guān)知識(shí)點(diǎn)，本節(jié)課在此基礎(chǔ)上，開始學(xué)習(xí)PS網(wǎng)頁設(shè)計(jì)，通過新建文檔，完善網(wǎng)頁中的其它要素，如：文本、頁頭、頁腳、圖片等要素。2、 學(xué)情分析認(rèn)知水平：本班學(xué)生為八年級(jí)學(xué)生，善于接受新鮮事物，欠缺專注力、知識(shí)遷移能力。知識(shí)技能水平：在前幾課時(shí)的學(xué)習(xí)中學(xué)生了解了網(wǎng)頁的常見大小，主頁包含的各項(xiàng)要素，七年級(jí)下已學(xué)習(xí)過PS的相關(guān)知識(shí)與技能，有一定的基礎(chǔ)。本節(jié)課，學(xué)生需要靈活運(yùn)

2、用以前的所學(xué)，制作出有個(gè)人特色的主頁。學(xué)生在自主實(shí)踐環(huán)節(jié)是遇到的問題，通過同伴互助、范例展示等方式，更好地理解為何這么做，以及怎么做。3、 教學(xué)目標(biāo)（1） 、知識(shí)與技能1. 了解主頁大小，掌握設(shè)置主頁大小的方法。2. 掌握文本設(shè)置的方法，嘗試通過更改大小、字體、變形、混合選項(xiàng)呈現(xiàn)出有個(gè)人特色的文本。3. 了解導(dǎo)航欄的樣式及位置，掌握矩形的繪制調(diào)整方法。（2） 、過程與方法1. 通過課堂任務(wù)的設(shè)計(jì)，強(qiáng)化學(xué)生個(gè)人自主探究能力及小組協(xié)作學(xué)習(xí)能力。2. 培養(yǎng)學(xué)生對(duì)問題的分析和解決能力，更好地理解PS制作主頁的方法與策略，提高學(xué)生對(duì)PS的理解與認(rèn)識(shí)。（3） 、情感態(tài)度與價(jià)值觀提倡學(xué)生多觀察、多動(dòng)手實(shí)踐，

3、不怕失敗，只怕不動(dòng)。在信息技術(shù)課堂上勇于探索實(shí)踐，通過作品展示自己。4、 教學(xué)重點(diǎn)主頁大小設(shè)定、標(biāo)題和圖片的大小及位置、導(dǎo)航欄制作5、 教學(xué)難點(diǎn)主頁中各對(duì)象的大小及位置6、 教學(xué)方法任務(wù)驅(qū)動(dòng)、分層教學(xué)、同伴互助7、 教學(xué)準(zhǔn)備極域多媒體網(wǎng)絡(luò)教室、Photoshop cs5、學(xué)案8、 教學(xué)過程教學(xué)階段教學(xué)活動(dòng)學(xué)生活動(dòng)設(shè)計(jì)意圖創(chuàng)設(shè)情境1. 展示范例，吸引學(xué)生的注意力，調(diào)動(dòng)學(xué)習(xí)的積極性2.師：剛才大家看到的是我們八年級(jí)一些同學(xué)的網(wǎng)頁設(shè)計(jì)作品，在這些作品當(dāng)中，有關(guān)于美食的，有關(guān)于旅游的，還有關(guān)于漫畫的，還有關(guān)于科技的，等等。那么，你知道這些作品是怎么完成的？3.教師小結(jié)：這些網(wǎng)頁，我們一般稱之為主頁，都

4、是在PHOTOSHOP中完成。觀看放映聆聽老師觀察素材文件并進(jìn)入創(chuàng)設(shè)情境思考并發(fā)表自己的看法展示同個(gè)年齡段同學(xué)的作品，可以吸引學(xué)生的注意力，也更貼近學(xué)生的生活，引起更多的共鳴，盡快進(jìn)入學(xué)習(xí)氛圍。選擇PS制作網(wǎng)頁，拓寬學(xué)生的知識(shí)面，提升PS的操作技能。復(fù)習(xí)舊知1. 啟動(dòng)PHOTOSHOP，向?qū)W生展示2. 對(duì)比說明，網(wǎng)頁設(shè)計(jì)時(shí)使用到哪些功能3. 小結(jié)：圖片拖動(dòng)至新建文檔文字文本工具導(dǎo)航形狀觀看放映參與互動(dòng)思考并回答PS強(qiáng)大的圖片文字與處理功能，學(xué)生在七下學(xué)習(xí)過，通過師生互動(dòng)，幫助學(xué)生復(fù)習(xí)一些跟圖片文字相關(guān)的操作。構(gòu)建新知（圖片）在復(fù)習(xí)了PHOTOSHOP的一些基本操作后，接下來，我們要開始正式設(shè)計(jì)

5、主頁了。在前一次課中，大家已選好圖片素材，并初步加工，怎么用在網(wǎng)頁中呢？師：引導(dǎo)學(xué)生嘗試啟動(dòng)軟件，開始新建文檔師：主頁新建完成后，第二步要添加背景圖片，那么，如何將上周保存過的圖片添加進(jìn)來呢？邀請(qǐng)學(xué)生上臺(tái)演示。師：XX同學(xué)演示得非常好，首先，打開文件，使用移動(dòng)工具，將圖片拖動(dòng)到文檔中。當(dāng)然，我們可以根據(jù)自己的構(gòu)想，調(diào)整圖片的大小及位置。(1).登錄FTP，下載前一課保存上交的圖片素材(2).啟動(dòng)PHOTOSHOP，參考學(xué)案，嘗試新建文檔(3).同伴互動(dòng)，落實(shí)新建文檔時(shí)的各項(xiàng)參數(shù)：800*600 背景色透明或其它(4) .學(xué)生使用教師機(jī)面向全班展示操作過程，并做相應(yīng)的講解。教師適當(dāng)點(diǎn)評(píng)及補(bǔ)充說明

6、。(5) 課堂操作時(shí)間，學(xué)生操作，同伴互助，教師巡視。如果有困難，先自行嘗試探究，再向同伴尋求幫助，如果實(shí)解決不了，可向老師尋求幫助。首先引出學(xué)生的疑慮，啟發(fā)學(xué)生展開思考。信息技術(shù)課堂更多的希望學(xué)生通過嘗試探索發(fā)現(xiàn)問題，進(jìn)一步嘗試探索尋求解決問題的辦法，從而提高解決問題的能力。通過學(xué)生演示+講解的方式，更加直觀地讓全班同學(xué)了解之前課上保存的圖片如何運(yùn)用到網(wǎng)頁中。構(gòu)建新知（標(biāo)題）師：現(xiàn)在我們需要給網(wǎng)頁添加標(biāo)題，那么，你覺得網(wǎng)頁的標(biāo)題有什么特點(diǎn)？師：教師小結(jié)標(biāo)題特點(diǎn)：醒目，顏色、大小或者字體與網(wǎng)頁中的其他文本不一致，位置根據(jù)整體頁面布局而定師：有請(qǐng)一位同學(xué)給大家演示如何制作網(wǎng)頁的標(biāo)題教師通過設(shè)問的

7、方式引導(dǎo)學(xué)生講解有關(guān)文字的操作。教師板書：文本：字體：字體庫中的或自行下載 形狀：變形 立體：混合選項(xiàng) 大?。捍笥谄胀ㄎ淖纸處煿膭?lì)基礎(chǔ)較好的同學(xué)嘗試探究任務(wù)一，自主上網(wǎng)搜索下載字體，并安裝使用(1) .學(xué)生觀看放映，對(duì)照范例及個(gè)人經(jīng)驗(yàn)，思考(2) .學(xué)生回答問題,表達(dá)個(gè)人的看法（2-3人）(3) .學(xué)生使用教師機(jī)面向全班，演示如何在文檔中添加文字，以及更改文字的形狀、大小、顏色。通過修改圖層的混合選項(xiàng)，使文字呈現(xiàn)出更多豐富的樣式。(4) .課堂操作時(shí)間，學(xué)生操作，同伴互助，教師巡視。如果有困難，先自行嘗試探究，再向同伴尋求幫助，如果實(shí)解決不了，可向老師尋求幫助。結(jié)合學(xué)生的個(gè)人經(jīng)驗(yàn)，鼓勵(lì)學(xué)生表達(dá)

8、個(gè)人看法。不僅僅是通過教師給出的幾張圖片得出一個(gè)結(jié)論，更多是從學(xué)生的生活和個(gè)人體驗(yàn)出發(fā)。大標(biāo)題的制作也是本課的一個(gè)重點(diǎn)，設(shè)計(jì)的意圖是學(xué)生通過對(duì)比嘗試，找到更適合自己的網(wǎng)頁，制作出更具個(gè)人特色的作品。采用分層教學(xué)，鼓勵(lì)同學(xué)結(jié)合個(gè)人實(shí)際情況，下載安裝新的字體，對(duì)于另外的基礎(chǔ)較弱的學(xué)生的，則鼓勵(lì)通過開關(guān)的改變，顏色調(diào)整和混合選項(xiàng)的應(yīng)用，制作出精彩的標(biāo)題。構(gòu)建新知（導(dǎo)航）師：導(dǎo)航是一個(gè)網(wǎng)頁的重要組成部分，位于頁面頂端，或是側(cè)邊的區(qū)域，一般由一排水平或垂直的按鈕組成，起著網(wǎng)站內(nèi)部頁面鏈接的作用。在你的網(wǎng)頁中，打算如何設(shè)計(jì)呢？教師小結(jié)導(dǎo)航欄的制作：位置：上邊或側(cè)邊形狀：矩形較適合大?。阂勒w頁面及個(gè)人喜好

9、而定形狀與文字分開操作師：哪位同學(xué)能夠演示下呢？(1) .學(xué)生觀看放映，觀看范例中的導(dǎo)航制作(2) .學(xué)生結(jié)合自己的網(wǎng)頁，發(fā)表看法。(3) 學(xué)生使用教師機(jī)面向全班展示操作過程，并做相應(yīng)的講解。教師適當(dāng)點(diǎn)評(píng)及補(bǔ)充說明。(4) 課堂操作時(shí)間，學(xué)生操作，同伴互助，教師巡視。導(dǎo)航是本課的分層教學(xué)內(nèi)容之一，學(xué)習(xí)效率較高的同學(xué)，可以自助嘗試制作導(dǎo)航。課上結(jié)合其余同學(xué)的作品，引導(dǎo)學(xué)生觀察導(dǎo)航欄的特點(diǎn)，分析制作時(shí)的使用到的工具，及可能會(huì)用到的一些操作小技巧。教師重在引導(dǎo)。歸納總結(jié)保存作業(yè)至桌面，格式為“學(xué)號(hào)姓名.psd”， 上傳至教師機(jī)，以供教師查看操作情況。教師課后查看作業(yè)，登錄匯總，針對(duì)作業(yè)中出現(xiàn)的小問題

10、，下一課時(shí)，展開分析與講解。(1).學(xué)生按要求保存并上交作業(yè)。(2).學(xué)生跟隨教師的板書，對(duì)本堂課的所學(xué)進(jìn)行小結(jié)。本課的基礎(chǔ)任務(wù)是新建文檔，制作網(wǎng)頁背景和大標(biāo)題。拓展提升任務(wù)是下載安裝字體制作新穎的標(biāo)題及導(dǎo)航欄的制作。教師根據(jù)學(xué)生上交的作業(yè)，做好記錄，以便下一堂課開展教學(xué)。板書PS網(wǎng)頁設(shè)計(jì)與制作1、 新建文檔 二、標(biāo)題 三、導(dǎo)航大?。?00*600像素 網(wǎng)頁標(biāo)題：醒目 形狀：可選矩形背景色：透明 字體：字體庫或下載 大?。鹤远?形狀：變形 位置：上邊或側(cè)邊 立體：混合選項(xiàng)9、 教學(xué)反思本課是一節(jié)常態(tài)課，通過前期的課上接觸結(jié)合上交的作業(yè)，發(fā)現(xiàn)本班學(xué)生的認(rèn)知能力和操作水平存在不小的差異，大部分學(xué)生的學(xué)習(xí)的積極性有，但持續(xù)時(shí)間不長，在學(xué)習(xí)中遇到問題時(shí)，大部分學(xué)生愿意主動(dòng)探究，探究成功后積極性倍增，探究失敗后有挫敗感，積極性大幅下降。在開展網(wǎng)頁設(shè)計(jì)制作教學(xué)時(shí)，采用PS網(wǎng)頁設(shè)計(jì)與制作。本課設(shè)計(jì)時(shí)考慮到了不同能力學(xué)生的學(xué)習(xí)情況，采用“分層教學(xué)”。課上通過展示作品，激起學(xué)生的學(xué)習(xí)興趣，拋出問題，引出答案，進(jìn)入本課的學(xué)習(xí)主題。課堂中任務(wù)驅(qū)動(dòng)與分層教學(xué)相結(jié)合，很好地照顧到不同層次的學(xué)生。演示環(huán)節(jié)，由學(xué)生自愿和教師抽查相結(jié)合，整個(gè)課堂教學(xué)進(jìn)展有序。課前預(yù)設(shè)的學(xué)習(xí)目標(biāo)也較好地完成了