2013年11月8日、JPタワー(東京・丸の内)で開催されたCREATE NOW / PLUS ONE DAYの「画像をなるべく使わずにWebをレイアウトするテクニック」セッションのスライドです。 http://adobe-createnow.jp/eventRead less
風水的に推奨できない地域に自分の家を建てるとか引っ越しをするという場合は… 恋する人ができてしまうと、その人とのこれから先の事と併せて相性が気になるでしょう。相性占いにトライしてあなたが恋心を抱いている人との相性がどれくらいのレベルなのかを確かめてみませんか? その日の運勢を知りたいとおっしゃるなら、TVの1つの構成となっている占いコーナーの時間が到来するのを黙って待つよりも、スマホを手に取り無料占いに注目した方が利口だと考えます。 占いで導き出された答えと未来が違っているとしても、外れたというわけではありません。タロット占いによって導かれた答えをベースとして生活すれば、未来は変えられるからです。 「ケガが長引いていて出掛けられない」といった方が、自宅で占い師に懸案事項を告白し、この先を占って貰えるというのが電話占いの利点です。 能力の高い占い師ほど顧客が多くいるので、アポは入れづらくなる
有名なサイトだとPinterestやBehanceなどで取り入れているような、グリッドレイアウトを簡単に実装できるjQueryプラグインのまとめです。 少し前はポートフォリオのギャラリー部分などのような箇所で主に使われている印象が個人的にあったのですが、最近ではブログの記事一覧やECサイトなどでもよく見かけますし、コーポレートサイトのトップに採用しているサイトなども多く見かけます。 基本的な動きは同じようなものでもサポートブラウザやアニメーションの有無などがプラグインによって違うので、自分の中で幾つか使いやすいものを見つけておくと良いと思います。 一応グリッドレイアウトを実装するためのプラグインということでまとめていますが、中にはフィルタリング・ソート・ドラッグ&ドロップなどの機能も併せて実装できるプラグインもあります。 また、基本的にフリーで使用できるもの中心でまとめていますが、商用利用
こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 前回、これからSassを始めたい人へ!導入手順をまとめてみた(Dreamweaver対応)というSassの基礎に関する記事を書かせていただきました。 そこで今回は、もう一歩つっこんでもっと使いこなせるようになろう!という趣旨のもと、ちょっと使えるようになったからっていい気になっている僕がSassのテクニックやら関数をまとめてご紹介いたします! たくさんある機能の中から、今回は比較的簡単で実用性の高いものをチョイスしました。 目指せSassマスター!WEBデザイナーもコーダーもすぐに実践したくなるSassの基本テクニック12連発もくじ もくじ テクニック1 アンパサンド(&) テクニック2 演算 テクニック3 round() テクニック4 rgba() テクニック5 コメントアウト テクニック6 変数 テ
Alfred は PC上のアプリケーションを即座に検索でき、立ち上げることの出来るアプリケーションランチャーです。 これだけでも便利なのですが、Powerpack と呼ばれるプラグインを購入し適応してみました。 購入はこちらから行います。 購入の手続きが完了した後、ライセンスが書かれたメールが送られてきます。 これを Alfred の Preferences の Powerpack にて購入時のメールアドレスと共に入力することで Powerpack の機能が有効になります。 Power pack を適応することでアンロックされる機能は公式に掲載されている通りです。 http://www.alfredapp.com/powerpack/ ざっくり説明すると、 Workflow を作成、インストールできるようになる クリップボードの履歴の呼び出し、スニペットの登録ができるようになる iTune
下記のような3カラムのグリッドに複数のアイテムを配置する時、アイテムの数が3の倍数だったらぴったり収まりますが、アイテムが7, 8個の場合は最後に余白を生じます。 もちろん余白のままでも良い場合はありますが、ぴったり収めたいという時に役立つスタイルシートのテクニックを紹介します。 Tetris & The Power Of CSS 基本となるHTMLは、リストでアイテムを配置します。 HTML アイテム数は、適当に変更して構いません。 <ul class="flex-container"> <li class="flex-item">1</li> <li class="flex-item">2</li> <li class="flex-item">3</li> <li class="flex-item">4</li> <li class="flex-item">5</li> <li cla
作成:2013/11/11 更新:2014/10/24 Webデザイン > 前回フォントや「文字」に関するまとめを書きましたが、書き足りないことが結構あったので、続編を作りました。今回は自分の勉強もかねて、フォントに関する基礎知識、アキ、段組み、詰め、図版などデザインに携わるなら知っておきたい知識をまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ 文字の基礎知識 1.文字用語 組版 2.組版(くみはん) 3.禁則処理 4.追い込み/追い出し/ぶらさがり 5.段間 行間(レディング) 6.アキ 7.行長 8.段組み 9.黄金比 詰め 10.プロポーショナル詰め 11.音引き 12.拗音(ようおん) 13.合成フォント 余白 14.近接と遠隔 15.版面(はんづら) 図版 17.図版率 18.訴求度 文字の基礎知識 1.文字用語 頻繁に出てくる、ちょ
レスポンシブWebデザインって? レスポンシブWebデザインとはPCのブラウザのサイズ以外のiPhoneやAndroidなどのスマートフォン、iPadなどのタブレット、ラップトップPC等の様々な画面サイズを想定して、その都度の適切なサイズ・コンテンツで表示するWebデザインです。もちろん同じURLなのでスマートフォンに新しいページを用意する必要はないので、一度固めてしまえばあとは運営運用が簡単です。 これまではWPtouchなどのプラグインでモバイル対応をしてきた方も多いと思いますが、GoogleもSEOにまつわる話でレスポンシブWebデザインを推奨していたり、増加傾向のスマートフォンユーザーに対して、テーマの変更を検討してみてはいかがでしょうか。 my flatonica ウィンドウサイズ全幅に展開され、ミニマルでありながらもエレガントなデザインのWordpressテーマです。テーマ専用
新しいフォントが無数に現れる時代になり、やはり情報と同じで多すぎると探しにくくなっています。そこでオススメのサイト2選を紹介しつつ、日本と海外のフォントポータルサイトや日本語フォントをメインに紹介している記事を集めてみました。 オススメの厳選サイト2選 大体はこの2つのサイトでイケてるフォントは手に入りますので要チェックです。ですが、日本語のフォントがないので日本語のフォントをお探しならば目次の2-1や3-2を見て下さい。 Fonts.com(SkyFonts) Fonts.com(SkyFonts) 個人的に超お気に入りのサービスです。現在1123種類のフォントをダウンロード出来るようになっていますのでやってない方は是非是非、お気に入りのフォントをダウンロードしましょう。 GoogleのオープンソースWeb Fontsコレクションが、デスクトップでも利用できるようになっている(Macおよ
2013-06-17 WEBコーダーがデザインを受け取った時に嬉しい8つのこと WEB制作 author:ゆっき 1つのwebサイトを作るのに、多くの人が関わり、協力してカタチにしていくのって、いいですよね。ひと通りのことを一人でできることも大切だと思いますが、それぞれの役割ごとのプロがいるのってすごいことだと思います。 プロデューサーがプロデュースして、ディレクターがディレクションをして、デザイナーがデザインを作り、コーダーがコーディングし、プログラマーがプログラミングする。 なんかかっこいい! 今日は、WEBコーダーとして、デザイナーさんの作ったデザインが「こうなってると嬉しい!」と思うことをご紹介したいと思います。 1. ガイドがバッチリ引かれている 私が最初にすることは、サイトのあらゆる部分の採寸です。 サイト全体の横幅 ヘッダーの高さ グローバルナビのパーツの横幅、高さ 左右カ
マークアップシリーズの第2回は、前回のよくある3つのデザインから考える、マークアップの最適解と同じく、html5jマークアップ部主催のイベント「MarkupCafe」で出題された3つのお題から最適なマークアップを探ります。 イベントではAからDの4つのチームにわかれてマークアップを考えました。それぞれのチームごとに違ったマークアップへの考えが表れていてとても興味深いです。また今回はイベント終了後に「HTML5 Experts.jp」のエキスパート兼マークアップ部の部長でもある村岡正和氏に、氏自身ならこうするといったマークアップを公開してもらいました。 本記事ではWebサイト制作の際にありがちな”ページング”、”フォーム”、”データテーブル”の3つについて要素の使いどころや仕様、アクセシビリティやユーザビリティといった観点からマークアップを考えていきます。 1.ページングの中身と重要度 最初
申し訳ございません。 只今メンテナンス中です。
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
プロフィールに記しておりますとおり、私は現在デザイン会社にて働いております。 昨年の3月、5年ほどやっていた「DTP・グラフィックのデザイン・レイアウト業務」から「Web担当」に相なり、日々勉強しながら仕事に臨んでおると言う状況です。 そのちょっと前までHTMLは妖精が書いていると思っていた私にとって、あまりに勝手の違う作業内容。最初は途方に暮れておりましたが、Twitter等で知り合うことのできた先輩Webデザイナーさん達のおかげもあり、現在では自分でWordPressのテーマを作成できるまでに成長することができました。頭を叩くと「セマンティック!」と音が鳴るまでになりました。 そんなわけでここいらで一度、自分がDTP→WEB担当になるにあたって勉強したこととか使っているツールとかをデロッとまとめておきたいと思います。 まずは業務をする上で必要不可欠になった言語や、作業効率を上げるために
初めてのiPhoneアプリを7日間で開発しました。 ウェブサイトの企画・制作が本業の僕にとって、アプリの制作はまったくの未経験。そのくせApp storeでリリースするところまで達成できたのは、 アプリ作成に挑む前の「気持ちの作り方」 技術不足を補ってくれるツール この2つのおかげだと思っています。 アプリの制作に挑戦し、途中で挫折してしまう失敗の原因に多いのは、身の丈に合わない難しすぎるアプリを作ろうとしてしまうことです。 僕の場合は、とにかくアプリを完成させることをゴールとして設定。開発期間を短縮してくれそうなツールがあれば利用することをアリとしました。 その結果、わずか1週間で初めてのアプリの制作を終えられたのです。 アプリをApp Storeからリリースしたことが「ある」と「ない」の差は自分にとっては大きく、ゼロから1にできたことへの達成感は今でも心に残っています。(この記事はアプ
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く