Web Page Construction 101: 网页设计的昨天与今天

背景简介

• 本文基于《Chapter 3: Web Page Construction 101》中的内容，探讨了早期网页设计的核心概念，涵盖了所见即所得（WYSIWYG）编辑器的使用和网页构建的基本技术，旨在为初学者提供一个关于如何构建基本网页的入门指南。

  标题1：所见即所得编辑器的使用

  • 所见即所得（WYSIWYG）编辑器是网页设计初学者的福音，它让设计师能够在视觉上直接看到网页布局的成品。Dreamweaver作为一款集成了WYSIWYG界面的网页编辑工具，以其与HomeSite+或BBEdit的无缝接口，为用户提供了同时享受快速设计和精细控制的双重优势。通过直接操作页面内容和布局，用户可以轻松地进行网页设计，而不需要深入了解HTML代码。这大大降低了网页设计的门槛，使得非专业开发人员也能创建出专业的网页。

    子标题：WYSIWYG程序的多样性

    • 市场上存在多种WYSIWYG程序，如FrontPage、GoLive、HotDog PageWiz和Web Studio等，它们各有特色，适用于不同的设计需求和用户偏好。选择合适的编辑器对于提高工作效率和满足设计目标至关重要。

      标题2：网页结构的两种基本类型

      • 网页结构是网页设计的基础，分为两种基本类型：Regular和Framed。Regular结构是传统的单一页面设计，而Framed结构则可以将多个页面内容在同一个屏幕上并排展示。虽然Framed结构提供了更大的灵活性和功能，但它也带来了与搜索引擎兼容性差等额外的技术挑战。因此，设计者需要根据实际需求和目标受众来选择合适的网页结构。

        子标题：框架和框架集

        • 框架集（Framesets）用于构建Framed结构的网页，它将屏幕分割成多个区域，每个区域称为一个框架（Frame），每个框架可以加载不同的网页内容。通过合理使用框架集，设计师可以创造出既美观又实用的多页面界面。

          标题3：HTML元素与网页内容组织

          • HTML是网页的基础语言，每个网页都包含HTML、HEAD和BODY三个基本元素。HEAD元素存放页面的元数据，如页面标题，而BODY元素则包含了网页上所有可见的内容。段落（Paragraph）和标题（Headings）是组织网页内容的基本元素，它们通过不同的标签来定义文本的结构和层级，使得网页内容更加清晰和易于导航。

            子标题：段落和标题的排版技巧

            • 通过段落（P）标签和换行（BR）元素，设计师可以控制文本的布局和间隔。此外，标题标签（H1到H6）不仅帮助区分不同的内容部分，还通过不同级别的标题来组织信息结构。这些元素的合理运用，对提升网页内容的可读性和用户体验至关重要。

              标题4：字体设置的艺术

              • 字体对于网页设计至关重要，它不仅影响内容的呈现，还能反映网站的风格。在早期的网页设计中，字体的选择和设置通常通过HTML的 , , 和 等标签来实现。设计师可以通过这些标签来设置文本的粗细、斜体、字体类型、大小和颜色，从而达到预期的视觉效果。

                子标题：字体选择的多样性与兼容性

                • 由于不同的计算机系统可能预装不同的字体，设计师在选择字体时需要考虑到跨平台的兼容性问题。通过提供多种字体选项，设计师可以最大化地确保网页在不同浏览器和操作系统上的显示效果接近预期。

                  总结与启发

                  • 早期的网页设计方法和技术为今天网页设计的多样性和复杂性奠定了基础。通过理解和掌握这些基础，我们可以更好地欣赏现代网页设计的创新之处，同时也能从中获得设计简洁、功能实用的网页的灵感。随着技术的发展，网页设计已经从最初简单的WYSIWYG编辑器和基础的HTML元素发展到了更加动态和交互式的体验，但其核心目标——有效地传达信息和吸引用户的关注——始终没有改变。
                  
                  （图片来源网络，侵删）
                  
                  （图片来源网络，侵删）
                  
                  （图片来源网络，侵删）