文字を制限した軽量な日本語 Web フォントを作成する方法
最近、Web フォントをつかってかっこいい表現をしているサイトも増えてきました。ただ、残念ながら 日本語で Web フォントを使うのは厳しいのが現実です。 というのも、日本語には英数字・ひらがな・カタカナ・漢字・記号・・・など必要になる文字数が多すぎるため、フルスペックの日本語の Web フォントはファイルサイズがすごいことになりそうです。 そこで、「利用したい文字だけを含んだ Web フォントをその都度作ればいいんじゃね？」ということを考えてみました。アイデア自体は珍しいものではなく、例えば デコもじ というサービスは同じようなことをやってくれるようです（ただし、無料では「書体 1 つまで」「5 文字まで」など機能制限が大きい）。 (追記) このような軽量フォントを作成することを「サブセット化」というようです。 手始めに日本語 Web フォントを作ってみる まずは簡単に日本語 Web フ
Create a Responsive and Multilingual Website in 5 min with Edicy
2014年7月23日 便利ツール 以前、元お隣さんが「非WEB屋でもサイトが作れる驚異的サービス／『サイトを作る』という敷居がどんどん低くなっていると実感する物色々」という記事でWeb制作の知識がなくても簡単にWebサイトを作れるサービスを紹介してくれていました。HTMLやデザインの知識がなくても、テーマを選んでコンテンツを入力すればサイトが作れるサービスがどんどん増えていますね。今回は同様のサービスですが、より多機能な「Edicy」を紹介しようと思います。 ↑私が10年以上利用している会計ソフト！ Edicyの特徴 動画を見てもわかる通り、Edicyは簡単にブラウザー上でWebサイトが作れるサービスです。 とにかく試してみましょう！ホームの「Try for Free」ボタンからアカウントを作成します。「.edicy.co」のドメインが取得できます。
必読！5分でわかるレスポンシブWebデザインまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
二度目まして。デザイナーの野田です。 レスポンシブWebデザインについて、僕なりにまとめてみたのでご覧下さい。今回は、制作に関することではなく、最低限知っておかなければならないことの基本編になります。 独学でつまずいていませんか？ Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。どんなスクールがあって、どんな内容が学べて、費用はどれくらいするのか、情報として持っておいて損はないはず。下記におすすめスクールを集めてみました！ レスポンシブWebデザインとは 「レスポンシブWebデザイン」とは、PC、タブレット、スマートフォンなど、複数の異なる画面サイズをWebサイト表示の判断基準にし、ページのレイアウト・デザインを柔軟に調整することを指します。 現在はPCやスマートフォンなど、デバイス毎に各HTMLファイル
Animating with CSS Transitions · jQuery Masonry
Ut condimentum mi vel tellus. Suspendisse laoreet. Fusce ut est sed dolor gravida convallis. Morbi vitae ante. Vivamus ultrices luctus nunc. Suspendisse et dolor. Etiam dignissim. Proin malesuada adipiscing lacus. Donec metus. Curabitur gravida. Phasellus pede arcu, dapibus eu, fermentum et, dapibus sed, urna. Sed ac risus. Phasellus lacinia, magna a ullamcorper laoreet, lectus arcu pulvinar risus
なんだこれ！！「NHKスタジオパーク」のレスポンシブ・ウェブデザインが凄まじくレスポンシブ！！ | ゴリミー
今のウェブデザインの流行りは「レスポンシブ・ウェブデザイン」！ 昨日、とあるアプリの紹介ページについて話し合っていたのだが、株式会社LIGのデザイナブログに書いてあった「必読！5分でわかる流行のレスポンシブWebデザインまとめ」に載っていた「NHKスタジオパーク」のレスポンシブ・ウェブデザインがイケイケすぎて感動したので、紹介する！これは本当にすごい！！ まず普通に表示するとこんな感じ。よくある3コラムベースのウェブサイト。 少し幅を狭めると、下にあったコンテンツが右サイドバーに移動し、右サイドバーにあったコンテンツが下に移動した。 さらに狭めてみると、右のサイドバーが完全に無くなった。 さらに狭めると今度は左のサイドバーが消えた。 ブラウザの限界まで狭めてみると、各パーツの幅も狭まってこのような形に落ち着いた。 これを試している時、各要素の動きがあまりにも滑らかでものすごく感動した。皆さ
NHKスタジオパーク
NHKスタジオパーク その２ NHKスタジオパークをVRで！大人気だったアニメのアフレコやキャスター体験をどうぞ！ NHKスタジオパーク 閉館について ２０２０年５月１１日 平素よりＮＨＫスタジオパークをご利用いただき誠にありがとうございます。 新型コロナウイルス感染拡大防止のため臨時休館中のＮＨＫスタジオパークは、６月の再開をめざしてきましたが、このたび閉館させていただくことといたしました。 緊急事態宣言が延長されるなど新型コロナウイルスをめぐる状況の先行きが見通せないことと、東京オリンピック・パラリンピックの延期に伴い、放送センターの建て替え工事の準備作業にスケジュールの変更が生じたためです。 当初はことし９月いっぱいでの閉館を発表していましたが、諸般の状況の変化に伴い、閉館時期を早める判断に至りました。 長年、多くの方々にご利用いただき、心より御礼を申し上げます。 既に団体予約をされ
[JS]変更時のアニメーションが気持ちいい、レスポンシブ対応のかっこいいグリッドを生成するスクリプト -Grid—A—Licious
Masonryはかっこいいけどパネル移動のアニメーションがちょっとな、という人にぴったりな、レスポンシブ対応でレイアウト変更時のアニメーションもスムーズでかっこいいグリッドを生成するjQueryのプラグインを紹介します。 Grid—A—Licious Grid—A—Licious -GitHub Grid—A—Liciousのデモ Grid—A—Liciousの使い方 Grid—A—Liciousの実装例 Grid—A—Liciousのデモ まずは、Grid—A—Liciousのベーシックな動作が確認できるデモからご紹介。 アレンジは、下記のGrid—A—Liciousの実装例で。 ページいっぱいに高さの異なるパネルが同じ間隔で配置されています。 デモページ：スマフォサイズ Grid—A—Liciousの使い方 Grid—A—Liciousは2008年にリリースされた当時は単にグリッド状に
Pinterest風にボックスを組み合わせた表示を高度に実現·jQuery Masonry MOONGIFT
jQuery MasonryはPinterest風の表示を行うjQueryプラグインです。 Pinterest風の大小さまざまなボックスを並べて表示するデザインが人気ですが、より高度な表現を実現したいと考える人に使ってみて欲しいのがjQuery Masonryです。 トップページです。ここも面白い表示です。 単純なシングルカラム。 マルチカラム。 画像。 メディアミックス。 アニメーションです。 項目の追加も可能。アニメーション付きです。 ページの最下部までいくと自動追加読み込みします。 一定の幅を空けて配置される表示法です。 右寄せ。 中央寄せ。 固定表示。赤い枠は常に右上に出ます。 単純な固定幅のカラムはもちろん、横に複数段にまたがる表示も可能です。画像の大小も適切に判定して表示してくれます。動画やテキスト、画像を組み合わせて表示も可能で、これはメディアなどで使うと面白そうです。一回表
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://pointcard.me/japanese-free-web-fonts/
Responsive Web Design JP（日本国内の秀逸なレスポンシブWebデザインを集めたギャラリーサイト）