低価格・高品質・最速のHTMLコーディングはクロノドライブへ

お電話でのお問い合わせ・ご相談はこちら 03-6416-5813 [C-0]

お見積もりフォーム

コーディングノウハウコラム

今さら人に聞けない!WordPressで使われているmod_rewriteの説明書

WordPressのmod_rewriteコードを参考にmod_rewriteについてまとめてみました。mod_rewriteとは?mod_rewriteとは、何かご存知でしょうか?これは、Apacheというhttpサーバで利用されいてるモジュールと言われるもので、URLの書き換え・リダイレクト処理を行なってくれるものです。主に「.htaccess」というファイルに任意の処理を記述して使用します。...続きを読む

新人コーダーに知っておいて欲しいリダイレクトの基本

サイトを運営していると、サイト内のページの移動や削除、またはサイト自体の移転をすることがあります。その場合、リダイレクトという処理を用いて新たなページに転送を行いますが、正しい知識と手順を以って対応しなければ、検索順位の下降、ページランクやドメインエイジの喪失といったSEO的なペナルティを招いてしまいます。そこで、そのようなペナルティを受けないために、ページ移動・サイト移転時の正しいリダイレクトの...続きを読む

画像を使わない擬似フォームUIの作り方 第03回 「タップ時のレスポンス向上」

第2回まで「擬似フォームUI」の作り方を解説してきましたが、第3回となる今回はちょっと方向性を変えて、チェックボックスやラジオボタンをタップしたときに、瞬時にレスポンスを返す方法を解説していきます。皆さんは、スマートフォンでフォームのチェックボックスをタップしたときに、一瞬遅れてチェックが入るといった経験をしたことはないでしょうか?次のサンプルを操作するとお分かりいただけると思います。サンプル※i...続きを読む

画像を使わない擬似フォームUIの作り方 第02回 「jQueryを使った擬似フォームUIの操作」

前回はCSSを使って擬似フォームUIのデザインを整えるところまでを紹介してきましたが、今回からは擬似フォームUIの肝となる、jQueryを使ったフォーム操作の方法を紹介していきます。前回の記事はこちらSTEP05jQueryでチェックボックスのチェック状態を操作するこの時点でのサンプルを表示する擬似フォームUIでは、実際のチェックボックスは隠れた状態になるため、jQueryでチェック/未チェックの...続きを読む

画像を使わない擬似フォームUIの作り方 第01回 「CSS3を使った装飾」

■完成イメージブラウザ標準のフォームUI(チェックボックスやセレクトボックス)のデザインは、標準ゆえに「フォーム」だと分かりやすいデザインですが、どうしてもサイトカラーに合わずに野暮ったい印象になるときがあります。そういった場合にデザインを自由に変更できるといいのですが、フォームUIへのスタイル適用は制限があり、自由に変更できません。そういったときに、実際のフォームUIを隠し独自のフォームUIを表...続きを読む

CSS3で簡単にボタン風バナーを作る

CSS3から背景にグラデーションをつけたり、ボーダーを曲線にすることができるようになりました。それを用いて、画像を使わず簡単にボタン風のバナーを作成するテクニックです。使うプロパティは下記の通りborder-radius(ボーダーに曲線をつける)backgroundのgradientプロパティ(背景にグラデーションをかける)CSSviewsourceprint?01.sampleBtn{02&nb...続きを読む

[CSS]CSSスプライトで容量を節約しつつロールオーバーを実現する

画像のロールオーバーに関するまとめ記事を更新しました。下記リンクよりご覧ください。【比較】覚えておきたいロールオーバー画像切替え5つの手法(CSS?JS?onmouseover?)ロールオーバーの指定の仕方はこれまで何度かご紹介しましたが、今回はそのロールオーバーの指定の中でも、CSSスプライトと呼ばれる方法をご紹介したいと思います。CSSスプライトとは?CSSスプライトとは、複数の画像をひとつに...続きを読む

ソースを見やすくするためのスタイルシート・コードフォーマット

スタイルシートを作成するときに、ただスタイルを羅列していくだけでは、後から見てどこに何が書いてあるのかわからず、メンテナンス性が非常に悪くなってしまいます。そこで、今回はスタイルシートを書くときに気を付けたいことをご紹介します。半角スペースを使うスタイル名とスタイルプロパティの後ろに一つ入れます。×viewsourceprint?1.text{2    te...続きを読む

[HTML]たった1行でアイコン付きの要素を右寄せにするテクニック

アイコンなどをbackgroundで指定した要素を右寄せにしたいとき、みなさまはどのようにスタイルを指定しているでしょうか。text-alignを使って要素を右寄せにしても、背景は動かないため、背景ごと動かさなければなりません。また、background-positionで直接位置を指定するのも、あまりよい方法とは言えません。今回は、そんな状態をたった一行で解消するテクニックを紹介します。対応方法...続きを読む

[jQuery]簡単に作れるスライド式メニュー

jQueryを使うと、アニメーションをさせながらメニューの開閉が行えたり、要素を移動させたりすることが可能です。その中で、今回はスライドしながら開閉するメニューのサンプルをご紹介します。導入の手順まず、head要素内でjQueryのコアファイルを読み込みます。viewsourceprint?1<scripttype="text/javascript"src="js/jqery-1.5.1.m...続きを読む
1 2 3 4 9