人口福利基金會系統(tǒng)前臺設計_第1頁
人口福利基金會系統(tǒng)前臺設計_第2頁
人口福利基金會系統(tǒng)前臺設計_第3頁
人口福利基金會系統(tǒng)前臺設計_第4頁
人口福利基金會系統(tǒng)前臺設計_第5頁
已閱讀5頁，還剩9頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

PAGEword文檔可自由復制編輯學院2013-2014學年第二學期結課設計（論文）學院（系）：軟件學院專業(yè)：軟件工程學生：指導老師：完成日期：2014年06月南陽理工學院學生結課設計（論文）人口福利基金會系統(tǒng)設計與實現DesignandImplementationofthePopulationWelfareFoundationSystem總計:課程設計（論文）14頁表格：0個插圖：4副人口福利基金會系統(tǒng)設計與實現軟件工程【摘要】人口福利基金會系統(tǒng)是為了更好的爭取國內外關心中國人口福利事業(yè)的團體和個人的支持與捐助，動員社會資源興辦有利于解決人口問題的社會公益項目和活動；關注人口與發(fā)展進程中的扶貧開發(fā)、人口素質以及伴隨城市化、老齡化等重大社會問題帶來的家庭及個人風險，增進人口福利與家庭幸福，為建設和諧社會做出貢獻?！娟P鍵字】人口福利基金會；基金；幸福DesignandImplementationofthePopulationWelfareFoundationSystemSoftwareengineeringJonlyChen【Abstract】Populationwelfarefoundation

systemisbetterinorderto

gainthesupport

anddonor

organizationsandindividuals

athomeandabroad

about

Chinesepopulation

welfare,

mobilizesocialresourcestosetup

tosolvethe

populationproblem

andsocialandpublicwelfare

projectsandactivities;

ontheprocess

ofpopulationanddevelopment

inthe

povertyreliefanddevelopment,

bringthepopulationqualityand

withthe

city,

theaging

etc.

majorsocialissuesof

familyandpersonalrisk,

promoting

populationwelfare

andfamilyhappiness,

andmakecontributionstotheconstructionof

harmonioussociety.【keywords】Populationwelfare；foundation

；Happiness目錄1.1網站定位61.2網站前臺建設要求61.2.1主要功能模塊61.2.2整體版面要求61.2.3設計效果要求71.2.4設計技術要求71.3前臺設計詳細說明71.3.1首頁整體效果71.3.2首頁結構91.3.3其他頁面及模塊簡介111.3.4設計效果與技術介紹121.4出現問題及解決方案121.5結束語：131.6參考文獻：13網站前臺建設及說明：1.1網站定位本網站為國家事業(yè)機構類的網站。1.2網站前臺建設要求1.2.1主要功能模塊主頁：首頁是瀏覽者打開網站的第一個頁面，清晰明了的方式展示本機構用途和機構特色。需要機構新聞的簡單介紹，都要在第一時間呈現給觀看者，且需要充分展現網站的亮點，以吸引瀏覽者。新聞動態(tài)模塊：新聞動態(tài)模塊是為了更快讓大家了解中國公益基金會的新聞動態(tài)，這樣有助于本基金會的信息公開化和豐富了本基金會的內容。公益項目模塊：公益項目模塊能快速的讓瀏覽者查詢所需內容，為瀏覽者提供好的入口，方便瀏覽者直接了解各個基金項目，以及更快提供自己的愛心。專題活動模塊：專題活動模塊是介紹中國公益基金會所做過的公益活動，以及可以提供和大家互動。愛心榜模塊：這個模塊是讓瀏覽者清晰明了看到大家的愛心，以及鼓勵這些愛心人士。其他模塊：我要捐贈、加入我們、信息披露、我要提問、關于我們等模塊為大家提供方便，以及介紹了中國基金會。注冊登錄模塊：這個模塊是為中國基金會提供了會員制，方便工作人員查詢愛心人士信息，以及更好的統(tǒng)計信息。1.2.2整體版面要求整個頁面布局運用分欄的方式呈現，采用絕對定位和浮動定位。絕對定位的優(yōu)勢在于，我們可以絲毫不差地精確控制任何元素的位置—這里面沒有什么需要猜測或者運氣的成分。由于應用了絕對定位的元素被不留痕跡地從常規(guī)文檔流中完全移除，所以它也不會為其他元素帶來任何的影響。浮動的本意是要將插入到文章中的圖片向左或者向右浮動，使圖片下方的文字自動環(huán)繞在它的周圍，使圖片的左邊或者右邊不會出現一大塊的留白。1.2.3設計效果要求本設計主要是以一個平靜的，在任何充滿壓力的環(huán)境里，只要搭配出一些灰藍或淡藍的明色色彩組合，就會制造出平靜恬靜的效果，背景的淡綠和導航的黑白搭配，給人以安心的感覺，因為它看起來誠實、直接。帶著明色的寒色可保持安寧、平和的感覺。補色和這些強調平靜的色彩在明暗度方面方面一定要類似，這點很重要，因為色彩很鮮明會制造不必要的警緊張，本設計主要體現清爽的感覺。特效方面，主要采用js和css的方式進行呈現。讓網站的一些展示動起來，讓網站更有生機，展現不用的呈現方式，讓愛心人士在視覺上產生沖擊感，對這些方面的內容產生興趣。有一個更多的了解。1.2.4設計技術要求開發(fā)環(huán)境：個人pc機制作軟件：AdobeDreamweaverCS4、AdobePhotoshopCS5制作技術：html、javascript、css、Div1.3前臺設計詳細說明：1.3.1首頁整體效果首頁（如上圖）的亮點在于網頁中間的圖片及文字說明，以圖片輪播的形式介紹了中國人口福利基金會得到文化及活動宣傳，為本機構文化和活動奠定了宣傳的基礎。主要要技術在于插入圖片的div，包括5張圖片輪播，大大的吸引用戶的眼球，還有添加了js特效來展現捐款人員以及金額的滾動效果，圖片替換的效果使瀏覽增添了些許樂趣。值得一提的是網頁下面的添加視頻播放的效果（如下圖）這個讓瀏覽者通過視頻更用事實了解到活動及基金用途。右邊的設置選擇播放可以讓大家更好的選擇播放畫面。本首頁另一個亮點就是運動js滾動效果（如下圖），更好的展示了本機構的愛人人士及捐款金額，捐款日期。1.3.2首頁結構<htmlxmlns="/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>中國人口福利基金會-首頁</title><linkrel="stylesheet"charset="utf-8"type="text/css"href="style/css/tpxw.css"/><scripttype="text/javascript"src="style/js/jquery-1.7.1.min.js"></script><scripttype="text/javascript"src="style/js/bootstrap.js"></script><scripttype="text/javascript"src="style/js/mon.js"></script></head><body><divid="box">//最大的box<divid="box1">//頁頭<divclass="top"></div>//站內搜索<divclass="top0">//導航<divclass="top1"></div><divclass="top2"></div></div></div><divclass="content_left"><divid="box3"><divclass="bot">基金會項目<divid="bot01"></div><divid="bot02"></div></div><divclass="bot1"></div></div><divid="box4"><divclass="bot">專項基金<divid="bot01"></div><divid="bot02"></div></div><divclass="bot1"></div></div></div><divclass="clearmjje"><div><aclass="titletitle_mjje"href="">捐款金額</a></div><divid="box5"></div>//頁尾部分（版本信息）</div><scripttype="text/javascript">functionsetMenuActive(index){varobj=$("#menuFrame").children().eq(index).addClass('active');}$(document).ready(function(){$("#word").click(function(){if($(this).val()==="站內搜索")$(this).val("");});$("#word").focus(function(){if($(this).val()==="站內搜索")$(this).val("");});$("#word").blur(function(){$("#buttSearch").attr("href","/search.aspx?text="+$("#word").val());if($(this).val()=="")$(this).val("站內搜素");});});</script></body></html>1.3.3其他頁面及模塊簡介子網頁多采用主頁的結構特點，子頁的布局與主頁稍有不同的地方在于，子頁在主要內容板塊主要為左邊分類標簽，右邊為主要的標簽內容展示。其他模塊里最值得一提的是注冊登錄模塊（如下圖），這個模塊運用動態(tài)網頁特點（有詳細介紹）。更好的豐富了網站內容。1.3.4設計效果與技術介紹布局主要采用分欄的方式，以各個板塊展示不同的內容信息。網站風格簡單容易操作，導航簡單，分欄的布局使條理清晰，清晰明了。讓廣大用戶容易上手操作。1.4出現問題及解決方案用戶通常會使用瀏覽器訪問您的網站。各瀏覽器解譯網站代碼的方式略有不同，這意味著您的網站在不同瀏覽器中顯示的效果會有所差異。一般情況下，您應避免依賴于瀏覽器特定的行為，例如在未指定內容類型或編碼的情況下，希望瀏覽器可以正確檢測到相應的內容類型或編碼。此外，您還可以采取以下步驟來確保網站在不同的瀏覽器中都能正確顯示。完成網站設計后，您應通過多個瀏覽器復查網站的外觀和功能，確保將您獨具匠心的設計完美呈現給所有訪問者。早在網站開發(fā)階段，您就應該進行這種測試。各種瀏覽器(甚至是同一瀏覽器的不同版本)對同一網站的呈現可能會有所不同。您可以使用諸如GoogleAnalytics(分析)這樣的服務來了解訪問者最常使用哪些瀏覽器訪問您的網站。即使您編寫的HTML無效，您的網站在某些瀏覽器中也可以正確顯示，但盡管如此，您的網站可能不會在所有瀏覽器(或將來出現的瀏覽器)中都正確顯示。要使您的網頁在所有瀏覽器中顯示的效果相同，最好的方法就是使用有效的HTML和CSS編寫網頁，然后在盡可能多的瀏覽器中測試這些網頁顯示的效果。有效、易解譯的HTML可保證網頁得以正確顯示，而CSS可以將網頁的外觀和內容分離開來，使網頁可以更快速地載入和呈現給訪問者。您可以使用驗證工具檢查自己的網站，例如W3Consortium免費提供的在線HTML和CSS驗證工具，還可以使用諸如HTMLTidy的工具快捷地清理您的代碼。(盡管Google強烈推薦使用有效的HTML，但這并不影響Google抓取您的網站并將其編入索引的方式。)1.5結束語：本次課題的設計和實現，我們小組首先在以往的學習基礎上，通過對相應資料的查閱和借鑒以及學習，了解基金會系統(tǒng)的基礎上掌握了人口福利基金會網站系統(tǒng)的基本方法，然后參考課題要求，以及對課題要求的分析，為設計和實現打下了基礎。由于能力的原因本次課題的設計還有很多不足的地方，一些功能的分析，設計和實現還有待進一步的提高和改善。1.6參考文獻：[1][S/OL]/view/267151.htm?fr=aladdin[2]姜超[D].《長春理工大學》,2011年[3]蒲子明《ssh整合開發(fā)技術詳解》，2009年[4]王水《軟件工程素質導論》，

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論