wordpressでサイトを制作する場合、大きく分けると2つの方法があります。 １つは真っ白い状態からオリジナルでテーマを作っていく場合（travel sketch）、もう１つは既存のテーマを自身でカスタマイズしていく方法です。今回は既存のテーマを自身でカスタマ…

ja.wordpress.org このプラグインは検索 & 置換操作中に発生する、あらゆるシリアライゼーションの問題も解決します。 とても簡単にデプロイ出来てしまうので、本当におすすめです。最新版は小規模なシングルサイトであれば無料で問題なく利用できますが、最…

wordpressにフォームを導入する場合、「Contact Form 7」プラグインを使うと簡単にお問い合わせフォームを導入することが出来ます。ja.wordpress.orgただ、Contact Form 7 は送信されたメッセージをどこにも保存しません。ですから、もしメールサーバーに問…

XAMPP環境でWordPressの制作を進めましたが、ポートフォリオ等に載せる為にはWordPressのデータを別サーバーに移行する必要があります。 データ移行用のプラグインなどもありますが、ここでは手作業でデータの移行を行います。 旧WordPressサイト(XAMPP)のバ…

WordPressとは WordPressとは、オープンソースのブログソフトウェアである。PHPで開発されており、データベース管理システムとしてMySQLを利用している。単なるブログではなくCMSとしてもしばしば利用されている。 WordPressのテンプレートはすべてPHPである…

canvasとは Canvasとは、ブラウザ上に図を描くために策定された仕様です。これまでHTML上で図を表現するためには、GIFやJPEGといったフォーマットの画像を用意する必要がありました。また、条件に応じて表示する図を変化させたり、アニメーションを実現する…

SEOに適した無限スクロールの導入 FacebookやTwitter、Pinterestなどのソーシャルメディアサイトが使っている事で一躍有名になった無限スクロール（英: Infinite Scrolling）ですが、今でもシングルページを利用したウェブサイト、特にコンテンツの量が豊富…

Windowオブジェクト Windowオブジェクトは、ブラウザーが持っている情報をそのまま持っています。ブラウザーの様々な情報を確認・取得する事が出来ます。 早速確認してみましょう。 <script> console.log(window); </script> documentオブジェクト documentオブジェクトとは、…

Document Object Model (DOM) は、HTML および XML ドキュメントのための API です。これはドキュメントの構造的な表現を提供し、内容や表示形態の変更を可能にします。簡単に言い換えるとhtmlの各要素、たとえば「p」とか「img」といった要素に直接アクセス…

「switch文」とはif文と少し似ていて、同じように分岐処理を行う物ですが、if文の場合、AルートもしくはBルート、というように二者択一を続ける分岐に対し、今回の「switch文」は同時に多数の分岐処理を行うことが出来ます。 switch (式or変数) { case 値1 :…

JavaScriptで乱数を取得したい場合には「random関数」を使います。 覚えるメソッド Math.random Math.random()は、0〜0.9999...(1未満)の間から、1つの数値をランダムで返すメソッドです。0は含みますが、1は含みません。 Math.round Math.round()は、小数点…

for文は繰り返し（ループ）処理です。 for ( 変数ｉの初期値 ; 繰り返し条件 ; 変数の変更 ) { 処理の結果 }記述例 <script> for (var i = 1 ; i <= 100 ; i++) { console.log( i ); } /* for ( 変数の初期値； 繰り返し条件； 変数の変更(最後は;がいらない) ) { 実</script>…

for文でのインクリメント/デクリメント演算子 上記のインクリメント演算子を使って 2から100まで2づつ増えていくfor文を作成しましょう。 一つのfor文（ループ）の中に、さらにfor文を入れることができます。 もちろん入れ子の深さを二重、三重、...と深くし…

配列とは複数の値を入れる事が出来る箱の事です。 今まで使っていた変数は1つにつき、1つの値しか入れる事が出来ず、新しい値を入れると上書きされてしまう、という特徴がありましたが、配列を使う事で同時に複数の値を収納出来るようになります。 配列の使…

「 new Date()」を使う事で、現在の時間を取得することが出来ます。 <script> var date = new Date(); document.write(date); </script> 実際に表示してみると「 new Date()」には日時についての様々なデータが収納されているのが解ります。 このままでは使いづらいので「 new…

イベントとは？ イベントとは，ブラウザ上で発生した出来事全般のことを表します。例えばブラウザに表示された画像をマウスをクリックしたり、テキストボックスに文字を入力するといったように，閲覧者が何か操作したときにイベントが発生します。またHTMLが…

イベントとは？ イベントとは，ブラウザ上で発生した出来事全般のことを表します。例えばブラウザに表示された画像をマウスをクリックしたり、テキストボックスに文字を入力するといったように，閲覧者が何か操作したときにイベントが発生します。またHTMLが…

JavaScriptとは、米Netscape Communicationsによって開発されたスクリプト言語です。JavaScriptは主にWebブラウザ上で動作します。クリックすると画像が変わったり、要素が消えたり、現れたりというHTMLやCSSでは出来ない、いわゆるサイトの動的な部分を担当…

JavaScriptでまず覚える事は変数の使い方です。変数とは値を入れておくことができる箱のようなものです。 処理結果などの値を変数に格納したり、それをまた別の処理へ引き渡したりすることができます。変数宣言 変数を使用する上で、まず行うのが変数宣言で…

スマートフォンの場合、PCのようにブラウザーから検索してWebサイトに行くよりも、ホーム画面に登録してあるアプリからワンタッチでWebサイトなりWebサービスを利用するケースがほとんどです。 なので、スマートフォンサイトを制作する場合には必ずスマート…

Webサイト上で新着情報や更新頻度の高い情報を表示させたい時には、TwitterやFacebookなど既存のSNSのプラグインを使うのが非常に便利です。SNSのプラグインを使用すれば、わざわざHTML内のデータを触る事無く、SNSに記事を投稿するだけでWebサイト内の情報…

Googleが提供しているGoogleAPIを使うことで簡単に様々な便利な機能をwebサイトに導入する事が出来ます。 Webサイトにスケジュール表やメールフォームを追加したい場合、PHPで作成する事が可能ですが、「Googleカレンダー」と「Googleフォーム」を使うのも選…

フッター要素などにあるコピーライトの記述。サイトによって色々な書き方がありどう書いて良いか迷う所ですが、そもそもコピーライトの記述は絶対に必要なものでは無く、記述しようがしまいが、日本では著作物は法律でちゃんと守られます。それでも何となく…

SEOとは、”Search Engine Optimization” の略であり、検索エンジン最適化を意味する言葉です。検索結果でWebサイトがより多く露出されるために行う一連の取り組みのことを指します。 オーガニック検索 オーガニック検索（自然検索 / Organic Search）とは、…

複数人でコーディング作業を進める場合、共通のルールや約束事を「コーディング規約」として事前に決めておきます。例えば担当者が独自の勝手なルールでコーディング作業を進めてしまうと、その担当者以外の者がコーディング作業する事が出来なくなってしま…

Googleカレンダーのhtmlの埋め込みですが、レスポンシブ対応にさせる場合、カレンダーの設定によってはスマホ時に画面からカレンダーの右側がはみ出してしまいます。 はみ出してしまう原因はカレンダーの上部にある「印刷」や「月・週」の表示切り替えタブな…

スマートフォン利用者を自動的に「スマートフォン版サイト」へ誘導できるよう、「アクセス者の端末に応じて自動でアクセス先を振り分ける機能」を作ってみましょう。この授業では「.htaccessファイル」を使って、サーバ側で自動振り分けする方法をやってみま…

Google Search Consoleとは Search ConsoleとはWebサイトの検索結果の状況とそれに付随する情報（Webサイトの改善案・被リンク数・キーワードなど）やGoogleが認識しているページ数、Googleクローラーのクロール状況が把握できるツールです。 Search Console…

SEO対策にはサイトが必ず自動的に掲載順位 1 位になるような秘訣は無く、とにかく自身のコンテンツの品質を高める事が結果として検索結果の上位表示に繋がるという事をしっかりと理解しましょう。www.dentsudigital.co.jp 低品質のページに該当されやすいペ…

webサイトはおおまかに別けるとテキスト・画像・色の3つの情報から成り立っています。 3つの中でも色はユーザーに最初に伝わる情報なので、配色次第でサイトの第一印象が決まってしまいます。 初心者にとって配色は難しい部分ですが、まずは既存のサイトやサ…