Web制作テクニック 【Javascript】オブジェクト（連想配列）内の文字列をソートする方法【sortメソッド／比較関数】
Javascriptのsortメソッドは便利な機能ですが、クセがあるので使い慣れていないと混乱することがあるかと思います。 個人的に「これどうやるんだっけ？」と思うことがあったので、今回まとめて記録用にまとめます。 オブジェクト（連想配列）...
JavaScript (JS)
Web制作テクニック 
Web制作テクニック あなたのサイト・ブログを異次元レベルに高速化する方法とデメリット
サイトの高速化はページ回遊率や離脱率の改善に非常に効果的なので、色々と思考錯誤している人は多いかと思います。特にWordpressサイトを運用しているとページ数の増加に伴い著しく速度が落ちてくるので悩んでいる人も多いのではないでしょうか？ ...
Web制作テクニック 初心者HTMLコーダー、プログラマーの時短術。バグに悩んだら単純化して考えよう
Webコンテンツが広く浸透したことで、HTMLコーディングやJavaScriptやPHPなどのプログラミングのハードルがぐっと下がり、独学で学ぶ人が以前よりも増えたように感じます。 独学でもプロとして通用するレベルにまで成長することは可能で...
Web制作テクニック 更新作業の手間を大幅削減！jQueryプラグインSmartList
無駄な更新作業に時間を費やしていませんか？ コーディングをしている人であれば以下のような横並びのリストを目にしたことがありますよね。いたって普通のリストです。 この時のソースコードは以下のようなイメージです。 <ul class="list...
Web制作テクニック 余計な記述無しで要素の高さを揃えるjQueryプラグインSmartHeightLineを公開しました。
HTMLやCSSだけでは実現が難しいレイアウトってありますよね。特定要素に高さを揃えることもその一つ。この問題をスマートに解決できるjQueryプラグインを公開しましたので是非お役立てください。
Web制作テクニック 【おすすめ】JavaScript・HTML5などがマンツーマンで学べるオンラインプログラミングスクールCodeCampの特徴・利点
PC（パソコン）やスマートフォンを使っていて「便利だけどちょっと使いにくいな・・・」と思ったことはありませんか？実はそれ、プログラミングを学習すれば解決できます。 「プログラミングなんて一般人に無理でしょ？」と思うかもしれません。しかし、意...
Web制作テクニック 【入門】JavaScript初心者が基礎を身につける為に読むべき記事まとめ+α、JavaScript講座の紹介もあります
ブログの記事数もだいぶ増えてきたので情報を整理するという意味でも入門向けJavaScript（JS）関連の記事をまとめてみようと思います。合わせてJavaScript初心者が基礎知識を高める為に有用なお勧めの書籍も紹介します。※現時点では当...
Web制作テクニック 【JavaScript】ラッパー関数を利用して簡潔で分かりやすいプログラミングをしよう
プログラミングにある程度慣れてくると色々と欲が出てきて「ここはこうやったほうが良いのではないか？」といった考えが浮かぶようになってくるかと思います。 無数にあるそういった考えの中の一つとして、「ラッパー関数」というものを説明しようと思います...
Web制作テクニック HTMLにGoogleマップを埋め込む際、正常に表示されない不具合の対処法
仕事でコーポレートサイトなどを作成していると企業情報ページにGoogleマップを埋め込む機会が多いかと思います。 HTMLとCSSだけで制作したサイトであればまず無いのですが、JS(JavaScript）を駆使したサイトを制作しているとGo...
Web制作テクニック 【サンプル付】外部化したヘッダー・グロナビの現在位置をアクティブにするテクニック【自動化】
以前投稿したヘッダーなどを外部化するテクニックの記事が大変好評のようでご利用いただいた皆様ありがとうございました。今回はその続編記事になります。事前知識として前回の記事をご覧いただくことをお薦めします。 実はヘッダーなどの共通パーツを外部化...
Web制作テクニック DOMを操作してHTMLを制御してみよう【 jQuery基礎】
前回の「CSSの操作」に引き続き、今回は「DOMの操作」について解説していきます。「CSSの操作」を理解された前提で話を進めていきますので、まだな方は先にCSSの操作をご覧ください。 CSSの操作で制御できるのは「見た目」に限定されていまし...
Web制作テクニック jQueryを使ってCSSを操作してみよう【 jQuery基礎】
先日投稿したjQueryの記事に続いて今回は実際にプログラムを書いていきます。 前回の記事の「ブラウザに依存しないセレクタエンジンを使ったDOMエレメントの選択」、「CSS操作」にあたる部分を取り扱います。 まずはjQueryを学習するにあ...
Web制作テクニック 値渡しと参照渡しを知りプログラムの挙動を正しく把握しよう【JavaScript入門】
以前、JavaScriptの基礎知識として関数に関する記事を書きましたが、関数を作成するにあたって知っておいたほうが良い知識に値渡しと参照渡しがあります。 値渡しと参照渡しとは関数への引数の渡し方に関する用語です。 この記事を理解するには関...
Web制作テクニック 膨大なデータの管理に便利！配列とオブジェクトを学ぼう！【JavaScript入門】
過去の記事でJavaScriptの基礎知識として色々と取り上げていきましたが、今回は配列とオブジェクトを取り上げようと思います。これらは知らなくてもプログラムは書けますが、知っているかどうかで作業効率大幅に変わります。 配列とは 配列とは複...
Web制作テクニック JavaScriptの関数型パターンによるクラス定義を学び信頼性のあるプログラムを書こう
どうも、こんにちわ。 フロントエンドエンジニアという肩書きを名乗っているのにも関わらず、最近、オブジェクト指向なプログラミングを書けていない管理人です。 というわけで今回は自分のリハビリも兼ねてJavaScriptの関数型継承というものを説...
Web制作テクニック JavaScriptの勉強を始める際まず知っておきたい３つの知識
学生やWebデザイナーの方でこれからJavaScriptやjQueryを始めたいという方は多いかと思います。いざ入門書などで変数や関数などを勉強しようにも、それ以前の箇所でつまづいてしまうという方もいるかも知れません。 そこで今回は本格的に...
Web制作テクニック jQueryの基礎中の基礎をなるべく分かり易く解説！
jQueryが世の中に浸透してからもう何年も経ちますが、なんとなく利用しているだけで実は基礎的な部分すら知らないという方は意外と多いかと思います。というわけで今回はjQueryの基礎中の基礎を解説していこうと思います。 jQueryの機能・...
Web制作テクニック レスポンシブWebデザインを実装してみて分かった11＋αのポイント
長年コーディングをやっていますが、今更ですが先日はじめて仕事でレスポンシブWebデザインに対応したサイトを作ることになり、やっとひと段落したところなのでレスポンシブWebデザインのメリット・デメリット、構築する上で気を付けたほうが良いところ...
Web制作テクニック JavaScriptを必ずCSSの後に読み込ませるべき理由とは？
プログラムが得意でない方でもライブラリを通じてJavaScriptを利用しているかと思います。 そのスクリプトを読み込む際にscript要素を使いますが、見落としがちな罠が潜んでいます。まずはその問題のソースコードをご覧ください。 問題のソ...
Web制作テクニック つまらない納品作業をあっという間に！FileExtractorAIRの活用法をご紹介！
以前作成したWeb制作者支援ツール FileExtractorAIRの活用方法をご紹介します。 今回の例ではWebサイトの更新差分ファイルのみをアップロードし、更新したファイルをリストアップするまでの手順を取り上げます。 1. まずはサイト...