必威体育下载基督教Heilmann

贴有“WebDevelopment”标签的文章

在他们年轻的时候把他们搞得一团糟?更好的网络教程现在!

星期四,7月28日,二千零一十一

我现在正在科技评论一本被用于教育环境(学校,大学,公司培训)关于HTML5,css和javascript,或者——简而言之——web开发。不用说,我对学校在这方面的教学感到非常震惊。

新学员得到的第一批材料似乎重复了许多过去的错误,这让我很恼火。必威体育下载接下来,我将展示一些问题以及我们应该做什么。

免责声明:这些是我在当前的代码示例和培训材料中遇到的示例。如果有人大喊“没人再用那个了”或者“什么样的白痴会这样写代码”,请从他们的象牙塔里走下来,把他们的手弄脏。在学校和公司的培训室里进行的日常培训。我并不是在编这个词——这是人们从学校或公司的角度开始上网时的印象,而不是阅读杂志,博客或关注Twitter上的一些知名人士。

地狱里的“你好世界”

我一直看到的第一个代码示例是这样的:

 
     

通常情况下,解释如下:

  • 这是嵌入脚本的方法,
  • 类型和/或语言对于告诉浏览器它是哪种脚本非常重要
  • 需要注释来阻止浏览器显示代码。最后一行中的javascript行注释“/”有时会添加“以确保HTML验证“

如果你真的使用HTML5doctype不需要它们.JavaScript是唯一支持的语言浏览器HTML5并且正在使用的将执行,因此类型属性仅在希望嵌入不应由所有人呈现的脚本时才有意义。一些客户端模板语言会这样做。JScript死了,我们甚至不必费心告诉别人。

至于评论,我还没有遇到任何浏览器显示脚本块中的代码。如果你真的担心向后兼容性猞猁Netscape 1(显然lynx还在生产中)那么您也不应该在页面中嵌入脚本。

最后,这是我们在任何情况下都要做的,以获得在单独文件中维护脚本的好处。页面中的嵌入代码只适用于需要缓存文件中的所有内容的高性能环境。另一种情况是,我经常看到内嵌JS代码对产品进行快速修复,或者添加“one off as this is a special page”,从而使维护更加困难。

我们改成这样吧:写“你好世界”的方法是写一个索引文件这解释了非常需要的语义基础HTML并嵌入以下内容:

 
     

这样人们就不会被诱惑混合行为,结构和表示,并理解构建Web产品而不是将所有内容都包含在一个文件中的页面意味着什么。

当然,将所有内容保存在一个文档中可能有好处。首先,你可以解释不同的东西是如何一起工作的。在真实的开发环境中,然而,这是个奇怪的例子,我们的引物不应该开始解释这些。忘记比学会更难,必威体育下载那么为什么我们要从你以后不会用的东西开始呢?

我们一起吃吧CSSJS就像我们在HTML文件——外部资源。这是最大的用例,也是我们应该让人们开始使用的用例。

诅咒document.write()。

每次我看到adocument.write()。document.writeln()。这些天我在物质上有点死在里面。当我们不得不用它将框架集写入刚刚打开的弹出窗口时,我就在附近。原因是浏览器不支持DOM访问页面中的内容或创建HTML内容。我不想记得那些时候,第一次进入网络开发世界的人也不应该。

我理解,在文档中显示输出是最简单的方式——给新开发人员第一个“哇,我刚刚编写的程序会显示在屏幕上。我也知道,然而,我不会雇佣任何使用文件编写只是在屏幕上打印一些东西。

使用document.write()。告诉开发人员JS在添加脚本节点的位置写出内容,而不是如何与之交互HTML.

我们改为这样做:我们有一些选择,而不是写入文档。这些是优先排序的,从最不理想的开始:

  • 使用警报()—只稍微好一点,但是也有一些好处。警报是破坏性的。它们会停止代码的执行,例如,您可以演示变量的值如何通过脚本的执行进行更改。它们的问题是,如果你想显示很多值,按回车键来清除所有的警告会变得很烦人。例如,在新的火狐中,警报被叠加而不是停止执行,这意味着这种利益已经消失。
  • 从简单的介绍开始DOM.如果你仔细想想,其实很简单:

    使用文档对象模型(DOM),我们可以访问页面中的元素。比如说你有一个

    在文档中。使用 document.getElementByID('结果')在您的javascript中,您可以访问这个元素。您可以使用 内层HTML.如果你做a document.getElementByID('result').innerHTML='我的结果'你会看到段落的内容改为“我的结果”。如果你做了 警报(document.getElementByID('result').innerhtml)您将收到一条提示,说明“我的结果”,因为这是您更改段落后的文本内容。

    这不难,它是?

  • 从一开始就介绍调试工具-解释浏览器中的控制台。所有现代浏览器都配有一个开发控制台,可以显示用控制台。.首先,我们解释开发人员在编写代码之前如何调试代码,然后让他们了解代码中发生了什么。这就像是在让新学员使用电动工具之前,向他们展示手册和急救箱的位置。我们的大部分工作是测试代码,而不是编写代码。在现实世界中,我们大部分时间都在调试和重构代码——那么为什么不从这开始呢?

诅咒警报()提示()

在任何浏览器中使用警报和提示打印结果并从用户那里获取内容都是一种简单的方法。然而,在一个真正的产品中,你几乎不会使用警报(除了用于调试),我可以安全地说,我从未在教程之外看到过使用提示。

谁犯了加“an”的错误请举手警报()在大循环中或尝试调试模糊()事件处理程序使用一个警报,从而在一个无休止的调试循环中结束。对,当浏览器(和服务器端的javascript)这些天有调试工具,能够更好地向我们展示引擎盖下发生的事情时,这样做是没有意义的。控制台向我们显示对象和DOM元素而不是神秘的[对象对象]作为调试信息。

我们改为这样做:而不是使用浏览器对象模型和警报,确认并提示使用控制台进行调试,使用表单字段进行数据输入。编写一个简单的解释来访问表单中的数据并不难:

文档中的表单允许您从用户那里获取信息并对其进行操作。假设您在页面中有以下表单:

       

标签需要元素来告诉用户条目字段是什么,以及应该如何处理它。的类型属性告诉浏览器我们需要什么样的输入字段——在本例中是一个数字。当表单发送到服务器和身份证件需要将标签与输入元素连接,这个占位符向用户显示预期值和必修的属性在浏览器中验证表单。

与文档中的所有元素一样,可以使用document.getElementByID()。方法用JavaScript。你可以设置和读取价值在球场上GET属性()SET属性().因此,如果您想使用javascript设置entrynumber到5,你要做的就是document.getElementByID('entryNumber').setAttribute('value',5).如果要读取字段的值,可以执行console.log(document.getElementByID('entryNumber').getAttribute('value'))

您可以通过读取或写入价值元素的属性。设置entrynumber到5,你要做的就是document.getElementById('entrynumber').value = 5.如果要读取字段的值,可以执行console.log(document.getElementByID('entryNumber').value)

(在Mathias Bynens的一些测试和反馈之后,这仍然是教新开发人员更好的方法)

用一个链接到的工作示例来支持它,并且您已经解释了表单是如何工作的,一些属性的作用,现在的浏览器有客户端验证,以及如何读写表单值。这并不难做到。

短注意广度的神话

每当我要求人们解释为什么而不仅仅是如何在教程中获得反馈,即我们的读者很忙,希望尽快看到结果。一般的共识是,读者的注意力跨度非常短,不想重复,也不想得到冗长的解释。

可能是真的,但这并不意味着你需要用勺子来提供信息。这意味着你的教程的开始必须吸引他们的注意力,你必须使它有趣。如果通过一个教程和编码是有趣的,那么人们将不会意识到他们花了多长时间在一个特定的任务上。

看看游戏:《愤怒的小鸟》并没有附带教程——每次你接触到一种新的小鸟时,都会有一张简单的图片向你展示它们的动作以及如何用手指激活它们的特殊技能。他们本可以写一份很长的文件,但他们不需要这么做。如果你真的认为人们的注意力持续时间很短,很快就会失去兴趣,那就看看有多少人一遍又一遍地试图解决同样的问题,就像看到猪爆炸一样有趣。同样的道理也适用于“割断绳子”。当小青蛙皱眉的时候,你会感觉很不舒服,因为糖果已经不见了,它对即将到来的喂食的持续的兴奋让你更想解决这个难题。为什么我们只有在“浪费时间”玩游戏的时候才会有这样的关注?

我们的培训材料应该从中吸取教训,让我们的读者保持兴奋,并希望必威体育下载了解更多。你不需要用掷模模拟器和计算素数的数学循环来做这些。把情感带进你的材料或展示现实生活中的例子,你就会引起读者的注意。在一个培训,让小组一点一点地发现这些材料,而不是给他们一个大的活页夹,上面有一些信息和例子,如果你想得到一个闪亮的证书来收集墙上的灰尘,那么就必须在当天结束之前完成。

猪嘴里的口红和假发

你不能通过用新技术来增加旧材料的味道来重新利用它们。时期。每当出现新的流行词时,一些旧书被掸掉,新功能被添加。这发生在DHTML,然后是Ajax,然后是移动Web开发HTML5.用Chrome替换Netscape 3截图,拍一章介绍新技术和Voil_-你给自己买了一个新卖家。我相信很多人会被出版商联系到“为这本旧书写一个新版本,你,知道,“升级”。说不!

除非这本书的原始版本写得非常好——而且我还没有找到这样的一个标准——否则这是在浪费每个人的时间,而且接近于一个骗局。在过去,Web开发的很大一部分要么是解决浏览器中的错误,要么是适应特殊的环境。这都是过去的事情,你不能仅仅增加一个理论上的新篇章来升级一本基于过时方法的旧书。

我们仍在努力寻找一种正确的方法来在网络上构建东西,我们的开发实践也在不断变化。性能问题,安全问题和稳定性在浏览器中不断地被修正和改变,过去的好主意现在很容易让你的网站被黑客攻击,或者让它运行得非常糟糕。

改变Web开发中解释代码的方法

所有这些都激励我编写另一个关于Web开发的初学者教程。我们不应该展示所有可能的事情,而应该展示有意义的事情,让人们上路。一个坚实的基础与最少必要的信息是一个伟大的起点,走出去,学习在你自己的条件。必威体育下载我们的教程和课程应该开始渴望更多的学习,而不是确保我们得到所有的信息,我们被要求推下我们的学生的喉咙。必威体育下载

你可以用的东西——我在奥斯陆与雅虎和歌剧院的Devoper晚上的演讲,挪威

星期四,12月3日,二千零九

我现在在挪威的奥斯陆,正准备去尼思大学雅虎和Opera开发者之夜.这是我今晚将要呈现的幻灯片和笔记。稍后将播放音频音频现在可用.

今晚到场的各位,请在此驻足,你会毁了它的。)

幻灯片

音频

录音是可以在archive.org作为一个54 mbMP3文件.

笔记

你可以使用的东西(由雅虎开发者网络和朋友提供)

在接下来的一个小时左右的时间里,我将和你们谈谈为你们所做的一些事情,你们可以在这些事情上有所建树。Web开发已经够令人困惑的了。没有必要不使用已经为我们做过的事情来让事情变得更复杂。但首先,关于我的一些事实:

我是克里斯,我已经开发网站12年了。我使用过很多框架CMS我还提供了各种国际和高流量的网站。我写过几本书,几十篇文章,数百篇关于网络开发的博客文章,可访问性,性能,可维护性,国际化和许多其他的事情,我不得不在我的日常工作中战斗。

现在我是一名开发者布道者,这是市场上的一份新工作,很多人对此感到困惑,我写了一本开发者福音手册这是免费的和有创意的共享网络,但是你也可以在lulu.com上购买硬拷贝.

我为工作雅虎开发者网络你们会发现我今天要讲的大部分内容。

必威体育下载学习基础知识

我们生活在这些日子里的好处是我们在网络上有大量的资源来学习网络开发的基础知识。必威体育下载我们仍然通过查看源代码和复制必威体育下载粘贴后的尝试和错误来学习它,这是人类的天性,但也阻止了我们的进化。的Opera Web标准课程是学习基于web标准的开发的一种很棒的资源吗必威体育下载黄蜂互动雅虎开发者网络剧场充满了演讲和教程的视频。所有这些都可以免费使用和构建。

从干净的画布开始

我学到的一件事是,为了交必威体育下载付有效且有趣的产品,你需要在一个坚实的基础上工作。Web开发受到部署环境完全未知这一事实的阻碍。这就是为什么我们在上场比赛之前需要公平竞争的原因。

您可以通过定义浏览器的“支持”来实现这一点。对于雅虎,这是分级浏览器支持文档。如果你的目标是让你的web产品在所有浏览器上看起来和工作都一样,那你就错了。Web设计是为了顺应流程,使自己适应用户代理(在大多数情况下是浏览器)的能力。在雅虎,我们有分级浏览器支持因此,不能支持新技术的浏览器将无法获得它们。Web站点的外观和工作方式并不是处处相同的。相反,使界面适应不同用户代理的能力正是Web开发如此强大的原因。

CSS框架和前端库

下一步是让我们摆脱浏览器的局限性,尤其是它们之间的差异。这就是CSS框架和前端库,如jquery,Mootools,道场悠悠还有很多是为了。所有这些都有一个相同的目标:允许您构建可预测且仅限于基本需求的代码。我们不应该仅仅为了让产品能够处理随机的浏览器实现问题而让代码膨胀。这些都是一个移动的目标,因为有各种各样的奇怪发生在整个董事会。图书馆使我们的工作可预测,并允许我们使用网络标准而不迎合浏览器。如果基于库构建代码,则可以通过升级库来修复下一个浏览器的产品。如果你选择自己做每件事——祝你好运。

构建工作的接口

接下来要考虑的是,应用程序接口不仅仅是外观。为了让它对每个人都有效,我们需要了解用户与我们产品的交互方式。这包括简单的可用性(不超载用户,不混淆用户),但也意味着了解不同的交互渠道,例如键盘用户。开始迈向可用接口的旅程的一个很好的资源是雅虎设计模式库.在那里,我们收集了最终用户如何使用网络并轻松实现目标的信息。如果有的话,在开始构建第一个小部件或应用程序之前,先看看这些模式。甚至还有不同设计器工具的模具.

利用网络

在过去的几年中,Web开发的巨大变化是我们停止了自己做任何事情。网络上有很多专门的系统,比如YouTube,Flickr和Google地图允许您以特定格式托管数据,并使您可以轻松地将这些数据转换为Web格式并重新使用。使用这些信息是通过应用程序编程接口或短API实现的。这些允许您以特定的格式要求数据,并仅返回所需的内容。web上有数百个可用的api。想知道什么是可用的,退房programmableweb.com.

首先考虑数据

如果您想要构建优秀的产品,需要注意的主要事情是将数据与演示文稿分开。这对于本地化是很重要的,国际化并保持代码的可维护性。对于不同数据源的混搭,这意味着您需要考虑尽可能简化使用不同api的过程。产品的复杂性随着所使用的API数量的增加而增加。每个API有不同的认证方式,期望不同的参数并以不同的格式返回数据。

将网络与YQL

YQL是雅虎为自己的需要而构建的解决方案。我们的所有产品都是基于API构建的,这是出于可扩展性的考虑。学习所有这些api和必威体育下载协商访问花费了我们很多时间,所以我们认为我们会想出更好的解决方案。此解决方案称为YQL.YQL是一个SQL从web获取数据的样式语言。下面的查询将从flickr获得伦敦的照片:

从geo.places中选择*,其中text=“London”

还是会呢?实际上,它会给我们提供文本为“伦敦”的照片,而不是在奥斯陆拍摄的照片。如果我们想用另一个API.Yahoo Geo api允许您定义地球上的任何地方,并将其恢复为“地球上的任何地方ID”或短woeid。Flickr支持此格式,所以我们可以一起使用这些API。Twitter也将很快支持这一点。

从flickr.photos.search中选择*在(
从地理位置选择woeid
其中text=“伦敦”
)

这会给你一些你想要展示的照片的数据,我们用另一个API获取信息的方法。

从flickr.photos.info中选择*,其中photo_id in(
从flickr.photos.search中选择id,其中wou id in(
从geo.places中选择weid,其中text=“London”
)

)

这是大量的数据,因此为了只检索我们真正需要的数据,我们可以通过替换*来过滤数据:

owner.realname选择农场,id,秘密,
服务器,标题,urls.url.content
来自flickr.photos.info,其中photo_id in(
从flickr.photos.search中选择id,其中wou id in(
从geo.places中选择weid,其中text=“London”
)

)

在中使用此查询YQL慰问,选择YQL作为输出格式和“flickr”作为回调将给我们一个有效的统一资源定位地址要在浏览器或脚本中使用:

http://query.yahooapis.com/v1/public/yql?
Q=从%20flickr.photos.info%20where%20photos_id%20in%20(
从%20flickr.photos中选择%20id%20。搜索%20,其中%20wou id%20in%20(
从%20geo中选择%20woeid%20。将%20放置在其中%20text%3d%22London%22
)&format=json&diagnostics=false&callback=flickr

srcA的属性脚本标记并编写几行Dom脚本显示照片.

这只限于雅虎吗?

不,当然不是。首先,您可以使用Atom将Web上的任何数据作为源,猪瘟病毒饲料,html,杰森微格式,RSS和XML表。

HTML具有YQL

HTML表非常有趣,因为它允许您从任何HTML文件,通过运行清理它HTML整洁,然后允许您使用XPath.

这允许您以一个简单的网站为例,比如这个关于电视笑话的把它变成wiget可以包含到其他页面中用几行javascript。

延伸YQL

您还可以通过提供简单的XML架构调用了打开的表.在这个模式中,你需要告诉YQL数据端点是什么,预期的参数和返回的参数。

打开的表还允许执行块它允许您编写将由谁执行的JavaScriptYQL在服务器端使用犀牛并已满E4X支持。

使用这个,我们可以转到前面的例子Flickr照片作为列表返回到一个打开的表中使Flickr的照片更容易获得正确的格式:

从flickr.photolist中选择*,其中text=“me”和location=“uk”,amount=20

使用杰森-PX输出这意味着我们可以简单地使用内层HTML渲染照片。

如果您希望您的表可用YQL,你所需要做的就是添加到在GitHub上打开表存储库.有关更多信息,退房YQL文档.

用块构建

如果您想构建一个Web应用程序,现在可以做的最好的事情就是使用已经测试过并且正在工作的构建块。的雅虎用户界面库充满了这些,因为这正是我们如何构建自己的工具。

用于创建布局CSS不必知道浏览器需要的所有黑客,您可以使用悠悠网格如果你真的很懒,你甚至可以用所见即所得网格生成器.

使用CSS网格和一些悠悠在分级浏览器支持中定义的所有浏览器中测试一个工作的应用程序是非常容易的。例子如下地理Flickr搜索和一个展示获取德里信息.

有一件事对中提供的小部件非常有用悠悠它们都是由自定义事件驱动的。通过这种方式,您可以扩展和更改它们的功能,而不必修改代码。只需为自定义事件编写一个事件侦听器,添加您的功能并阻止原始功能。

另一大好处是悠悠是非常详细的吗文档还有成百上千的实例你可以用来开始。

想出名吗?

今天我最不想说的是雅虎应用平台或短雅普.使用雅普您可以使用javascript构建Web应用程序,HTMLCSS并将其添加到雅虎主页,我的雅虎和雅虎未来的属性甚至更多。

您从应用程序开始并将其开发到应用仪表板.雅虎应用程序有两个视图:一个小视图或多或少是静态的(但允许使用一些Ajax),另一个大视图提供完全访问权限和更大的屏幕空间。小视图覆盖在雅虎页面上,并将显示雅虎广告。你可以用大视角赚钱。

有一件事可能会让人有点沮丧雅普当你以一个正常的web开发思维去做的时候,这并不是全部CSS/HTML和JavaScript是允许的雅普使用恰亚以确保我们的应用程序安全。因此我们把一些放在一起Caja-ready代码示例让你走上正轨。

最简单的构建方法雅普应用程序是通过使用雅虎标记语言(YML)悠悠作为悠悠被重写以符合Caja。

如果你想看看雅普应用程序看起来,退房Github上tweettrans的来源.本质上,它是一个简单的PHP API调用使用YQL和一个YML使用Ajax显示结果的接口。不涉及JavaScriptYML为我们做。

你可按以下连结安装TweetTrans:http://yahoo.com/add?雅皮德=ZKBMH94K.这也是在雅普应用程序库已启动并正在运行。

在Yahoo中推广您的应用程序的更强大的方法是利用我们的社会关系,您可以通过深入社会图来实现这一点API.最简单的方法是使用社会的SDK也可在Github上获得.注意到SDK无法在本地主机上运行—您需要在应用程序仪表板或主页上的Yahoo容器中运行它。

电梯节距

雅虎用户界面库-悠悠

悠悠是雅虎用来建立网站的系统。它不断被测试为最大数量的用户工作,免费的,打开源代码,涵盖从设计模式到开箱即用小部件的所有内容。它是模块化的,您只能使用您需要的东西。您可以自己托管它,也可以从分布式服务器网络中获取它。

雅虎查询语言-YQL

YQL是一个Web服务,它允许您将来自不同来源的Web上的任何数据与简单的SQL-风格语言。您可以根据需要过滤数据,还可以在返回数据之前使用服务器端JavaScript转换数据。数据提供者可以使用YQL发布一个API在雅虎基础设施和云存储之上的网络上。

雅虎应用平台-雅普

雅普是Yahoo应用程序平台,它允许您构建运行在Yahoo主页和其他属性上的应用程序。你可以深入雅虎的社交图表来推广你的应用程序,你可以创建高度安全的网络应用程序雅普使用CAJA确保代码质量。

利用网络开发*,是吗?在多伦多的域名聚合大会上发言,加拿大

周二,8月18日,二千零九

我刚从多伦多回来,我在第二次演讲的加拿大域收敛关于分布式数据网络开发和使用社交网络的会议。

首先,我要说的是,这对我来说是一次大开眼界的经历,因为我从来都不知道有一个由“庄家”组成的完整社区——那些购买的人,销售和“开发”互联网域名,就像其他人处理房地产一样。

组织者(我的一个老朋友在我们创建的时候就向我们打过招呼)C64demos together)想让我谈谈关于API和社交网络的Web开发,因为这在域市场中的当前状态是非常随机的。为一个域创建一些内容的常见方法是雇佣一个开发人员进行租用编码,得到一个99美元的标志,写一些内容,并把它现场。这样创建的网站的主要目标是让人们点击它的广告-出售域名是次要的步骤。

这与我所认为的Web开发完全相反,但我并没有谴责它,而是喜欢有机会展示另一种以非常小的预算和不太多的技术诀窍构建Web站点的方法。这是我要说的:

演示幻灯片

笔记

以下是我在演讲中要说的笔记。不过,我很随意。情不自禁,是吗?

使用Web开发

据报道,当前的金融危机也对网络业务造成了损失。虽然这在某种程度上是正确的(广告销售下降表明),但可能有一个不同的原因:网络不断发展,我们用户的习惯也在发展。

建造它,他们就会来,不再切割它

任何一个构建网络产品并想知道为什么评论越来越少的人,访问和点击必须意识到它们是一个庞大的网站和服务网络的一部分。人们使用网络和多任务社交。

当这是所有领域的时候

我记得当我刚开始做网络开发人员的时候,你有一个浏览器窗口。如果你想打开几个页面,你需要几个窗口。所有这些都用光了我们没有多少记忆。由于电脑运行缓慢,我们可能打开了另一个聊天客户端或IRC客户端和电子邮件客户端。无论如何,工作和冲浪是两项不同的任务。

Web 2.0革命

在Web2.0中,这一点发生了变化。计算机变得更强大,浏览器开始支持多个标签和软件从笨重的桌面移动到更轻的基于网络的界面。网络从一种读/写媒体转变为一种读/写媒体,用户开始通过改变网络体验来积极定义自己的网络体验,而不仅仅是阅读在线内容。

带上噪音!

下一波是越来越多的社交网络,博客,微博客和信息系统。作为人类,我们是天生的沟通和告诉世界我们所做的一切。只有我们的社会标准和所学的礼仪改变了这一点。必威体育下载由于这两者在网络上似乎都不重要,我们很高兴告诉世界我们做什么——不管世界是否感兴趣。毕竟,一旦我们发现了一些事情并告诉了全世界,是时候回去寻找下一件大事了。

哦,闪亮的对象!

这种丰富的实时信息会导致超负荷工作,使人们容易分心。它还降低了通信成本,迫使我们以越来越短的点对点格式提供越来越多的信息。

如果你不能和他们战斗…

不过,抱怨已经够多了。有趣的是,我们现在拥有的分布式web正是web应该的样子。网站不是广播或电视频道,而是与更大的数据网络相连接的小型数据集。因此,为了成为其中的一部分,我们需要传播我们的内容。

传播和收集

享受数据网络乐趣的方法是在网络上分布我们自己,并将数据带回我们的网站。

第一步是在网上传播我们的内容:

这种方法的好处如下:

  • 数据分布在多个服务器上,即使您自己的网站处于脱机状态(例如用于维护),数据仍然存在
  • 你接触到用户,并进入那些永远不会出现在你的网站上的社区。
  • 你可以从这些网站上获得关于你的内容的标签和评论。这些可以成为关键字和指导方针,为您写在您的主要网站在未来非常相关的副本。你知道人们想听什么而不是猜测什么。
  • 对这些网站的评论也意味着你开始了一个与网络用户交流的渠道,这是自然发生的,而不是将他们发送到一个复杂的联系人表单。
  • 您不必担心将图像或视频材料转换为Web格式——专门为此目的构建的网站会自动为您实现这一点。
  • 您允许其他人将您的内容嵌入到他们的产品中,从而可以重新获得他们的成功和完整性。

如果你想更多地了解这种方法,betway体育官方网退房开发者福音手册在“使用(社交)网络”一章中,我将详细介绍这一点。

将网站带到网站

另一件要考虑的事情是把网络带到网站上,让人们可以在你的界面上使用他们乐于使用的服务。

我发现其中一件非常有用的事就是聊天器.聊天捕手是wordpress插件或PHP检查各种社交网络中链接到网站的更新的脚本。这样你就可以得到Twitter的更新,比如在你的博客上以评论的形式链接到你的网站。这让我知道有多少人在谈论我的帖子,尽管我没有得到多少评论。唯一的小麻烦是会出现转发,但这是可以调整的。

另一个有趣的小工具是雅虎副业它允许您定义对Twitter网络的搜索,获取自动更新并回答tweets。

科特韦特做同样的事情,但在更专业的层面上。Cotweet是为企业管理其Twitter推广而建立的,它不仅可以帮助您跟踪人们谈论某些话题,而且还可以为几个人定义“轮班”,以便在特定时间段内监控Twitter。在世界各地都设有办公室的公司中使用它,您可以24小时在Twitter上进行报道,而无需从多个地点登录到Twitter本身。

另一种利用社交网站的方法是允许您网站的访问者直接从您的网站更新其在各种社交网络上的状态。这可以像添加“tweet This”或“bookmark This in delicious”按钮那样简单,也可以像在雅虎新主页上实现第三方小部件那样复杂。

深入数据网络。

将社交网站带到您的网站是第一步。在你的网站上使用“数据网”的信息会更强大,但是完成起来有点复杂。

说到多汁,美味数据

网络上充满了漂亮而丰富的数据,而且周围有很多数据。不过,我们试图做到这一点可能相当笨拙。我们需要的是一种访问数据的简单方法。一个经典的方法是雅虎派普斯.

YahooPipes是一个可视化界面,可以混合来自各种数据源(如网站和RSS喂养。该界面提醒用户visio或数据库组织工具,非常容易使用。Pipes的问题在于它是一个高科技界面(看不见或不能使用鼠标的用户无法使用它),而且很难更换管道。任何更改都意味着您需要返回管道接口,并在视觉上更改管道的结构。好消息是你可以克隆别人的管道并从中学习。必威体育下载

混合Web的一种更简单、更灵活的方法是YQL.的雅虎查询语言,或短YQL是Web的统一接口语言。语法很简单SQL:

选择服务何处条件

比如说你想让小猫出现在你的网站上(谁不想?)以下YQL声明将抓取描述中带有“kitten”字样的照片,Flickr的标题或标签。

从flickr.photos.search中选择“*”,其中text=“kitten”

假设你只想要5只小猫-你只需要添加一个限制命令:

从flickr.photos.search中选择*,其中text=“kitten”限制为5

很好,但是你从哪里能得到这个呢?YQL是一个API它本身有一个统一资源定位地址端点:

查询http://query.yahooapis.com/v1/public/yql?q={}格式={}格式

输出格式有以下两种XML杰森.如果你选择杰森您可以在javascript中立即使用数据。

重新混合网络。

你可以套几个YQL查询来执行复杂的web查找。猜猜这是怎么回事:

从flickr.photos.info中选择*,其中photo_id in(
从flickr.photos.search中选择id,其中wou id in(
select woeid from geo.places where text='london,uk'
和许可证=4
)

它的作用是:

  • 寻找伦敦,英国使用这些地方API雅虎地理平台。这是为了确保你能找到在伦敦拍摄的照片,比如英格兰,而不是一个叫伦敦的乐队。地理位置API返回一个地方作为一个在地球上或短悲伤ID。
  • 搜索具有此地球上何处ID的Flickr照片
  • 获取在Flickr中找到的每张照片的详细信息。
  • 只返回许可证为4的照片,因为这意味着这些照片是创作共享空间,您可以使用它们。这一点非常重要,因为Flickr的用户可以保护他们的照片。

使用免费小工具显示它们!

你可以使用像这样的系统雅虎用户界面库在一个很好的界面中轻松显示您找到的照片.

通过以下方式使用几个apiYQL以及宇航CSS网格可以显示特定位置的信息,而无需自己维护任何内容。这个关于德国法兰克福的例子显示这可能是什么样子。每当法兰克福的维基百科条目被更改或有人上传法兰克福的新照片时,这个页面自动更新自己,雅虎天气的变化API或者有人添加了一个在法兰克福发生的新事件。

所有这些工作都使用API

所有这些东西背后的驱动因素是应用程序编程接口或短API。安API是一种获取信息的方法,它在程序级别上驱动一个网站,并有机会重新混合这些信息。比如说,你想要Twitter上当前的趋势主题。您可以转到Twitter主页,也可以打开以下内容统一资源定位地址在浏览器:

这将为您提供杰森格式–您可以轻松转换和使用的格式。

API问题

当然,api也有一些问题。首先,外面有很多。可编程网络,一个试图跟上api的发布和消亡的门户目前列出了1400多个不同的api。这是很好的,但问题是他们中的大多数人不遵循任何其他人的结构。认证,输入和输出参数以及访问限制因APIAPI而且会使我们很难使用它们。这里就是YQL以一种简单的方式进来。

api的另一个问题是,它们可能只是实验性的,甚至可以在没有警告的情况下关闭或更改。因此,您需要编写非常防御性的代码来读取API。如果一切都失败,并保持要显示的数据的本地副本,例如Twitter将再次离线一天。

变戏法内容?

无需自己编写内容就能生成内容丰富的web产品,这听起来像是美梦成真。不过,重要的是要不断提醒我们,我们使用他人的内容,并且我们依靠他们来传递。

内容的问题

虽然您可以实现很多自动化,但在将第三方内容投入使用之前让人检查它仍然是一个非常好的主意。所有的事情都会出错——糟糕的编码会使文本看起来很糟糕,一个山核桃在CMS可以将错误的内容输入到您选择的类别中,文本可能太大而无法显示,还有许多其他因素。因此,最好编写一个验证工具来缩短文本并调整所提取数据中图像的大小。

缺乏上下文

一个可用性问题是可能缺少上下文。之前我们讲过区分一个地理位置很重要,比如巴黎,法国人喜欢帕丽斯·希尔顿。这同样适用于你从网络上获取的内容。人们很乐意分享他们的内容,但是当你把它放在他们不赞成的东西旁边时,他们会变得很不协调。记住,人们在网上发布数据是出于内心的善良。不要通过在上下文之外显示信息来降低成本。

用户原创内容问题

专业记者和作家长期以来一直在批评的一件事是,虽然用户生成的内容有很多直接性,但也缺乏质量控制。可悲的是,在很多情况下,最有动力表达自己观点的人是最不合适的。评论可能会很尖刻,让人们不再相信web2.0是一种告诉别人你想法的方式。诀窍是善有善报。对你来说,这再次意味着用户原创内容数据不是你应该测量的——质量是你需要关心的。

安置

错误的放置会降低整个数据网络的成本。例如,如果你在保修期满后的某一天,在这些型号容易爆炸或死亡的新闻旁边展示某个品牌的笔记本电脑的照片,你不会给自己任何帮助。再一次,在坏消息旁边显示人们的评论和博客文章也可能让他们生气。

法律问题

这就引出了法律问题。仅仅因为数据在网络上可用并不意味着你可以使用它。您可以在web上拥有大量的免费数据,并使用这些数据使现在或多或少有些无用的域名停放站点对读者来说更有价值。但是,您还需要确保允许您使用该内容,并以正确的属性显示该内容。

演示和资源

下面是一些任何开发人员都可以通过一点努力来使用和构建的东西。

  • 我的公文包页面完全由YQL在服务器外部维护。如果我想升级它,我要么在上面贴点东西我的部落格,更改一些博客页面,将新书签添加到美味的或将新幻灯片上载到SlideShare
  • 关键词查找器使用雅虎BOSS API查找与您输入的任何项目相关的关键字。关键字是真正的用户输入的关键字,以便在雅虎搜索中获得前20个搜索结果。
  • 耶斯洛是一个火狐插件,允许你分析为什么你的网站速度慢,可以做什么使它更灵活,从而创造更快乐的访问者。
  • 土工格室是工具的基础雅虎占位符在文本中找到地理位置并将其转换为地图或可嵌入的微格式。
  • 盲目搜索是对雅虎的一个并排比较,必应和谷歌搜索结果,因此一个快速的方法,找出你如何在所有三个排名。
  • 相关器是替代搜索界面的实验。您可以按兴趣筛选结果,而不是获取“全部捕获”搜索结果页面,地点或人员。
  • 开发者福音手册这是我写的一本免费的在线书,在这一章中,我将详细介绍本文所涉及的主题。
  • Web开发解决方案这是一本我和Ed的朋友们出版的关于使用分布式数据进行Web开发的书。

玩得好!

作为最后一件事,我想提醒你,在社交网站上表现好是很重要的。一切都是为了付出,分享和联系,如果你滥用这个系统,人们会抱怨你,并引起一场很难与公关或营销抗衡的骚动。但是,如果你接受了网络的社交方面,你会有相当大的影响,如下面的例子所示。

CalalIF.Org

Colalife这是一个很好的例子,说明使用社交网络可以对人们的生活产生影响。colalife的组织者利用社交网络(Facebook和Twitter)来说服可口可乐公司将免费药物与饮料一起运送到第三世界国家。可口可乐在世界各地都有销售渠道,并设有冷藏库。科利菲公司的员工设计了一种特殊的设备,可以在不占用额外空间的情况下,将避孕药具和补液药物储存在玻璃瓶中。可口可乐公司同意了这一点,现在药物免费提供给那些需要它的人,公司创造了大量的善意。这是一个拥有数百万想法和网络的人,他可以自由地告诉一家公司是什么让这一切发生。

谢谢!

这就是我想说的,谢谢。

额外成就

作为额外的,我很高兴地宣布,由于我在点酒方面的创造性,多伦多的丽笙酒店现在提供了一种新的鸡尾酒,它是我发明的“keylime pie”,由斯米尔诺夫香草制成。酸的混合物和苏打水。这对我来说是另一个第一次——我的任何发明都没有出现在鸡尾酒吧的菜单上!

创建快乐的小网站——我在《卫报》上的科技演讲

星期六,6月28日,二千零八

这是我今天在伦敦卫报办公室做的报告。在这篇文章中,我介绍了我发现的关于开发网站的不同伟大想法。点击这里查看演示文稿:

[幻灯片共享ID=488632&Doc=HappylitleWebSites-1214566328957709-8&W=425]

监护人已经记录了我的谈话,并将在在卫报博客里

现在都是关于api的。

星期五,11月2日,2007

看到Web API主题的覆盖面不断增加,真是太酷了。API最终演变为跨多个系统工作也非常令人兴奋,从检索数据的单向流聚合并移动到应用程序的另一个入口点。例如,在电影或书籍网站上为亚马逊写评论会有多酷?有了编写api,我们就可以利用人们在网上闲逛的地方的知识,而不必诱使他们使用web应用程序。

不管怎样,这个新的API我今天有三次获释:有关于.NET杂志API的播客和杰里米·基斯一起,Paul Hammond德鲁·麦克莱伦,由保罗·博格主持,阿贾克斯群岛以我的幻灯片分享“黑客”为特色RSS喂养我上传了我在邓迪大学黑客日介绍会上做的演讲,昨天苏格兰。

享受!