Explore
For Enterprise
Join for Free
Log In

芸術と人文
ビジネス
コンピューターサイエンス
データサイエンス
情報技術
健康
数学と論理
自己啓発
物理科学とエンジニアリング
社会科学
言語学習
学位および修了証

Coursera（コーセラ）内をすべて検索

閲覧
検索
企業用
ログイン
参加は無料

03.05 - Using Secure File Transfer Protocol

Loading...

Introduction to HTML5

ミシガン大学（University of Michigan）

4.7 (7,980 件の評価) | 140K在籍する学生

Web Design for Everybody (Basics of Web Development and Coding) 専門講座における 5 の 1 コース

シラバスを表示

Thanks to a growing number of software programs, it seems as if anyone can make a webpage. But what if you actually want to understand how the page was created? There are great textbooks and online resources for learning web design, but most of those resources require some background knowledge. This course is designed to help the novice who wants to gain confidence and knowledge. We will explore the theory (what actually happens when you click on a link on a webpage?), the practical (what do I need to know to make my own page?), and the overlooked (I have a page, what do I do now?). Throughout the course there will be a strong emphasis on adhering to syntactic standards for validation and semantic standards to promote wide accessibility for users with disabilities. The textbook we use is available online, “The Missing Link: An Introduction to Web Development and Programming” by Michael Mendez from www.opensuny.org. This course will appeal to a wide variety of people, but specifically those who would like a step-by-step description of the basics. There are no prerequisites for this course and it is assumed that students have no prior programming skills or IT experience. The course will culminate in a small final project that will require the completion of a very simple page with links and images. The focus of this course is on the basics, not appearance. You can see a sample final page at http://intro-webdesign.com/html5-plain.html. This is the first course in the Web Design For Everybody specialization. Subsequent courses focus on the marketable skills of styling the page with CSS3, adding interactivity with JavaScript and enhancing the styling with responsive design. You can see a sample site for the capstone course at http://intro-webdesign.com/

学習するスキル

Web Design, Web Accessibility, Html, Html5

レビュー

4.7 (7,980 件の評価)

5 stars
6,042 ratings
4 stars
1,609 ratings
3 stars
260 ratings
2 stars
31 ratings
1 star
38 ratings

CR

Jan 31, 2016

Exceptional course, taught by a friendly, talented teacher. Perfect introduction to HTML. While the course seems to be still under development (there is the odd typo or the like) it's a great start.

NJ

Apr 26, 2019

I didn't know about making my web pages accessible till this course. But now I know how important it is for my web pages to be accessible to all, for my html to validate and be semantically correct.

レッスンから

Week Three

Okay, you created a file...what now? This week we will begin by covering the important but often overlooked concepts of validation and accessibility. Did you follow the DOM structure when you created your page? Did you use semantic tags to make sure that page viewers can access all of the information, even if they have physical or cognitive disabilities? This is knowledge you can use if you would like to pursue a career as a web accessibility specialist. Finally I will briefly cover the steps needed to post your site to the web. There are many free and paid services that you can use to get your work off your computer and on to the Internet.

03.03 - Hosting Your Site5:05

03.04 - cPanel8:31

3.04a - Creating a GitHub Pages Account5:29

3.04b - Uploading to GitHub Pages Account8:24

03.05 - Using Secure File Transfer Protocol7:51

講師

Colleen van Lent, Ph.D.
Lecturer
Charles Severance
Professor

Hi, in today's lecture, we're gonna talk about SFTP which stands for

Secure File Transfer Protocol.

What this is, it's a fast way for

your to move your files that you've been creating out onto the web.

So, secure file transfer is just really a common way of moving files from your

computer off to either someone else's computer, off to your server, or

even up to some other computer that's within your business.

People use the terms FTP and SFTP interchangeably.

What's important for you to know is that the S stands for secure.

So a lot of times, people are going to require that you use the SFTP protocol,

instead of the FTP protocol.

So when I say the word protocol, hopefully in your mind that's causing a little bit

of a flashback into our early lectures when we talked about how browsers interact

with the files that are sent to them.

So with HTTP or HTTPS, your browser knows, oh,

here's a file that she wants me to display.

I should ignore all the tags and go ahead and put up a nice site for them.

In the same way, you may have seen that there is a file protocol,

which works pretty much the same way and says they've been making a web page,

and it has been existing on their computer.

With FTP or SFTP, what is going on is the browser is being told don't display these

files, we actually want you to transfer them from one computer to another.

What's also really nice about most FTP/SFTP software programs is that

they let you drag and drop the files instead of uploading them one at a time.

So, let's say that you're ready to go ahead and do secure file transfer.

There's a few things that you're going to need.

The first is your going to need what we call FTP client.

What this is, is a software the you will use to connect different machines.

If you're using a PC a common software program is WinSCP.

If you're using a Mac many people use Fugu or Cyberduck.

No matter which one of this three programs you wanna use,

they're all free for download.

Once you have your client, you need to go back and find out what the FTP address for

your host is.

When you signed up for a hosting service, they probably sent you an email that was

full of information that you didn't really understand.

It's time for you to finally dive into that email and

start using the information.

So let's go ahead and do it together.

So here's an email that my hosting service sent to me with all the information I

was going to need to connect to my site.

Now if you look I have different things such as my account details and

the site administration that tells me how I can connect if

I was going to use something called zpanel.

But since I'm using FTP, or in my case SFTP, what I need to know is the address,

the port, and then there's also my username and my password.

In many cases they don't specify a port, but my particular hosting service did.

So let's go ahead and copy this, and

I'm gonna log on with Cyberduck.

[NOISE] Now, as may of you bring up Cyberduck some of you may end

up having a picture very similar or a little graphic very similar to mine.

If nothing showed up what I want you to do is go up to the top, and

you should have a file and this is true if you're using WINSCP or Fugu instead.

And you're gonna wanna go to open connection, and

that's what brought me up here.

So when I click on open connection, one

of the first things you need to decide is whether you're gonna be using FTP or SFTP.

Next, you need to put in your server.

And if you need to, your port.

Finally, go ahead and put in your user name and password.

Hopefully, you've remembered all that information and

the connections going to pop up for you.

Don't be surprised of you forgot once or twice what that connection is, and

if it pops up a warning.

All right, once your window pops up,

you're going to see that you have a few different folders.

These different folders contain different information that your

hosting service may or may not want to be shared.

So for instance, think about any web site that you go to such as Facebook, Amazon.

What's going on is that there are a lot of files going into building these sites, but

they only want you see some of them.

And those files that they want you to see,

they need to reside in the public HTML folder.

So when I go in here, what I want to just warn you about, is that when I click on

the public HTML folder and you click on it, it's going to look very different.

The reason for that is that I've already uploaded a lot of files, and for you it's

most likely that the only file that's in there is something called cgi bin.

And you wanna just pretty much leave that one alone.

Now, what you wanna do next is start dragging and

dropping some of the files that you wanna see.

So let's go ahead and look at a site that I can use as an example.

I'm gonna go ahead and bring this, open.

And it's just a little site I have about Ashtabula.

It's got a picture, and a couple maps on it.

And if I go to the intro website, you can see that it doesn't exist there.

There's nothing there, we get a 404, which means hey, you asked for this file and

it doesn't exist.

So let's go ahead and move those files over using cyberdock.

So I'm going, all the code I wanna upload is over here.

It's in a folder called Ashtabula.

With many other services, I would need to go in and upload each file one by one.

But instead, I'm gonna drag this entire folder over and drop it in.

By the way, when you're dropping in, make sure you're dropping it in,

right in the public HTML, not in a sub-folder if you have one.

Not in the cgi-bin.

Great.

So there's Ashtabula.

Let's try reloading my folder, and you can see that I come very close to success.

I've got the two maps ,but the top picture is missing.

Instead, all we see is the alt text.

It's basically saying I can't find that picture.

So let's a take a look and see what it's supposed to be looking at.

I'm going to go to right click.

Inspect element.

And you can see it says, hey I can not find this picture down here.

You're asking me to upload something called harborJTwide.jpg I don't

know what that is.

Alright, let's check out Cyberduck.

Here's attribute, here's images.

You can see, oh, but the picture's right there.

But if you look really closely, you can see I used lowercase h over here and

an uppercase H over here.

I need to change the code.

There are two ways you can do that.

You can either edit it right within here, or you can change it on your computer and

drag it up again.

Let's go ahead and just edit it right here.

Oops.

Actually, let's not because that's a picture.

What I really wanna edit, is the html file.

I'm glad I made that mistake.

It keeps you from making it yourself.

So I'm gonna change this lowercase h to an uppercase H,

save it, and let's try reloading.

Success.

We've got the file just as we wanted it.

Now anytime you change a file, you're going to have to remember

that any changes you make you need to drag and drop back up.

That's one of the main reasons people have trouble with FTP,

is that they forget what they uploaded and what they haven't.

That's why I really like the ability to upload and

entire file over one at a time as well as individual files.

Let's go ahead and review a little bit.

You can upload your files many ways, you can use C-Panel, you can use Fugu,

you can use Cyberduck, you can use WinSP.

There isn't a single right way to do it, but the most important thing is,

before you can go ahead and use any of these software tools, it is important for

you to know your login information.

So, hold on to that e-mail when your hosting service sends it to you,

you will be really glad you did.

Good luck,

コース一覧で検討

サインアップは無料です。今すぐサインアップして、パーソナライズされたお勧め、更新、サービスを利用しましょう。

コーセラは、世界トップクラスの教育を世界中に配信しています。最高峰の大学や組織とのパートナーシップに基づくオンラインコースが提供されています。

© 2019 Coursera (株)すべての権利予約します。

App Storeからダウンロード

Google Playで取得

Coursera
このコースについて
リーダーシップ
キャリア
カタログ
修了証
MasterTrack™の修了証
学位
企業用
政府向け

コミュニティ
Learners
Partners
Developers
Beta Testers
Translators

つながる
ブログ
Facebook
LinkedIn
Twitter
Instagram
Youtube
技術ブログ

さらに表示
規約
プライバシー
ヘルプ
アクセシビリティ
報道関係者
お問い合わせ
ディレクトリ
アフィリエイト