デイトラWeb制作初級編『Day17~19 ポートフォリオ作成&公開で詰まった所』

うにょママ
うにょママ

ポートフォリオ作成&公開で大きくつまづいた(解決に時間がかかった)箇所が二点あります。何につまずいたかと解決方法の備忘録です。

FTPソフトを使ってのサイト公開(ファイルのアップロード)がわからない

私はこのブログ開設時にConoha Wingでサーバー契約をしました。

そのためエックスサーバーの新規契約はせず、Conohaで新たにドメインを取得しました。

ファイルアップロードの流れがエックスサーバーとは違ったので、自力で調べて解決するのにとても時間がかかりました。

ConoHa WINGでは、FTPアカウントを管理画面から自分で作成します。(多くのレンタルサーバーは自動的に割り当てられる。)

IT超初心者の私、FTP?は?というレベルなので、調べて進めるだけでとても時間がかかりました。

無事にFTPアカウント取得し、FTPソフト(Cyber Duck)でファイルをアップロードしようとしたのですが、ここでもつまずきポイント。

使い方がよくわからない!!! 

色々調べたあげく、FTPソフトを使わずにファイルをアップロードしました。

IT超初心者の私にはこのやり方が簡単でした。

でも、ここで疑問がでてきました。

FTPソフトを使わずにファイルをアップロードできるのに、わざわざなんでFTPソフトを使うんだ??

(エックスサーバーも同様にFTPソフトを使わずにファイルをアップロードできるらしい。)

なので思い切って理由をメンターさんに聞いてみました!

メンター様のお答え

実際のお仕事ではクライアントさんにサーバーのアカウントとパスワードを聞いて、サーバー内を直接見ることは無い。

ファイルのアップロードに必要な情報(FTPサーバー名、ユーザー名、パスワード )だけをもらい、FTPソフトを通してサーバーにファイルをアップロードする。

言われてみれば当たり前か!

HP制作者がクライアントさんの他のファイルを覗けたら機密的にも問題があるし、誤ってファイルを削除してしまったら大変なことになる!!

もしConohaを使っていてFTPソフトでファイルをアップロードする場合は以下のサイトが参考になります。

ツイッターカードが表示されない

頑張ってポートフォリオ作成し、サイト公開も完了!!!

後はツイッターカードを作成し、シェアすればOK♪

のはずだったのですが、ツイッターカードが上手く表示されない(泣)

解決までにとても時間がかかりました。。

こんな感じで、チェックはオッケーとなっているのに画像が表示されません。

いろいろ試した結果、画像のサイズを指定したら上手く表示されました!

チェックした事
  • OGPタグが正しいか
  • 「og:image」のパス、ファイル名は正しいか
  • ページURLとサイト名が繋がっていないか
  • Twitter(Card Validator)キャッシュのクリア
  • 適切なサイズの画像を選択しているか

画像のサイズを指定すれば良いと気づくまでにかなり時間を費やしました。。。

キャッシュのクリア何回もしたり、タグやファイル名のチェックばかりしてました(;´Д`)😞

幅1200×高さ630の画像を用意しておけば良かったようですが、よくわかっていなかったので画像のサイズが合っていませんでした。

HTMLでwidthとheightを指定することで、画像を差し替えなくてもうまく表示されました。

まとめ

みんながつまずかない所で、自分だけがつまずいているんじゃないかと落ち込んだりしました。

エックスサーバーで契約しとけば良かったかな、とか。(笑)

時間はかかりましたが自力で調べて解決までたどり着けたことで、少し自信がつきました^^

この記事を書いた人

うにょママ

元駐妻。7年半過ごした台北から2022年2月に本帰国しました。
このブログではWeb制作の勉強、台湾生活、子育てについて気ままにつづっています。