Webサイト専門プログラマの言いたい放題

元システムエンジニアがサイト制作とプログラミングについて好き放題しゃべります。

【プロのノウハウを効率よく盗むコツ】

学校のホームページをWordPressでリニューアルしている 生徒さん。 WordPressのことは他のスクールで学んだけれど、 途中で行き詰ってしまったそうです。 今、マンツーマンレッスンで困っているところだけ ピンポイントでお教えしているのですが、 CSSが苦手…

【プラグインの動作を抑止するスクリプト】

WordPressにjQueryのプラグインを導入して、 スタイリッシュな検索動作をサイトに組み込んでいる 生徒さん。 ユーザーの使い勝手を考えて、プラグインの動作を 一部変更することになりました。 「どこをどう書き換えればよいのか?」 この答えにたどり着くた…

【JavaScriptでHTMLを自由に読み取るレッスン】

ぐるなび風のレストラン検索サイトを教材として、 検索ボタンを押したときの動作をJavaScriptで作る レッスンをしました。 プログラミングは、小さな命令の組み合わせで作ります。 「検索ボタンのプログラム」 という、決まりきった答えがあるのではありませ…

【WordPressでプラグインが動かない原因の多くはjQuery】

一般的によく使われているプラグインなのに、 「私のWordPressでは動かないんです…」 これ、経験したことある方多いかと思います。 多くの場合、 ・お使いのテーマ ・お使いの(他の)プラグイン ・自分が改造したコード のいずれか、または組み合わせが原因…

【WordPressで絞り込み検索に使えるプラグイン】

isotope.jsというjQueryのプラグイン。 ↓使い方が載っているサイト on-ze.com検索対象をグリッド状に自動で並べるだけでなく、 フィルターによる絞り込み機能が使えます。 グリッドレイアウトだけならmasonry.jsも有名ですが、 フィルター機能がありません。…

【プロから学ぶべきは「着眼点」である】

ドラえもんの名言のひとつに こういうのがあります。 ~~~~~~~~~~~~~~~ 人にできて、きみだけにできない なんてことあるもんか。 ~~~~~~~~~~~~~~~ いい言葉ですよね。 今すぐにはできないことでも、 どうすれば克服できるかが…

【動画講座JavaScript編|受講生の感想】

JavaScript編を受講されている生徒さんから 講座への感想をいただきました。 ~~~~~~~~~~~~~~ プログラムをデバッグする方法というのは その概念も知りませんでしたし、 ネットや書籍では独学が難しいので、 とてもためになりました。 こういう…

【WordPressでモバイル対応のページを作る方法】

今日のレッスンでは、 ページビルダー系のプラグインの使い方と、 カスタムテンプレートの作り方 をお教えしました。 WordPressにはモバイル対応済みのテーマが多いので、 レスポンシブ対応のページが簡単に作れそうに思えます。 しかし、実際はそんな甘くあ…

【HTMLをWordPressへ載せ替えるサポート】

とある公共機関のホームページを WordPressに載せ替えるサポートを レッスンとして行っています。 レンタルサーバーの選び方や、 サーバー会社に事前確認すべき内容、 WordPressのインストール方法、 初期設定で気を付けるべきポイント、 などを初回レッスン…

【ウェブページで外部のリソースを借りるには?】

添付のようなアイコンは、 画像として配布されているものもあれば、 ウェブフォントとして配布されているもの もあります。 画像の場合は、色が変更できませんし、 CSSで大きさを変更するため引き伸ばすと 画像がひどく荒れてしまいます。 しかしウェブフォ…

【WordPressでウェブアイコンを使う方法】

FontAwesome(フォントオーサム)という 無料のウェブアイコンをWordPressで使う方法を レッスンしました。 ウェブアイコンというと何か特殊な印象を 受けるかもしれませんが、 Googleフォントに代表される、 ウェブフォントを利用する場合の方法と、 考え方…

【プログラムは文法の知識だけでは作れない】

ジグソーパズルの遊び方は 誰でもご存知でしょう。 パズルの絵柄がどうであろうと、 総ピース数がどうであろうと、 平面だろうと立体だろうと、 「ピースの凹凸がぴったり合えば正解」 という根本的なルールだけで 成り立っていると言えますよね? でも、 ジ…

【jQueryで検索処理の組み立て方を学ぼう】

HTMLとCSSをしっかり学び、レスポンシブなサイトが 構築できるようになった生徒さんが、次のステップ 「jQuery」の習得に励んでおられます。 レッスンでは、架空のイタリアンレストランのコース 検索ページを用意し、検索ボタンの動作をjQueryで 作成できる…

【なぜこの方法が正しいのか?】

eastcoder.com WordPressでjQueryのプラグインとか bootstrapなどのフレームワークとか、 とにかく、CSSやJavaScriptをリンク させたいとき、2つの方法があります。 方法1. テンプレートに直接リンクを埋め込む。 方法2. アクションフックを使う。 シェ…

【「自動化したい」について】

何かを自動化するニーズって、 かなり多いと思います。 誰だってそうですよね? 毎月末の請求処理とか、 特に事務処理的な単純作業は 誰もが楽をしたいと思ってるはずです。 それを解決する1つの手段として プログラミングがあるわけですが、 そこに広告と…

【新規ツール開発の事前調査】

「極秘ツールが期間限定で公開」 「完全自動で収益が上がる」 みたいな怪しいツールの情報が 出回っているせいで、 よく誤解されるんですよね。 「同じようなツール作れませんか?」 って。 例えばAmazonが公開している APIを使ってプログラムを作れば、 ・…

【JavaScript動画講座受講生へのメールサポート】

JavaScriptの動画講座を受講している 生徒さんから質問が届きました。 早速、補講メールを作成して 配信スタンバイ完了。 質問すればするほど、 より深い基礎知識に基いた回答が 得られるので、 スキルアップが加速します。 PR CODEMYのマンツーマンレッスン…

【ネットユーザーのニーズを調べる方法】

特定の商品をブログで紹介するにあたって、 インターネットユーザーの興味関心を リサーチした上で記事を書くことは とても有効なことです。 リサーチの1つの手段に、 『アンケートをとる』 ことが挙げられます。 ネットでどうやってアンケートをとるの? …

【コピペ厳禁!Youtube動画のレスポンシブ埋め込みコード】

Youtube動画のページで共有ボタンを押して 埋め込み用のコードをコピーします。 <iframe width="560" height="315" src="...."></iframe> これをブログやホームページに埋め込むと src="..." で指定された動画がページに表示 されますが、スマホで表示すると横幅が 画面をはみ出したり、縦と横のサイズの バランス…

【WordPressのセキュリティ対策レッスン】

WordPressは世界シェアナンバーワンのCMSなので、 利用者が多い反面、攻撃の対象にもなりやすいです。 これはどうしようもない事実です。 私たち個人ができるセキュリティ対策としては、 1.どんな攻撃方法があるのかを知っておくこと。 2.どんな対策方法…

【WPのDB移行で思わぬエラー】

同じレンタルサーバー同士の 移転なので、単純に Export→Import で取り込めると思ったら MySQLのバージョン非互換で 内部文字コードのエラー。 kngy.net 結局、DBのダンプファイルを テキストエディタで直接修正し、 正常にImportできました。 サーバーもそ…

【クラウド型ウェブツール開発】

ツール開発の打診があったので、 実現の可否を見極めるために 開発ソフトで技術調査の真っ最中。 1.データベースの利用 アプリケーションからレンタルサーバーの DB(MySQL)に接続できること。 2.WebAPIの利用 サードパーティーのWebAPIを使って、 デー…

【スタイルシートで簡単にグラフが描ける方法】

世論調査のようなアンケートページを 作成中の生徒さんから質問がありました。 「アンケートの結果をグラフみたいに 表示したいのですが、できますか?」 中級者以上なら、 ・HTML5のCanvasタグ ・JavaScript この2つを組み合わせれば グラフが描けることを…

【レストランの検索ページでjavascriptのレッスン】

今夜のマンツーマンレッスンの準備で、 架空のイタリアンレストランの検索ページを 作成しました。 レッスンの目標は2点。 ・javascriptを使って入力内容を取得する ・javascriptを使ってHTMLを自由に変更する 高度なことを実現するには、 単純なことを仕組…

【150万PV・VPSへサーバー移転】

マンツーマンレッスンで知り合った 起業家さんが運営していらっしゃる 月間150万PV越えの超人気メディア。 アクセス数が多く、 ピーク時に何度もサーバーダウン。 サイトの今後の成長を見据えて、 共用型のレンタルサーバーから VPSへの移転を提案しました。…

【ドメインのお引越し(移管)】

長年ウェブサイトを運営していると、 あっちで取得したドメインや こっちで取得したドメインが、 あっちのサーバーで使っていたり こっちのサーバーで使っていたり、 情報がバラバラになってきて ややこしいですよね。 「一箇所にまとめて管理したい」 そん…

【ウェブサイトをSSL化するレッスン】

現在、少数の生徒さんを動画講座や マンツーマンレッスンで継続的に お教えしていますが、 ひとりひとり目標も違えば、 毎回お教えする内容も違うので、 ちょうどいい人数と感じています。 明日は、ウェブ予約システムの設置を お教えした生徒さんに、 サイ…

【ウェブ予約システムを設置するレッスン】

・予約状況を見ることができる ・カレンダーから選択できる ・日付と時間帯が選択できる ・予約完了ページが開く ・予約メールが届く ・自動返信メールが届く そんなウェブ予約システムを ホームページに設置するレッスンを行いました。 英語のプラグインっ…

【スタイルシートを学んで表現のバリエーションを増やそう】

いろんなサイトを見て、 「自分でもこういうサイトを作れるようになりたい」 ということから、マンツーマンレッスンで HTMLとCSSを学んでおられる生徒さん。 『ホームページ作成のツボとコツがゼッタイにわかる本』 http://amzn.to/2bXJkbs を購入されて自習…

【伝えない希望は叶わない】

たとえ仕事を依頼する相手のほうが その分野のことに詳しくても、 「こうして欲しい」 を具体的に伝えることができなければ、 期待通りのモノは出来上がってこない。 なぜなら、 作る側は、提供された情報で作るから。 言われてもいないことを、 想像で作っ…

【ドラえもんの名言より】

今回、初めて正規の料金で ピンポイントレッスンを行いました。 生徒さんに金銭的な余裕が あったからではありません。 むしろ逆なんです。 ~~~~~~~~~~~~~ 今までオンラインスクールや 訪問レッスンをお願いして 多額の投資をしてきたので、 正…

【公共機関HPのワードプレス載せ替えをサポート】

勤務先でHPのリニューアルを 仕事として命じられた生徒さん。 なんと、勉強の期間も含めて1年 待っていただいているそうです。 「もう失敗はできない・・」 「最低でも半年で完成させたい・・・」 今日は第1回目のレッスンでしたが、 事前に質問事項をワー…

【二冠達成!!2ジャンル同時1位 ワードプレスの本】

先月のことですが、ついにWebデザインとWeb構築・管理の 2ジャンルで二冠を達成しました。 Amazonの全ての本の中で総合661位でした。 最近は、マンツーマンレッスンでも私の本を 使ってくださっている生徒さんがおられます。 もちろん購入していただいてい…

【フロントエンジニアがサーバーエラーに挑む】

ものすごいアクセス数を集めている メディアサイトで頻繁にサーバーエラーが 発生して見れなくなり、困っているという ご相談をいただきました。 レンタルサーバーのログ解析ページを見て、 サイトに大きな負荷をかけているページの ランキングを割り出すと…

【仕事でワードプレスが必要な方へ】

勤務先のホームページをワードプレスに 載せ替えることになった生徒さん。 今まで有名なオンラインスクールや、 訪問レッスンを受けて、 多額の自己投資をされてきたそうです。 でも、残念ながら仕事で必要なレベルまで スキルアップすることはできませんで…

【ワードプレス以外でも使えるアンケートフォーム】

アンケートフォームやお問い合わせフォームなど、 ウェブの画面上で入力や選択した内容をメールで 送信できるものがありますよね。 ワードプレスなら、 プラグインとして配布されているものがあるので、 プラグインのインストールと設定のやり方さえ ネット…

【Googleアナリティクスとサーチコンソールを設定しよう】

ワードプレスでサイトを作っている生徒さん。 今日は、ワードプレスに2つの重要ツール ・Googleアナリティクス ・サーチコンソール を連携する具体的な設定方法と、 この2つのツールを ・どんなときに ・何のために ・どの画面で ・何を見れば ・どんな情…

【縦横が入れ替わるレスポンシブな表(テーブル)】

HTMLとCSSを学んでいただいている生徒さん。 今日は、スマホで表示したときに縦横が入れ替わる 表(テーブル)の作り方をお教えしました。 ランキングや一覧などを表にすると見やすいのですが、 列が多くなるとどうしてもスマホで表示させたときに 折り返し…

【TwitterのタイムラインをWordPressに設置する方法】

無料テーマを使ってWordPressでサイトを作る 勉強をしている熱心な生徒さん。 今日はサイドバーにTwitterのタイムラインを 表示する方法を学んでいただきました。 Facebookのタイムラインや、 Instagramの投稿など、 SNSの投稿と連動しているサイトって 結構…

【更新しやすいホームページとは】

診療時間や料金表など、 追加や変更が生じやすい箇所を 全て画像で作ってしまうと、 ホームページが制作者の手を離れて、 画像ソフトを使えないクライアント様の 手に引き渡したあとで困ります。 「ちょっと文字を変更したいだけなのに、 画像ソフトがないか…

【プログラミングの面白いポイント】

今日もVBAプログラムと格闘です。 手作業やマクロではできない 複雑な処理をプログラムで自動化するのですが、 そのプログラムを組み立てるための ロジックを考えるのが面白いです。 ~~~~~~~~~~~~~~~~~ このデータをこっちに詰め込んで・・…

【脳ミソが沸騰しそうです・・・】

CSVを読み込んで、マスターと照合して どうのこうのするツールを作成中です。 もちろんお仕事です。 プログラムの中で取り扱うデータ構造は 自分で考えて決めることが多いのですが、 なるべくシンプルに心がけても、 実際のロジックはなかなか複雑になる こ…

【ワードプレスのインストールが失敗する意外な原因】

海外在住のデザイナーさんからメールで ご相談をいただきました。 「お名前.comで取得した独自ドメインを、 さくらインターネットのサーバーで使いたい」 「ワードプレスをインストールしたけれど、 画面が表示されない。403 Forbiddenが出る」 ウェブサイト…

【HTMLとスタイルシートの関係】

HTMLのテンプレートを使ってサイトを制作している 生徒さんと、スカイプで1時間レッスンを行いました。 文章やリンクを入れる程度しかHTMLを触っていないので、 「表を埋め込むにはどうしたらいいの?」 「ページ内にリンクさせるにはどうしたらいいの?」 …

【HTMLをピンポイントで学べるレッスン開始】

WordPressの5時間コースを 受講された生徒さんから、 「HTMLのレッスンを受けたい」 というご相談を いただきました。 お客様に紹介したい 商品があるそうです。 そのためのページを 作れる実力を、 しっかり身に付けたい と仰るのです。 とても向上心のあ…

【ワードプレスのバックアップでFTPエラーが出た場合の対処法】

ワードプレス用のバックアッププラグインとして有名な BackWPup でバックアップを実行したときにFTPエラーが出た場合の 原因と対処法について解説します。 BackWPUpはFTP通信を利用している BackWPUpを使うと、夜中などに自動で定期的にWordPress全体を バッ…

【Python入門書を書いてみたい方いらっしゃいませんか?】

お世話になっている出版社様が、 ウェブプログラム言語Python(パイソン)の入門書を書いてくださる方 を探しておられます。 ・Pythonを初心者向けに教えられる方 ・出版の世界にデビューしてみたい方 ・出版の実績を自己PRに追加したい方 いらっしゃいまし…

【フォーム送信前にプログラムを割り込ませる方法】

登録ボタン、送信ボタンなどフォームのボタンをクリックすると、 サーバー側にリクエストが送信されるので、 ブラウザの画面はリロードされます。 ですから、もし画面がリロードされる前に何かをしたい場合、 ボタンの送信イベントを横取りして、目的の処理…

【パトラッシュ・・・】

結局、IE8互換対応の先陣を 切ることになりました。 「互換用のjsプラグインが いろいろ転がってるから、 簡単に対応できるだろ?」 とかすぐに言いたがる 現場を知らないエンジニアに 言ってやりたい。 『じゃあアナタがやれば?』 『簡単なんでしょ?』 と…

【IEはウェブ制作者を苦しめる】

いったん納品を終えた とあるサイト構築案件で、 IE8への互換対応が 必要だという話になりました。 制作側の関係者が、 コスト・信用ともに手痛い ダメージを被ることに。 私には直接的な飛び火は していませんが、気の毒です。 本件のコーディングでは、 ・…