WEBデザインとWeb制作に関するmacha1990のブックマーク (15)

  • 今さら人に聞けない!! Photoshopのショートカットキー講座(69) パスの境界線を描く方法

    パスツールで描いた線に、ブラシやペンなどの描画系ツールで色や太さを与えることができるのが「パスの境界線を描く」という機能です。通常はパスパレットのメニューから「パスの境界線を描く」(複数のパスから一部のパスを選択した場合は「サブパスの境界線を描く」)をクリックすることで操作しますが、ショートカットキーを覚えておけば毎回パレットを開くことなく操作ができます。 まずショートカットキー「P」でパスツールを選択し、パスを描きます。その後、「B」でブラシツールに切り替えて線の色やサイズを設定します。ここで選んだブラシの色・サイズ・不透明度・ストロークなどがそのままパスの境界線として表現されます。ブラシ・鉛筆ツールだけでなく、消しゴムツール(ショートカットキー「E」)やぼかしツール、覆い焼きツール(ショートカットキー「O」)などを選択することも可能です。 使用する描画ツールの設定が完了したら、後は「E

    今さら人に聞けない!! Photoshopのショートカットキー講座(69) パスの境界線を描く方法
    macha1990
    macha1990 2012/08/18
    パスツールで書いた線に境界線を付けて実用化
  • JavaScript + Ajax 実践サンプル集 - ホーム

  • はじめてのjQuery

    デザイナ向け「初めてのjQuery」

  • どのプログラム言語を覚えればいいのか分からないっていう初心者さんのためのガイド(Web)

    作りたい Webサイトのアイデアはあるけど、どんなプログラムを勉強したらいいか分からない人 ... という人のための、ざっくりとしたガイドです。 HTMLCSS はわかるけど ... という初心者さんが対象の記事になってます。 インターネット上には当に色んな Webサイトがあって、こんなサイトを自分でも作ってみたいなーと思う事がたくさんあります。でも、いざ自分で作ってみようと挑戦しようと思っても、これって何でできてるんだろうと考えます。そういえば、まだ Webサイトを作り始めるずっと前にもそんな風に思っていた初心者時代がありました。 やりたい事はあるけれど、まず、どんなプログラムを勉強すればいいのか、そこからが分からなかったんですよねー。プログラムとひと言でいっても、C言語系、PHPJavaPerlJavascript当にたくさんあって、初心者さんには意味不明だと思い

    macha1990
    macha1990 2012/06/26
    プログラム言語概要
  • みんな大好きリキッドレイアウト~固定幅+リキッドレイアウトに挑戦~ « SetucoCMSプロジェクト

    はい、こんにちは。リーダーのskyguildこと三上です。 SetucoCMS合宿@2011のLT大会でリキッドレイアウトの話をしました。今回はそのスライド内で語り切れないデモの部分を中心に解説してみます。 リキッドレイアウトのLTスライド うまく表示されない方は下記のリンクからご覧ください。 みんな大好きリキッドレイアウト(別窓で開きます) 要約 リキッドレイアウトとは、可変レイアウトの一種で、ブラウザ幅に対して%で幅を指定する。 リキッドレイアウトなら閲覧環境に合わせて最適なレイアウトに可変できる! とはいえ、「ナビゲーションの幅が可変すると使いづらい」とか一部は固定幅にしたい。そんな時の固定幅+リキッドレイアウト。 参考にしたサイト:「サイトの横幅」再論:950px時代のウェブデザイン 実装方法 というわけで、普通のリキッドレイアウトと、固定幅+リキッドレイアウトの実装方法について解

    macha1990
    macha1990 2012/06/15
    リキッドレイアウトのことについて、
  • 保存版!CSS3セレクタの説明書

    CSSセレクタについての基礎知識 このブログで何回も説明していますが、念のために説明します。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの1つです。 セレクタ表の説明には属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。 私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。 あと親子関係や兄弟関係などもあまり聞きなれないかもしれません。下の階層にある要素との関係が親子関係で、同じ階層にある要素同士の関係が兄弟関係です。 あと、CSS3と聞いて「どうせIE8以下はダメだし使えない」と思う方もいるかもしれませんが、セレクタに関しては簡単に対応できます。 IE6~8でもCSS3セレクタが利用できるツールの決定版「Selectivizr」をご参考に。 それ

    保存版!CSS3セレクタの説明書
    macha1990
    macha1990 2012/06/02
    CSS3セレクタ解説
  • Webデザインにアクセント!記号やイラストなどのフォントまとめ

    記号やイラストなどを収録しているフォントをお探しの方用のエントリ。 自力で無料のものを探すのは難しいという方は参考にどうぞ。 Kaomoji Holiday illust Garabata - dingbats The Scrappin Cop SocialIcons font by ptocheia - FontSpace Irresistible Free Dingbat Fonts | Part II - StarSunflower Studio このページにはかなりの量がまとまっています。キャプチャーは全て、このページのリンクへつながっています。 Was Woodcuts Griffin Bats Zooland My 70's Ding Squares Font Medieval Dingbats Kaloscai Flowers Jade Dingbats Font 001 M

    Webデザインにアクセント!記号やイラストなどのフォントまとめ
  • 初心者さんのためのWebサイト制作に役立つリンク集

    2017年6月29日 Webサイト制作 「Webサイト勉強するのにおすすめのサイトを教えてください!」との声が多いのですが、日のWeb関連チュートリアルサイトをあまり見たことがなかったので、今までおすすめできませんでした…。ということでちょっとググって初心者さんによさそうなサイトをいくつか紹介します。小難しい単語が並んであるようなサイトは避けているつもりですが、わかりにくかったらすみません。他にもおすすめサイトがあればぜひコメント欄にて教えてください! ↑私が10年以上利用している会計ソフト! Webサイトを作る流れ まずはWebサイトを作る目的を考える 誰のため?何のため?Webサイトを作り始める前に。 サイトマップと呼ばれる構成図を作成 Webサイトの構成図を簡単に作れる便利ツール ワイヤーフレーム(Webサイトのレイアウト)を作成 Webサイトの骨組み: ワイヤーフレームを素早く・

    初心者さんのためのWebサイト制作に役立つリンク集
  • JavaScript例文辞典

    ■基 [01]JavaScriptを定義する [02]外部JavaScriptファイルを読み込む [03]スタイルシートを定義する [04]NN3、NN4、NN6、IE4.x、IE5.xで動作するように記述する [05]NN4でのみ動作するように記述する [06]NN6でのみ動作するように記述する [07]IE4.x以上で動作するように記述する [08]IE5.x以上で動作するように記述する [09]IE5.5以上で動作するように記述する [10]ビヘイビアファイルを読み込む [11]IEとNN両方で動くように記述する [12]連続して関数を呼び出す [13]MacOS Xかどうか判別する [14]Safariのみ動作するように記述する [15]Safariのバージョンを返す [16]Operaのみ動作するように記述する ■構文 [01]変数に文字や数値を入れる [02]四則演算を行う

  • 今時のテレクラ事情

    当サイトでは20年前に世のおじ様達を席巻したテレクラについて熱く語ります。 テレクラの誕生の歴史から現在に至るまでの経緯や、今テレクラを利用する人の心情について詳しく記載しております。 テレクラとは、すなわちテレフォンクラブの略称です。1985年に生まれたサービスであり、出会い系サイトの前身といっても過言ではありません。 現在ではスマートフォンで相手女性とインターネットを介しコミュニケーションを取ることができますが、当時は携帯電話も無く、個室形式の店舗にまで行って利用しなくてはなりませんでした。 当時は突如現れた新アダルトサービスに法整備が追いつかなく、駅前のティッシュ配りなどで未成年がサービスを知り、援助交際という俗語が誕生するなど、凄い盛り上がりをみせました。 その後、1995年にこういった状況を野放しにはできないと法整備がされ、利用者に年齢確認を求めるなどされ利用者やテレクラ事業者も

    macha1990
    macha1990 2012/03/28
    JAVAスクリプト入門的なサイト、音声あり
  • CSSのopacityで透明度/透過度を指定する方法|BLACKFLAG

    今さらながら、Webページ内の要素に対して、要素の透明度/透過度をCSSのみで指定する方法について。 久々にCSSのみで透明度の指定が必要になる場面があったのですが、記述方法をすっかり忘れていたのでここにメモとして残しておきます。 CSSで透明度を指定するには「opacity」というプロパティを使用しますが、ブラウザによって記述が変わるので下記の様な形になります。 ◆CSS div { filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; } 『filter:alpha(opacity=50);』 これはIE向けの指定。 “50”というのは透明度が“50%”ということ。 透過無しの状態“100%”を指定する際は「filter:alpha(opacity=100);」。 『-moz-opacity: 0.5;』 これはFiref

    CSSのopacityで透明度/透過度を指定する方法|BLACKFLAG
  • [CSS]スタイルシートの量を少し減らした、新しいclearfix -micro clearfix

    A new micro clearfix hack デモページ [ad#ad-2] 「clearfix」はフロートした要素が親要素からはみ出してしまうのを回避するもので、当サイトでもいくつか紹介してきました。 今回紹介するのは、スタイルシートの量を更に減らし(class名も短く)した「micro clearfix」です。 この新しいclearfixの対応ブラウザは、下記の通りです。 Firefox 2+ Safari 2+ Chrome Opera 9.27+ IE 6+, IE Mac IE6 にも対応しているのは嬉しいところです。

  • CSSでレイアウトするなら絶対覚えておきたいブロックレベル要素のクセとかいろいろ

    Webデザインをするときに、必ず使うスタイルシート。思うようなレイアウトを作るために、チェックしておきたいブロックレベル要素や、インライン要素のクセみたいなのをまとめてみました。後半はスタイルが反映されない原因のひとつ、スタイルの優先順位についてです。 Attention 記事公開時からいろいろと勉強して、この記事内で紹介している事柄で、間違った解釈をしていたなーと気がつきました。 この記事の中でいくつか追記してありますが、詳しくは、新しく書いた 11月7日の記事:CSSでレイアウトするなら絶対覚えておきたい配置のルール:フロートや絶対配置、z-index とかいろいろ を読んでみてくださいね! New Post Webサイトをデザイン、レイアウトするのに欠かせないのが CSS(Cascading Style Sheets、スタイルシート)ですね!今では CSS3 が話題を集めていて、CS

  • SOYAGIMI NOTE 事業者のための情報発信メディア

    Information to help businesses事業者に役立つ情報を総合的にお届けします こんにちは、SOYAGIMI Note を運営する株式会社SOYAGIMI 松永です。 このサイトは弊社顧客様のための情報提供、また様々な地域で活躍される事業者様のお役に立てる情報を発信するためのメディアです。 私たちも小規模な事業者ですので、比較的使える情報や経験をご紹介できると思います。 比較サイトなんか見ても、昨今事業者は軽く扱われがちですからね。 色んな情報やテクニックを持って、けっこう大変な時代を乗り越えていけたらいいなぁって。 Convenient tool use 便利なツールの使い方をご紹介 小規模で活動されていると、やはり人出が足りなくなるのが現状です。 しかしながら最近は無料で使えて、業務を効率化できるアプリも多数存在します。 そういったアプリの使い方などをまとめて、経

  • HTMLタグボード - HTMLタグ一覧、CSSリファレンスなど

    HTMLタグボード HTMLタグ一覧、CSSリファレンス、SEO、ブログ収益化などWebサイトやブログを運営する人を応援する総合コミュニティサイト

    HTMLタグボード - HTMLタグ一覧、CSSリファレンスなど
  • 1