Debriefing [デブリーフィング]

Debriefing [デブリーフィング] はHTMLやCSSやデザインなどのWeb制作に関することや、仕事を効率化する方法や生活に役立つHow Toを発信します。

「Web」記事一覧

主にWeb制作やSEOやサーバーなどのWeb系の情報をまとめたカテゴリです。

SublimeTextでのソース検索・一括置換・フォルダ内一括置換のやり方

SublimeTextを使ったソースの検索・一括置換・フォルダ内一括置換のやり方について紹介します。一括置換をうまく使いこなせば、手作業でやる面倒な置換作業を一瞬で終わらせることができるので、作業時間短縮のためにも絶対覚えておきましょう。

はてなブログを活用したアクセス数を増やすためのブログ戦略を考察してみた

ブログのアクセス数やPV数を増やすために、はてなブログを活用したブログ戦略について書いてみました。はてなブログは他のブログサービスに比べてドメインパワーが強く、はてなブックマークとの連携も強いです。このはてなの恩恵を存分に活用してブログを育…

CSSでパララックスのようなスクロールを表現する方法background-attachment:fixedの使い方

CSSのみだけでパララックスのようなスクールを表現する方法について紹介します。パララックスをWebページに取り入れるとスクロール時に動きのある魅了的な表現をデザインに加えることができます。基本的にJavaScriptで実装することが多いですが、今回はCSSの…

プログラミング学習を反復学習するなら思い切って就職したほうが効率が良い話

web

将来フリーランスのエンジニアになりたい人がプログラミング学習をすることは良いことです。しかし何回も反復学習しているより、思い切ってWebの受託会社に就職したほうが、効率的に技術力や知識を身につけることができます。今回はプログラミング学習を反復…

書いたコードを共有できるCodePenの登録方法と使い方とブログの貼付け方

web

書いたコードをブログやWordPressなどに貼付けられるCodePen(コードペン)の登録方法や使い方、コードの貼付け方法について紹介します。CodePenを使えば簡単にブログやWordPressにコードを貼り付けてその場でデモを表示することが可能です。

CSSのtext-overflow:ellipsisを使って文字数制限(...)を表示させる方法

CSSを使って文章に文字数制限を実装する方法について書きました。通常はPHPなどのプログラム言語を使って文字数制限することが一般的ですが、CSSだけでも簡単な文字数制限を実装することができます。

はてなブログの読者になるボタンをオリジナル化&軽量化してみた

はてなブログの「読者になる」ボタンをデフォルトのボタンではなく、HTMLとCSSで作ったオリジナルボタンにする方法について紹介します。オリジナルボタンにすることによってページ速度が向上したり、好きなサイズにしたり好きな箇所に設置することができるの…

はてなブログ独自ドメイン変更後のAdSense審査が通過しない原因

Google AdSenseの審査に通過しない原因と解決方法について書きました。「サイトの停止または利用不可」というのが審査に落ちる結果だったら、このページを確認してみてください。僕の場合はメインドメインからサブドメインへのリダイレクトが未設定だったこ…

エックスサーバーでwwwなしからwwwありへリダイレクト設定する方法

エックスドメインで取得した独自ドメインを、wwwなしからwwwありへリダイレクト設定する方法について書きました。エックスドメインで取得したドメインは、エックスサーバー上でサイト転送設定を行う必要があります。301リダイレクト設定をすることによってSE…

スマホ表示でtableの表を滑らかに横スクロールさせるCSSの記述方法

tableタグでコーディングした表は、表の項目の数が多いとスマホの画面内におさまりきれず、表が潰れてしまいます。今回はスマホ表示のtable表を滑らかに横にスクールさせる方法について紹介します。

input type="number"で表示される矢印ボタン(スピンボタン)をCSSで消す方法

HTML5のinput type="number"を使うとフォームの右側に矢印ボタン(スピンボタン)が表示されてしまいます。今回はCSSを使って、この矢印ボタンを非表示にする方法について紹介します。やり方は簡単な数行のCSSを記述するだけです。

CSSでaタグのリンクやJSのクリックイベントを無効にする方法【pointer-events:none】

CSSを使ってaタグのリンクやjavaScriptのクリックイベントを無効にする方法について書きました。CSSのpointer-events:noneを要素に指定すれば、手軽にリンクやクリックイベントを無効化することができます。

最速でWeb制作ができるようになる効率の良いHTMLとCSSの勉強方法。

HTMLとCSSを最速で効率的に勉強する方法について書きました。全くの初心者の方は本やオンライン学習サービスを使って基礎を学習したほうが良いです。基礎が固まっている方はどんどんゼロからサイト制作した方が、やればやるほど知識と経験が蓄積されてきます…

デザイン力を着実に上げるための8つの勉強方法と習慣

デザイン力を向上したい、デザイン力を上げてもっと良いデザインを作りたいという方向けにデザイン力を鍛える方法について書きました。基本的なことからちょっと変わった方法まで、個人的に良かった勉強方法や習慣を書いていきます。

独学から最短でWebデザイナーになろうと考えている人におすすめの勉強法

独学でWebデザイナーになりたい思ったら、Webデザインスクールに通うことをおすすめします。なぜならスクールに通った方が、短期間で集中的に勉強ができ、就職・転職活動も効率的に進めることができるからです。

低価格・手軽に始めたい。安いレンタルサーバーはロリポップがおすすめ

低価格・格安なレンタルサーバーを探しいている方向けにおすすめのレンタルサーバーを紹介します。個人レベルのサイト、簡単なサイト、ポートフォリオサイトなどとにかく料金を安く抑えたい人にとって、ピッタリのレンタルサーバーはロリポップ!です。

WordPressでブログやるならレンタルサーバーはエックスサーバーがおすすめ

WordPressを使ってブログやオウンドメディアなどのサイトを運用したい場合、レンタルサーバーはエックスドサーバーに契約することをおすすめします。今回はエックスサーバーのメリット、特徴、評判について紹介します。

ポートフォリオサイトにおすすめなレンタルサーバーはさくらのレンタルサーバー

自分のポートフォリオサイトや簡単なWebサイトを公開したい場合は、レンタルサーバーを契約する必要があります。今回はポートフォリオサイトなどを公開したい初心者におすすめなレンタルサーバーを紹介します。結論から言うと初心者におすすめなサーバーはサ…

ドメイン変更後、新ドメインへ検索順位影響0でSEO効果を引き継ぐ方法

サイトのドメインがサブドメインから独自ドメインに変わった、または新ドメインに変わった時は、Googleの検索順位に影響が出ます。今回は影響を最小限に抑えてSEO効果を新ドメインに引き継ぐ方法を紹介します。

はてなブログ独自ドメイン設定後にやるべき各種URL変更方法

はてなブログのはてなドメインから独自ドメインに変更したら、Google AnalyticsやGoogle AdSenseなど、URLの変更設定をしなくてはいけません。今回は各種URL変更について書いていきます。めんどくさい作業ですが、1つ1つ変更しなくてはいけません。

はてなブログをエックスドメインで取得した独自ドメインに設定する方法

はてなブログで、はてなドメインからエックスドメインで取得した独自ドメインに切り替える方法について書きました。独自ドメインに切り替えるには、DNSレコードの設定と、はてなブログ側での設定の2つで独自ドメインに切り替えることができます。

WordPressのパーマリンクの設定方法。パーマリンクを設定してSEO対策

WordPressのパーマリンクの設定方法について書きました。WordPressでブログやサイトを作ったらはじめの段階でパーマリンクの設定をしておいた方がよいです。悪いパーマリンクを設定しておくと後々SEO対策をする時に後悔することが多いです。なので良いパーマ…

Android端末だと©(コピーライト)にCSS指定が適用されない原因と解決方法

Android端末では©(コピーライト)の部分にCSSが適用されません。これはAndroidにインストールされている日本語フォントが©に対応していないことが原因だそうです。今回はこのAndroid特有のバグを解決する方法を紹介します。

WordPressのショートコードをPHPテンプレートファイルに書く方法

WordPressのショートコードをPHPのテンプレートファイルに貼り付ける方法を紹介します。ショートコードは固定ページや投稿のエディタにそのまま貼り付けることができますが、PHPのテンプレートファイルに貼り付けるには少しコードを書く必要があります。

WordPressのトラックバックとは?ピンバックとの違い。トラックバックの送信方法

WordPressの設定でトラックバックとピンバックの設定があります。でもこの2つの用語、イマイチちゃんと理解していなかったりしませんか?今回はトラックバックとピンバックの違いとトラックバックの送信方法について書いて行きます。

WordPressの初期設定。インストール後に絶対後悔しない設定方法

WordPress(ワードプレス)の初期設定について書きました。WordPressをインストールしたらはじめにやっておきたい初期設定があります。WordPressでサイトやブログを後悔して、しばらく時間が経ってから設定をすると後悔することが出てくるので早め設定してお…

letter-spacingとtext-align:centerで中央揃えにしたら文字がずれた時の修正方法

画像出典:W3C CSSでtext-aline:centerをしたら最後の文字がずれてなんか変。 テキストや見出しを中央揃えにしたい時に「text-aline:center」を指定して、なおかつ「letter-spancing:1px」とかで文字間を微調整した時に、なぜかテキストが左よりにずれてしま…

Webデザイナーになるには。未経験・文系出身からWebデザイナーになる方法

文系の学校出身で未経験でもWebデザイナーになる方法を書きました。文系の大学を出て未経験だった自分がどうやってWebデザイナーになったか、独学からはじめてスクールに通って、就職活動をして内定を取るまでの話を記事に書きました。

デザインの4原則を勉強してデザイン力を向上させる方法

デザインの4原則って知っていますか?デザイン力の4原則を学習すればデザイン力を向上させることができます。具体的には近接・整頓・反復・コントラストの4つの原則をデザイン上に使用すれば、ユーザーにとって見やすくわかりやすいデザインを作ることができ…

はてなブログをhttpからhttps[常時SSL]に変更した時のSEOやその他設定について

このブログDebriefingは4月からURLがhttps(常時SSL接続)に切り替わりました。 今回httpsに変更するにあたって、ブログ周りの各種設定を変更したので、その時にやったことを書いていきます。 このブログは、はてなブログを使って運営していますが、WordPres…