肯定有人会问,网站形式如此多样化,例如常见的单列布局、双列布局、三列布局、栅格布局、响应式布局、瀑布流布局和滚动页面布局。
以下是网页设计中常见的几种版式:
单列布局(Single column layout):网页的内容只有一列,通常用于移动设备或简单的网页设计。
双列布局(Two column layout):网页的内容分成两列,通常用于博客、新闻或个人网站。
三列布局(Three column layout):网页的内容分成三列,通常用于门户网站或新闻网站等。
栅格布局(Grid layout):将网页内容分割成多个网格,以创建有序的布局,通常用于商业或企业网站。
响应式布局(Responsive layout):根据浏览器窗口大小的不同,自动调整网页的布局和内容,以便在各种设备上呈现最佳的用户体验。
瀑布流布局(Masonry layout):瀑布流布局通常用于展示图片或照片等内容,每个元素都像瀑布一样垂直排列,以形成流畅的视觉效果。
滚动页面布局(Scrolling layout):通过水平或垂直滚动,让页面的不同部分呈现在用户面前,通常用于长页面或故事网站等。
网站结构这么多,为何只归类出栏式结构和区域结构这两种框架呢?
作为基础结构,栏式结构与区域结构具有一定的普遍性和实用性。可以放置一定量的信息内容,并符合网站网页形式的信息格局要求。两种格局所形成的网站风格气质也具有一定的独立性,应用起来各有特色。
现今的大部分网站框架都是由这两种基础结构演化而来,结合了两种格局的优点,可以使页面既保留栏式结构的大气,又保有区域结构的精美,这样的网站更能适应信息形式的变化和人们审美的提高。
巧妇难为无米之炊,网页的各组成部分正是设计师手中所用的“食材”,色彩、版式、风格等视觉元素则是“油盐酱醋”。设计师通过运用各种创意手段“煎、炒、拌、蒸、煮、炖……”,在发挥材料优势的基础上,制作出色香美味的“视觉大餐”。
网页上的组成部分并非都是一成不变的,每种类型的网站都具有独特的信息模块。如一般情况下,电子商务网站会拥有独立的产品导航,购物系统和相关信息模块,以及各种尺寸、不同位置的促销广告。这是属于电子商务网站特有的内容,页面将产生相应的形式,视觉设计既要突破信息形式的局限,又不能脱离了信息赋予它的文化内涵。
在浏览器空间里,按照一定的视觉表达内容的需要和审美规律,结合各种平面设计的具体特点,将信息内容和页面视觉元素加以组合编排,就是网页排版了。
如果说平面设计中的长宽比例是固定的,那么对网页设计来说,则没有所谓固定的长宽比例,设计者可以自行确定作品外沿是横长方形还是竖长方形。还可以根据创作的需求,让格局居中,或是接近边缘。比如很小的居中的界面,或者是占满浏览器屏幕的情况,以及横向伸展的个性化格局。
总体来看,网页设计是比较自由的。
网页排版虽然横宽自由,但还会受到习惯的限制。无论什么内容的网站,其页面上的信息所具备的功能大多都是相同的。例如页面上可能存在标志、导航、文章标题、正文、装饰用插图、正文中配图、广告信息、动态广告、版权信息、超级链接等。
一般情况下,标志放置在页面上部;超级链接文字的颜色要区别于其他文字的颜色;版权信息要放在页面最下部;中文导航尽量以四个汉字命名……这些都是网民在长期的浏览网站活动中形成的用户习惯。