はしくれエンジニアもどきのメモ

情報・Web系技術の勉強メモ・備忘録です。

デザイン

CSS のみで縞模様、水玉模様を作る

CSS のみで縞模様、水玉模様を作る CSSのみで、縦縞・横縞、水玉模様を作れることがわかったのでメモ。 参考にしたリンクはこちらです。 honttoni.blog74.fc2.com 目次 サンプル 縦縞・横縞・斜め縞 水玉 参考リンク サンプル 縞模様のサンプル codepen.io …

ドローイングソフト「Inkscape Portable」のインストール

ドローイングソフト「Inkscape Portable」のインストール フリーのドローイングソフト「Inkscape」のポータブル版をインストールしたのでメモ。 svg などのベクター画像を扱えます。 Illustrator の代替ソフトといわれる時もあります。 公式: Home | Inksca…

オープンソースになったフォント「Roboto」を使ってみよう

オープンソースになったフォント「Roboto」を使ってみよう オープンソースになったフォント「Roboto」をインストールしてみたのでメモ。 目次 Roboto DL, インストール Windowsフォントとの比較 参考リンク Roboto 「Roboto」は、Googleのデザイナーによって…

CSS の色指定は、HSL を使っていこう

CSS の色指定は、HSL を使っていこう 色の勉強をしていると、 色の3属性として 色相 (Hue)・彩度 (Saturation)・明度 (Lightness)が出てくる。 しかし、RGBで色を指定しまう(指定する機会が多い)と、 この3属性を活かすことができない。。 hsl(); を使えば…

ワイヤーフレーム、フローチャートなどの無料ドローツール「draw.io」 を使ってみる

ワイヤーフレーム、フローチャートなどの無料ドローイングツール「draw.io」 を使ってみる 最近は、ドローイングツールのWebサービスがあります。 その中で、使い勝手がいいという「draw.io」を使ってみました。 目次 類似サービス一覧 draw.ioとは export(…

デザイン基礎(配色)

デザイン基礎(配色) デザインの基礎的な配色関係のリンクが溜まってきたので、保存しておきます。 自分なりにまとめたノートっぽいものを後日まとめておきたいと思います。 「フォント」、「余白」や「レイアウト」の話は別の記事に今後書きたいと思います…

動きのあるWebサイト 12選

動きのあるWebサイト 12選 カルーセル、パララックス、動画などの動きのあるサイトをまとめておきます。 目次 カルーセル系 パララックス系 動画系 参考リンク

マテリアルデザインについてのメモ

マテリアルデザインについてのメモ 今後流行るであろうデザインなので、整理も含めてリンクなどをメモしておきます。 追記:マテリアルデザインでのデータの可視化について追加。 2015年6月3日 目次 マテリアルデザインの概念 マテリアルデザインのサイト集 …

Webサイトをモノクロ表示にするブラウザの拡張機能 (un)clrd

Webサイトをモノクロ表示にするブラウザの拡張機能 (un)clrd 以前使用した( 可読性に優れたサイト 8選 - はしくれエンジニアもどきのメモ ) ツールのメモです。 目次 (un)clrd 関連リンク (un)clrd (un)clrd – The world wide web in black and white!www.un…

可読性に優れたサイト 8選

可読性に優れたサイト 8選 可読性に優れたサイトを保存しておきます。 ここでいう可読性は、モノクロにしてもちゃんと読めるかです。 カラー、モノクロの両方の画像を残しておきます。 目次 通常 パララックス 動画 + パララックス まとめ 参考リンク 関連…

ファーストビューの優れたサイト例 12選

ファーストビューの優れたサイト例 12選 ファーストビューの優れているサイトのメモ。 サイトは変更する可能性があるので、画像も載せておく。 目次 jQuery 系 動画系 劇場系 パララックス 劇場系+パララックス 参考リンク

おすすめダミー画像生成サイト[メモ]

おすすめダミー画像生成サイト ウェブサイト制作に役立ちそうなダミー画像を生成サイトを知ったのでメモ。国産のようです。 目次 紹介 テスト 参考リンク