网站设计必需运用的5个方法 The web design world is filled with excitement and experience, creativity and skill. Often, experienced web designers utilize a set of solid, proven techniques that others may not notice. Let's take a look at a few of these techniques and how you can implement them into your own site quickly and easily.
Often, a bony, lanky black spider will crawl around your web site, wiggle its little feet in excitement, gather up your e-mail address and store it near its pinchers. Then, when it returns to its master, it will religiously add all gathered data to a huge nest of e-mail addresses, then used as bait to sell to marketing firms.
Those little black spiders are software utilities that slither underneath your page's surface, at underlying HTML code, specifically for a standard formatted e-mail address (name@domain.com). This can be the most effective method for gathering e-mail addresses and needs to be thwarted. There are a number of techniques web designers can implement to protect against these creepy crawly little annoyances.
Of the many, here are three that can work quite well. 下面介绍三种最有效的方法。
1. Use HTML symbols. To disable spiders from grabbing your e-mail address, some formatting modifications need to be made to fool the software. All e-mail addresses use the at symbol (@), and spiders are taught to look for them. HTML symbols are written directly into the HTML code, but are interpreted by the browser into their actual meaning. The HTML symbol for the @ sign is @. So, how do we implement something like this? <a href="mailto:name@domain.com">
All we do is replace the @ sign with the HTML symbol that represents it. This method, however, is sometimes caught by more sophisticated software. Although most are not quite as advanced, they do exist. How do we surpass this hurdle? Let's try some JavaScript.
2. Using JavaScript, we will simply break up the e-mail address into four different sections, 1: name, 2: the @ sign, 3: domain, 4: extension. Here is a simple implementation of JavaScript to perform this action.
运用JavaScript。我们把电子邮件地址简单分成四部分:1:邮件名, 2:@ 符号, 3:域名,4:扩展名。下面就是一个运用JavaScript的简单例子。 <script type="text/javascript"> name ="you" domain ="domain" extension =".net" document.write('<a href="mailto:' + name + '@' + domain + extension +' " ' +' >e-mail link here '); </script>
The above code is fairly self-explanatory. We define three variables, name, domain and extension, and simply concatenate those variables within a document.write statement to the browser. Notice we use HTML's anchor tags within the write statement so your browser will interpret the e-mail link correctly.
There is another problem with using this method...can you figure it out? JavaScript is client-side, which means although spiders might not be able to interpret your e-mail address, browsers with JavaScript capabilities turned off will not either, meaning your e-mail address will not be displayed to the user.
How do we fix this problem? Can we get away with refusing to display any e-mail address? Yes, we can, but we still must provide a way for the user to contact us. The solution is a rather simple email form.
3. The third might be the only full proof method of protecting yourself against spam spiders, and that is simply refusing to display your e-mail address. Instead, if your server supports server-side processing, like Perl, ASP, Cold Fusion or PHP, simply design a feedback form, and call a server-side script to process the data behind the scenes. Sorry boys, spiders can't dig quite that deep.
I am a huge advocate of PHP, but choose whatever language that your host supports. Please note that if your server does not support any server-side programming language, you are out of luck in this regard. Chose between the two aforementioned methods, and stick with it.
Our web sites are nothing without content, and most content is comprised of simple text. Many web designers neglect to pay attention to their topography, and it shows. Proper topography varies based on where the text is and what purpose it serves. Although there are no rules etched in stone, there are a few general techniques that should be followed. Although some of these tips may seem elementary, I find many of them are not followed.
Clearly, headings should be larger, by 1 or 2 font sizes, than your body text. You may consider bold, but be cognizant of the letter width. Arial Black, for example, may create letters too fat for your taste. When using colors, be sure the colors contrast well with the background color of your site. Black and dark gray do not contrast well, while black and white (or light gray) work quite well. Sometimes, even a simple color change can create useful headings.
Also be sure to cascade your headings. A main heading, for example, would be larger than subheadings. This effect creates a sense of emphasis and flow to the information.
标题要有层次感。比如说,主标题的字号要比副标题大,这样会创造强调效果,引导读者继续阅读文章。
Do not italicize your headings. Italics are meant to underscore particular content, but since the text is a heading and of larger size anyway, italics are redundant and often make the text difficult to read.
The default is Times New Roman, which works fine, but many think it is boring. I have experimented with Arial, Georgia and Verdana, and have found Verdana the most readable font face available. This is a personal preference, but fonts should be restricted to the above four to ensure compatibility between all users of your web site. If your user's browser does not support your font choice, their browser will revert to its default. Since browsers have increased support for CSS, or Cascading Style Sheets, whenever possible, use CSS to define your fonts, rather than HTML's <font> tag. Also, be sure to keep your font sizes large enough for visitors of all ages and eyesights.
默认的Times New Roman字体,效果不错,但很多用户并不喜欢者众字体。我利用Arial、 Georgia 、Verdana做过试验,发现Verdana是最容易阅读的字体。当然,字体的选择与个人喜好有关,但应该严格限制为以上四种字体,保证网站用户的兼容性。如果用户浏览器不支持这种字体,就会将其转换为默认认字。由于浏览器已经支持CSS,如果可能,可以利用CSS定义字体,效果会比使用HTML中的<font>标签好。同时,字号要足够大,保证各个年龄段以及各种视力水平的人,都可以浏览。 Stress Styles 强调
Avoid using all capital letters within your text, as it makes it difficult to read and implies you are shouting at the reader.
避免在文章中使用大写字母。否则用户会因为难以阅读文章,而对网站感到厌烦。
To stress words within your body text, decide on a format and stick with it. Some choose bold, while others choose italics or underline. My personal favorite is italics, but any of these can work well. Be careful when using underline, however, as it can be mistaken for a link. In addition, do not overuse these stress styles.
Entire body text should not be bold. Bold, like italics, is used to emphasis words, and usually an entire body of copy should speak for itself in regularly styled text. I like to use CSS to space my body text out
正文部分不应该出现粗体。粗体与斜体都是强调词语的方法。通常,正文应该设置正常字体,我喜欢用CSS安排这些内容。 3. Metatags make your site search engine friendly 3. Meta标签利于搜索引擎优化
Metatags are what search engines use to display your site when a user searches for keywords within a search engine. Usually, web designers include at least three metatags, title, description and keywords.
A great thing about metatags is they are easy to implement, directly within the <head> and </head> tags. Let's take a look at what the three aforementioned metatags look like.
You can copy and paste the above three lines of code and place them within your HTML source code; simply type in your web site's title, a description (or summary) of your web site, and keywords, usually separated by commas. Then, simply submit your web site to as many search engines as you can get your hands on, and watch your site's hits improve.
Always, always provide some method of communication for your users. Many web developers will include e-mail links and feedback forms on their site. Doing this tells your users that you care about what they think of your site, and also suggests your encouragement for them to e-mail you are share.
Be sure, then, to check your e-mail often. There is nothing more frustrating then having to wait a week or more for someone to respond to your e-mail. Checking your e-mail ususally takes 2 minutes...do it as much as you can and keep your web visitors happy.
If your server supports a server-side language, like Perl, ASP, Cold Fusion or PHP, either design one or head off to a script repository and perform a simple search. Listed below are a few resources offering free scripts:
5. Design with the little guy in mind 5. 不要忽视网站任何用户
In this day and age, all we think about are the bells and whistles, especially when it comes to slick new web designs. Not only are these new technologies often misused, it dramatically slows the speed of your site down, especially large animated .gifs and complex Flash programs.
Although there are more broadband users than ever, never design specifically for them. There are still 28.8 users out there, and designing your site so waiting time exceeds 10 seconds will send those users to a competitor's site.
Web designers need to keep their sites simple. Far too many, especially newer web designers, have fixated their eyes upon the gold when they have not yet mastered the silver. Only use graphics where you need them. Never use .gif animations unless absolutely, unavoidably necessary, which is rare. Additionally, do not use large, intricate backgrounds on your pages, as they hinder the readability of your text and increase load time.
Design with the end user in mind. Assume the user is connected through a 28.8 modem with a 15" monitor at 800x600 resolution using Netscape. Trust me, those visitors will love you (and support you) for it.
We have looked at 5 tips every designer needs to keep in mind when doing the work they love. Although communication is essential, steps can be taken to decrease the amount of spam in your little brown mailbox.
网站设计者工作时,应遵循以上5条建议。尽管交流很重要,但我们可以采取措施减少邮箱中的垃圾邮件数量。
Designers also must make sure their topography is easily readable and logically designed. Moreover, search engine friendly sites are often popular sites, and those who design for the little guy greatly improve compatibility with all potential users.