ツイート
シェア
LINEで送る
B! はてぶでブックマーク
Pocketでブックマーク
RSSフィード

中級者 - Webマスターへの道

自分で情報を探しながらやっても、なかなかスムーズに答えにたどりつかない人にWeb情報を発信します。

経験が足りないだけで、遅かったり、失敗しても自信をなくさなくていいです。いまは大きくなるために、技術を知って試す時期なので。

むしろたくさん悩んで、フリーズして、失敗してください。気がついたら最適な答えを出す力が自然と身についているでしょう。

HTMLとCSSだけで円を描く方法。サイズ、色はCSSで変更できる。

html5 css3 image

画像を使わずに、HTMLとCSSだけで円を作る方法です。とてもかんたんです。

画像を読み込む必要がないので、応答時間やページの表示時間が少しだけ短縮できます。

一番のメリットは、CSSでサイズや色をかんたんに変更できること。デメリットはそんなに使うことはないこと。

(意味ねーじゃんと言わないでください。)

続きを読む

JavaScript Prism.js, 表示する行数を変更する

JavaScript image

ソースコードをハイライト表示するプラグイン、Prism.jsの表示サイズを変更します。作業はとてもかんたんです。CSSで指定します。JavaScriptはまったくいじりません。

ただ細かい微調整が必要で、たんに行の高さ ✕ 行数にすればいいというものではありません。

続きを読む

HTML5&CSS iframe, マップ, YouTubeがスマホではみ出ないように表示する

html5 css3 image

GoogleMapやYouTubeを埋め込むときに使うiframeタグ。これを縦横比(アスペクト比)を変えずにレスポンシブに対応する方法です。

iframeはスマホで見るとはみ出ることがあるので必須。(これが起きるサイトは有名なところでも意外と多い。)

HTMLに少し修正を加えてあとはCSSで対応します。

続きを読む

nginx, Basic認証の使い方。.htaccessファイルは使わない。

nginx ロゴ

WebサーバのnginxでBasic認証を行う方法です。

Basic認証はページを表示するのにユーザー名・パスワード入力を求める機能で、Webサーバーでこれを設定すると、ブラウザがユーザー・パスワード入力ボックスを表示させます。

nginxでは .htaccessファイルは使いません。設定ファイルに記述します。

続きを読む

PythonでCSS, JavaScript, HTMLの圧縮ツールを作る

python image

Pythonのcss_html_js_minifyパッケージを使うと、簡単にCSS、JavaScript、HTMLの圧縮ツールが作成できます。

サンプルコードを使って作成してみましょう。

(本来、自分で作るもんじゃありません。こうやってPythonは作っていきますよという一例です。)

続きを読む

WordPress, マルチサイトはプラグインに気を付けよう! DBエラーが起きることも。

wordpress image

WordPressのマルチサイトで各サイトの外観 -> メニューで追加、編集できなくなりました。

原因はCategory Order and Taxonomy Terms Orderプラグイン。マルチサイトでのプラグイン有効化にありました。

プラグインがマルチサイトに対応しているかがポイント。

原因の詳細とその対処方法です。

続きを読む