1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 |
<!doctype html> <!--特定のIEだけにスタイルシートを適用するためのコメントアウト--> <!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="ja"> <![endif]--> <!--[if IE 7]><html class="no-js lt-ie9 lt-ie8" lang="ja"> <![endif]--> <!--[if IE 8]><html class="no-js lt-ie9" lang="ja"> <![endif]--> <!--[if gt IE 8]><!--> <html class="no-js" lang="ja"> <!--<![endif]--> <head><!--メタ情報やタイトルなど--> <meta charset="utf-8"> <meta http-equiv="x-dns-prefetch-control" content="on"><!--DNS preftch(SNSボタン等の表示高速化のための設定) の有効化--> <link rel="dns-prefetch" href="//connect.facebook.net"> <link rel="dns-prefetch" href="//s-static.ak.facebook.com"> <link rel="dns-prefetch" href="//static.ak.fbcdn.net"><!--DNS preftchを設定するドメインを記載--> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><!--IEの利用可能な最新のレンダリングエンジンで表示--> <title></title> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="apple-touch-icon" href="apple-touch-icon.png"> <link rel="stylesheet" href="css/main.css"> <script src="/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script><!--様々なブラウザをHTML5とCSS3に対応させる JavaScriptライブラリ--> </head> <body> <!--[if lt IE 8]> <p class="browserupgrade">お使いのブラウザは<strong>古いバージョン</strong>です。<a href="http://browsehappy.com/">ブラウザのバージョンアップ</a>をすることで、最適な環境で本ウェブサイトを閲覧することができます。どうぞお試しください。</p> <![endif]--> <header><!--サイト全体のヘッダー--> <h1 class="title">ページのh1タイトル</h1> <nav><!--サイト全体のナビゲーション--> <ul> <li><a href="#">nav1</a></li> <li><a href="#">nav2</a></li> <li><a href="#">nav3</a></li> </ul> </nav> </header> <main><!--ページのメインコンテンツ部分--> <header><!--メインコンテンツのヘッダー(あってもなくてもOK--> </header> <article><!--メインコンテンツの記事部分 H2等のタイトルが必要!単体でも内容が完結する部分--> <h2>H2タイトル</h2> <p>内容</p> <section><!--記事の中のグループ分けなどで使用 H2などのタイトルが必要!--> <h2>グループのH2タイトル</h2> <p>内容</p> </section> <section><!--記事の中のグループ分けなどで使用 H2などのタイトルが必要!--> <h2>グループのH2タイトル</h2> <p>内容</p> </section> <section><!--記事の中のグループ分けなどで使用 H2などのタイトルが必要!--> <h2>グループのH2タイトル</h2> <p>内容</p> </section> </article> <footer><!--メインコンテンツのフッター(あってもなくてもOK--> </footer> </main> <aside><!--サードバーやフッターなどのメインの記事と直接関係のない内容--> </aside> <footer class="wrapper"><!--ページ全体のフッター部分--> </footer> </body> </html> |
ページを更新した時に自分だけならまだいいのですが、 クライアント様に確認していただくときなどは同じアドレスにするとキャッシュが残っていて表示が崩れている、と言われたり厄介です。 なので初めから以下の表示方法で設定しておく […]
一番更新料が安いドメインは? ドメインと聞いたら.com や .jp や .co.jp などが一般的で、そのあたりが思い浮かぶと思いますが、 実は書ききれないぐらいたくさんのドメインが世の中にあって、今も増え続けています […]
AMPとは AMPはグーグルが始めたモバイルでの表示を早くするための対策。 3秒以上サイトの表示に時間がかかると、40%の人が離脱してしまうという結果が出ているようですが、現状かなりのサイトが3秒以上読み込み速度がかかり […]
Pureは、Yahoo!が開発したCSSフレームワークです。 シンプルで軽量なのが一番の魅力です! 私は自分用に作ったのフレームワークを、必要な部分のみ使用していましたが、こういったものも便利ですね。 Pure を利用し […]
ワードプレスのオリジナルテーマに検索フォームを作る 検索フォームを作るには、以下を記載した searchform.php という名前のファイルを作り、テーマファイルに入れます。 [crayon-628c4bb1b2234 […]
何を基準にレンタルサーバーを選べばいいのか、安いだけで本当にいいのか、と悩むと思います。 レンタルサーバーの安いところってやっぱりダメなの? 安さ、使いやすさのみで選ぶとしたら私は毎回ロリポップ!レンタルサーバーをお勧め […]
スマホ対応には2通りあります。2のレスポンシブデザインのほうが制作作業も更新作業も簡単で、安く作ることができます!
ワードプレスで社内でホームページを管理しようと思ったけど、わかりにくくて困っていませんか? 御社に必要な部分のみを残し、追加し、使いやすく管理画面をカスタマイズすることができます。
YouTubeのURLから指定範囲を選択 → GIF画像にしてくれます! GIFMAGAZINE http://gifmagazine.net/movietogif imgflip https://imgflip.com […]