網(wǎng)站設(shè)計(jì)的幾個(gè)技巧,讓你的網(wǎng)站與眾不同

網(wǎng)站建設(shè)包括網(wǎng)站策劃、網(wǎng)頁(yè)設(shè)計(jì)、網(wǎng)站推廣、網(wǎng)站內(nèi)容整理、網(wǎng)站優(yōu)化技術(shù)、網(wǎng)站改版等。網(wǎng)站建設(shè)的前期準(zhǔn)備包括了前期網(wǎng)站定位、內(nèi)容差異化、頁(yè)面溝通等戰(zhàn)略性調(diào)研，這些確立后，再去注冊(cè)域名、租用空間、網(wǎng)站風(fēng)格設(shè)計(jì)、網(wǎng)站代碼制作五個(gè)部分，網(wǎng)站建設(shè)過(guò)程需要網(wǎng)站策劃人員、美術(shù)設(shè)計(jì)人員、WEB程序員共同完成。網(wǎng)站建設(shè)中最重要的環(huán)節(jié)之一就是網(wǎng)頁(yè)設(shè)計(jì)，網(wǎng)站網(wǎng)頁(yè)設(shè)計(jì)是企業(yè)展示自身形象、發(fā)布產(chǎn)品信息、聯(lián)系網(wǎng)上客戶的新平臺(tái)、新天地，進(jìn)而可以通過(guò)電子商務(wù)開(kāi)拓新的市場(chǎng)，以極少的投入獲得極大的收益和利潤(rùn)。
Website construction including web site planning, web design, website promotion, website content arrangement, website optimization technology, the website version, etc. The website of the preparation includes the website localization, the content page communication differentiation, strategic research, these established, then go to register a domain name, to rent space, WEB design, website code style made five parts, website construction process need WEB site planning personnel, art designers, and WEB programmer to complete. Website construction is one of the most important part of a web page design, website web design is the enterprise show their image, release information, contact clients online platform, new new world, and can be through the electronic commerce to develop new markets, with very little input get great revenues and profits.
網(wǎng)站建設(shè)前期準(zhǔn)備工作相當(dāng)重要，這決定你建站的目的，以及日后維護(hù)網(wǎng)站，讓你的網(wǎng)站發(fā)揮作用等是相當(dāng)?shù)闹匾?。網(wǎng)站建設(shè)中網(wǎng)頁(yè)設(shè)計(jì)的排版經(jīng)常被忽略，其實(shí)這樣做是非常不明智的，因?yàn)樽⒅鼐W(wǎng)頁(yè)排版確實(shí)可以提高你的網(wǎng)頁(yè)設(shè)計(jì)水平和可讀性。下面，創(chuàng)新互聯(lián)列出了若干非常有用的排版技巧讓你的網(wǎng)站建設(shè)看起來(lái)更好。
Website construction preparation work is quite important, this decision to the purpose of building your site, and later when maintenance of website, make your site function etc is pretty important. Website construction of web design typographical often by oversight, in fact it is very unwise, because pay attention to web page layout can really improve your web page design level and readability. Below, shang pin China outlined some very useful typesetting skills make you website construction is looks better.
一、糾正行高(Correct line high)
最常見(jiàn)的網(wǎng)頁(yè)布局錯(cuò)誤之一是定義了不正確的行高。行高是定義一行文本的高度，所以我們必須按照文本字體大小來(lái)設(shè)定行高。
The most common web page layout error is defined not one of the right line high. Do high definition is a line of text height, so we must, in accordance with the text font size to set the high line.
一般來(lái)說(shuō)，在設(shè)置文本行高的時(shí)候，我經(jīng)常在字體大小的基礎(chǔ)上加上7個(gè)像素(對(duì)12-17像素的字體而言)
Generally speaking, set text line in high, I often on the basis of the font size and seven pixels (to 12-17 pixels font speaking)
二、文字編排(Font layout)
在網(wǎng)頁(yè)設(shè)計(jì)中，字體的處理與顏色、版式、圖形化等其他設(shè)計(jì)元素的處理一樣非常關(guān)鍵。
In web design, processing and color, the text format, graphical and other design element processing is critical.
1.文字圖形化(Text graphical)
文字圖形化就是將文字用圖片的形式來(lái)表現(xiàn)，這種形式在頁(yè)面的子欄目里面最為常用，因?yàn)樗哂型怀?，同時(shí)又美化了頁(yè)面，使頁(yè)面更加人性化加強(qiáng)了視覺(jué)效果。是文字無(wú)法達(dá)到的。對(duì)于通用性的網(wǎng)站弊端就是擴(kuò)展性不強(qiáng)。
Text graphical words with the picture is the form of performance, the form of the page son columns are the most commonly used inside, because it has the outstanding, and beautify the page, to make the page more human to strengthen the visual effect. Is the text can be. For general website malpractice is not strong scalability.
2.強(qiáng)調(diào)文字(Emphasize text)
如果將個(gè)別文字作為頁(yè)面的訴求重點(diǎn)，則可以通過(guò)加粗、加下劃線、加大號(hào)字體、加指示性符號(hào)、傾斜字體、改變字體顏色等手段有意識(shí)地強(qiáng)化文字的視覺(jué)效果，使其在頁(yè)面整體中顯得出眾而奪目。這些方法實(shí)際上都是運(yùn)用了對(duì)比的法則。如果在更新頻率低的情況下也可以使用文字圖形化。
If the individual text as the appeals of the page key, can add thick, underlined by and increase the font, and no telltale sign, the tilt font, font color, change means consciously strengthen the visual effect of the text, so that in the whole page is outstanding and brilliant. These methods are, in effect, is to use the law of contrast. If in the update frequency low can also use graphical text.
3.不要使用過(guò)多的字體(Don't use too much font)
為了確?？勺x性和專業(yè)性，你的網(wǎng)頁(yè)上不應(yīng)該使用超過(guò)3種字體。使用過(guò)多的字體會(huì)干擾你的用戶而且讓你的網(wǎng)站看起 來(lái)很亂。相反，較少的字體讓你的網(wǎng)站顯得干凈易讀。你可以標(biāo)題使用一種字體，正文使用一種字體，最后 logo或副標(biāo)題使用另外的字體。
In order to ensure a readable and professional, your web site should not use more than 3 fonts. The excessive use of words experience interfere with your users and make your site look up to is a mess. Instead, less font let your site appears clean and easy to read. You can use a font title, the text using a font, finally logo or subtitles use another font.
三、網(wǎng)站配色(Website match colors)
1.用一種色彩。這里是指先選定一種色彩，然后調(diào)整透明度或者飽和度，(說(shuō)得通俗些就是將色彩變淡或則加深)，產(chǎn)生新的色彩，用于網(wǎng)頁(yè)。這樣的頁(yè)面看起來(lái)色彩統(tǒng)一，有層次感。
With a color. This refers to the selected a kind of color first, and then set the transparency or saturation, (say some is popular color becomes weak or deepen), create new colors, used in web pages. This page looks colour united, have administrative levels feeling.
2.用兩種色彩。先選定一種色彩，然后選擇它的對(duì)比色(在Photoshop里按ctrl+shift+I)再進(jìn)行微小的調(diào)整。整個(gè)頁(yè)面色彩豐富但不花稍。
With two kinds of colour. First selected a colour, and then select it contrast color (in Photoshop in press CTRL + shift + I) to a tiny adjustment. The entire page color is rich but not take a little.
3.用一個(gè)色系。簡(jiǎn)單的說(shuō)就是用一個(gè)感覺(jué)的色彩，例如淡藍(lán)，淡黃，淡綠;或者土黃，土灰，土藍(lán)。也就是在同一色系里面采用不同的顏色使網(wǎng)頁(yè)增加色彩，而又不花，色調(diào)統(tǒng)一。這種配色方法在網(wǎng)站設(shè)計(jì)種最為常用。
With a color is. Simple said is to use a sense of color, such as light blue, yellow, green, Or taupe, the ash, the blue. It is in the same color fastens with different color, make the inside pages increase color, and not spend, tonal and unity. This kind of color matching method in the web design most commonly used.
4.灰色在網(wǎng)頁(yè)設(shè)計(jì)中又稱為“萬(wàn)能色”，其特點(diǎn)是可以和任何顏色搭配，在使用時(shí)把握量避免網(wǎng)頁(yè)變灰。 在網(wǎng)頁(yè)配色中，盡量控制在三種色彩以內(nèi)，以避免網(wǎng)頁(yè)花、亂、沒(méi)有主色的顯現(xiàn)。背景和前文的對(duì)比盡量要大，(絕對(duì)不要用花紋繁復(fù)的圖案作背景)，以便突出主要文字內(nèi)容。
Gray in web design, also known as "universal color", its features and any color collocation, when use of web gray grasp to avoid. In the web page color matching, try to control in the three kinds of colour within, to avoid a web page, disorderly and no flowers the manifestation of the color. Background and above the contrast of the big as far as possible, (never use decorative pattern for the design of heavy and complicated background), in order to highlight the main text.
四、按級(jí)別來(lái)排列標(biāo)題和文本(According to level to arrange title and text)
為了增加可讀性，給標(biāo)題、介紹段落和常規(guī)文本創(chuàng)建標(biāo)簽層級(jí)是很重要的，這樣你的用戶可以看清你的文章結(jié)構(gòu)并能很 快的找到他們感興趣的部分。
In order to increase readability, to the title, introduces conventional text paragraphs and create label level is very important, so your users can see your essay structure and can very quick find their interest in the parts.
五、關(guān)注對(duì)比(Attention contrast)
即使你的網(wǎng)站有很好的排版了，另一個(gè)需要注意的是對(duì)比。如果你的頁(yè)面背景是中灰色(#999999)，那么不要使用深灰色(#333333)的文本，否則你的內(nèi)容很難看清，尤其是對(duì)一些年紀(jì)比較大的或視力差的人。
Even if your site has very good typesetting, another note that the contrast. If your pages in the background is grey (# 999999), so do not use dark grey (# 333333) of text, or your content it becomes difficult to see, especially for some older or poor eyesight.
總之，除非你的網(wǎng)站是關(guān)于黑客、黑帽seo或哥特?fù)u滾的，不然你應(yīng)該使用淺色背景和深色字體來(lái)保證清晰的對(duì)比度增加你網(wǎng)站的可讀性。
In short, unless your site is about hackers, black hat seo or gothic rock, otherwise you should use light color and brunet background to ensure clear contrast font increase the readability of your web site.
六、糾正標(biāo)題margin值(Correct title margin values)
另外一個(gè)常見(jiàn)的錯(cuò)誤是標(biāo)題周圍不正確的margin值。標(biāo)題其實(shí)是與它下面的段落是相關(guān)聯(lián)的，而不僅僅是兩個(gè)段落的分 割符。這就是為什么標(biāo)題的margin-top比margin-bottom要寬。
Another common mistake is not the right margin around title value. Title is to be with it the following paragraph is associated, and not just two paragraph points cut operators. This is why of the title of the margin-top margin-bottom than to wide.
七、創(chuàng)建樣式庫(kù)(Create style library)
讓你的網(wǎng)站產(chǎn)生視覺(jué)震撼的一個(gè)簡(jiǎn)單高效的方法是給特殊的頁(yè)面創(chuàng)建特殊的樣式。例如，創(chuàng)建一個(gè).warning的CSS類來(lái)向 你的用戶顯示“警告”。
Let your website produces visual shock of a simple and efficient way is to give the special page create special style. For example, create a. Warning CSS class to your user shows "warning".
八、正確使用標(biāo)點(diǎn)符號(hào)(The correct use of punctuation marks)
如果你想提升你的排版水平不容忽視的一點(diǎn)是正確使用標(biāo)點(diǎn)符號(hào)。例如，引號(hào)經(jīng)常用雙撇符號(hào)代替(譯者注：我想作者要表達(dá)的意思應(yīng)該是全角符號(hào)和半角符號(hào)的區(qū)別，就像中文的引號(hào)和英文的引號(hào)不同一樣)。
If you want to improve your typesetting level nots allow to ignore point is right use of punctuation marks. For example, quotes often use double leave symbol instead of (translators note: I think the author want to express meaning should be the Angle symbols and half horn symbols differ, as Chinese and English quotes quotes different).
注意區(qū)分雙撇符號(hào)：
Distinguish double leave symbols
同樣的文本，使用引號(hào)：
The same text, use quotation marks:
這樣更好，不是嗎?如果你是WordPress用戶，你可能很樂(lè)意知道你最喜歡的博客平臺(tái)自動(dòng)將雙撇號(hào)轉(zhuǎn)換為智能的引號(hào) 。否則，你得使用HTML字符編碼。如下所示：
This is better, isn't it? If you are WordPress user, you can be very happy to know you like most blog platform to be automatic will double apostrophe conversion for intelligence quotation marks. Otherwise, you have to use HTML character encoding. Shown below:
9、代碼部分使用等寬字體(The code to use typewriter fonts)
如果你是一位開(kāi)發(fā)者(就像大部分讀這篇博客的人)你可能想貼一些代碼在你的博客里。如果是這樣，請(qǐng)使用等寬字體。 那么，什么是等寬字體?它就是字母和字符占相同水平寬度的字體。
If you are a developer (like most read this blog) you may want to post some code in your blog. If so, please use the typewriter fonts. So, what is the width of font? It is the same level of letters and characters of the width of the font.
那么在網(wǎng)站的代碼段你應(yīng)該使用哪種字體呢? 到目前為止 Courier字體是最流行的，那么嘗試一下最新的一些字體像 Consolas或 Monaco怎么樣呢?那你一定要看看這里咯。
So in the website of the code segment you should use which kinds of fonts? So far Courier font is the most popular, then try the latest some font like Consolas or Monaco? You must see here anymore.
總結(jié)(summary)
一個(gè)網(wǎng)站的成功與否與建站建設(shè)前的規(guī)劃有著極為重要的關(guān)系。在建立網(wǎng)站前應(yīng)明確網(wǎng)站建設(shè)的目的，確定網(wǎng)站的功能，確定網(wǎng)站規(guī)模、投入費(fèi)用，進(jìn)行必要的市場(chǎng)分析等。只有詳細(xì)的規(guī)劃，才能避免在網(wǎng)站建設(shè)中出現(xiàn)的很多問(wèn)題，使網(wǎng)站建設(shè)能順利進(jìn)行。 以上創(chuàng)新互聯(lián)幾點(diǎn)網(wǎng)站建設(shè)的建議希望能對(duì)大家提高網(wǎng)站建設(shè)中網(wǎng)頁(yè)設(shè)計(jì)起到幫助。
The success of a web site before construction and planning has a very important relationship. In a web site on the website of the former should be clear purpose, determine the functionality of the site, to determine the scale of investment cost, web site, make the necessary market analysis, etc. Only the detailed planning, to avoid in the website construction of many of the problems that appear, make the website construction can be carried out smoothly. Above is the website of the product China some Suggestions in hopes of us improve website construction of web design help.
本文發(fā)布于成都網(wǎng)站建設(shè)公司創(chuàng)新互聯(lián)http://www.muchs.cn/