WEB制作

WEB制作について

WEB制作とは、いわゆるホームページ制作とかWEBサイト制作とほぼ同意とされ、ホームページを作成する作業、もくしは業務を意味します。

しかし、WEB制作=ホームページを作成するといっても、その意味合いや作業範囲は画一的なものではなく、視覚的な作業であるデザインやビジュアル設計や、情報構築やユーザビリティ、検索エンジン対策でのマークアップ構造の設計、WEBマーケティングを意識したライティングやサイト構造の設計まで実に多岐にわたり、それぞれの作業内容も容易なものではありません。

実際の制作においても、HTMLコーディングにおいては、ブラウザーやUAを考慮したCSSやHTMLマークアップ、動的機能を持たせるためのJavaScriptやJquery、ActionScriptを駆使したFlashコンテンツ、PHPやJavaなどのWEBに特化したプログラム機能との連携など、内容や仕様により、規模や予算、スケジュールや関わる人員も大きく異なります。

いずれにしてもWEB制作について一番重要なことは、ヴィジュアルデザインや高度なシステム機能、やみくもなWEB広告や広報活動ではなく、インターネットユーザーを意識した品質の伴ったプロモーションに尽きるといえます。

Flash制作について

Adobe Flash(アドビ フラッシュ)は、Adobe Systems(アドビシステムズ Systems)社の開発による、音声や動画、ゲームやグラフィックアニメーションなどを組み合わせて再現することが可能な、オーサリングソフト、または作成されたコンテンツのこと。

Flashコンテンツは、WEB専用のコンテンツで、再生するにはブラウザ専用プラグイン『Flash Player』をインストールするこで可能である。Flash Playerは無料で配布されていて、Adobe社によるとネットユーザーの90%以上の環境に、プラグインがインストールされている。『Adobe AIR』OS上で実行できるアプリケーションのこと。

もともとは、FutureSplash社から『FutureSplash Animater』という簡易的なアニメーション作成に特化していたアプリケーションであったが、Macromedia社により買収され『Macromedia Flash』となり、その後Macromedia社がAdobe社に買収されたことにより『Adobe Flash』として今日に至っている。

テキストエディタのサクラエディタで起動時の折り返し方法を『右端折り返し』デフォルト設定する

Webの制作過程でサクラエディタ折り返しデフォルトの右端折り返し起動設定が必要になったので、テキスト編集ソフトウェアのSAKURAエディタで『右端折り返し』デフォルト設定してみます。

 

はじめに

最初の手順としては、まずサクラエディタを起動して空のファイルを表示します。

 

その次に、

メインメニューを、[設定]⇒[タイプ別設定]⇒[スクリーン]タブ、レイアウト項目・折り返し方法のプルダウン[右端で折り返す]と変更をします。

 

最後の手順

としてはダイアログで、[OK]⇒プログラムの再起動することで今回は完了です。

 

この工程の流れで気を付けたい事が、設定から直接折り返し方法を設定した場合は、再起動後に元に戻るという点について注意する必要があります。

メール送信時の差出人文字化けのmb_send_mail-PHPの解決方法

今回のシステム開発で取り扱うテーマは『mb_send_mailでメール送信者情報の日本語が文字化けしてしまう』の解決方法である。

$header= From:送信者名.$mail;
などとしてそのまま、mb_send_mailの引数として変数を放り込むと文字化けするので、
$from_name=送信者名;
$header= From:.mb_encode_mimeheader($from_name).$mail;
として一度エンコードする処理を入れる
とする。

解決方法の補足として、あわせて以下のように文字コード指定をしておく必要があるようだ
mb_language(uni);
mb_internal_encoding(utf-8);
mb_http_input(auto);
mb_http_output(utf-8);があり、メール送信時の差出人文字化けについて今回のテーマの補足知識となります。

問題解決カテゴリーとしては、mb_send_mailについてのPHPに分類される。

情報について、検索エンジンでは下記の関連情報での組み合わせでインデックスされている。
mb_send_mail 文字化けに関連する検索キーワード
mb_send_mail 文字化け utf-8
mb send mail文字化け
php mb send mail文字化け
send mail文字化け
mb send mail header文字化け
mb send mail文字化け機種依存文字
mail文字化け
mac mail文字化け
apple mail文字化け
live mail文字化け

電話番号の正規表現チェックのPHP関数-PHPの解決方法

今回のシステム開発で取り扱うテーマは『PHPで電話番号の正規表現での入力チェックをif文記述で判断』の解決方法である。

PHPで正規表現をチェックするにはpreg_match関数をつかいます。

電話番号が半角数字とハイフンで入力されていませんとする。

解決方法の補足として、ハイフンを含んだ場合の記述例でしたが、ハイフン無しも併せてチェックする場合は、preg_matchiの引数として以下の記述とします。
/^([0-9]{3}-[0-9]{4})?$|^[0-9]{7}+$/があり、電話番号の正規表現チェックについて今回のテーマの補足知識となります。

問題解決カテゴリーとしては、PHP関数についてのPHPに分類される。

情報について、検索エンジンでは下記の関連情報での組み合わせでインデックスされている。
php 電話番号 判定
php 電話番号 正規表現 ハイフンなし
php 電話番号 ハイフン
php 電話番号 正規表現
php 電話番号チェック
php 電話番号 バリデーション
php 電話番号 ハイフン 追加
php 電話番号 フォーマット
php 電話番号 正規表現 ハイフン
php電話番号ハイフン削除

エックスサーバー間でのサーバー移転

Xserver同士で異なるアカウント間のサーバーの引っ越しの方法を調べました。

Webサイト管理を一つのアカウントに統一するためです。ちょっと特殊なケースなので備忘録として。
ドメインの移管などは発生しないので、作業自体は2日程度で完了するでしょう。

WordPressで管理するサイトだったので、データベースの移転も併せて行ってみます。
作業をおおまかに分けると以下のようになります。

1.移転元サイトディレクトリデータのバックアップ

2.移転元MySQLデータベースのバックアップ

3.移転元各予備データバックアップ

4.ドメインの削除と追加

5.移転先MySQLデータベース作成

6.移転先サイトディレクトリデータアップロード

7.動作確認

Xserverの管理画面や機能は初心者にもやさしい配慮がされているので、順番さえ間違わなければ、わりと簡単に移転ができます。

Xserver内でサーバー移転を行う場合の一番の注意点は、ドメインの移管を行わないので、ドメイン設定が移転元から移転先で完了する間、おおよそ24時間ほどはサイトが表示されなくなるので注意が必要です。

また、別会社のレンタルサーバーへの移転やについてもデータやDBバックアップ、予備データの定期的なバックアップについては基本的には同じ作業になるので、同じ手順でバックアップを保存しておくのもよいでしょう。

1.移転元サイトディレクトリデータのバックアップ

まずは移転元のサイトディレクトリのデータをバックアップしますが、この作業は15秒程度で完了します。

Xserverサーバーパネルのアカウント項目、バックアップから該当する対象ディレクトリをダウンロードします。

これで移転元サイトディレクトリデータ保存は完了です。

アカウントrootを一括でもダウンロードできますし、設定したドメインのディレクトリのみを選択してもダウンロードできるので、非常に便利です。

2.移転元MySQLデータベースのバックアップ

XserverサーバーパネルのphpMyAdminにログインします。
ログイン情報はwp_config.phpに記載されていますので、忘れた場合はこちらのDBユーザー名とパスワードでログイン可能です。

phpMyAdminの管理画面にログインすると左上にinformation_schema(MySQLの基本設定情報)とWordPress用に設定したMySQLのデータベース名の二つのDB名が表示されているので、WordPress用に設定したMySQLの方をクリックします。

WordPress用に設定したDBの構造が表示されたら、上部のタブの”エクスポート”をクリックしてDB のダンプ(スキーマ)表示画面に。

通常はこのまま”ファイルに保存する”にチェックを入れ、”zip形式”を選択して、画面左下の”実行”ボタンをクリックすると、圧縮されたDBファイルが自身のパソコンにダウンロードされます。

これで移転元のDBバックアップは完了です。

3.移転元各予備データバックアップ

Xserverにはサーバメールやメールマガジンなどの機能も付属しており、念のためWordPressの投稿データなどを含めて個別にバックアップをとっておきます。

WordPressはダッシュボードからのエクスポート機能ですべてのコンテンツのxmlデータをダウンロードしておきます。

メール設定についてはサイトディレクトリのデータの中にWebメールのデータがドメインフォルダのmailフォルダに保存されているようですが、基本バックアップできないと思った方がよさそうです。移転先で複数のメールアドレスを一括して追加できるので、サーバーパネルのメールアカウント設定からアドレス一覧をコピペしてメモ帳で保存しておきました。

メルマガやメーリングリストも利用していた場合は、ひな形やタイトルを同じくメモ帳で保存しておきました。xmailinglistというフォルダに保存されているようですが、ちょっとあやしいので送信先のアドレスなどはexcelなどで管理しておいたほうが無難です。

CGIツールのメールフォームはディレクトリアップで大丈夫でしたが、アクセス解析は上手くいきませんでした。

これで移転元の各予備データバックアップは完了です。

4.ドメインの削除と追加

移転元のドメイン設定からサーバー移転する対象のドメインを削除します。ドメインを削除すると、ドメイン下のフォルダや各設定はすべて消失するので注意が必要です。MySQLのデータベースは、個別に削除する必要がありますが、こちらは可能な限り保存しておいたほうが無難でしょう。

移転先のサーバーパネルから、先ほど移転元で削除したドメインを追加します。ドメインが削除されていない場合はエラーが出て追加できないのと、ドメインのトップレベル部分comやjpはプルダウンからの選択になっているので、間違いないように注意しましょう。

上記作業が完了して、ドメインにアクセスして以下のように表示されていれば、あとはサーバー移転の設定が完了するのを待つことになります。

「無効なURLです。ドメイン設定の反映待ちか、存在しないアドレスです。
再度ご確認のうえアクセスをお試し下さい」

以上の作業で、現在のサイトは完全に閲覧できなくなり、メールの送受信もできなくなります。今回の場合は平均して20時間ぐらいはドメイン管理の変更でサイトが表示されなくなりました。

これでドメインの削除と追加は完了です。

5.移転先MySQLデータベース作成

移転先のXserverアカウントで、新しいMySQLのデータベースを作成します。移転元ではMySQL5と5.5が混在しているタイプでしたが、新しい移転先のアカウントでは5.5で統一されていました。

データベースはXserverのサーバーパネルから、MySQL設定で新しいユーザーとデータベースを作成します。

データベースには空のデータベースを作成して、移転元でバックアップしたMysSQLのデータベースをインポートします。

phpMyAdminの管理画面にログインすると左上にinformation_schema(MySQLの基本設定情報)と新しくWordPress用に設定したMySQLのデータベース名の二つのDB名が表示されているので、WordPress用に設定したMySQLの方をクリックします。

WordPress用に設定したDBの構造が表示されたら、上部のタブインポート”をクリックしてインポート表示画面に。

“インポートするファイル”するの参照から、保存しておいた移転元のファイルを選択して、画面左下の”実行する”をクリックして完了です。

6.移転先サイトディレクトリデータアップロード

移転元からダウンロードしたファイル内のpublic_htmlフォルダ内のwp_config.phpの以下の項目を、移転先で設定したMySQLのデータベース内容に変更してから、public_htmlフォルダのすべてを同じディレクトリにアップします。

/** WordPress のためのデータベース名 */
define(‘DB_NAME’, ‘データベース名’);

/** MySQL データベースのユーザー名 */
define(‘DB_USER’, ‘ユーザー名’);

/** MySQL データベースのパスワード */
define(‘DB_PASSWORD’, ‘パスワード’);

/** MySQL のホスト名 */
define(‘DB_HOST’, ‘mysql移転先.xserver.jp’);

このままでは確認できないので、Xserverサーバーパネルの動作確認URL設定でURLを追加してみましょう。

元のWordPressサイト構成が表示されていればまずは一安心です。デザインなどは内部的テーマのパス指定の違いなどの影響で、正常には表示されていませんでした。

これで移転先サイトディレクトリデータアップロード作業は完了です。

7.動作確認

おおよそ24時間以内には新しいWebサーバーの内容が関連付けられますので、何らかの画面が表示されれば、正常にドメイン管理の変更は完了しています。

ただし24時間以上経っても、以下のメッセージが表示され続ける場合はブラウザのキャッシュクリアをすると更新される場合があります。

「無効なURLです。ドメイン設定の反映待ちか、存在しないアドレスです。
再度ご確認のうえアクセスをお試し下さい」

まずは、メールアドレスの追加を一括で行い送受信を試してみます。送受信に問題がなければ、サイトの動作確認に移ります。

移転元と移転先のPHPのバージョンが異なる場合注意が必要で、TOPページ以外表示されず404サーバーエラーが発生したり、PHPのエラーやWarnningなどが表示されたりします。

今回はhtaccessファイルの作り直しが必要であったため、サーバーパネルの自動インストールからWordPressを一度インストールして、自動生成されたhtaccessファイルを取得してURLを変更してアップしたら、下層ページが表示されるようになったりと、個別に動作確認と対応をする必要があるので、ひととおりサイトの動作確認を行った方がよいでしょう。

※データが喪失する恐れがあるので、どのようなデータも2種類以上でバックアップしておくのがよいでしょう。