導航:首頁 > 萬維百科 > 網站設計基礎

網站設計基礎

發布時間:2020-08-10 23:55:05

1、一個網站建設需要懂得哪些基礎知識?

1、設計知識
既然是網站建設,就應該特別注意規模和條件。一個網站應該有自己的規則和規格,有自己的圖形和字體,具有不同的個性化特徵,當然,屬於自己的亮點,是受到關注的主要條件。因此,在網站建設過程中,設計是一項不容忽視的技術。
2、軟體技術
在網站建設中,我們不僅需要建設各個板塊,而且軟體是互聯網應用和操作不可缺少的工具。如果我們不使用這些軟體,就無法完成網站建設。因此,要建設網站,必須會使用軟體,如FLASH軟體,或其他類型的技術軟體等。
3、優化技術
如果網站不具備市場營銷功能,就會失去其價值,學習相關的SEO優化知識可以使我們的網站建設更有價值。

2、網頁設計基礎問題。。

我了個去啊,您這是一點不會吧?你確定這樣你要做個人網站。。。還不如直接找個人幫你做掉算了,真是,,,,讓我想到的是考試答卷啊。您這個╮(╯▽╰)╭


1、試描述建設個人網站的基本步驟。


    前期准備工作,你要有一個域名和域名空間,好了不要問我什麼是域名,域名空間就是你文件的存放地。

    之後,設計-網頁基礎排版和圖像處理;靜態頁面-html+css靜態頁面編輯;程序-把做好的靜態頁面嵌套到程序裡面,你就可以通過後台進行管理了。

    最後調試,測試網站鏈接等無問題後上傳網站到空間,正式發布運行。


2為什麼製作網頁時要遵循使用標准字體、標准色彩的原則?


    首先網站是不支持除標准字體之外的字體的,除非你使用的字體恰好瀏覽者的字體庫也有這種字體否則都會變成「宋體」,所以使用標准字體之外的字體也就毫無意義了。

    當然有一種叫做@font-face的字體,可以 將外部字體載入到網頁,但是他有一個致命的缺陷——針對中文字體相當的不完善。而且使用這種方法你要將字體轉換成.eot、.svg、.ttf、.woff四種格式字體,並在樣式中定義字比如:

@font-face {
    font-family: '953-cai978regular';
    src: url('../font/953-cai978-webfont.eot');
    src: url('../font/953-cai978-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/953-cai978-webfont.woff2') format('woff2'),
         url('../font/953-cai978-webfont.woff') format('woff'),
         url('../font/953-cai978-webfont.ttf') format('truetype'),
         url('../font/953-cai978-webfont.svg#953-cai978regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

    至於顏色,你可以查下相關web安全色的問題,我就不多給你解釋了。


3使用表格和框架布局網頁有什麼不同之處?試描述二者結合布局網頁的優勢


    表格和框架的話,我不想說太多了,這個根本是本質上的區別,沒啥好解釋的,就簡單說下方便你理解就算了。

     表格的話你可以理解為Excel差不多,就是在html頁面上建立一個table表格,把需要的內容放在相應的單元格就可以,不過html中的表格可以做布局用(現在很少有人用了)。

    框架的話,不建議你去研究,這個基本上在網頁製作中很時候用到了,不過像現成的QQ客服代碼和API地圖代碼插入就是框架結構。

    這個兩個你都不需要知道他們的優勢,因為基本不用這兩種進行布局。現在大多數是採用div+css的布局,而且現在html5+css3的技術很強大了。

    另外框架有個致命缺點就是會出現內部滾動條,你要是不明白我說的是什麼意思,你自己做一個頁面只用框架並且把高度和寬度撐開你就知道了,太影響美觀了有木有啊o(>﹏<)o


4回答關於文本和圖像的使用的下列問題:
(1)如何輸入無行距回車和連續多個空格?


    不是很清楚你說的無行距回車是啥,如果是像word一樣的換行的話只要一個<br />就搞定了,單個空格是 &nbsp; 多個空格我們基本不用,大多數採用 margin/padding 直接控制幾個像素的距離。


(2)什麼是替換文本,替換文本在圖片正常瀏覽和非正常瀏覽時如何表現?


    替換文本就是字面的意思,比如我在當前位置插入一個圖片,但是由於不明原因它不能顯示了(360急速模式下默認是一個裂圖,你懂的),現在替換文本就會顯示出來了。也就是說我設置了替換文本是「你看不到我」,那麼當圖片不顯示的時候你就看到這句話了(前面說了360顯示裂圖,IE是這樣的,你要是一定要顯示這句話就要牽扯到瀏覽器默認格式的問題了,現在先不和你說有點小復雜)。

    如果圖片正常情況下 你是看不到替換文本。

    值得注意的是替換文本是屬性是alt ,瀏覽器本身具有糾錯性很多人用alt顯示提示信息,其實這個不是title才是,alt的作用是替換文本。不過現行的主流瀏覽器都默認支持這種錯誤。


5按照鏈接源端,網頁中的超鏈接可以劃分為哪幾種?按照鏈接目的端又可以分為哪幾
種?


    額~這個問題我也不是很清楚,我不明白你說的源端是什麼。

    你可以自己在w3c school上關於a標簽這節內容上看看。

    http://www.w3school.com.cn/html/html_links.asp

    (你要是想系統的學html也可以上w3c school 上學,挺全面的)


6什麼是圖像熱點?如何創建圖像熱點鏈接?


    熱的就是。。。專業解釋是啥我也忘了。就你能聽懂的方法說吧,網頁上的文字和圖形都可以創建鏈接,問題來了,網頁上的圖形不管你做成啥樣也就只能是正方形或是矩形(flash做的不算),那如果我想要一個菱形或是圓形的鏈接怎麼辦?熱點就有用了。

    你要是不用軟體想自己創建一個熱點鏈接就算了,省省力氣吧,語法倒是不難。

<map name="mymap">
<area href=URL1 shape=rect coords="x1,y1,x2,y2">
<area href=URL2 shape=circle coords="x,y,r">
<area href=URL3 shape=poly coords="x1,y1,x2,y2,...,xn,yn">
</map>
<img src=image_url usemap=#mymap>

    但是,你看那x1、y1的了嗎,算坐標算死了,還不一定找的准。使用軟體直接操作,語法也不用你寫,很方便的。


7使用CSS樣式有哪些優勢


    css樣式就是把定義文本、圖像、布局等一系列的代碼全部放在一個統一的「附加樣式表」里,這樣整個html文檔看起來會很乾凈。

    而且,有些樣式是重復調用的,如果有一個統一的樣式表只要該一個class即可,就不需要去找每一行的內嵌樣式,省時省力。

    所以css優勢就是:增強代碼可讀性、便於修改。



8什麼是內部樣式表,什麼是外部樣式表?試舉例說明如何使用外部樣式


    好吧,這個其實和上面是一樣的,看下面代碼,插入css樣式的三種方式:

<link href="CSS/document.css" rel="stylesheet" type="text/css">
<!--調用外部樣式表,單獨一個.css文件-->
<style type="text/css">
html{
width:100%;
background:#c8e5ee;
}
</style>
<!--內部樣式,直接寫在html文檔的頭部里-->
<p style="color:red; padding-left:50px;">我是紅色字體哦~</p>
<!--內嵌樣式,直接跟著他要作用於的標簽里-->


9行為是由事件和動作組成的。什麼是事件?什麼是動作?它們之間有什麼關系?試以一個行為為例說明


    這個不想理你,你想知知道的太寬了,現在和你說了你也 理解不了。

    這個事件的問題你還是放在以後有時間在考慮了解吧,太簡單的沒用,難的你現在也做不到。以後你要是想學JS的時候用到的會比較多。

    不過現在JS很多開源代碼給你抄,你不會也沒關系,也可以做出你想要的效果。


不要一下想把所以的東西都學會這是不科學的,o(╯□╰)o    我也是學了有1年不到才開始不會出現兼容問題的。

3、網站設計需要什麼基礎?

首先明白:
網站設計是設計師
網站製作是苦力工
網站設計不同於網站製作,要有色彩方面的知識。設計主要是美工方面,得懂得網站重構方面的知識,對網頁的製作只需要了解就行了。最好懂得網站標準的知識,比如第三代標准div+css等方向。
軟體:photoshop、flash、dreamweaver以及3DMAX等,這些是基礎的。
樓上說的ASP、PHP就設計到網站製作編程方面,那不是設計師的范疇。

4、網頁設計的基本原則是什麼?

審美原則
好的創意必須具有審美性。一種創意如果不能給瀏覽者以好的審美感受,就不會產生好的效果。創意的審美原則要求所設計的內容健康、生動、符合人們審美觀念。
目標原則

創意自身必須與創意目標相吻合,創意必須能夠反映主題、表現主題。網頁設計必須具有明確地目標性。網頁設計的目的是為了更好的體現網站內容。
系列原則
所謂系列化就是在具有同一設計要素或同一造型、同一風格或同一色彩、同一格局等的基礎上進行連續的發展變化,既有重復的變遷,又有漸變的規律。從視覺心理上來說,人們厭棄單調劃一的形式,追求變化,連續系列的獨特性會令人們耳目一新。系列原則也符合「寓多樣於統一之中」這一形式美的基本法則,組成連續系列的每一幅界面雖然是一個獨立的單元,但由於整體結構內容的相關性,風格基調的一致性,使網站在變化中求統一,形成多樣統一、對比而又和諧的藝術效果。

5、要學習網站設計需要有什麼基礎

如果你要學習 靜態網頁 用dreamweaver
只要學習 CSS+Div HTML 語言 就行
當然圖片素材 flash可以網上找

如果你要學習 動態網站 那用的東西就非常多啦,而且很難
最好能有老師指導,要不自己學習估計 相當費勁,

我們現在就在學習動態網站,用的是C#語言(最好有C語言基本功)
軟體用的是 Microsoft Visual Studio 2008

現在網上運行的網站基本都是動態的,靜態的只是幫初學者認識熟悉網站製作,網站方面 沒什麼大的發展,網上代碼下載網特別多,
而且網站很廉價,如有不是愛好學習的話,建議學習美工~

6、網頁製作設計的基礎部分包括哪些?

網頁切圖 選學
網頁設計的步驟是策劃-作圖-靜態頁-編程-測試-發布-維護-改版重構 循環
切圖是一個技術也是一種藝術,不少美工都具有切圖的功底!不過,也不是所有的網頁都需要切圖!因此,切圖的選學的,而且,沒有追求的話,切的亂七八糟也沒關系!

html標簽的用法 必學
這個是必學的,畢竟頁面還是html標簽組成的!你要熟知大部分標簽的用法!這個可以去w3school學習進階!

css 樣式和樣式表 必學
css是目前網頁設計中的主要角色!也是程序和美工的區別之一!css可以簡單理解為美化!你可以使用他設置顏色,大小,邊距,行距,字體,位置等等等....

瀏覽器兼容 選學
html頁面最終要在瀏覽器中運行和查看!但是,不是所有的瀏覽器都遵循同一個標准,因此,你的頁面在每個瀏覽器底下或多或少的都有一些不同!你要學會找到問題,解決問題!最大限度的保證在每個瀏覽器下看起來都差不多!

javascript & jQuery 選學
JS和JQ是兩個不同的東西,js在網頁中的主要作用就是網頁「特效」了。比如滑動,展開收起,幻燈片等等~~團隊細分中,html頁面是由前端設計師製作的,網頁設計師僅僅負責效果圖的製作!但是,現在的網頁設計師明顯的需要具備多門「手藝」才能混,js是其中之一!

Action script 選學
AS是flash中的常用到的一種語言!主要是製作全flash網站或者flash+xml交互模塊! 如flash幻燈片,圖表等~

學習建議:
目前的大部分html教程都是垃圾教程,是網站為了賺取流量到處復制粘貼的千篇一律的扯淡字元串(還不能算是文章,只能算是一個字一個字組成的頁面,因為連發布者都不知道裡面寫了什麼)!個人建議,你最好下載幾個chm格式的手冊,如html手冊,css手冊等~備用查詢,作為字典!我學習的時候是讀的《Head First xHtml + css》,一周入門html+css!不過,學習肯定離不開勤學苦練!以下是我建議的學習方法:
1.認識標簽,學會是使用h標題,p段落,ul列表,div元素,img插入,a鏈接
2.學會添加標簽屬性 class=「name」,id=「name」,table的相關屬性
3.學會引入外部文件,<link /> <script src=""></script> <img src="" />
4.一個完整簡單的html,嚴格按照html的結構製作一個純html標簽組成的頁面,無樣式,能區別出標題,列表,鏈接,段落
5.css學習入門:字型大小,邊框,float浮動,clear清除浮動,background背景
6.頁面模塊劃分:header,mian-body,footer 頭部,內容,頁腳
7.頁面布局細分:三列,兩列,四列,多列,【國字形、常字形】
8.html,css分離使用,在html引入外部css樣式表
9.圖片美化頁面

大致以上幾點,循序漸進!而且,盡量手寫代碼,使用記事本即可~因為,你要不斷的去認識和書寫一些常用的標簽和拼寫!【實際工作中,編輯軟體都有代碼提示功能,那僅僅是為了加速工作效率,但並不適合新手使用,否則,就懶惰了!不利於記憶和理解!】

7、網頁設計基礎教程

http://tech.163.com/special/w/000915SQ/webmediatech.html
菜鳥教程,懂點電腦就可以看懂

與網站設計基礎相關的知識