热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

网站设计的50条建议

Tipstobrandyourwebsite宣传网站的建议Includeyourlogoinallpages.Positionitatthetopleftoreachpage.确

Tips to brand your website
宣传网站的建议

· Include your logo in all pages. Position it at the top left or each page.

确保每张网页的左上方出现logo。

· Complement your logo with a tagline or catchy sentence that summarizes your business purpose. For example "Always low prices" is the tagline for Wal-Mart.

logo旁边出现标语或者是介绍企业特点的语言,比如说,“天天平价”是沃尔玛的标语。

· Create a favicon. A favicon is that small graphic that appears next to the URL in the address bar.

创建favicon。Favicon就是出现在地址栏URL旁边的图形。

· Have a consistent look and feel in all your pages. Use a color scheme and layout that are clearly recognized across your site.

所有网页外观设计要一致。网站的颜色、布局要一致。

· Have an About Us section, that includes all relevant information about you and your business.

网站设置“联系我们”板块,包含所有关于你与公司的相关信息。

· Include a copyright statement at the bottom of each page.

网页底部包含版权信息。

Tips on website navigation

网站导航系统

· Design your pages to load in less than 10 seconds (50Kb maximum size, including pictures).

网页下载时间控制在10秒之内(50kb,包括图片)。

· Group your navigational options in relevant categories.

相关的导航内容放在一起。

· Use common names for your menu options: Home, About Us, Contact Us, Help, Products. Avoid "clever" or "trendy" alternatives.

菜单栏选项使用常用的名称:主页,关于我们,联系我们,帮助,产品,避免出现时尚、流行的选项。

· If your site uses Flash, provide also an HTML version for users who prefer a less fancy, faster site.

如果网站利用Flash,确保出现HTML版本,有些用户不喜欢眩目的网站。

· Provide simple text navigation links at the bottom of long pages, so users don't need to scroll back up.

网页底部出现简单的文本链接,这样用户就不必退回网页顶部。

· Link your logo to your homepage, except in the homepage itself. Put a link to your homepage on all your internal pages.

logo与主页进行链接(除去主页logo之外),另外所有二级页面要与主页进行链接。

· Display a "breadcrumb trail"; it is basically the path from the homepage to the page where you are. A breadcrumb trail looks like this: Home > Section > Sub-Section > Page, and it greatly facilitates navigation.

展示网站浏览路线,就是指从主页进入各级页面的路径,比如说,主页 > 主菜单>次级菜单 > 二级页面。这样用户可以方便地操作网站。

· If your site is too big, provide Search capabilities. Include a search box in the upper right corner of your homepage, and a link to a Search page from your interior pages. Freefind ( ) offers you a free and powerful search engine for your site.

如果网站内容太多,你可以提供站内搜索。网站主页的右上方可以设计搜索框,或者提供搜索页面,以及内部页面与搜索页面的链接。网站需要具备功能强大、免费的搜索引擎。

· Set your search box to search your site, not to search the web.

搜索框用来搜索网站内容,而不是所有网络内容。

· Create a custom error page that displays a simple site map with links to the main sections of your site. That way, you will not lose visitors that have followed a bad link to your site or who have misspelled your URL.

创建常用的错误页面,页面中呈现站点地图,以及与网站主要内容的链接。这样,网站就不会流失链接无效或者URL输入错误的访问者。

Tips on Layout and Content Presentation
布局与内容的设计技巧

· Save the top of your page for your most important content. Remember: good content must flow to the top.

网页顶部的内容应该是最重要的内容,请记住:好内容必须放置在顶部。

· Lay out your page with tables, and set the width in percentage terms instead of a fixed number of pixels. That way, your page will always fit the screen, without the need to scroll horizontally.

网页可以用表格布局,表格宽度用百分比设定,避免利用固定像素数字。这样网页会永远与显示屏相适应,不会出现水平滚动条。

· Optimize your page to be viewed best at 800x600 (the most popular resolution at the time of this writing).

优化网页,确保在800x600(最常用)分辨率状态下,网页呈现最佳状态。

· Use high contrast for the body of your page: black text on white background, or white text on black background work best.

网页文本内容颜色对比要明显:黑色文本搭配白色背景,或者白色文本搭配黑色背景。

· Don't use too many different fonts in one page. Also, avoid using small serif fonts (like Times Roman): they are difficult to read from a computer screen. Verdana is the most web-friendly font, since it is wide, clean and easy to read.

网页避免出现太多字体,同时避免使用小字号的serif字体(例如Times Roman),这样的字体出现在电脑显示屏中,不便于阅读。Verdana是一种最适合网站的字体,因为它宽度大、整洁、易于阅读。

· Avoid long blocks of text. Use tools that facilitate scanability, like bullets, subtitles, highlighted keywords, hyperlinks, etc.

避免出现大段文字。利用有助于用户浏览网站的工具,比如,点式列表、副标题、关键词以及超链接等等。

· Avoid amateurish features like: numeric page counters, wholesale use of exclamation points, all caps, center justified blocks of text, excessive animated gifs, busy backgrounds, etc.

网站避免出现以下特征:数字计数器、大量感叹词、全部大写字母、全部文本内容居中、大量动画图片、复杂的背景等等。

· Don't use pop-up windows. They distract your visitors and are immediately dismissed as ads.

避免使用弹出框。弹出框类似于广告,会分散访问者的注意力。

· Test your site so that it looks good in different browsers and resolutions.

在不同的浏览器以及分辨率状态下,测试网站。

Tips on Writing for the Web
网站文本内容设计方法

· Write in layman's terms so that everybody can understand your content, unless you're running a technical site for technical people.

避免出现专业术语,保证所有浏览着理解网站内容,除非网站是为技术人员提供专业技术服务的网站。

· Reading from a screen is painful: use 50% less words than you would use on print.

阅读电脑显示器中的文字确实有一定难度,所以网站文字要少于印刷品文字的50%。

· If a page is too long, break it into several pages and link to them.

如果网页太长,就需要把它拆成几张网页,并且与这些网页进行链接。

· Don't use font sizes smaller than 10pt. for the body of your page. Specify your fonts in percentage terms instead of pixels, to let users set their own size preferences using their browser's text view options.

网页文本字号不小于10pt。利用百分比指定网站字体,而避免利用像素,这样用户可以根据自己的喜好,利用浏览器文本选项,确定字号。

· Use a spell checker. Spelling mistakes are embarrassing and hurt credibility.

利用拼写检查程序。网站避免出现尴尬的拼写错误,这样会降低网站信誉度。

Tips to Know Your Customers
了解网站消费者的方法

· Ask for feedback: include a feedback form in your Contact Us page.

征求反馈信息:“联系我们”的网页中出现反馈表格。

· Publish an ezine and include a subscription form in your homepage. Give your customers valuable information and encourage them to contact you.

出版电子杂志,网站主页出现订阅方式。为用户提供有价值信息,鼓励他们与你联系。

· Include polls and other tools to gather market intelligence.

利用投票系统以及其它工具收集营销资料。

Tips on Linking
链接方法

· Make your links descriptive. They should indicate what the user will be linking to, as opposed to just saying "click here".

链接应该是描述性的,应该说明用户链接的地址,而不要仅仅出现“点击这儿”。

· Don't underline anything that is not a link.

非链接内容,不能出现下划线。

· Underline your links and use a consistent color for them across your site (preferably blue).

网站链接内容应该出现下划线,并且网站所有链接内容的下划线颜色应该相同。

· Use a different color for visited links, so that your visitors know where they've been (preferably purple or a more subdued tone of the unvisited links color).

已访问的链接颜色应该不同,这样访问者可以了解已经浏览过哪些内容(未访问的链接最好使用紫色或者其它比较柔和的颜色),

· When linking to a non-HTML file, such as Excel, Word or Acrobat, make it evident, by including a small icon next to the link.

当与Excel、Word、Acrobat等非HTML文件链接时,可以在链接附近增加一个小图标,这样更明显。

· Don't link to "under construction" pages.

避免出现与“在建中”网页的链接。

· Make sure that your links work and that you don't have broken links. There are free online tools that can help you with this.

确保链接的有效性,避免出现无效链接,这时你可以利用网上的免费工具。

· If you use graphic links, don't forget to use the ALT attribute. The ALT attribute should describe what are you linking to.

运用图片链接时,使用ALT标签。ALT标签应该说明你所链接的内容。

Tips on how to use graphics
利用图片的方法

· Optimize your graphics. Use only .gif and .jpg formats. Make your image files as small as possible while maintaining acceptable quality. Use a free online graphics optimization tool.

优化图片。图片最好只利用.gif与.jpg格式,在保证图片质量前提下,尽量压缩文本。你可以使用网上提供的免费图片优化工具。

· Use thumbnails (miniature versions of a picture) and make them clickable to the actual size picture.

使用图片的缩小版本,并且使用户可以与它们的原版本链接。

· Avoid graphics that look like ads. People ignore them.

避免出现与广告外形相似的图片,网站访问者会忽视这些图片。

· Use the ALT attribute on pictures, even the image is not a link. It helps users with disabilities and people who have turned off graphics.

利用图片的ALT属性,即使图片不可以链接。这样有助于不喜欢图片的用户浏览网站。

Tips to optimize your site for the search engines:
网站的搜索引擎优化

· Create short, descriptive page titles, to entice search engine users to click on your links.

创建简短、描述性的网页标题,促使搜索引擎用户点击网站链接。

· Create a site map containing all your pages, and link to it directly from your homepage. Search engine robots will follow the link to your site map and will most likely add all your pages to the index.

创建包含所有网页的站点地图,并且与主页直接进行链接。搜索引擎机器人会根据链接浏览站点地图,把所有网页添加到索引中。

· Decide what the two or three main keywords are for each page (the words you believe search engine users will type to find your page) and repeat them often in your page title, description meta tag and page body.

确定每张网页的2-3个关键词(你认为用户会键入搜索引擎,寻找网页的词语),并且确保关键词经常出现在网页标题、叙述meta标签以及网页文字内容中。

· Create a Links page and call it Resources. In it, place links to those sites that have agreed to place a reciprocal link to your page. The more inbound links you have from quality sites with a topic related to your site, the better your site will rank with the search engines.

创建链接页面。在链接页面中,与同意与本网站链接的其它网站进行链接。如果信誉度高的网站与本网站链接内容越多,那么本网站在搜索引擎中的排名就会越高

· Use more text than graphics, and minimize the use of Flash and Javascript. Search engines heavily favor text and will crawl and index your site faster.

网站多使用文字内容,尽量减少使用图片、Flash、Javascript。搜索引擎更喜欢文字内容,可以更快对网站做索引。
 


推荐阅读
  • CSS3选择器的使用方法详解,提高Web开发效率和精准度
    本文详细介绍了CSS3新增的选择器方法,包括属性选择器的使用。通过CSS3选择器,可以提高Web开发的效率和精准度,使得查找元素更加方便和快捷。同时,本文还对属性选择器的各种用法进行了详细解释,并给出了相应的代码示例。通过学习本文,读者可以更好地掌握CSS3选择器的使用方法,提升自己的Web开发能力。 ... [详细]
  • 微软头条实习生分享深度学习自学指南
    本文介绍了一位微软头条实习生自学深度学习的经验分享,包括学习资源推荐、重要基础知识的学习要点等。作者强调了学好Python和数学基础的重要性,并提供了一些建议。 ... [详细]
  • Iamtryingtomakeaclassthatwillreadatextfileofnamesintoanarray,thenreturnthatarra ... [详细]
  • 本文介绍了在开发Android新闻App时,搭建本地服务器的步骤。通过使用XAMPP软件,可以一键式搭建起开发环境,包括Apache、MySQL、PHP、PERL。在本地服务器上新建数据库和表,并设置相应的属性。最后,给出了创建new表的SQL语句。这个教程适合初学者参考。 ... [详细]
  • Webpack5内置处理图片资源的配置方法
    本文介绍了在Webpack5中处理图片资源的配置方法。在Webpack4中,我们需要使用file-loader和url-loader来处理图片资源,但是在Webpack5中,这两个Loader的功能已经被内置到Webpack中,我们只需要简单配置即可实现图片资源的处理。本文还介绍了一些常用的配置方法,如匹配不同类型的图片文件、设置输出路径等。通过本文的学习,读者可以快速掌握Webpack5处理图片资源的方法。 ... [详细]
  • 本文主要解析了Open judge C16H问题中涉及到的Magical Balls的快速幂和逆元算法,并给出了问题的解析和解决方法。详细介绍了问题的背景和规则,并给出了相应的算法解析和实现步骤。通过本文的解析,读者可以更好地理解和解决Open judge C16H问题中的Magical Balls部分。 ... [详细]
  • CF:3D City Model(小思维)问题解析和代码实现
    本文通过解析CF:3D City Model问题,介绍了问题的背景和要求,并给出了相应的代码实现。该问题涉及到在一个矩形的网格上建造城市的情景,每个网格单元可以作为建筑的基础,建筑由多个立方体叠加而成。文章详细讲解了问题的解决思路,并给出了相应的代码实现供读者参考。 ... [详细]
  • 成功安装Sabayon Linux在thinkpad X60上的经验分享
    本文分享了作者在国庆期间在thinkpad X60上成功安装Sabayon Linux的经验。通过修改CHOST和执行emerge命令,作者顺利完成了安装过程。Sabayon Linux是一个基于Gentoo Linux的发行版,可以将电脑快速转变为一个功能强大的系统。除了作为一个live DVD使用外,Sabayon Linux还可以被安装在硬盘上,方便用户使用。 ... [详细]
  • 本文讨论了在手机移动端如何使用HTML5和JavaScript实现视频上传并压缩视频质量,或者降低手机摄像头拍摄质量的问题。作者指出HTML5和JavaScript无法直接压缩视频,只能通过将视频传送到服务器端由后端进行压缩。对于控制相机拍摄质量,只有使用JAVA编写Android客户端才能实现压缩。此外,作者还解释了在交作业时使用zip格式压缩包导致CSS文件和图片音乐丢失的原因,并提供了解决方法。最后,作者还介绍了一个用于处理图片的类,可以实现图片剪裁处理和生成缩略图的功能。 ... [详细]
  • Android日历提醒软件开源项目分享及使用教程
    本文介绍了一款名为Android日历提醒软件的开源项目,作者分享了该项目的代码和使用教程,并提供了GitHub项目地址。文章详细介绍了该软件的主界面风格、日程信息的分类查看功能,以及添加日程提醒和查看详情的界面。同时,作者还提醒了读者在使用过程中可能遇到的Android6.0权限问题,并提供了解决方法。 ... [详细]
  • 手把手教你使用GraphPad Prism和Excel绘制回归分析结果的森林图
    本文介绍了使用GraphPad Prism和Excel绘制回归分析结果的森林图的方法。通过展示森林图,可以更加直观地将回归分析结果可视化。GraphPad Prism是一款专门为医学专业人士设计的绘图软件,同时也兼顾统计分析的功能,操作便捷,可以帮助科研人员轻松绘制出高质量的专业图形。文章以一篇发表在JACC杂志上的研究为例,利用其中的多因素回归分析结果来绘制森林图。通过本文的指导,读者可以学会如何使用GraphPad Prism和Excel绘制回归分析结果的森林图。 ... [详细]
  • 本文介绍了贝叶斯垃圾邮件分类的机器学习代码,代码来源于https://www.cnblogs.com/huangyc/p/10327209.html,并对代码进行了简介。朴素贝叶斯分类器训练函数包括求p(Ci)和基于词汇表的p(w|Ci)。 ... [详细]
  • 如何自行分析定位SAP BSP错误
    The“BSPtag”Imentionedintheblogtitlemeansforexamplethetagchtmlb:configCelleratorbelowwhichi ... [详细]
  • 推荐系统遇上深度学习(十七)详解推荐系统中的常用评测指标
    原创:石晓文小小挖掘机2018-06-18笔者是一个痴迷于挖掘数据中的价值的学习人,希望在平日的工作学习中,挖掘数据的价值, ... [详细]
  • sklearn数据集库中的常用数据集类型介绍
    本文介绍了sklearn数据集库中常用的数据集类型,包括玩具数据集和样本生成器。其中详细介绍了波士顿房价数据集,包含了波士顿506处房屋的13种不同特征以及房屋价格,适用于回归任务。 ... [详细]
author-avatar
100斤的重口味_866
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有