サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
衆院選
atomicbox.tank.jp
WEBのコーディングでよく使いそうな、html特殊文字の数値参照（10進数、16進数）と文字参照をまとめました。 フォントに依存する部分があるため、指定のフォントによっては見た目が違ったり出ない場合がありますのでご注意ください。 文字参照についてはW3Cの仕様書（こちら）を参考に作成しました。
WEBコーダーに必要なhostsファイルの書き換え作業、書き換え内容は単純ですがファイルのある階層が深かったり管理者権限で編集しないといけなかったりと細々面倒です。 Windowsでhostsファイルの編集・監視・切り替えを行える便利なフリーアプリがあるのでそちらを使ってみようと思います。 前提 Windows 8.1 Hosts File Managerのダウンロード 何種類かあると思うのですが、Hosts File Managerというものを入れたいと思います。 Hosts File Manager こちらのサイトの「ダウンロード」ページからインストーラをダウンロードします。 「Hosts File Manager Ver. 2.00」（現時点で最新バージョン）をクリックすると、「HFM_2.00_x86_ja.zip｣のようなファイルがダウンロードできました。圧縮されているので解答し
このページは通常html版ページです。AMP版ページはこちら。 （amphtmlメタタグを設定してるけど、ブラウザがそれを判断してAMP版に飛んでくれるわけではないらしい。。） 基本的には、AMP公式プロジェクトの情報を元に作っています。Create Your AMP HTML Page（公式サイト） AMP対応htmlファイルの作り方 以下は公式ほぼそのままなのですが、だいたい必須項目なのでそのまま使えると思います。 「⚡」という雷マークの絵文字がソースに入ります。間違いじゃありません。（⚡の代わりにampでも良い。） viewportのinitial-scale設定と、<script type="application/ld+json">〜</script>の部分はオプションなのでなくてもOKです。 通常htmlページとAMP対応htmlページを両方作る場合はメタタグの規定の書き方があ
2016年1月、ついに世界のWEBデザイナーが切望していたIE8のサポートが実質終了しました。 ようやく大手を降ってhtml5に移行できるよねということで、html5の基本タグを再確認しながらソースサンプルというかデモページを作りました。 HTMLの基本を見直す良いタイミングだったので、ついでにリセットCSSも見直すことに。 HTML5に対応していて、Normalize.css系の、「オールリセットじゃなくて、ブラウザ間の差をなくす」タイプのCSS、「sanitize.css」を使ってみたので合わせてまとめておきます。 HTML5のヘッダー <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta name="description" content="html5の基本文法と、ベースレイアウトに良く使う基本タグ
前回【CakePHP】初心者向けの基本ルールでは、CakePHPの概要と基本的な規約をご紹介しました。今回は、その続きで「なんかよくわからんけど、とりあえず使ってみるか」というレベルの基本の使い方をご紹介します。 記事を書くにあたって基本をふりかえりつつ色々調べていたんですが、「え？この機能こんな使い方あったんかい…（今更）」みたいな発見があって、まとめることの大切さを実感するのでありました(^^;) 前提 CakePHPをインストール済 この記事はCakePHP2系の内容です。 初めてのCakePHPプログラム CakePHPは「MVCモデル」を採用していて、Model・View・Controllerで一つの機能ができあがります。ただしこの3つが常に必須かというとそうではありません。Modelはデータを扱うものなのでデータベースを使わない機能には不要ですし、Viewも見た目を一切気にしな
WordPressのテーマ製作をしていると、カスタムフィールドをうまく取り入れてクライアントが更新しやすいようにカスタマイズしたいなぁと思うことが多々あります。 今回は、筆者もよくお世話になっている「Custom Field Suite」というプラグインの使い方を書き留めておこうと思います。 基本情報 WEBサイト：Custom Field Suite インストール：「プラグイン」メニューから「Custom Field Suite」で検索してインストール・有効化します。 ドキュメント：Documentation | Custom Field Suite フリーのプラグインなのですが、ループフィールドに対応しているのがとても便利！ フィールドグループ作成 メニューに追加された「フィールドグループ」から、新規作成でカスタムフィールドセットを作ります。 特定のテンプレートや、カスタム投稿タイプに
今回はMAMPのインストールとドキュメントルートの設定などの基本設定が終わったあとにやっておきたい、バーチャルホストの設定についてまとめていきたいと思います。MAMPというよりは、おそらくMAMPが代理でインストールしてくれる、Apacheの設定方法になります。 まだMAMPのインストールがお済みでない方は、【Mac OSX】MAMPの初期設定 : 基本の設定をご覧ください。 バーチャルホストとは？ バーチャルホストというのは、簡単に言うと一台のマシンないしIPアドレス（ドメイン）で、複数のサイトがあるように使うことができる技術です。 ウェブ制作の携わっているとone社の案件、two社の案件にthree社の案件…etc.を同時に管理しないといけないということがありますよね。フォルダで分けるのは無理がありますし、マシンを増やすわけにもいきません。バーチャルホストの設定はほぼ必須となることでし
前回、【CakePHP】初心者向け・基本の使い方に引き続きCakePHPの基本的な使い方について。 コントローラ（Controller）とビュー（View）を使って、URLをぽちぽちと指定すると自分が作ったViewのctpファイルの内容が画面に出てくる…ところまでやったので、「次はModelの使い方…データベースかな？」と思いきや今回は見た目、ヘッダーやフッターのレイアウトの話です。とりあえず見た目から入ってみましょう。 前提 CakePHP2系の内容になります。 レイアウトとは CakePHPでは、特に何もしなくてもなんとなくレイアウトされた状態でページができます。【CakePHP】初心者向け・基本の使い方でExampleというページを作りましたが、こんな感じの見た目で出てきます。 勝手にCakePHPのヘッダーとフッターがついていたり、CSSも指定していないのにh2タグが赤字になってい
/* style.css */ /* メディアクエリサンプル */ @media screen and (min-width: 1281px) { // 画面幅が1281px以上（PC専用スタイル） } @media screen and (max-width: 1280px) { // 画面幅が1280px以下（タブレット・スマホ共通スタイル） } @media screen and (min-width: 768px) and (max-width: 1280px) { // 画面幅が768px～1280px（タブレット専用スタイル） } @media screen and (max-width: 767px) { // 画面幅が767px以下（スマートフォン専用スタイル） } @media screen and (max-width: 414px) { // 画面幅が414px以下（
<!DOCTYPE html> <html lang="ja"> <head prefix="og: http://ogp.me/ns#"> <meta charset="utf-8"> <meta name="viewport" content="width=980,user-scalable=yes,target-densitydpi=device-dpi"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <meta name="description" content="ページの紹介文。"> <meta name="copyright" content="© atomicbox"> <title>ページタイトル</title> <meta property="og:type" content="article">
ウェブ制作するための開発関連メモを残していきます。（html/JavaScript/jQuery など） PHP用の高速開発フレームワーク、cakePHPのインストール方法の記録です。MAMP（というか、ローカル環境）に入れる時を意識して書いているので、実際のサーバーに設置する時とは若干ズレがある可能性がありますのでご注意ください。 前提 MAMP（Apache）をインストール済 （mod_rewriteを有効化） （php.ini/date.timezoneをAsia/Tokyoに設定済） 下二項目はApache・PHPのベース設定になりますが、一応補足で説明を入れておきます。 おおまかな流れ cakePHPをダウンロード＆解凍＆設置 （mod_rewriteを有効化） （php.ini/date.timezoneの設定） core.phpの編集 database.phpの編集 Debu
ウェブ制作するための開発関連メモを残していきます。（html/JavaScript/jQuery など） MAMP開発環境構築シリーズ、【Mac OSX】MAMPの初期設定 : バーチャルホストの設定（Apache）ではMAMPでバーチャルホストを作る方法をご紹介しました。 これでMac1台あればいくつでもウェブサイトを並行して作れるわけですが、「スマートフォン対応」する時みなさんはどのように作業していますか？ MacOSXでは実は、MacとiPhoneをUSB接続するだけで簡単にiPhoneから開発中のウェブサイトを見ることができます。 …が、バーチャルホストで作った名前ベースのバーチャルドメインはApacheを動かしている端末だけでしか認識できないので、少し設定をいじる必要があります。今回は基本の1台構成（バーチャルホストなし）の場合とバーチャルホストありの場合の両方の設定方法をご紹介
他のjQueryプラグインなどと競合しないようにカプセル化することは安全なプログラムを書く上で重要です。プラグインじゃなくてもjQueryファイルならそっと囲んでおいた方が良いでしょう。 よーーーく混同して間違えてしまうのですが、「$(function(){ });」とはまったく別物である。（後述） ;(function($) { // この括弧の中では変数はローカル変数として扱える。 var hensu = 96; // この中では、必ず$ = jQueryであり、安全である。 $('#hoge').fadeIn(); })(jQuery); ページ読み込み判定など ページの読み込みが完了した後に処理をはじめたい時の豆知識。「ready」イベントはjQueryを利用する場合ほぼ必ず使用することになるので必修です。 【ポイント】 readyイベントはDOMツリーの構築が完了した時点で発火し
このページを最初にブックマークしてみませんか？
『atomicbox.tank.jp』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
