开发者社区> 异步社区> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

《HTML5+CSS3网页设计入门必读》——1.8 了解在Web服务器上放置文件的位置

简介:
+关注继续查看

本节书摘来自异步社区《HTML5+CSS3网页设计入门必读》一书中的第1章,第1.8节,作者: 【美】Julie Meloni更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.8 了解在Web服务器上放置文件的位置

维护Web内容的一个重要方面是确定将如何组织该内容——不仅便于用户查找,而且便于你维护服务器上的内容。把文件放在目录中有助于管理那些文件。

在Web服务器上命名和组织目录以及开发针对文件维护的规则完全取决于你自己。不过,在这个漫长的过程中,维护一个组织良好的服务器可以使其内容管理更高效。

1.8.1 基本的文件管理
在你浏览Web时,可能注意到当你在Web站点中导航时URL会改变。例如,如果查看一家公司的Web站点,并且单击通往公司的产品或服务的图形导航元素,URL可能会从

http://www.companyname.com/

变为

http://www.companyname.com/products/

http://www.companyname.com/services/

在上一节中,我使用了术语文档根目录(document root),但是没有真正解释它的有关含义。Web服务器的文档根目录实质上是完整URL中的末尾斜杠。例如,如果域是 yourdomain.com ,并且URL是 http://www.yourdomain.com/ ,那么文档根目录就是通过末尾斜杠(/)表示的目录。文档根目录是你在Web服务器上创建的目录结构的起点;Web服务器将从这个位置开始寻找Web浏览器请求的文件。

如果像前面所指示的那样把sample.html文件放在文档根目录中,将能够通过Web浏览器利用以下URL访问它:

http://www.yourdomain.com/sample.html

如果把这个URL输入到Web浏览器中,将会看到呈现的sample.html文件,如图1.8所示。


b8626c5be92581658a666a40fe700c359c152d5e

不过,如果在文档根目录内创建一个新目录,并把sample.html文件放在该目录中,则将利用下面这个URL访问该文件:

http://www.yourdomain.com/newdirectory/sample.html

如果把sample.html文件放在一连接到你的服务器时就最初看到的目录中,也就是说,你没有改变目录并把文件放在文档根目录中,那么将不能从你的Web服务器利用任何URL访问sample.html文件。该文件仍然位于你称为Web服务器的机器上,但是由于文件不在服务器软件知道从此开始寻找文件的文档根目录中,永远都没有人能够通过Web浏览器访问到它。

底线就是:在开始传输文件之前,总是要导航到Web服务器的文档根目录。

对于图形和其他多媒体文件尤其如此。Web服务器上的公共目录被称为images,正如你可能想到的,其中将存放所有的图像资源以便检索。其他流行的目录包括用于存放样式表文件的.css文件(如果使用多个样式表文件的话),以及用于存放外部JavaScript文件的.js文件。此外,如果你知道在Web站点上将具有一个区域,访问者可以从中下载许多不同类型的文件,就可能简单地把该目录命名为downloads。

无论它是一个包含你的艺术选辑的ZIP文件,还是一个带有销售数字的Excel电子数据表,在Internet上发布不仅仅是Web页面的文件通常是有用的。为了使一个不是HTML文件的文件在Web上可用,只需把该文件像一个HTML文件一样上传到Web站点,并遵循本章前面给出的关于上传文件的指导即可。在把文件上传到Web服务器之后,就可以创建一个指向它的链接(在第8章将学习这方面的知识)。换句话说,Web服务器不仅仅能提供HTML文件。

下面给出了一段示例HTML代码,在本书后面将学习关于它的更多知识。下面的代码将用于一个名为artfolio.zip的文件,它位于Web站点的downloads目录中,并且会显示链接文本“Download my art portfolio!”:

<a href="/downloads/artfolio.zip">Download my art portfolio!</a>

1.8.2 使用索引页面
在你想到索引时,可能会想起本书后面的那一节,它告诉你在哪里寻找各个关键词和主题。Web服务器目录中的索引文件可以服务于此目的——如果你像那样设计它的话。事实上,该名称最初就起源于此。

index.html文件(或者采用它通常的叫法即索引文件(index file))是你给一个页面提供的名称,当人们导航到你的Web站点中的特定目录时,你希望他们把该页面视为默认的文件。

索引文件的另一个作用是,访问你的站点上的某个目录的用户将具有一个索引页面,但是没有指定该页面仍将登录到用于站点的那个区域(或者用于站点本身)的主页上。

例如,可以输入以下URL之一,并登录到Apple的iPhone信息页面上:

http://www.apple.com/iphone/

http://www.apple.com/iphone/index.html

iphone目录中没有index.html页面,结果将依赖于Web服务器的配置。如果服务器被配置成禁止目录浏览,用户在尝试访问不带有指定的页面名称的URL时将会看到一条“Directory Listing Denied”(“目录列表被拒绝”)消息。不过,如果服务器被配置成允许目录浏览,用户将会看到那个目录中的文件列表。

你的托管提供商将已经确定了这些服务器配置选项。如果你的托管提供商允许你通过控制面板修改服务器设置,你就可以更改这些设置,使得服务器基于你自己的需要来响应请求。

索引文件不仅在子目录中使用,也在Web站点的顶级目录(或文档根目录)中使用。Web站点的第一个页面——首页(home page)或主页(main page),或者当用户第一次访问你的域时你希望他们看到的Web内容的你所喜欢的任何称呼——都应该被命名为index.html,并且放在Web服务器的文档根目录中。这确保当用户在他们的Web浏览器中输入 http://www.yourdomain.com/ 时,服务器将利用你打算让他们看到的内容来响应(而不是给他们提供“Directory Listing Denied”(目录列表被拒绝)消息或者其他某种意外的后果)。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
【Emmet —— HTML / CSS】 超实用开发技巧
【Emmet —— HTML / CSS】 超实用开发技巧
20 0
HTML+CSS项目案例(主体部分-首页(index))-1
HTML+CSS项目案例(主体部分-首页(index))
22 0
HTML+CSS项目案例(主体部分-首页(index))-2
HTML+CSS项目案例(主体部分-首页(index))
42 0
【Emmet Zen Coding——HTML / CSS】 超实用开发技巧
前端开发中 Emmet 常用开发技巧,提升开发效率
490 0
+关注
异步社区
异步社区(www.epubit.com)是人民邮电出版社旗下IT专业图书旗舰社区,也是国内领先的IT专业图书社区,致力于优质学习内容的出版和分享,实现了纸书电子书的同步上架,于2015年8月上线运营。公众号【异步图书】,每日赠送异步新书。
12049
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载