Debriefing [デブリーフィング]

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

「Web」記事一覧

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

はてなブログのテーマの作り方とオリジナルデザインを効率的に作るコツ

はてなブログのオリジナルテーマを制作する方法について紹介します。はてなブログのオリジナルのテーマを作るうえで、やったことや気がついた点や注意点などがあったので書きました。

CSSで画像を画面の横幅いっぱいに表示させる方法 background-size:cover

CSSで画像をモニター画面の横幅いっぱいに表示させる方法について説明します。PCやタブレットやスマートフォンなどの画面サイズが異なるデバイスでも、縦横比が崩れないように実装することが可能です。

リダイレクトとは?種類や設定方法。301や302、.htaccessなどについて

Webサイトのリダイレクトの種類や設定方法について説明します。リダイレクトには301、302などの種類があります、また.htaccessを使った方法やPHPを使った方法など、リダイレクトの設定方法もいくつかあるので説明します。

JavaScriptでURLの内容を取得する方法

JavaScriptを使ってページのURLの内容を取得する方法について説明します。取得したい内容によって記述方法が違うので、目的に応じてそれぞれ記述方法を確認してみてください。

jQueryでURLの文字列を判定して処理を実行させる方法

全てのページに対してではなく、個別のページに対してのみJavaScriptの処理を実行したい時があると思います。今回はjQueryを使ってURLの文字列を判定し、条件分岐させる方法について書きました。

モーダルウィンドウとは?特徴・使いどころ・デメリットについて

Webサイトによく使われているモーダルウィンドウについて書きました。モーダルウィンドウをサイトに実装する時は、モーダルウィンドウの特徴や使いどころ、メリット・デメリットをよく理解した上で実装することが重要です。

HTML・CSSのコーディングができないデザイナーに理解して欲しいこと

HTML・CSSのコーディングができない、分からないデザイナーに、デザインを作るうえで知ってほしいこと、理解してほしいことについて書きました。コーディングのことを理解していると制作するデザインデータの質が上がります。それによってサイトの保守性・更…

jQueryでクリックすると表示・非表示を切り替えるtoggleを使った方法

jQueryを使って、要素をクリックすると非表示になっている要素を表示したり、非表示にさせたり切り替える方法について説明します。今回紹介する要素を表示・非表示させる方法はtoggleメソッドを使ったやり方です。

jQueryでmodal(モーダルウィンドウ)を実装する方法

jQueryを使ってWebサイトにmodal(モーダルウィンドウ)を表示する実装方法について説明します。モーダルウィンドウを表示させるとWebサイトにインタラクティブな表現を追加することができます。

はてなブログデザインテーマ「Debriefing」をリリースしました。

はてなブログのオリジナルデザインテーマ「Debriefing」をリリース致しました。今回ははてなブログのデザインテーマ「Debriefing」の特徴やカスタマイズ方法について紹介していきます。

Photoshopの全てのレイヤーグループをワンクリックで一括で閉じる方法

Photoshopのレイヤーグループをワンクリックで一括で閉じる方法を紹介します。グループレイヤーが開いた状態のデザインデータは見栄えて的に綺麗ではありません。そんな几帳面なデザイナーのために、ワンクリックで全てのグループレイヤーを閉じる方法を紹介…

jQueryの$(document).readyと$(window).load 実行処理の種類とタイミング

jQueryを書く時に、$(document).ready(function(){}や$(function() {}や$(window).load(function(){}などで書き始めて括弧の中に処理内容を書くことが多いと思います。今回はjQueryの1番はじめに書く実行処理の書き方の種類と意味について説明します。

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サイトを公開したい場合は、レンタルサーバーを契約する必要があります。今回はポートフォリオサイトなどを公開したい初心者におすすめなレンタルサーバーを紹介します。結論から言うと初心者におすすめなサーバーはサ…

© Debriefing 2019 All Rights Reserved.