発行
スマートフォンの登場で、Webサイトそのものを印刷して情報を保存するニーズは低減しましたが、ユーザーや、サイトの性質により印刷が必要とされる場合もあります。これまで制作はどのような対応をしてきたか、また印刷手法にはどのようなものかあるか、それぞれの経験を語ります。
ECSSは「分けて考える」という思想であることを前回解説しました。そのためには、具体的にはどのようなアプローチを用いているのでしょうか。実際のECSSのWebサイトを元に、「名前空間」と「モジュール」について解説します。
React.jsで書かれたWebアプリケーションを実際にFluxの設計に則って書き換えてみます。Fluxによってデータフローを整えることで、のちのちの拡張性や修正に強い設計になります。
発行
前回までで、UIデザイナーによる使用フォントの選定が終わりました。今回は、その指定を元に実装した過程を紹介します。font-familyでフォント名を指定するだけと思っていましたが、使用するフォントや表示するブラウザによって、さまざまな違いがあったのです。
CSS設計方法、Enduring CSS（ECSS）は、複雑さを排除し、ある程度のCSS容量増加を覚悟することで、CSSの寿命を伸ばすというアプローチを取っています。今回は、その基本となっている考え方から解説します。
React.jsで複雑なアプリケーションを構築するのに親和性が高い設計思想Fluxを解説します。必ず採用しなければならないものではありませんが、React.jsをよりよく理解するためにも知っておきたい設計思想です。
発行
今回は、実際の選定のプロセスを紹介します。何よりも先にやらなければならなかったのは、各種OSに標準インストールされているフォントの調査でした。それを踏まえ、今回の選定コンセプトに合ったフォントを選定します。
モバイルデバイスの普及により、狭い画面幅が一般的になりました。このとき、折り返しの制御を怠るとレイアウトの崩れの原因にもつながってしまいます。今回は英単語や数字、URLの折り返しをコントロールする方法を紹介します。また、コンテンツ幅に応じたセンタリングと左寄せの自動切り替えにも触れます。
コードのリファクタリングとテストの仕上げとして、最後に表示処理のテストを書いていきます。表示処理は文字結合など単純な処理も含まれますので、テストを行う、行わないの判断も適宜するとよいでしょう。
発行
OSやブラウザのバージョンアップが進み、サイトで利用できるフォントに変化が出ています。このシリーズでは、ピクセルグリッドのコーポレートサイトリニューアルを例に、フォント選定と実装のプロセスを解説します。まずは、フォントを選定する前に考えておくことを紹介します。
モバイルデバイスの登場により、Webサイトがさまざまな画面幅で表示されるようになりました。どんなデバイスで表示しても、意図通りにテキストが表示されるようにコントロールするにはどのような方法があるか、ピクセルグリッドとCodeGridのリニューアル作業を例に解説します。
ToDoアプリからデータを扱う処理を分離して、設計し直してみます。分離した処理群に対して、テストを書いてみましょう。コードの設計とテストは一緒に考えたほうが効果的であることが実感できるでしょう。