地产网站项目中的纯中式元素设计之全过程

 更新时间:2016年9月20日 19:04  点击:1811

  项目本身是讲纯私家苏州园林别墅。

  创意初始:

  力求  

  讲山清水润

  讲江南温婉

  讲气质

  讲在北方

  讲独特人文园林

  讲互动在中国元素衍生

  讲时光流转,四季切换,用网络平台展现平日无法企及的视觉效果。 

  按惯例 我们开始进行设计大纲:

  经过创意部门的开会,起草了一个方向性的大纲。大体从导向入手,考虑一个初次访问者的浏览层次。如下图

<   帮你的页面瘦身

  我们浏览网页实际上是将虚拟主机中的网页内容下载到本地硬盘,再用浏览器解释查看的。下载网页的快慢在显示速度上占了很大比重,所以,网页本身所占的空间越小,那么浏览速度就会越快。这就要求在做网页的时候遵循一切从简的原则,如:不要使用太大的Flash动画、图片等资源。干净、简洁的页面会给人一种思路明朗的感觉。   

  网站计数器代码放置的技巧

  在网页里放置计数器可以统计网站的访问流量,为站长和广告商家提供访问依据,但是,不管功能有多强大的网站统计系统,都会有出故障的时候。如果直接把统计代码放到页面内容的前面,或者放在一个Table或者div标签里,那么在计数器不能访问的时候,你的页面上那个Table或者div就会产生几十秒钟的延迟,导致页面很长时间才能访问。所以,要提高网站的速度,就要讲究统计代码放置的位置,正确的方法是:把统计代码放到页面的最下面,并且不要和页面内容同在一个Table或者div标签里。可以在页面代码的最下方直接放置统计代码,或者在最下方单独做一个Table或者div来放置计数器。这样,在计数器不能访问的时候,你的网站速度也不会受到丝毫影响。   

  制作友情链接的学问

  很多站长都喜欢直接引用友情网站上的图片URL,这样图片要先经过加载才能显示的,各个友情网站的访问速度不一样,整个表格都要等图片都下载完了才能显示出来,这样大大降低了网页的速度。因此,做友情链接时应尽量做到:   

  1.只做文字链接:做文字链接是不会延迟网页速度的。

  2.将所有链接放到一个独立的分页去,然后在首页链接上该页。  

  3.如果友情链接一定要出现在首页,请将链接所在的整个Table放到页面的最下方,因为页面是由上到下逐行显示的,将其放到页面的最下方,不会延迟其他内容的显示。  

  4.友情链接的LOGO图片先下载后再传到自己的网页空间,这样,速度由自己的网站空间决定而不受友情网站的影响。


< ◇如何在网页中加入单个或几个空格?
◆在源代码中输入&nbsp,每个&nbsp之间请用空格分开。
◆在Dreamweaver中用<CTRL>+<SHIFT>+<SPACE>插入空格或任输几个字符,然后将其色彩设成背景的色彩!

◇如何在网页中加入书签,在页面内任意跳转?
◆在源代码中需要插入书签的地方输入<a name="top"></a>,在调用的地方输入<a href="#top">Top</a>,其中的top是你设定的书签名字。
◆在Dreamweaver中用菜单的「Insert」-「Name Anchor」命令插入书签,调用时,在Link中输入#top,top为书签名。

◇如何在网页中加入书签,在多个页面之间任意跳转?
◆方法与上面类似,不过做链接时要在书签名前加上网页文件名,如:other.htm#top,这样一来就会跳转到other.htm页面中的top书签处。

◇将网页加入收藏夹?
◆请使用如下代码:(注意标点符号)
< a href='http:///htmldata/2005-10-12/'#'' onclick="window.external.addFavorite(''http://qiangwei.126.com'',''【梦想天空】qiangwei.126.com 各种网页工具教程DW、FLASH、FIREWORKS及CGI教学、聊天交友……'')" target="_top">将本站加入收藏夹< /a>

◇如何去掉链接的下划线?
◆在源代码中的<HEAD>…</HEAD>之间输入如下代码:
<style type="text/css"> <!--
a { text-decoration: none}
--> < /style>
◆在Dreamweaver中用「Text」-「Custom Style」-「Edit Style Sheet」-「New」-Redefine HTML Tag中选择a,然后在decoration中选中none

◇如何将网页定时关闭?
◆在源代码中的<BODY>后面加入如下代码:
< script LANGUAGE="JavaScript"> <!--
setTimeout(''window.close();'', 60000);
--> < /script>
在代码中的60000表示1分钟,它是以毫秒为单位的。

◇如何设置命令来关闭打开的窗口?
◆在源代码中加入如下代码:
< a href="http:///" onclick="javascript:window.close(); return false;">关闭窗口< /a>

◇如何制作电子邮件表单?
◆在<FORM>中输入Action="youremail@XXX.XXX" ,提交采用POST方法。

◇如何自动加入最后修改日期?
◆在源代码中的<BODY>…< /BODY>之间加入如下代码:
< Script Language="JavaScript"><!--
document.write("Last Updated:"+document.lastModified);
-->< /Script>

◇如何在网页中加入EMAIL链接并显示预定的主题?
◆代码:< a href="mailto:yourmail@xxx.xxx?Subject=你好">Send Mail< /a>

◇如何让背景图象不滚动?
◆代码:<BODY Background="bg.gif" Bgproperties="fixed" >
◆在Dreamweaver中用「Text」-「Custom Style」-「Edit Style Sheet」-「New」-Redefine HTML Tag中选择Body,

  门户网站有很多种。最为国人熟知的是象新浪搜狐那种信息类门户。主要以广告收入为主。现在也有博客门户等。象当当、淘宝那样的购物平台,其实也是一种门户,只不过陈列的是商品信息,赢利方式是依靠出售商品。不同的门户,有不同的需求,都应该根据这些需求出发去设计网站,这是众所周知的,但是它们之间也有共性,那就是都要求提高浏览效率!促使网站达成赢利目标。

  信息类门户:

  1.网页的体积最小

  2.分类明确,多方向引导

  3.信息量最大

  4.风格一致,易于管理

  5.以适当的方式提供多种多样的广告位

  6.分栏目设计突出主题风格

  购物类门户:

  1.网页体积尽量小

  2.分类明确,多方向引导

  3.信息根据重要程度疏密有秩

  4.每一个页面信息都是一种广告方式

  5.突出商品本身

  6.分栏目设计突出主题风格

  一、网站风格/创意

  “风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。整体形象包括站点的版面布局,色彩,字体,浏览方式等。如:我们觉得迪斯尼是生动活泼的而IBM则是专业严肃的。每一个网站都会给人们留下的不同感受。这里我们需要做到的是根据网站的定位做出网站特有的风格。除此我们还需要在风格同一上需要把握一下,其实这个风格的统一和传统的印刷出版物没什么区别。你网页上所有的图像、文字,包括像背景颜色、区分线、字体、标题、注脚什么的,都要统一风格,贯穿全站。这样子用户看起来舒服、顺畅,会对你的网站留下一个很专业的印象,有一个全局感受。

  创意,所谓创意就是不拘一格某些设计师在做创意的时候大费周章,做出来确实不可否认很有创意、很别致,但往往对于行业网站的客户为什么不能接受呢?此时不要太责怪客户的不识货,应该反思,抓住客户的需求。其实做行业网站不需要很多大的创意,也不要浪费过多的时间去追求如何个性、如何好看,我们只需要一点小小的创意贯穿全站,也许会使网站更生动更具有吸引力、更有思想。”

  不要在页头用大面积的装饰图片来体现整个网站的风格

  门户网站构成很复杂,通常会兼并、嵌套很多小网站。网站的经营方当然希望让这些小的网站套用整个门户的VI


  要知道错在什么地方,最好先看看为什么要进行WEB界面静态化。我绝不在乎已经浮了两年多的所谓不能把WEB界面变成静态页面就是技术不佳的话,事实上,今天才开始静态化是由于搜索引擎的要求。换言之,如果不是由于有搜索引擎极大的访问压力,仅仅是人的点击的话,根本不需要考虑动态网页静态提供。这就是路可能走错的原因,因为,对于人来说,把首页进行静态化是可以减轻访问压力的;而对于搜索引擎来说,如果梢页也是以伪静态形式提供的话,那么是否首页并不重要了,因为搜索引擎会顺着连接把整个网站搜个遍,如果仅仅是把首页静态化,对于减轻搜索引擎的压力没有什么帮助,如果是把所有异化的网页全部静态化,工程何其大也,包括使用者网站编辑,她们能够承受吗?

  把首页静态化的原因,说起来主要与中国国内的网站设计陋习有关:总是把首页做得奇大无比,塞满了没有人看的垃圾。因此,假设受众总是先到首页的话,那么首页的负载就是后续页面的几十倍,把它静态化,也就省下了资源。但实际上目前的趋势,或者说国外网站的大势是使用精简的小首页,这样静态化就没有太大的必要;如果访问负载来自于搜索引擎的话,就更没有必要了。

  那么什么内容应该以静态网页提供呢?大致可以把网页分成三类:一是导航性网页,这类页面变化少,适宜使用静态页面提供;国外网站的首页一般是这种形式;二是内容分类列表、摘要网页,这类是相对于书本的目录,如果是更新频繁的话,静态网页很难做,主要是需要实时更新的内容太多,一般适宜动态网页;三是内容页,如文章内容,这类网页罕有访问,也极少变动,适于变成静态网页。国内的网站的常见的大首页,主要是把第一类和第二类的功能混淆起来。我的系统的功能目前是主要把第一类变成静态,还是挺有用的,但尝试把第二类变成静态,就不恰当了,这就是我错的地方。

  “把动态页面转成静态页面”,需求看似简单,但只有实际做下去,才知道什么是合适的,什么不是合适的。


[!--infotagslink--]

相关文章

  • php漏洞之跨网站请求伪造与防止伪造方法

    今天我来给大家介绍在php中跨网站请求伪造的实现方法与最后我们些常用的防止伪造的具体操作方法,有需要了解的朋友可进入参考。 伪造跨站请求介绍 伪造跨站请求...2016-11-25
  • photoshop设计一幅大鱼海棠动画片海报制作实例教程

    今天小编在这里就来给各位photoshop的这一款软件的使用者们来说一说设计一幅大鱼海棠动画片海报制作的实例教程,各位想知道具体制作步骤的使用者们,那么各位就快来看看...2016-09-14
  • 如何获取网站icon有哪些可行的方法

    获取网站icon,常用最简单的方法就是通过website/favicon.ico来获取,不过由于很多网站都是在页面里面设置favicon,所以此方法很多情况都不可用。 更好的办法是通过google提供的服务来实现:http://www.google.com/s2/favi...2014-06-07
  • ps怎么制作倒影 ps设计倒影的方法

    ps软件是一款非常不错的图片处理软件,有着非常不错的使用效果。这次文章要给大家介绍的是ps怎么制作倒影,一起来看看设计倒影的方法。 用ps怎么做倒影最终效果&#819...2017-07-06
  • C语言程序设计第五版谭浩强课后答案(第二章答案)

    这篇文章主要介绍了C语言程序设计第五版谭浩强课后答案(第二章答案),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2021-04-02
  • js屏蔽F12审查元素,禁止修改页面代码等实现代码

    有时候我们需要屏蔽客户端的F12,以防菜鸟也可以随意修改我们的代码,也处于源码的保护等操作,这里就为大家分享一下常见的代码...2020-10-03
  • Photoshop设计商务名片的5种常见思路分享

    今天小编在这里就来给Photoshop的这一款软件的使用者们来说下计商务名片的5种常见思路,各位想知道的使用者,那么下面就快来跟着小编一起看一看吧。 给各位Photosho...2016-09-14
  • jQuery实现HTML元素隐藏和显示

    这篇文章主要为大家详细介绍了jQuery实现HTML元素隐藏和显示,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2021-08-19
  • mac下Apache + MySql + PHP搭建网站开发环境

    首先为什不自己分别搭建Apache,PHP和MySql的环境呢?这样自己可以了解更多知识,说起来也更酷。可也许因为我懒吧,我是那种“既然有现成的,用就是了”的人。君子生非异也,善假于物也。两千年前的荀子就教导我们,要善于利用工具...2014-06-07
  • WPF实现类似360安全卫士界面的程序源码分享

    最近在网上看到了新版的360安全卫士,感觉界面还不错,于是用WPF制作了一个,时间有限,一些具体的控件没有制作,用图片代替了。感兴趣的朋友一起跟着小编学习WPF实现类似360安全卫士界面的程序源码分享...2020-06-25
  • php实现网站留言板功能

    我要实现的就是下图的这种样式,可参考下面这两个网站的留言板,他们的实现原理都是一样的畅言留言板样式:网易跟帖样式:原理 需要在评论表添加两个主要字段 id 和 pid ,其他字段随意添加,比如文章id、回复时间、回复内容、...2015-11-08
  • 网站广告怎么投放最好?首屏广告投放类型优化和广告位布局优化的案例

    网站广告怎么投放最好?一个网站中广告位置最好的是哪几个地方呢,许多的朋友都不知道如何让自己的网站广告收效最好了,今天我们就一起来看看吧。 在说到联盟优化前,...2016-10-10
  • C++如何删除map容器中指定值的元素详解

    map容器是C++ STL中的重要一员,删除map容器中value为指定元素的问题是我们经常与遇到的一个问题,下面这篇文章主要给大家介绍了关于利用C++如何删除map容器中指定值的元素的相关资料,需要的朋友可以参考借鉴,下面来一起看看吧。...2020-04-25
  • photoshop安卓和苹果界面设计之尺寸规范详解

    今天小编在这里就来给各位photoshop的这一款软件的使用者们来说下安卓和苹果的界面设计之尺寸规范,各位想知道的使用者们,那么下面就快来跟着小编一起看看吧。 给...2016-09-14
  • javascript中去除数组重复元素的实现方法【实例】

    下面小编就为大家带来一篇javascript中去除数组重复元素的实现方法【实例】。小编觉得挺不错的,现在分享给大家,也给大家做个参考,一起跟随小编过来看看吧...2016-04-16
  • photoshop设计重影效果具体制作教程

    今天小编在这里就来给各位photoshop的这一款软件的使用者们来说一说设计重影效果具体的制作教程,各位想知道具体制作方法的软件使用者们,那么大家就来看下小编带来的教...2016-09-14
  • Illustrator结合photoshop设计可爱的卡通女厨师头像制作教程

    今天小编在这里就来给Illustrator的这一款软件的使用者们来说一说结合photoshop设计可爱的卡通女厨师头像的制作教程,各位想知道具体制作步骤的使用者们,那么下面就快来...2016-09-14
  • PS怎么设计T恤 PS制作T恤教程

    PS怎么设计T恤?很多人都想要在T恤上有自己喜欢的图案,那么自己设计T恤的图案是方法之一,本次为大家带来了详细的ps设计T恤教程,有兴趣的同学快来看看吧。 1、打开PS,新...2016-12-31
  • photoshop设计一张节约用水环保主题海报制作教程

    今天小编在这里就来给photoshop的这一款软件的使用者们来详细的说说设计一张节约用水环保主题海报的制作教程,各位想知道具体制作方法的使用者们,那么下面就快来跟着小...2016-09-14
  • Javascript循环删除数组中元素的几种方法示例

    这篇文章主要给大家介绍了关于Javascript循环删除数组中元素的几种方法,文中给出了详细的示例代码供大家参考学习,对大家具有一定的参考学习价值,需要的朋友们下面来一起看看吧。...2017-05-22