一種所見即所得式的線上網(wǎng)站建設(shè)方法
【專利摘要】一種所見即所得式的線上網(wǎng)站建設(shè)方法，它包括如下步驟：①、用戶通過Web站點(diǎn)調(diào)用數(shù)據(jù)庫信息，并建立用戶自己的網(wǎng)頁頁面；同時(shí)數(shù)據(jù)庫返回網(wǎng)頁頁面數(shù)據(jù)，并在Web站點(diǎn)將網(wǎng)頁頁面顯示出來；②、用戶利用Ajax技術(shù)創(chuàng)建模板編輯模塊，并將創(chuàng)建的模板編輯模塊放在以建立好的網(wǎng)頁頁面中；所述的模板編輯模塊存放在數(shù)據(jù)庫中；③、當(dāng)用戶對(duì)所得的模板編輯模塊進(jìn)行編輯時(shí)，通過Javascript將更改數(shù)據(jù)發(fā)送至數(shù)據(jù)庫，數(shù)據(jù)庫返回更改結(jié)果數(shù)據(jù)至模板編輯頁面，同時(shí)將編輯后的模板編輯模塊顯示在網(wǎng)頁頁面上。
【專利說明】一種所見即所得式的線上網(wǎng)站建設(shè)方法
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及一種建設(shè)網(wǎng)站的方法，具體地說是涉及一種所見即所得式的線上網(wǎng)站建設(shè)方法。
【背景技術(shù)】
[0002]隨著國際互聯(lián)網(wǎng)的迅速發(fā)展，網(wǎng)站的數(shù)量呈幾何倍數(shù)地快速增長(zhǎng)。除了傳統(tǒng)的企事業(yè)單位以外，個(gè)體工商戶、個(gè)體從業(yè)者、自由職業(yè)者也都需要建設(shè)自己網(wǎng)站，把它作為一個(gè)展示、宣傳的途徑和渠道。而建設(shè)一個(gè)網(wǎng)站，則需要網(wǎng)站擁有者提供域名、網(wǎng)站空間、ip地址、網(wǎng)站主機(jī)和網(wǎng)頁等內(nèi)容。網(wǎng)站擁有者要么自己來制作和維護(hù)網(wǎng)站(這就要求其具備相當(dāng)水平的計(jì)算機(jī)和網(wǎng)絡(luò)技術(shù))，要么委托專業(yè)的網(wǎng)絡(luò)公司來制作網(wǎng)站，不僅花費(fèi)資金很高，而且整套程序還非常繁瑣。
[0003]近兩年來，一種名為‘自助建站’的技術(shù)逐漸開始成熟。所謂自助建站，就是使用者利用其他網(wǎng)站自動(dòng)提供的域名、網(wǎng)站空間、ip地址和網(wǎng)站主機(jī)，通過使用其提供的各種網(wǎng)站模板和內(nèi)容管理系統(tǒng)，根據(jù)自己的需要來建設(shè)及更新自己的網(wǎng)站，從而使得網(wǎng)站建設(shè)與維護(hù)都變得容易起來。與自己?jiǎn)为?dú)建設(shè)網(wǎng)站相比較，不僅步驟簡(jiǎn)單，其費(fèi)用也大幅度地降低了。
[0004]但是，目前的網(wǎng)站自助建設(shè)技術(shù)其普遍存在的一個(gè)缺點(diǎn)是:使用者在編輯、維護(hù)自己的網(wǎng)站及網(wǎng)頁內(nèi)容時(shí)，無法實(shí)時(shí)看到最終的效果。只能在編輯結(jié)束后，通過‘預(yù)覽’功能或者通過登錄網(wǎng)站，才能看到最終的網(wǎng)站顯示效果。其編輯過程既不直觀，又繁瑣，還常常發(fā)生‘最終效果與預(yù)期效果不一致’的情況，往往需要反復(fù)調(diào)整，使得網(wǎng)站的編輯、維護(hù)時(shí)間浪費(fèi)許多，維護(hù)成本大大增加。

【發(fā)明內(nèi)容】

[0005]本發(fā)明為解決上述問題而提出一種所見即所得式的線上網(wǎng)站建設(shè)系統(tǒng)及方法，主要目的希望能夠利用本發(fā)明，使得使用者能夠以真正的‘所見即所得’的方式，編輯、維護(hù)自己的網(wǎng)站架構(gòu)和網(wǎng)頁內(nèi)容。
[0006]為實(shí)現(xiàn)上述目的，本發(fā)明采用以下技術(shù)方案:
一種所見即所得式的線上網(wǎng)站建設(shè)方法，它包括如下步驟:
①、用戶通過Web站點(diǎn)調(diào)用數(shù)據(jù)庫信息，并建立用戶自己的網(wǎng)頁頁面；同時(shí)數(shù)據(jù)庫返回網(wǎng)頁頁面數(shù)據(jù)，并在Web站點(diǎn)將網(wǎng)頁頁面顯示出來；
②、用戶利用Ajax技術(shù)創(chuàng)建模板編輯模塊，并將創(chuàng)建的模板編輯模塊放在以建立好的網(wǎng)頁頁面中；所述的模板編輯模塊存放在數(shù)據(jù)庫中；
③、當(dāng)用戶對(duì)所得的模板編輯模塊進(jìn)行編輯時(shí)，通過Javascript將更改數(shù)據(jù)發(fā)送至數(shù)據(jù)庫，數(shù)據(jù)庫返回更改結(jié)果數(shù)據(jù)至模板編輯頁面，同時(shí)將編輯后的模板編輯模塊顯示在網(wǎng)頁頁面上。
[0007]所述的模板編輯模塊按類別存放在數(shù)據(jù)庫中。[0008]在所述的網(wǎng)頁頁面上設(shè)置控制按鈕，控制按鈕觸發(fā)模板編輯模塊啟動(dòng)工作。
[0009]采用上述技術(shù)方案的本發(fā)明，對(duì)于使用者來說，其編輯和維護(hù)過程所面對(duì)的網(wǎng)站架構(gòu)及網(wǎng)頁效果，與網(wǎng)站實(shí)際運(yùn)行時(shí)的效果完全相同，從視覺效果來看，編輯狀態(tài)完全等同于運(yùn)行狀態(tài)。這樣，編輯、修改過程不僅簡(jiǎn)單、方便，而且非常直觀，減少了編輯和維護(hù)的次數(shù)，提高了工作效率，降低了維護(hù)成本，非常適合一般使用者、尤其是一般計(jì)算機(jī)操作人員的操作習(xí)慣。
【專利附圖】

【附圖說明】
[0010]圖1是本發(fā)明關(guān)于網(wǎng)站底層數(shù)據(jù)的流程圖。
[0011]圖2是本發(fā)明關(guān)于建置網(wǎng)站的流程圖。
[0012]圖3是本發(fā)明關(guān)于登錄驗(yàn)證后進(jìn)入網(wǎng)站建置的實(shí)施例。
[0013]圖4是本發(fā)明關(guān)于站點(diǎn)控制面板的實(shí)施例。
[0014]圖5是本發(fā)明關(guān)于頁面控制面板的實(shí)施例。
[0015]圖6是本發(fā)明關(guān)于模塊控制面板的實(shí)施例。
[0016]圖7是本發(fā)明關(guān)于完成建置退出后網(wǎng)站真實(shí)展現(xiàn)的實(shí)施例。
[0017]圖8是本發(fā)明關(guān)于網(wǎng)站底層設(shè)計(jì)的原理框圖。
【具體實(shí)施方式】
[0018]如圖1所示，一種所見即所得式的線上網(wǎng)站建設(shè)方法，主要采用Ajax技術(shù)實(shí)現(xiàn)，Ajax的核心是JavaScript對(duì)象XmlHttpRequest,使用它可以構(gòu)建更為動(dòng)態(tài)和響應(yīng)更靈敏的Web應(yīng)用程序。該方法的關(guān)鍵在于對(duì)瀏覽器端的JavaScript、DHTML和與服務(wù)器異步通信的組合。這種強(qiáng)大的力量可以使應(yīng)用程序更加自然和響應(yīng)靈敏，從而提升用戶的瀏覽體驗(yàn)。它包括如下步驟:
①、用戶通過Web站點(diǎn)調(diào)用數(shù)據(jù)庫信息，并建立用戶自己的網(wǎng)頁頁面；同時(shí)數(shù)據(jù)庫返回網(wǎng)頁頁面數(shù)據(jù)，并在Web站點(diǎn)將網(wǎng)頁頁面顯示出來；
②、用戶利用Ajax技術(shù)創(chuàng)建模板編輯模塊，并將創(chuàng)建的模板編輯模塊放在以建立好的網(wǎng)頁頁面中；所述的模板編輯模塊存放在數(shù)據(jù)庫中；
③、當(dāng)用戶對(duì)所得的模板編輯模塊進(jìn)行編輯時(shí)，通過Javascript將更改數(shù)據(jù)發(fā)送至數(shù)據(jù)庫，數(shù)據(jù)庫返回更改結(jié)果數(shù)據(jù)至模板編輯頁面，同時(shí)將編輯后的模板編輯模塊顯示在網(wǎng)頁頁面上。
[0019]所述的模板編輯模塊按類別存放在數(shù)據(jù)庫中。
[0020]在所述的網(wǎng)頁頁面上設(shè)置控制按鈕，控制按鈕觸發(fā)模板編輯模塊啟動(dòng)工作。
[0021]在Ajax之前，Web站點(diǎn)強(qiáng)制用戶進(jìn)入提交/等待/重新顯示范例，用戶的動(dòng)作總是與服務(wù)器的“思考時(shí)間”同步。Ajax提供與服務(wù)器異步通信的能力，從而使用戶從請(qǐng)求/響應(yīng)的循環(huán)中解脫出來。用戶通過可視化界面，借助ajax技術(shù)，修改頁面布局及模塊內(nèi)容，并將修改的內(nèi)容提交到數(shù)據(jù)庫且在編輯實(shí)時(shí)顯示修改結(jié)果。詳見附圖1。
[0022]利用Ajax的這些技術(shù)特點(diǎn)，我們開發(fā)了這樣一個(gè)具有桌面風(fēng)格的(desktop-like)企業(yè)級(jí)的建站系統(tǒng)。頁面的內(nèi)容都以模塊的形式顯示出來，每個(gè)模塊就是一個(gè)功能組，譬如一個(gè)留言板，一個(gè)搜索欄都是一個(gè)模塊，用戶通過配置站點(diǎn)一一新增頁面一一增加模塊的步驟完成網(wǎng)站的建設(shè)，這些模塊都是已經(jīng)開發(fā)的成型的功能組，每個(gè)功能組都有一個(gè)控制面板，用戶通過控制面板來完成顯示、內(nèi)容維護(hù)等操作，在維護(hù)一個(gè)模塊的同時(shí)不影響其他模塊的正常顯示，配置的頁面和最終的顯示頁是同步的。由于采用了Ajax技術(shù)，每次模塊的更改只向服務(wù)器提交當(dāng)前模塊的數(shù)據(jù)而不是整個(gè)頁面，所以操作起來就像桌面的應(yīng)用速度非?？?，詳見附圖8。
[0023]請(qǐng)參照?qǐng)D2是本發(fā)明關(guān)于建置網(wǎng)站的流程圖。用戶在登錄驗(yàn)證后進(jìn)入自己的站點(diǎn)維護(hù)頁面，站點(diǎn)維護(hù)頁面同在互連網(wǎng)供人瀏覽的界面基本保持一致，以此達(dá)到所見即所得的效果(What You See Is What You Get, WYSIWYG),可以通過對(duì)比圖3和圖7看出維護(hù)界面同瀏覽界面之間的差別僅存在于跟隨在每一個(gè)控制對(duì)象的操作按鈕，這些按鈕在登錄前的瀏覽界面里是看不到的，也就是說外人是無法更改站點(diǎn)的，而在登錄確認(rèn)后這些控制按鈕出現(xiàn)并跟隨在每個(gè)操作對(duì)象的右上方，點(diǎn)擊即可更改當(dāng)前對(duì)象。這些操作對(duì)象分為三類，即站點(diǎn)、頁面、模塊。他們之間的關(guān)系是每個(gè)用戶只會(huì)有一個(gè)站點(diǎn)對(duì)象，一個(gè)站點(diǎn)對(duì)象包括復(fù)數(shù)個(gè)頁面，一個(gè)頁面包括復(fù)數(shù)個(gè)模塊。模塊是一個(gè)站點(diǎn)的最基本對(duì)象。
[0024]當(dāng)用戶第一次登錄系統(tǒng)后，系統(tǒng)默認(rèn)站點(diǎn)只有一頁，就是首頁，這時(shí)用戶可以通過站點(diǎn)的控制面板來更改站點(diǎn)的樣式及其他站點(diǎn)屬性，進(jìn)入站點(diǎn)控制面板的方法是點(diǎn)擊整個(gè)頁面最右上腳的控制按鈕。請(qǐng)參照?qǐng)D3關(guān)于登錄驗(yàn)證后進(jìn)入網(wǎng)站建置的實(shí)施例。同時(shí)也可以新建頁面，這些新建的頁面可以作為此站點(diǎn)的分頻道，點(diǎn)擊站點(diǎn)頁頭下方的“新建頁”鏈接完成此操作，在出現(xiàn)的頁面控制面板內(nèi)完成對(duì)當(dāng)前頁面的設(shè)置。如模塊的排列方式頁面的名稱等等。新建頁面后開始給頁面增加模塊，點(diǎn)擊頁面上的增加模塊按鈕進(jìn)入模塊庫內(nèi)選擇，在模塊庫內(nèi)有已經(jīng)開發(fā)好的模塊供用戶選擇，包括留言板、企業(yè)名片、企業(yè)地圖、信息發(fā)布等等功能。
[0025]請(qǐng)參考圖4是本發(fā)明關(guān)于站點(diǎn)控制面板的實(shí)施例，在這里用戶可以通過調(diào)色板調(diào)整整個(gè)站點(diǎn)的背景顏色、通過站點(diǎn)樣式設(shè)置從樣式庫中選取樣式并應(yīng)用的自己站點(diǎn)上，所謂樣式就是頁面的展示方式及模塊的展示方式，通過網(wǎng)站題頭的設(shè)置選取自己喜歡的網(wǎng)站頁頭，網(wǎng)站頁頭的展現(xiàn)方式多種多樣，可以從已有的資源庫中選取FLASH或圖片，也可以自己制作FLASH或圖片上傳后直接應(yīng)用。還可以通過站點(diǎn)廣告設(shè)置給自己的網(wǎng)站添加對(duì)聯(lián)廣告等內(nèi)容。`
[0026]請(qǐng)參考圖5是本發(fā)明關(guān)于頁面控制面板的實(shí)施例，點(diǎn)擊“首頁”、“第一頁”、“第二頁”…旁的控制按鈕進(jìn)入此頁的控制面板，頁面控制面板會(huì)下拉出來位于頁面導(dǎo)航的下面，在控制面板內(nèi)用戶可以選取當(dāng)前頁面應(yīng)用的頁面布局，模塊的排列方式，并可以修改頁面的名稱，如需建立一個(gè)“關(guān)于我們”的頻道，則可以在控制面板的頁面名稱編輯框內(nèi)輸入“關(guān)于我們”即可。
[0027]請(qǐng)參考圖6是本發(fā)明關(guān)于模塊控制面板的實(shí)施例，點(diǎn)擊當(dāng)前頁面的增加模塊按鈕即可從模塊庫中選取需要的模塊添加到當(dāng)前頁面上，“增加模塊”按鈕根據(jù)用戶選擇的頁面布局顯示，如用戶選擇的頁面布局是兩列，那么頁面下方會(huì)出現(xiàn)兩個(gè)“增加模塊”按鈕，點(diǎn)擊那一列的“增加模塊”按鈕就在當(dāng)前列增加模塊。模塊庫的內(nèi)容非常豐富，有企業(yè)常用的留言板、企業(yè)簡(jiǎn)介、企業(yè)名片、企業(yè)地圖、鏈接服務(wù)、站內(nèi)搜索，新聞發(fā)布欄、供求信息欄等等。它們都是已經(jīng)開發(fā)好的獨(dú)立單元，符合當(dāng)前流行的構(gòu)件式編程思想，用戶可以象搭積木一樣搭建一個(gè)個(gè)性化的網(wǎng)站。這些模塊每一個(gè)都有一個(gè)特定的控制面板，如圖6上的模塊I至模塊5，它們可以是五個(gè)不同的模塊，每個(gè)模塊的右上角均有一個(gè)控制按鈕，點(diǎn)擊控制按鈕即在本頁當(dāng)前模塊的位置出現(xiàn)此模塊的控制面板，在控制面板中用戶可以更改當(dāng)前模塊的一些屬性，例如點(diǎn)擊模塊4的控制按鈕后，原模塊4的位置上隨即出現(xiàn)設(shè)置界面，而整個(gè)頁面的其他部分并不隨之變化，在設(shè)置界面里用戶可以設(shè)置當(dāng)前模塊的名稱，顯示方式等等屬性，假如模塊4是一個(gè)供求信息模塊，那么用戶可以從文字列表，圖片列表，圖片櫥窗等幾種顯示方式中任選一種，同時(shí)還可以設(shè)置當(dāng)前模塊內(nèi)顯示的信息的條數(shù)。
[0028]請(qǐng)參考圖7是本發(fā)明關(guān)于完成建置退出后網(wǎng)站真實(shí)展現(xiàn)的實(shí)施例，在完成網(wǎng)站的階段性編輯后可以退出看到編輯后的網(wǎng)站的樣子，由于網(wǎng)站編輯的狀態(tài)和最終編輯后的效果是完全一致的，所以我們并不額外再提供網(wǎng)站預(yù)覽的功能，用戶可以隨時(shí)再次登錄后繼續(xù)網(wǎng)站的編輯，對(duì)站點(diǎn)、頁面、模塊三類對(duì)象作出自己滿意的調(diào)整。
【權(quán)利要求】
1.一種所見即所得式的線上網(wǎng)站建設(shè)方法，其特征在于，它包括如下步驟: ①、用戶通過Web站點(diǎn)調(diào)用數(shù)據(jù)庫信息，并建立用戶自己的網(wǎng)頁頁面；同時(shí)數(shù)據(jù)庫返回網(wǎng)頁頁面數(shù)據(jù)，并在Web站點(diǎn)將網(wǎng)頁頁面顯示出來； ②、用戶利用Ajax技術(shù)創(chuàng)建模板編輯模塊，并將創(chuàng)建的模板編輯模塊放在以建立好的網(wǎng)頁頁面中；所述的模板編輯模塊存放在數(shù)據(jù)庫中； ③、當(dāng)用戶對(duì)所得的模板編輯模塊進(jìn)行編輯時(shí)，通過Javascript將更改數(shù)據(jù)發(fā)送至數(shù)據(jù)庫，數(shù)據(jù)庫返回更改結(jié)果數(shù)據(jù)至模板編輯頁面，同時(shí)將編輯后的模板編輯模塊顯示在網(wǎng)頁頁面上。
2.根據(jù)權(quán)利要求1所述的所見即所得式的線上網(wǎng)站建設(shè)方法，其特征在于:所述的模板編輯模塊按類別存放在數(shù)據(jù)庫中。
3.根據(jù)權(quán)利要求1所述的所見即所得式的線上網(wǎng)站建設(shè)方法，其特征在于:在所述的網(wǎng)頁頁面上設(shè)置控制按鈕，控制按鈕觸發(fā)模板編輯模塊啟動(dòng)工作。
【文檔編號(hào)】G06F9/44GK103793216SQ201210426028
【公開日】2014年5月14日 申請(qǐng)日期:2012年10月31日 優(yōu)先權(quán)日:2012年10月31日
【發(fā)明者】劉亞非, 玉培華, 翟社景 申請(qǐng)人:鄭州月太軟件有限公司