HTML5、CSS3与JavaScript实战建站指南

需积分: 10 142 浏览量更新于2024-07-27 收藏 5.36MB PDF 举报

本资源是一本深入讲解网站创建技术的教程，特别关注HTML5、CSS3和JavaScript这三大核心语言。"Foundation Website Creation with HTML5, CSS3, and JavaScript"这本书旨在为初学者和进阶开发者提供一个系统的学习路径，帮助他们理解和掌握构建现代网站所需的关键技能。在"Introduction"章节中，作者强调了对web开发的入门者来说可能会感到的挑战，因为web技术领域广阔且不断更新。书中提到，要学习的内容包括但不限于web历史、项目管理、设计规划、以及如何使用HTML5为页面结构奠定基础。HTML5章节重点介绍了新的语义元素和特性，如语义化的文档结构、多媒体支持等，这对于提升网页的可访问性和SEO至关重要。 CSS3在本书中占据重要地位，不仅涉及基本概念，还涵盖了实践中的设计和部署技巧。读者将学习到响应式设计，确保网站在不同设备上都能提供良好的用户体验。CSS3的新特性如动画、布局和过渡效果将被深入探讨。 JavaScript部分分为两章：初识JavaScript以及更深入的理解。初级章节介绍了JavaScript的基础语法和脚本编写，而深入章节则会探讨函数、对象、DOM操作等高级主题，同时还会涉及前端框架和异步编程的概念。服务器端技术在第11章被提及，虽然主要聚焦前端，但理解后端如何与前端交互是全面开发不可或缺的一部分。此外，作者还推荐使用WordPress这样的内容管理系统来加速开发过程，并在第12章提供了具体的应用指南。最后，"Afterword: The Business of the Web"章节探讨了web开发背后的商业逻辑和技术趋势，为读者提供了对整个行业的宏观视角。书末的索引方便读者查找和回顾所学内容，使整个学习过程更加有序和高效。这是一本既适合新手入门，又适合有一定经验的开发者提升技能的实用教程，通过系统学习，读者能够建立起坚实的基础，应对web开发的复杂性和多样性。

Chapter 2

Keeping a Project on Track

Project management doesn’t have to be rocket science. Sure, there are libraries full of books on the topic

that make managing projects sound like PhD-worthy material. Trust us, though: when you’re starting out,

keeping things simple is the best advice we can offer you! Chances are that the project that you’re cur-

rently staring down isn’t overly complex, so don’t let it jump in complexity in your mind. We’re going to take

a quick look at a few different ways of managing projects and the three things you should always keep in

mind: time, money, and scope (what needs to get done).

The process of web design and development is a unique one. The old-school method of managing projects

isn’t necessarily the best approach in an industry where new competitors and technologies can emerge

during the course of a three-month project. It’s often reasonably cheap and easy to make changes at

any stage of a project. Even though we made the direct comparison of construction work to web work in

Chapter 1, we framed it like that in order to give you an idea of what the various roles are on a web project.

In reality, building a website isn’t like building a house at all; you’re not tied to particular dimensions after

pouring the foundation. The materials used are all digital; and for that reason, they are easy to work with

and make changes to after the fact. Deleting something doesn’t involve a wrecking ball, and adding some-

thing new doesn’t require materials to be purchased and brought in from off-site. If you’re ﬁve days into the

project and your client suddenly decides that she would, in fact, like to accept orders online instead of only

telephone orders, then all you have to do is hand the client a revised cost estimate and timeline (if even

this). After a website has launched, you might start hearing from visitors that they need to be able to import

data in a certain format. If so, you can develop and push that revision out near-instantly by publishing it to

Chapter 2

the server. No jackhammers, no demolition crew, and no need to make three million duplicates. So, why

then should you plan everything up front and set it in stone on day one?

The project manager on a web project doesn’t have to be ﬂuent in all development languages, database

systems, and server setups (it doesn’t hurt to know a little about each, though, just so you can tell whether

someone is pulling your leg). The project manager has to know how to deal with people, keep everyone

happy (or at least productive), and assure everyone involved that the project is moving forward. The main

goals are to remove any roadblocks to project completion. If your developers’ ofﬁce is under renovation

and they can’t get any code written because someone is always hammering, then ﬁnd somewhere quieter

for them to work. If your designers’ computers are constantly crashing, causing them to have to revisit the

same work over and over again, get them new machines.

The traditional approach to project management

Project management, in the traditional sense, is often very complex. This single chapter deﬁnitely couldn’t

cover all aspects of it, but we are hoping to share with you some tips and things to look out for along the

way. We’re strong believers in developing project-management skills, if for no other reason than to improve

your skills in estimating. Since everyone has his own way of dealing with things and no two projects are

the same, we can’t give you the perfect road map for getting from x to y to z in every case. Our best advice

is to go with your experience; and if you really don’t know the answer, admit it and then ﬁnd the answer.

Although it’s possible that you may be the only person working on any given project, more often than not

you will be part of a team. There will always be someone to turn to for advice (or at least an opinion) if you

get stuck. If the worst comes to pass, there’s always the Internet—we hear you can always ﬁnd someone

willing to give you their opinion there, right or wrong!

The traditional approach to project management has its roots in the construction industry. In fact, the U.S.

Navy ﬁrst conceived of this project-management process in order to get a better handle on the process

of building ships. When materials need to be ordered, parts manufactured off-site, and specialized labor

brought in, there is a big advantage in trying to plan things in advance. Having software specialists sit-

ting around before the computers used for targeting enemies have been installed is a huge waste of time

and money. Having a master plan that lets you see, in advance, whether things are ahead of or behind

schedule gives you that ability to contact subcontractors in advance and either delay or move up their

participation in a project.

When we mention the traditional approach to project management, we’re referring to the formal process

taught by the Project Management Institute (www.pmi.org). This process is sometimes referred to as the

Waterfall model; with this method, a project is planned as much as possible up front. Planning continues

until a consensus on “perfection” is reached, and then work commences. There is a lot of criticism of this

way of doing things, particularly in software and web development projects, because there is no feedback

and evaluation built in until the end of the project. Instead of building something small, checking in with

your client (and possibly end users) to validate your assumptions, and then continuing, you’re instead

deciding how the end result will look on day one. That removes a great deal of ﬂexibility from a project; or,

at the very least, it wastes a great deal of time as things need to get planned and replanned. This method

does have its place in certain industries, however. For example, in large-scale construction projects, you

need to have a plan in place before you start. It would be foolish to start building a high-rise ﬂoor-by-ﬂoor,

without knowing how many stories it will have until you’re done. You can’t just leave some “feature” of the

building (such as electricity) until the last minute. But you can do precisely that in web development projects.

Keeping a Project on Track

The rigidity and linear nature of the Waterfall model just doesn’t suit web development. The upfront costs

in both time and money associated with this type of planning are out of scale with most web work.

Another consideration is that, with the pace at which various technologies progress, taking three months

to plan a project up front may in fact put you three months behind the curve in terms of the technology

available. A different way to think about this is the following: say you’re spending a week at the beginning of

the planning stage of your project to do an analysis of the various database systems available, so you can

determine which one is fastest for implementing a new short text-messaging application. You look at three

different products and decide on Product A because it’s deﬁnitely the fastest in database inserts (adding

records) and selects (querying data out of the database). You ﬁnish planning and begin development.

After one week of developing your application, Product B releases a new version that is 100 times faster at

doing selects (which makes it about 20 times faster than Product A, which you’re currently using). Do you

switch? Well, you’re already falling down the waterfall; there’s no turning back now. Your entire timeline will

fall apart, and things will need to be replanned if you switch at this stage.

The nine knowledge areas

Even though the methodology may not be the most ﬁtting, it’s worthwhile drawing from the experience

of the Project Management Institute to gain some guidance in how we should proceed. Nine knowledge

areas are covered in the Project Management Body of Knowledge (PMBOK), which is published by the

Project Management Institute (see Figure 2-1). These nine areas cover every possible aspect of project

planning and management. We have space in this book only for a quick overview of each; but if you

want to learn more, we encourage you to take a look at some of the publications put out by the Project

Management Institute.

Project Time Management

Project Scope Management

Project Integration

Management

Project Cost Management

Project Human Resource

Management

Project Communications

Management

Project Procurement

Management

Project Risk Management

Project Quality Management

Project Management

Knowledge Areas

Figure 2-1. The nine knowledge areas covered by the Project Management Institute

Chapter 2

Here is a brief description of each of the areas:

■ Project Integration Management: This area looks at planning and integrating all the various parts

of the project. It talks about developing a project charter (a document that summarizes what the

project will accomplish and why it’s needed), developing a plan for the project (how you’re going

to do what you’ve outlined in the charter), and how everything is going to be communicated

between the team and the client or stakeholder(s).

 Project Scope Management: This area outlines, speciﬁcally, what work has to be done to com-

plete the project and how that work is going to be broken down between the various “resources.”

It also identiﬁes how any changes will be handled during the project.

 Project Time Management: This area deﬁnes how long a project is going to take and identiﬁes

how many people, including the speciﬁc skills and at what times, will be needed to complete the

deﬁned project.

 Project Cost Management: Money is another important factor. This area deﬁnes the budget for

the project and how things will be controlled to stay within that budget.

 Project Quality Management: How will you make sure that what you produce works and does

what it’s supposed to do? What kind of testing will be done, and what test results are accept-

able?

 Project Human Resource Management: Where are you going to get your team members? What

skills do they need? Do you need to train anyone? How will the team be managed?

 Project Communications Management: This area covers how things will be shared amongst the

project team and the stakeholder(s), how progress will be communicated and tracked, and how

things will be documented.

 Project Risk Management: This area looks mostly at the risks involved if the project fails (or suc-

ceeds; there may be risks either way). It attempts to anticipate any problems that may emerge at

various points in the project and to plan ways to minimize or eliminate those risks.

■ Project Procurement Management: How/where will products or services be acquired when

needed, and how will subcontractors be managed (if applicable)?

Although we don’t advocate going the PMI route on web development projects, your client/employer may

have different ideas (and hey, it’s their money!). If you’re required to go this route, do yourself a favor and

ﬁnd somebody with the project management professional (PMP) designation to bring on board. It’s a fairly

expensive process, in both time and money, to obtain this designation; however, if your client is a stickler

for the Waterfall method, having a PMI-accredited project manager on board will save you hours of time.

Be aware, however, that a PMP doesn’t come cheap. You will want to contact him at the very start of a

project, before the budget is set, so that he can get involved immediately.

Web project management: the power of iteration

As we mentioned previously, the web is an inexpensive medium. Making mistakes during development

is OK, and they are usually easy to ﬁx. Because of this, web-project management can be more relaxed,

allowing for feedback and change at any stage. The heavy-handed scope-management system imposed

Keeping a Project on Track

in the traditional method of project management can be relaxed, and a more collaborative development

process can be pursued. The gist of this approach goes like this: “Let’s just start building this thing; we can

make changes as we discover the need for changes. You’ve got a ﬁxed timeline and budget, that’s ﬁne. I’ll

do my best to give you updates on how we’re progressing through each of those as we go along.”

The reason this is the opposite of traditional project management is that the traditional approach aims

to control change very tightly (some might say discourage change, but that’s not necessarily true). This

approach encourages it (within the limits of time and budget), so that all parties are happy with the end

product because they’ve all been deeply involved in shaping it from the beginning. While the end result

may look nothing like what was originally talked about, the end result will still meet a need.

When it comes to developing web projects, you’ll hear a lot of different terms thrown around. Agile develop-

ment is commonly used, and it describes a number of development processes that involve multiple itera-

tions and working closely with stakeholders until everybody agrees that an end result has been reached.

If you were working for a client, you would build something and show it to her at a very early stage. The

client could try it, react to it, and tell you that changes need to be made or that something is missing. You

could then take that feedback and make those changes right away. Working this way, you would step,

piece-by-piece, through a project adding all of the functionality that is necessary.

An agile example of planning

Agile project management is better illustrated through example. Say you’re building a news website for a

client, a television network launching an on-air news program incorporating citizen journalism. The client

tells you he needs a site that will allow its viewers to submit news stories and categorize them. Site visitors

should then be able to vote on which stories they like the best, and those will be the stories that make it

on air. The client wants the entire program to be about news as it happens from the perspective of those

who are “at ground zero.” You chat a bit with the client, and you both throw together a one-page document

that outlines the general idea of what you’re going to try to accomplish. You work through a schedule and

a budget for the project, and then you get started on building a submission page.

The news website absolutely cannot exist without a place for viewers to submit stories and a place for

those stories to be displayed. It’s always a good idea to identify the core of a website (or most “inner” page

of a website) and start there, because the only thing limiting your work is time and money. Think about it:

if your time runs out and you’ve spent all of it developing a viewer-to-viewer messaging system, then the

website doesn’t accomplish what it needs to be able to do.

The submission page asks the visitor to enter her e-mail address, enter a link to the story, select which

categories it belongs to, and enter a brief synopsis. You then build a news display page that groups every-

thing by category (picture something similar to Digg.com or Slashdot.org). Your designer puts together

a mock-up, and you paste in the graphics and CSS so that your client can get an idea of what the end

product will look like.

Your client takes a look at what you’ve done so far, and he comments that the station can’t have people

submitting news stories with only an e-mail address. The station needs to know more about the source

of the story. We’ve discovered an addition; we’ll need to ﬂush this part out into a user management piece

with usernames and passwords (who wants to reenter all her contact information every time she submits

a story?). You throw together a few more pages exhibiting this functionality, and you have your client take

a new look.

剩余289页未读，继续阅读

wuguangliang55

粉丝: 0
资源: 2

HTML5、CSS3与JavaScript实战建站指南

精通HTML5、CSS3和JavaScript构建网站基础

HTML5与CSS3入门指南：打造高效网站

HTML5与CSS3基础入门：打造网页新篇章

Foundation Website Creation with HTML5, CSS3, and JavaScript 无水印原版pdf

foundation-website-creation-w-html5-css3-[removed]Joe Lewis，Jonathan Lane，Meitar Moscovitz和Tom Barker的“使用HTML5，CSS3和JavaScript创建基础网站”的源代码-html website source code

foundation-website-creation-w-css-xhtml-[removed]史蒂夫·史密斯（Steve Smith）和乔纳森·莱恩（Jonathan Lane）的“使用CSS，XHTML和JavaScript创建基础网站”的源代码-css source code

[JavaScript] 网站设计基础教程 (HTML5, CSS3, JavaScript 实现) (英文版)

FoundationWebsiteCreationWithHTML5CSS3AndJavascript.pdf 英文原版

How to Integrate kkfileview with Cloud Storage Services for Online File Browsing

精通HTML5与CSS3基础构建

最新资源