网页设计新趋势 — 什么是 div ?

• 

• 记得第一次接触 xhtml 与 CSS 时，对于各种 html 标签的缩写都很有兴趣，例如：h1 的 h 原意为何？ul 与 li 是哪个英文单字演变而来…..，这些似乎没有人去研究过，不过倒也不妨碍程式的学习。我最记得友人给我的 div 标签解释较为有趣。他说：「div 像是一个容器，可以放很多东西进去。」这很有禅意的开示，说真的并没有给我任何启发，直到当我有机会教授他人网页设计时，我开始认真去构思：「如何化繁为简、深入浅出的方式来向一个初学者解释 div？」
  html 语法里的 div 标签，其原单字为：division，与area、zone、region、section 意思相同，就是指定区域。为何加入一个指定？因为配合 div 一起作用的还有：margin、padding、float 等 CSS 参数，这些参数是强化 div 这个 “容器” 的大小、性质与用途，说穿了 CSS 就是在定义 div 的外观。
  我们可以把 div 视为一个独立的行政区，整个中国就是一篇网页，各县市是网页内的 div。县市内还可再分各乡镇邻里 div。地理疆界画分出来后，地景地貌的规划，要靠国土发展计画与都市计画，这些法律条文就是网页设计上的 CSS。因此我们可以说：
  div 是个区域范围，像是网页顶端 (Head)、中段 (Body)、侧区 (side) 与底端 (footer) 等区块
  CSS 是定义区域内的样貌，如：颜色、效果、大小….
  在区域内活动的人事物，就是我们所谓的网页内容

• 使用 div 设计网页，有诸多优点：
  
  网页版面构成样式 (Style) 与网页内容 (Content) 分开，易于资料维护与管理
  简化网页页面程式码，加速浏览速度与便于搜寻引击的检索
  网页外观若要变换样式 (变脸)，修改CSS即可，网页内容丝毫不受影响
  可以结合 CSS framework，增快网站后台开发时间与便于统一网页样式
  可以设定自由边界，让页面可依照使用者的萤幕大小，自动缩放，此特色可让网页相容于携带式行动设备 (智慧型手机、平版电脑…)
  减少版面构成语法上的Bug。传统 Table (表格) 语法，经常会自己撑大或是断裂，往往要费时重新调整，甚至重作，徒增困扰

• 既然 div 的优点很多，为何台湾大多数的网页设计公司还是不太喜欢使用，反而继续使用落伍、垂死、问题最多的表格 (Table) 语法？
  
  表格语法表较容易，无须在费时去学习陌生的 div 语法，减少麻烦
  表格语法所开发出来的网站成本较低，在程式端要注意的小地方少
  客户在网站制作_网页设计公司-【创新互联】响应式网站设计公司">网页设计上的预算不高，网站建置上的诸多专业考量就省啦
  会表格语法的网页设计师比较好找，但擅长 div 与 CSS 语法的网页设计师就很少了
  表格语法可以模拟平面设计概念的网页设计。但平面设计不是网页设计，如果没有正视这两者的差异，过度依赖平面设计上的美学观，反而会造成后续程式端的问题
  客户不懂网页设计的眉角与奥义，未来网站的搜寻排序也不是本阶段所需注意的
  在网页设计里，魔鬼就存在技术的细节中。如果在网站建置开始就不以技术为导向，完全以视觉上的美观为主，可以推测的将来，妖孽群舞，百病丛生，永远无法将虫虫危机解除，届时网站将是一个无法处理的痛。

名称栏目：网页设计新趋势 — 什么是 div ?
标题链接：/news27/79177.html

成都网站建设公司_创新互联，为您提供标签优化、移动网站建设、微信公众号、面包屑导航、做网站、Google

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联