⑴ web開發流程圖 一般用什麼軟體
1. Codepen
Codepen應該是全世界最受歡迎的開發環境之一了。CSS技巧的作者Chris Coyier是Codepen的聯合創始人之一，這也就是為什麼這款app看起來那麼豪華。除了視覺上的優秀效果，它可以生動地展現預覽，當你修改了代碼，就可以看到效果，使你能夠更容易地找出變化。
Codepen用於CSS的預處理器包括SCSS、SASS，LESS和Stylus，用於JS的有CoffeeScript和LiveScript，用於HTML的包括Haml、Markdown、Slim和Jade。另外，它還包含了8個可用的內置的JS庫。Codepen中合作和私人的「pens」需要付費使用。【前往Codepen】
2. JSFiddle
JSFiddle可以說是成就了開發環境的流行，它是第一個也是最出名的平台。JSFiddle有超過30個可以立即使用的JavaScript庫，你還可以輕松的添加外部文件。在預處理方面，它有用於CSS的SCSS、用於JS的CoffeeScript以及用於HTML的簡單Vanilla。
如果你在與其他開發者合作，我強烈建議你使用JSFiddle。在所有的開發環境中，JSFiddle的協作特性是同類型應用中最好的，而且區別於Codepen的是，它的這個特性是操作簡單並且免費的。
但JSFiddle沒有的是預覽功能，你需要手動刷新頁面。和其它開發平台相比，JSFiddle確實也比較慢。另外，JSFiddle還有一個不足就是它的執行鍵不是很靈敏，有時需要多點擊幾次才能夠執行代碼。【前往JSFiddle】
3. JS Bin
JS Bin是由JavaScript開發大師Remy Sharp創建的，他擁有一家專注於JavaScript和HTML5的web開發公司。JS Bin的JS預處理器包括CoffeeScript、TypeScript、Traceur、JSX以及可供使用的超過40個的JS庫。你同樣可以添加外部文件，但是必須在編輯器上手動操作。而用於CSS的預處理器，它提供了LESS。
JS Bin和以前開發平台的區別在於它允許你把文件下載到你的電腦上，這對於開發者，尤其是在離線狀態下調試代碼的程序員來說，是一個很不錯的特點。你還可以創建私人的Bin空間，不過你需要對此付費。另外，JS Bin不支持協作功能。【前往JS Bin】
4. CSSDeck
CSSDeck已經存在一些年了，但它的影響力好像不是很大。不過，由於它的簡潔性，它還是值得關注的。如果你不需要其它平台里那些復雜的功能，那CSSDeck就應該是你的選擇。
CSSDeck的預處理器包括用於HTML的HAML、Markdown、Slim和Jade，用於CSS的LESS、Stylus、SASS和SCSS，以及用於JS的CoffeeScript。它還有幾個可用的CSS和javascript庫，對於沒有的庫，你只需要將其手動地添加到庫的列表中就可以使用了。
CSSDeck雖然很簡潔，但它有一個讓我很吃驚的特性，就是它支持用戶改變字體大小，這是一個簡單卻實用的功能。所以說，如果你在尋找有很多很炫的功能的開發平台，CSSDeck可能不適合你。它的簡潔性讓你更專注於最重要的事情，這也是它最大的特點。【前往CSSDeck】
5. Dabblet
當我還在使用十六進制顏色代碼的時候，Dabblet的特性讓我驚訝了，它的顏色預覽居然顯示在代碼旁，這是我第一次見到這樣的設置。雖然我不確定這是否是一個有用的特性，但是它的整潔性還是給我留下了很深的印象。
現在，Dabblet最棒的地方在於它允許用戶以5個不同的視角進行預覽，分別是CSS編輯器和效果，HTML編輯器和效果，CSS和HTML的編輯器和效果，JavaScript及運行結果，全部綜合效果。這些功能在絕大部分的開發環境中都沒有。
它也有不足，第一，Dabblet缺乏HTML和CSS的預處理器，這是令人困惑的。第二，它沒有內置的JavaScript庫，不過你可以通過手動插入JavaScript庫來解決。第三，它的每個板塊大小是固定的，無法作出調整，這和以前傳統的調試平台是一樣的。第四，它缺少一個用於演示其他用戶作品的板塊。【前往Dabblet】
6. Liveweave
Liveweave是一個擁有很多功能的開發平台，比如可以關閉的實時預覽。你也可以為了保護視力，開啟夜間模式，將所有界面都變暗。Liveweave提供了20多個JavaScript庫，甚至還支持SVG。其內置的標尺使測量更加精確，更符合美學標准。
它還有一個吸引我眼球的地方，就是它的協作功能。如果你過去曾經使用過Teamviewer，你會發現它們是相似的。你需要做的事只是點擊協作鏈接，你就可以分享來自於你到weave的鏈接了。
你甚至可以下載你的weave文件，並把它保存為單獨的HTML文件或者保存為包含獨立HTML、CSS和JS文件的zip壓縮包。對了，Liveweave還有一個內置的Lorem Ipsum生成器。 【前往Liveweave】
結語
當然，每一個平台和工具都有它自己的特性，都會對你有所幫助
⑵ 設計WEB站點的一般步驟
(1)對Web站點作出具體的規劃
(2)准備Web站點的素材
(3)創建 Web站點和製作網頁
(4)測試Web站點
(5)發布Web站點
(6)宣傳自己的Web站點
(7)對Web站點進行維護和更新
⑶ 如何製作網站 web
第一步：建站系統選擇
不懂技術和設計的情況下，你就需要用到自助建站系統了，需要找網頁製作公司的模板，這樣可以讓你零基礎做出一個比較美觀的網站。後台都是可視化操作，模板設計感強，簡潔典雅，做出來的網站效果也非常好。
第二步：頭圖設計
訪客打開你的網站後，瀏覽順序一般是從上至下……因此，若想快速吸引訪問者注意力，就一定要重視頭圖banner！讓客戶感受到視覺上的美觀和愉悅，而不是看了你網站一眼就迅速關掉。頭圖一定要要足夠顯眼、吸睛。讓客戶一眼明白你是干什麼的，千萬不要太啰嗦，免得浪費客戶時間。
第三步：詳細信息展示
在標題頭圖之下，一般是企業簡介、重要產品展示、團隊成員、詳細業務介紹、媒體報道等，網站靠後部分則是留言表單、聯系方式。中間可以根據需求添加商城、博客等版塊。這樣的版塊排列順序比較有邏輯，便於客戶理解。
如何製作網頁，添加這樣的功能呢？在上線了網站編輯器點擊左側【添加新版塊】，可以添加各種功能——商城、定價表、相冊、產品展示、大尺寸媒體、留言表單、橫向布局、縱向布局等。版塊的布局、順序均可調整，版塊內的文字內容、圖片也可隨時更改。
第四步：加強客戶聯系
網站是從互聯網引流的好渠道，你可以在網站底部添加自己的社交媒體平台按鈕，吸引客戶關注你，進而為自己積攢私域流量。
第五步：發布上線
在網站後台的「設置」里你可以設置網站域名、標題、logo等等。全部做好並預覽無誤後點擊左下角的「上線」，就成功發布自己的網站了。
⑷ 應該如何製作web流程圖
一、設計的任務：設計是一種審美活動，成功的設計作品一般都很藝術化。但藝術只是設計的手段，而並非設計的任務。設計的任務是要實現設計者的意圖，而並非創造美。 網頁設計的任務，是指設計者要表現的主題和要實現的功能。站點的性質不同，設計的任務也不同。從形式上，可以將站點分為以下三類。 第一類是資訊類站點，像新浪、網易、搜狐等門戶網站。這類站點將為訪問者提供大量的信息，而且訪問量較大。因此需注意頁面的分割、結構的合理、頁面的優化、界面的親和等問題。 第二類是資訊和形象相結合的網站，像一些較大的公司、國內的高校等。這類網站在設計上要求較高，既要保證資訊類網站的上述要求，同時又要突出企業、單位的形象。然而就現狀上來看，這類網站有粗製濫造的嫌疑。 第三類則是形象類網站，比如一些中小型的公司或單位。這類網站一般較小，有的則有幾頁，需要實現的功能也較為簡單，網頁設計的主要任務是突出企業形象。這類網站對設計者的美工水平要求較高。 當然，這只是從整體上來看，具體情況還要具體分析。不同的站點還要區別對待。別忘了最重要的一點，那就是客戶的要求，它也屬於設計的任務。
⑸ WEB網站的設計過程有那幾個階段
1,確定用途(功能)
2,資料搜集
3,美工
4,框架設計
5,加入代碼/程序/資料庫
6,整體測試
⑹ web程序的一般設計過程
web程序，就是說B/S架構的系統么，剛好在做一個網站開發，我按照自己的開發過程好想法說說吧
1.
需求分析，可能感覺很虛，但是這是必須的，你這個系統是為什麼而做的，就是它的需求是什
么？有了需求，你去分析，將這種需求轉換成E-R圖，讓客戶能夠看懂，他們的需求都被概括進去了
2.
概要設計，根據你的需求分析文檔，都要完成哪些功能，需要你設計好怎麼去完成這些功能。最好是能夠直接設計出大概的資料庫表以及之間的關系
3.
資料庫的設計（這個是我感覺非常有必要單獨列出來），我感覺資料庫是一個系統的核心，當你的資料庫的表，以及之間的關系，都設計的非常的好，能考慮到這些表之間的可能關聯，後面可能會碰到的問題，系統基本上問題也不大了。
4.
架構設計，你要考慮系統規模大小，主要的關注點，然後考慮你是使用什麼資料庫，什麼框架，什麼界面技術等等。
5.
詳細設計，根據你考慮的架構，輸出詳細設計文檔。這個階段的最後最好將資料庫弄好。前面只是將資料庫設計出來了，還沒有正式的建庫建表，你就先把資料庫弄好
6.
開發，然後就是按照詳細設計開發，界面等等。。。。。
⑺ 我是做web前端的，要實寫一個流程圖，不會寫，沒思路，求指教
如果這個流程圖是固定的，也就是說是不會隨著數據，改變位置的話，那就做五行七列的格子，然後往格子里加東西應該就可以了。像那個藍色四個角，你可以在這個包裹電話的小盒子里，定位四個小正方形，定位到四個角上。
例外那個每個圖標樣式都是固定的上圖下文，上圖帶四個小正方形的交互，並且大部分帶箭頭，可以寫公共樣式。像那些線，如果嫌麻煩，可以用圖片代替，定位上去。
⑻ 請教公司里web開發的流程
首先策劃出文案，然後設計出效果，通過後製作切圖做頁面，前後台可以同時做，套頁面應該是把任憑做的html靜態頁與程序員開發的後台綁定起來
⑼ 一個完整的web項目開發流程
1 需求確定
通過各種方法確定系統的功能與性能。
功能：注冊、登錄、查詢、搜索。。。
性能：可同時支持N個並發訪問，並且響應時間不低於M毫秒。。。
方法：
會議
詢問
頭腦風暴
原型-界面原型、業務原型。。。
本階段是項目開發的最重要的階段。
在WEB項目中，通常界面設計會在本階段進行。
2 分析與設計
1 架構分析與設計
邏輯結構：
3層架構、多層架構。。。
MVC。。。
Model1或Model2
。。。
物理架構：
web伺服器的分布
資料庫伺服器的分布
。。。
技術解決方法的確定：
Java/.net
Open Source/商業
。。。
2 業務邏輯分析
根據需求分析業務邏輯：
有哪些人使用本系統
他們會使用本系統做什麼
通常他們使用本系統的步驟是怎麼樣的
會有哪些明顯的類來支撐本系統的運行
會有哪些不同的提示會反饋給用戶
。。。
本階段與需求的確定密切相關，通常在確定需求的時候就會進行相關的分析。
3 業務邏輯設計
根據需求的分析來確定具體的類
確定類的屬性
確定類的介面（方法）
確定類之間的關系
確定用戶操作流程在設計上的反映
進行資料庫的設計
注意：不同的項目步驟可能不盡相同
4 界面設計
設計系統的界面風格：
顏色、style
設計系統的具體「模擬」界面：
能夠從頭到尾
方便進行需求的確定
方便JSP程序員進行開發
。。。
3 開發環境搭建
開發工具的確定：
eclipse、Myeclipse。。。
配置管理工具的確定
測試工具的確定
文件伺服器/配置伺服器等的確定
。。。
4 開發-測試-開發-測試
按照設計進行開發
迅速開發原型
進行迭代開發
提早進行測試：
單元測試
黑盒測試
白盒測試
性能測試
易用性測試
。。。
5 編寫文檔
⑽ 網頁設計流程是什麼
策劃階段
每一個網站的建立同時，都伴隨著諸多尚未解決的需求。為什麼要做這個網站？是製作之處需要想到的問題，無論是為了宣傳業務、提升業績，還是表達觀點、傳遞價值，一個網站都會承載著諸多的功能需求。那麼，在策劃階段，就要圍繞著需求及功能點，將其一一解析出來，並整理成冊為：PRD產品需求文檔。通常這部分是由產品經理（PM）完成，需要在與客戶詳細交談過數次後，才能一並輸出。如果項目中途突然加個需求，程序和設計的心裡一定會很難過的，所以一個新站的策劃初期，至少要考慮到未來2~3年，網站的功能添加的可拓展性。
2.交互設計
這一階段的工作通常由專業的交互設計師來完成，當然也時常可由產品經理兼職。交互設計師得根據解析出的PDR需求文檔，合理地組織網站框架，建立一級、二級導航欄目，規劃網站內頁的瀏覽路徑，以及頁面跳轉關系。通常會用到Sketch、或OminiGraffle、mindnote等軟體來梳理頁面邏輯及框架結構，以完成交互設計稿的繪制。以便網站受眾在瀏覽過程中能高效、愉悅地獲取到他們想要的信息。如果是頁面不多，可在白板上或幾張A4中完成這個環節的工作；頁面巨多，則要將交互稿整理出圖，打包為電子手冊，方便下一工作環節的實施。
3.視覺設計
現在該網頁設計師正式出場了，這一環節中，設計師主要根據交互設計稿，確定網站內頁的具體設計規范，包括網站顏色VI的選用、字體字型大小大小、以及素材的編排、選取及處理、每一根線條、每一個像素，都是由作為准網頁設計師的你來把控了。將所有頁面設計稿完畢後，標注好尺寸、顏色等數值信息，輸出必要的圖片、icon等資源，打包好後一並交給Web前端工程師。
4.前端製作
這個環節的主角是Web前端工程師。其主要根據網頁設計師出具的設計稿，運用HTML、CSS代碼實現頁面重構和頁面邏輯跳轉，運用JavaScript、JQuery等技術優化網站瀏覽體驗，以及網站界面交互動效、功能實現的製作。相信你的程序員哥哥定能給你辦得穩妥妥的，當然在這個過程中會遇到些許問題，作為網頁設計師的你要及時與之溝通，一起將界面的細節做到99%還原設計稿。
5.後端製作
實現後端數據的邏輯處理，比如數據的提交存儲、更新修改、查詢等。這個環節的主角是Web後端工程師，通常要用到PHP、java、C語言或C++等編程技術。作為網頁設計師的我，對於這一環節的工作是持仰望態度，無法展開來講了。
6.測試上線
在網頁重構及後端製作完成後，將代碼模板套入CMS（即：內容管理系統）完成本地測試，以檢驗其可靠性。在排除bug問題後，就可准備上線了。買個域名和伺服器，做些必備的伺服器配置工作，完成DNS解析，將域名和伺服器連接起來，最後再運用FTP工具上傳資料到伺服器。於是該網站就可以正常訪問了。