HTML、CSSの勉強法を以前書きました。 www.yukihy.com この記事を書いたあと、jQueryに挑戦をして、まだまだ完璧ではないものの実際にこのはてなブログを通して、いろんなブログパーツのようなものを作ることができました。 そこで、jQueryを勉強するとき、効率良く身につけられる方法を書いていきたいと思います。 僕自身いろんな本やツールに手を出しながら進めてきたので、実際に下の通りに行ったわけではありませんが、もう一度勉強しなおすとしたらこういったようにやるなといった感じです。 それではレッツゴー！ jQueryを身につけるための最短ステップ ステップ１　Progateで手を動かしながら学ぶ ステップ２　平行してWebデザインレシピの記事を読む ステップ３　ドットインストールで総復習&補完 ステップ４　書籍を参考に実際に作ってみる 作りながら学ぶjQueryデザインの教科書

こんにちは。Googleアナリティクスラブのカグア！です。 Googleアナリティクスのウェブテストって、URL単位じゃないとできないから使いづらいなあ、と思っている方はいませんか？ なんと公式ページに、ページ内のボタンやテキストなど、オブジェクト単位でA/Bテストする方法が書いてありましたので、ご紹介します。 実際試しましたけど、実装もすごい簡単でしたよ。 追記：2017年2月8日　GTM実装しているのならば、Googleオプティマイズとの組み合わせが、もはや最強かもしれません。 ＞＞Googleオプティマイズを使えたのでざっくり解説！時代はGGOP 関連記事 ＞＞A／Bテストの失敗事例、テストすること自体が有効という思い込み GoogleアナリティクスのA/Bテストとは 正式にはウェブテストという名称です。Googleアナリティクスのレポート内の行動＞ウェブテスト にあります。 ランデ

Bracketsがメジャーバージョンアップ 昨日、これまで小刻みなマイナーバージョンアップを繰り返し0.44までバージョンを重ねていたBracketsが1.0と、正式なバージョンアップを行いました。わーい！！確か私は0.14くらいから（2年近く経ってる？）使っているはずですが、開発には既に3年ほどかかっているそうです。 Brackets – A modern, open source code editor that understands web design. 今回はこれについてではなく（別途記事を書きます書きました→Bracketsだって激しく進化してますよ！メインエディターとして1年使ってみて）、この1.0と同時にリリースされたBrackets制作チーム肝いりの拡張機能、「Extarct for Brackets」の紹介をしたいと思います。これはまだまだ多いPSDカンプからのHTM

2017年5月25日 CSS FlexboxとはFlexible Box Layout Moduleのことで、その名の通りフレキシブルで簡単にレイアウトが組めちゃう素敵ボックスです。前々からあった技術ですが、ブラウザーによって書き方が違ったり、仕様がころころ変わったりと、イマイチ一歩踏み出せない感があったFlexbox。しかしようやくモダンブラウザーでの利用に難がなくなり、実務にも充分使えるようになりました。今回はそんなFlexboxの魅力と使いドコロを、デモ付きで紹介していこうと思います！ ↑私が10年以上利用している会計ソフト！ 対応ブラウザー Can I use…で紹介されているように、現行のモダンブラウザーでは問題なく利用できます。ただし、Safari用に -webkit- のベンダープレフィックスが必要です。IEについては11から正式に対応。IE10にも対応していますが、書き方が

無料で資料をダウンロード SEOサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする　＞＞ コンテンツマーケティングはブログだけじゃないと書いておきながら、やっぱり基本はブログということで、今回はそのブログをより有益な存在にするためのアドバイス記事をカリスマブロガーのニール・パテルに学びます。 — SEO Japan コンテンツマーケティングの長所は、多数のソーシャルシェア、新たなEメールの購読者、そして、コメントをもたらしてくれる点だ。ただし、前提として、コンテンツの質が高く、また、コンテンツマーケティングを適切に実施する必要がある。 しかし、コンテンツマーケティングのタスクはあまりにも多く、失念してしまうこともある。 そこで、この取り組みを成功に導くため、チェックリストを策定した。

【画像表示の不具合について】 皆様方へは、ご迷惑をおかけし大変申し訳ございません。 現在もまだ、一部の画像に関しまして反映されない不具合が継続しております。 現在、修正にあたっております。復旧まで今しばらくお待ち頂きます様、何卒お願い申し上げます。 フォト蔵　システム部 【写真検索の不具合について】 皆様方へは、ご迷惑をおかけし大変申し訳ございません。 現在、「写真検索」におきまして、検索後ページに何も表示されないなどの不具合が発生しております。 調査並びに修正にあたっております。復旧まで今しばらくお待ち頂きます様、何卒お願い申し上げます。 フォト蔵　システム部 【画像タイトル及びタグ入力における不具合について】 皆様方へは、ご迷惑をおかけし大変申し訳ございません。 現在、フォト蔵は、画像タイトル及びタグ入力におきまして、後に記載の漢字が含まれる場合、タイトルが表示されないや、文字化けする

CSSでできる事がどんどん増えてます。JavaScriptを使って実装するようなレイアウトやUIも、CSSだけで作れちゃうほど、便利なプロパティがじゃんじゃか増えましたね。ここでは、要素にアニメーション効果をつけるためのCSSを使ったエフェクトについて、まとめてゆこうと思います:)。 CSSで動かす 「動く」といっても、自由自在にぐにゃぐにゃ動かせるわけではなくて、CSSアニメーションでは、プロパティの数値をスムーズに増減させることで、要素のスタイルを滑らかに変化させます。 例えば、下のサンプルでは、p要素にカーソルを合わせた時に、font-sizeの値を、1emから2emに、スムーズに変化するように指定しています。 p { transition: font-size 1s; } 動かすためのマストプロパティ CSSでアニメーションさせるために必要不可欠なのがtransitionプロパティ

写真を始めたけどなかなか上手くならない。。やっぱりセンスが無いからダメなのかな？とあきらめる前に今回ご紹介する３つのポイントを確認してみるといいかもしれません。美術センスが無い人だって、いくつかのポイントに気をつけることが出来ればすてきな写真が撮れるはずです。 センスが良くなくても大丈夫！どうせ写真なんて美的センスがいい人が撮らないと良い写真にならない。。なんて思うかも知れませんが、そうとも限りません。 確かに芸術的なセンスがある人は、特に撮り方や構図を教えることなく素敵な写真をバシバシ撮る人もいますが、そうで無いごく普通の一般の方でもいくつかのポイントを押さえるだけできっと今までとは見違えるようなステキな写真を撮れるきっかけが掴めるはずです。 私も芸術的センスにはあまり自信がありません。。たぶん絵を描かせたら「絵心無い芸人」に近い出来映えになるはずです（笑） 今回はデジイチ初心者がもっと

Webサイト制作で避けて通れない配色の決定。芸術的素養が絶望的にないのでいつも泣いてるゴロドクさんです、どうも。 所詮素人には理論に基づいた配色など無理ゲーです。先日もちょっとしたデザイン的なゴニョゴニョという場面に出くわしましていつものように悩みつつ、なんか配色決定のためのWebサービスないかなーと思って探してたらこういうのを見つけました。 webでの色指定は基本的にRGB値での指定となりますがこれって光の三原色の混色なんですよね。 実際にCSSなんかで数値いじりつつデザインしてると「なんか違うなー」というときにもっと明るくしようとか、もっと彩度上げようってのが感覚的にどの数値をどんだけいじって良いのかってわからないんですよ。 RGB値直接いじって彩度上げようと思ったらくすんじゃった上に色みかわっちゃってオヤオヤ残念なんて日常茶飯事ですよ（いやそのまえにフォトショなりなんなりでデザインカ

先日、「プログラマーがイラレで絵を描けるようになると、こうなる - pblog 」という記事を書いたら好評だったようでイロイロとレスポンスを頂けて嬉しいです。 このLesson4を特化したのが我が著書「イラレパズル」です。絶版やけど。＞プログラマーがイラレで絵を描けるようになると、こうなる - pblog http://t.co/nYyaku0CHd— ヤマサキタツヤ (@yamasakki) 2014年7月18日 そんな中「イラレパズル」というイラレ練習本を著者の方に教えて頂きました。 絶版とのことで仕方なく古本で購入（古本だと印税とかいかないんですよねえ、、、申し訳ない） イラレパズル―Illustrator図形おえかき学習えほん 作者: ヤマサキタツヤ出版社/メーカー: エムディエヌコーポレーション発売日: 2003/02メディア: 単行本 クリック: 4回この商品を含むブログを見る

ソーシャルアプリ事業部でデザイナーをしております。 こーたと申します。 どうぞよろしくお願いします。 今回は普段仕事でよく使う、illustratorの 「覚えなくてもいいけど覚えておくとちょっと作業が楽になる」 そんな小技を紹介したいと思います。 「Ctrl」+「Ｓ」くらいのシンプルさです。 覚えなくてもいいけど、覚えて頂けると幸いです。 とっくに知っているよ！という方はささっと読み流してください。 どこでも色を拾えるスポイトツール。 この画像のこの色を使いたい！ でもカラーパレットから色を探すのは大変。。。 そんな場合は、フォントからグラデーションまで、 何でも吸い取ってくれる万能なスポイトツールでアートボード外の色も吸い取ることができます。 現状、ピンク色ロゴを、デスクトップ上の参考画像（カメの甲羅）の色に変更したいと思います。 まずは、色を変更したいロゴを選択したら、ツールバーから

この文章について OOP（オブジェクト指向プログラミング、オブジェクト指向パラダイム）について プログラミング勉強中の大学生さんに説明する機会が何度かあったので、 自分の中で整理するために書きました。 中には適切でない説明もあります。ばっさり省いているところもあります。 詳細より イメージを掴んでもらうことを優先しているためです。 「それにしてもあんまりだなー」という表現がありましたらご連絡いただけると嬉しいです。 大学生さん 大学生さんたちはいろんな背景を持っています。 プログラミングを始めたばかりの人 独学で Objective-C や JavaScript を書いた経験がある人 Web やコンピュータの仕組みについてもこれから勉強する予定の人 使用言語 大学生さんたちはプログラミングの第一歩として JavaScript と PHP を使っています。ここでは説明に PHP のコードを使

クラウドソーシングサービスなどというサービスにちょっと手を出してみました。結論からいうと、正直あまり使いたくないなと思いました。よくも悪くも名前を聞くランサーズというサービスについてです。なんかもっと上手に付き合う方法がある気がしてたんだけどなあ。 クラウドソーシング(というかランサーズ)について どんなサービスか ランサーズ 一言でいうと、仕事をやってほしい人と仕事をしたい人のマッチングサービスです。 特徴 良い所 営業しないでもお客さんと出会える可能性がある エスクロー入金(後述します) 手数料は無難な料金設定だと思う。特に文句はない。 悪いところ 今からツラツラと書く。 どんな仕事内容がマッチングされているのか システム開発 webシステム・アプリ開発・ソフトウェア開発・VBAなど・ゲーム開発・サーバ構築・セキュリティ・DB構築 Web制作 ホームページ/webデザイン・スマホ/モバ

調べる。 備忘録としてwebやデザインについて調べたり 新しく知ったことなどを書き残していくカテゴリです。

レストランで魅惑の一皿に出会ったとき。あるいは、とっておきのレシピで作った手料理がいつになく上手に仕上がったとき。｢この料理を写真に撮ってみんなに見せたい！｣と感じませんか？ FacebookやTwitter等のSNSでは、日々たくさんの料理写真が共有されています。でも、なんだか私の料理写真はあまり美味しくなさそう......。料理の写真って、どうすれば美味しそうに撮れるの？ なぜか全然美味しそうに見えない私の写真に｢いいね！｣は付かず......。実物はもっと素敵だったのに！ 困ったときはプロに聞くのが一番早い。というわけで、料理専門の写真教室｢フェリカスピコ｣を主宰するフォトグラファーの佐藤朗さんに、かわいく美味しそうな料理写真を撮るコツを習うことにしました。 カメラは、7月27日にFUJIFILMから発売されたばかりの｢X-M1｣を使用。機械に弱い私は内心不安だったのですが、必要なポ

Enable JavaScript in your browser. このウェブサイトはJavaScriptをオンにしてご覧下さい。 HTML5とは、WHATWGおよびW3Cが、HTML4に代わる次世代のWEB環境として、策定を進めている仕様です。 HTML5を簡単に説明すると、今まで複雑だった処理を簡単にし、HTMLデータの意味をより具体的に表現できるようになります。 現状ではHTML5非対応のブラウザもありますが、少しずつ非対応ブラウザもバージョンアップによって対応されていっているようです。 ここでは皆さんがHTML5を超速で学ぶのに、もっとも効率的なノウハウサイトや便利ツールを紹介しています。 ※HTMLの基礎はこちらから学べます→HTMLを学ぼう！ HTML5入門サイトHTML5, きちんと。 ５分～10分ぐらいでHTML５というものが何なのかを理解できるようになります。 HTML