Keiyaku CSS
Keiyaku CSS Crazy Style Formatter for Japanese Contract Document Unfortunately, the style in Japanese contract document is totally crazy. I hope this CSS library cures that a bit: write a document logically structured in markdown or HTML, apply keiyaku-css to it then, you’ll get a well-formed document good luck! 概要 Keiyaku CSS（以下、「本件ライブラリ」という。）は、Markdownで書かれた契約文書を、適切な印刷書式にスタイリングするための、CSSライブラリです。 ユ
Web業界の人はそろそろPDCAという言葉を捨てたほうがいいんじゃないか - 絶倫ファクトリー
PDCAは「小さな改善」を指すものではないし、そもそもWebサイト改善には向いてない。まずPDCAはP=計画ありきの「マネジメント」の話だし、Webはコントロールできない要素が多すぎて精度の高い計画立案が難しいからだ。 PDCAサイクルの出自は製造業の品質管理である。そしてPDCAという概念のキモは、「品質管理の話をしていると思ったらいつの間にかマネジメントの話をしていた。何を言っているのかry」である。例えば「C」は品質チェック作業はなく、品質のばらつき具合が事前の計画どおりだったかどうかを判断する。それはP=計画の検証そのものだ。製品の品質を管理するときに、単に品質チェックの「作業」を頑張ればいいのではない。品質の問題が生産工程全体のマネジメントの問題にスライドしていく。それがPDCAという概念の画期的な点だった。 だからPDCAというのは製造業だろうがWebだろうが、常にマネジメント
画像を拡大全画面表示するのに、まだLightBoxとか言ってんの？ - それマグで！
フルスクリーン・モード使えよ。楽だぞ 昨今のブラウザにはフルスクリーンモードが搭載されていて、それを使うと、コピペレベルで画像を拡大表示が出来る 画像をフルスクリーンにお手軽に作るHTMLの例 <div id='img01' onclick="this.webkitRequestFullScreen();" > <img src='http://cdn-ak.f.st-hatena.com/images/fotolife/t/takuya_1st/20141129/20141129034938.jpg' /> </div> <button onclick="img01.webkitRequestFullScreen();">フルスクリーンで表示</button> #img01:-webkit-full-screen { width: 80%; background-color: rgba(
画面遷移に疑問を感じたあなたにオススメするUI Flowsというツール | UXデザイン会社Standardのブログ
2014.11.19 / UI 画面遷移に疑問を感じたあなたにオススメするUI Flowsというツール Tomohiro Suzuki クライアントやディレクターから渡された画面遷移図を元にワイヤーフレームを作ってみると、後から足りない画面が次々に発見された、または画面内の情報がどこに繋がるのか分からないといった経験はありませんか？ この画面遷移図というものは本来は制作範囲の全体像と構造を明確にし、必要な画面というものを洗い出したりするものです。通常のWebサイトであれば、従来のような画面遷移図でも問題ないかもしれませんが、多くのインタラクションが発生するサービスの設計では複雑化しやすく、何度も情報を行き来して確認することになるため時間がかかります。 原因のひとつとして、画面遷移図では画面名のみを記載して繋げていくことになるため、必要な情報が不足していることが挙げられます。その結果、本来で
早稲田大学のサイトリニューアルがなぜこんなにひどいのか。 - 隣り合わせの灰と青春
久しぶりにセミナー以外でブログ書きます。 このたび早稲田大学のWebサイトがリニューアルされました http://www.waseda.jp/top/ が、かなり論議になりそうなリニューアルなので、 情報設計専門家として内容を見てみます。 1.なにがグローバルなサイトなの？ 今回のリニューアルではIE10以降を対象外としていて、 普通に使っているIE7や8では見ることができません、 これはアクセシビリティ上かなり問題だと思います、 多くの人が目にする大学というサイトでノンアクセシビリティを貫くというのは、 いまの時代にそぐわないのではないでしょうか。 わざわざIE10にアップデートまでしてみるサイトでもないですしね。 ぜんぜんグローバルじゃありません。かっこ悪いです。 2.レスポンシブデザイン？ スマートフォン、タブレットに対応したサイトになったみたいですが、 そもそものとこ
切れないハサミと使えないWebデザイン | ベイジの社長ブログ
本エントリーは、以下の目次で構成されています。 2種類のハサミと2種類のWebデザイナー Webデザインの特殊性 ビジュアルのディテールに神が宿らないWebデザイン 美しいが使えないWebデザインをしてしまう理由 Webデザイナーを支配する「強固な固定観念」と「裏の動機」 美しいビジュアルの根底にあるデザインの本質 本当に「最近のWebデザインはつまらない」のか？ ミスマッチが生む不幸なWebデザイン Webデザイナーに求められる自らのスタンス Web制作会社にも求められる明確な価値観 2種類のハサミと2種類のWebデザイナー 例えば、以下のような2種類のハサミが存在するとします。 工芸品のように美しいが切れ味はよくないハサミ 見た目はそれなりだが非常によく切れるハサミ 1は、ハサミとしては売れないでしょう。ただ、それが刺激的で斬新なビジュアルであった場合には、特別な賞を取ったり、美術館に
『色を色で見ないで』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 2013年度新卒入社、AmebaのSimplogでWEBデザイナーをしているリュウタロウと申します。 以前新卒デザイナー同士の勉強会がありまして、そこでの私の発表内容がすごく好評でした。 以降より多くの人に向けて発信したいと考え、この場をお借りして記事を執筆させて頂く事になりました。 これから綴るのは、デザインの細かいテクニックやハウツーではありません。 様々なジャンルのクリエイティブに通じる、基本的なモノの見方、考え方の話です。 「ワタシ、デザインワカラナイワ」 というビジネスパーソンも、普段やっている仕事や趣味とリンクさせながら理
FINDJOB!終了のお知らせ | FINDJOB!
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
HTTPリクエスト数削減テクニック2： CSS Sprite編
はじめに こんにちは、クラスメソッド株式会社の野中です。 HTTPリクエスト削減テクニックの紹介に入り、前回の『リクエスト数削減テクニック1：インラインイメージ編』では、インラインイメージについて紹介しました。本記事では「CSS Sprite」の基本的な知識と使い方、使いどころについて解説します。すでに定番のテクニックとなっていますが、何となく使っていることが多いと思います。初学者の方にも理解していただけるよう詳しく解説します。 対象者 対象者は主にコーダー、フロントエンドエンジニアです。 デザインとコーディングを合わせて担当するWebデザイナーも対象です。 コーダー・フロントエンドエンジニア Webデザイナー Webディレクター Web担当者 CSS Spriteとは Webサイトではアイコンやナビゲーションなどに多くの画像が使われ、サイトによっては20個30個とたくさんのアイコンが使わ
WebデザイナーのためのSass/Compass入門 先生：石本 光司
ーーーーーーーーーーーーーーーーーーーーーーー schoo WEB-campusは「WEBに誕生した、学校の新しいカタチ」。 ＷＥＢ生放送の授業を無料で配信しています。 ▼こちらから授業に参加すると、先生への質問や、ユーザーとのチャット、資料の拡大表示等が可能です。 https://schoo.jp/class/228/room ーーーーーーーーーーーーーーーーーーーーーーー
企画・提案・見積・納品・契約などのテンプレ・知識まとめ２３ | コムテブログ
TL;DR クライアントさんとの打ち合わせや会議の後は、必ず議事録を書いて社内共有します。座った位置や発言なども、思い出しながら簡潔に書きます。おかげで「何を話したっけ？」「言った、言わない」を防げてます。フリーランスの人は、見積書、請求書、契約書、法律などのテンプレや知識があると、スムーズに先へ進めます。その他、ヒアリングシート、契約書など Web 制作業でリアルで必要だった書類系テンプレや知識をまとめました。 企画／提案 １．企画書 企画書はどれくらいのコストで効果（売上）を得るかというのが一番大切。とはいえ、上司を説得できる企画書も大切。以下は企画書の作り方と資料作成サービスなどのまとめです。 [保存版] 最強の企画書の作り方と資料作成サービス完全まとめ | 世界ろぐ “通る企画書”作りの基本／上司を説得できる企画資料の作り方講座#1 | Web 担当者 Forum ２．提案書 提案
美しいWebデザインをタイプ別に！見ないと損するパーツ別ギャラリーサイトまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
中型ライダー（二輪）免許を持っているライターの内藤です。 本日は、ライダーキック並みの強烈さで役に立つ見本サイトをまとめてみたいと思います。 Web屋さんはご存じの方も多いかもしれませんが、ブログをしている一般の方、Webデザイン・DTPに興味のある方、お店を持っている方なども必見です！ 部品に特化した見本 部品に特化した見本サイトをご紹介します。 見出しデザイン（h1,h2,h3……その他DTPでも） はじめは見出しデザインに特化した見本サイトまとめ。 見出しデザイン.com http://midashi-design.com/ 見出しタグ（h1,h2,h3……）のデザインの見本ですが、DTPなどでもヒントになるものがたくさんあります。 カテゴライズは、グラデーション・テキストのみ・テキスト非画像・上線・下線・丸・四角・囲み線・斜線・点線・角丸。 ヘッダー部分に凝っても見出しが適当だと全
ノンデザイナーこそ押さえておきたい! UI/UXが学べる神スライド7選 | Find Job ! Startup
競合に負けないWebサービスをつくるため、UI（User Interface）、UX（UserExperience、ユーザー体験）にこだわるのは、もはや常識。良いUI/UXはチーム全員で考えることが、良いサービスをつくる秘訣です。 エンジニアやWebディレクターも学んで損はしません。もちろん、本職デザイナーの方々にも役立つ7つのスライド厳選まとめです！ 目次 基礎知識 １．UXのためのUIデザイン ２．UX is not UI ３．ククパド美ちゃんと学ぶ！クックパッドのUI改善プロセス：前編 応用編（Webサイト） ４．ククパド美ちゃんと学ぶ！クックパッドのUI改善プロセス：後編 ５．コンテンツで改善する UI デザインの極意 応用編（スマホアプリ） ６．UI＆UX / 重要なのは、毎日さわって嬉しいUI UX! 応用編（タブレットアプリ） ７．ニコニコ超デザイン-
CSSだけで作るアイコン付きボタンの作り方
<body> <a href="#" class="button normal">ボタン</a> </body> body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; margin: 0; padding: 0; } a { /* サイズ指定 */ width: 200px; height: 50px; display: block; box-sizing: border-box; margin: 20px; /* 縦横中央揃え */ text-align: center; line-height: 50px; /* 色指定 */ background-image: -webkit-linear
» スマートフォンサイトのユーザビリティを下げるアンチパターン | Webnoborder
モバイルデザインパターン― ユーザーインタフェースのためのパターン集を読んで、スマートフォンサイトのアンチパターンも作りたいと思ったのがキッカケで作ってみました。 独断と偏見で評価しています。 反応エリアを探させるアコーディオン 「お金からモバイルデザインパターン― ユーザーインタフェースのためのパターン集を読んで、スマートフォンサイトのアンチパターンも作りたいと思ったのがキッカケで作ってみました。 独断と偏見で評価しています。 反応エリアを探させるアコーディオン 「お金から探す」周辺のリストがアコーディオンになっていますが、テキストの部分をタップしても何も動作しません。 プラスアイコンの部分をタップしないと反応しないのです。 このようにタップ領域がユーザの意識と違う場所に設定されているのは、ユーザビリティに問題があるといえるので改善が必要でしょう。 参考サイト スマートフォンサイトにお
CSSだけで簡単に吹き出しを作成する方法4つ！
<!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="UTF-8"> <style type="text/css"> * { box-sizing: border-box; } .wrapper { padding: 30px; position: relative; } .box { position: relative; background: #ccc; height: 50px; width: 100px; margin-bottom: 20px; } .box:after { content: ''; position: absolute; border-top: 10px solid #ccc; border-right: 5px solid transparent; border-left: 5px solid tran
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://soufflecode.net/website/
GunosyのUIを徹底的に分析してリデザインしてみた
UIデザインについて改めてしっかりと学ぶために参考になるスライドまとめ
Restaurant Guide | Tabélog New York