Webデザインをしていると、HTML と CSS だけではできない表現ってありますよね。そんな時によく使うのが jQuery。今回は jQuery っていまいちよく分からない ... っていう人が、jQuery に少しでも親しんでもらえたらいいなーと思って、知ってる事をまとめてみました。なので jQuery 初心者さん向けの記事です。 とっても当たり前なんですけど、Web サイトは基本的に HTML で書かれていて、デザインは CSS で装飾されていますよね。最近では CSS3 の登場で、簡単なアニメーションも CSS で作れるようになりました。でもクライアントワークでは、まだまだ CSS3 を使える部分が限られているし、Webデザインに少し動きなどをつけたい時などは、まだまだ jQuery を活用する事も多いです。 私は Javascript が苦手で、jQuery もどちらかというと苦
本日から新たに、「Webデザイン入門」というタイトルで連載を始めます。 9月からWebスクールの講師をさせていただいているのですが、そこでカリキュラムとして渡されたテキストには「Photoshop や Dreamweaver 等のソフトの操作説明」しかされておらず、ソフトの操作方法を習得しただけではWebデザイナーとして就職し、仕事していくのは少々厳しいのではないかと思いました。 そこで、ソフトの操作方法と平行して「Webデザインそのもの」について考える時間を設けたいと思い、オリジナルのカリキュラムを作ることにしました。 ここでは、そのカリキュラムの一部をブログ形式にして掲載しています。 既にWebデザインの仕事をされている方はご存知のことばかりかもしれませんが、これからWebデザイナーになりたい方や、今はプログラミングなどデザイン以外の仕事をされていて、これからデザインも手がけてみたいと
ベンチャーはお金がない ベンチャー企業ていうのはお金がありません。 しかし、最近、IT革命というものがあったらしく、起業のコストが劇的に下がりました。コストがさがることで、リスクも劇的に下がり、サラリーマンと起業家のリスクの差がどんどん縮まっています。 いろいろなツールが無料や少額のお金で使えるようになりました。ベンチャーはお金がないので、どうしても無料で揃えたくなります。しかし、実際はお金を少しかけたほうが、効率的になり、時間のコストが下がるということを忘れがちだったりもします。 そこで、僕がベンチャーを立ち上げて使ったものや、金かけてでもやっておいたほうがよかったなーというところを紹介します。 登記の手続き まず、登記は絶対、司法書士の先生に頼んだほうがいいです。 「自分でやったほうが安いし、経験になるかな〜(^◇^)」と思ってやってみたのですが、これが地獄でした。何度も間違えを訂正さ
Firefoxのアドオンは、便利なんですけどアドオンを追加しすぎるとツールバーがやたらとでてきて使いにくいなってしまたり、かといってアドオンを無効にしたり有効にしたりすると再起動しなくてはならなくてめんどうくさいですよね。フォクすけ最大の利点アドオンを使いやすくする方法はないのでしょうか? この記事では、別々にカスタマイズされた同じバージョンのFirefox3を使い分けしたい方にお勧めの方法です。これにより、アドオンが違うものが起動させられるため仕事用、ブログ用、家庭用などのように使い分けることもできます。 また、この方法でブックマークも別々にできるため1台のPCで家族で共有したりする場合にも最適です。 1.プロファイルを作る 起動しているブラウザを終了します。 次にアクセサリ内のコマンドプロンプトを起動して "C:\Program Files\Mozilla Firefox\firefo
Firefoxには、ご存じのように複数のプロファイルを作成する機能[プロファイルマネージャ]が搭載されています。 アドオンのテスト用、Web開発用アドオンを満載したプロファイルなど、複数のプロファイルを作成し、Firefox起動時に選択して利用するのは簡単ですが、これらを同時起動したり、途中で変更するのはちょっと面倒な作業が必要ですね。 このように、Firefoxプロファイルを複数作成されている方に役立つアドオンが「Profile Manager and Selector」です。 「Profile Manager and Selector」をインストールしておけば、複数のプロファイルから簡単に選択して起動したり、異なるプロファイルでFirefoxを複数起動させたりすることが非常に簡単になります。 まずは普段お使いのメインのプロファイルで起動中に「Profile Manager and Se
数あるFirefoxの機能の中で、最もパワフルな機能の一つでありながら、あまり多くの人に知られていないのが複数のプロフィールを作成出来る、という機能。ブラウジングプロフィールを複数作成し、うまく使いこなす為の方法をご紹介しちゃいます。 同じFirefoxプロフィールに全てのアドオンをインストールする代わりに、タスクごとにプロフィールを作成し、そのタスクに必要なアドオンのみをそのプロフィールに作成する、というのが根本的な考え方。Firefoxをウェブ用のOSに見立てて考え、それぞれのプロフィールをアプリケーションとして考えます。プロフィールの一つは基本的なウェブブラウジング用として使用、もう一つは文章作成用、もう一つはウェブ開発用、などにそれぞれを設定していきます。米ライフハッカー編集部のライターのほとんどが日々の文章作成業務用、検索用、パーソナルブラウジング用に複数のプロフィールを作成して
※コメントにも頂いておりますが、この公開版はバグがありますので、承知の上でご利用になるか、ご自身でカスタマイズされる方がお使いください。 スマートフォンサイトにおいて、左のムービーのようなフリック動作ができる画像スライドのjQueryプラグインを作りました。(ムービーはiOSシミュレータによるデモです)iPhone・Androidでご覧の方はデモに直接アクセスしてください(ムービーは再生されません)。 【デモを見る(iPhone・Androidで見てください)】 【ダウンロード】 なぜプラグイン化したか 横向き対応がハードルを高くする ご自身でこの手のUIを組んだ経験がある方はわかると思いますが、絶対配置(position:absolute)を使ったリキッドレイアウトを組むのはなかなか手の込んだことが必要で、今後の仕事で都度ゼロからUI作成を行うのは効率が悪くなってしまうと思ったからです。
Yamadaです。 かれこれWeb屋暦が14年くらいになるんですが、こうしてWebに携わっていると、3ヶ月周期で情報の入れ替えをしていかないと、正直追いつかないと感じます。そんな激流のようなWeb業界にこれから飛び込もうと言う新卒の方や、中途の方に送るバイブルとなればと思います。 というわけで改めて春ですし、これからホームページ(Webサイト)を作成してWeb屋さんになる方へ送るお勧めサイト集です。 後編はこちら Web制作を始める人の為のスキル・ワイヤーフレーム・SEO・マーケティング・Webサービスの基礎情報 忘れないで欲しい事 Web制作には、様々なスキルが求められます。 しかしその技術が、いつの間にか消えていったり、使えなくなったりしました。新しいデザイン、新しいコード、新しい言語、新しい環境、様々なものがあります。しかし、それらを追い続けていくうちに、一つ、とても大事な事を忘れて
去年の話ですが、海外でこんな記事が上がっていました。 20 Tips you need to learn to become a better PHP Programmer 記事の内容は、かなりレベルが低いです。 しかし、初心者のうちに知っておけば、より早く成長出来るでしょう。 初心者PHPerのために、この記事の翻訳を載せます。 20 Tips you need to learn to become a better PHP Programmer PHPは、同じオブジェクトの扱い方でも複数の書き方を持っている、とても気まぐれなプログラミング言語だ。 詳しくは、私の書いた”The Art of Programming“を読むと良い。 これから書くTipsは、過去のプロジェクトから私が学んだコードの可読性、メンテナンス性を上げ、あなたを素晴らしい、より進んだPHPプログラマーにするもの
Translation of: What Does It All Mean? - Dive Into HTML5 Diving In The Doctype The Root Element The <head> Element Character Encoding Friends & (Link) Relations rel = stylesheet rel = alternate Other Link Relations in HTML5 New Semantic Elements in HTML5 A long digression into how browsers handle unknown elements Headers Articles Dates and Times Navigation Footers Further Reading 訳注 Diving In この章で
私の勉強方法まとめてみました。 といっても 「いい情報をとりこんで、実践して、その結果をアウトプット」 をひたすらしているだけなのですが、実際にどのようなサイトや本を見てインプットしているか、どんな風に実践して、何をアウトプットしているかなどまとめてみました。 インプット 情報が美しくまとまっているサイトのフィードをチェック 国内外のWeb系の情報を丁寧にまとめてくれているブログがたくさんあります。 そういうブログのフィードをチェックしています。 デザインTipsやトレンド紹介、便利なプラグイン、プログラムなど、毎日どんどん新しい情報が出てきます。 全部読んで理解してその場で実践する、というとは不可能に近いので、へー、こういうことも出来るんだー、とさらっと頭に入れて、特に気になったものだけはてなブックマークなどでタグをつけて保存したりしています。 そうしておくことで、いざ●●しないといけな
HTMLやCSS、DynamicHTML、JavaScriptやPerl、Windowsコマンド、ネットワークコマンド、Linuxコマンドといった、Webサイト構築やアプリ開発に欠かせないプログラミング言語とコマンドのリファレンスマニュアルです。各項目のサンプルコードは、コピーし貼り付けてすぐに使えます。入門講座も用意しました。ぜひブックマークしてお役立てください。 HTML HTMLは、Webコンテンツを作成する上で、最も基礎となる記述言語です。各タグについての概要や属性などをサンプルを交えて説明します。 HTMLリファレンス(107項目) HTMLリファレンスの使い方 HTML入門 CSS CSSは、Webページのレイアウトなどといったコンテンツの見栄えを指定する記述言語です。各スタイルの概要や使い方を説明します。 CSSリファレンス(73項目) CSSリファレンスの使い方 CSSの基
友人がブログを始めたのですが、 Web制作もデザインも全く経験が 無いけど、普通な感じがすごく嫌 らしく、知識が無くても加工出来る、 とか良いサイトとかソフトは無いのか、 と聞かれて教えたWebサービスや ソフトが、同じ境遇の方に役立つかも と思って記事にします。 普通に写真や画像を掲載するのではなく、ちょっと個性的な感じにしたい、出来れば無料がいい、でも自分でデザイン作業は出来ないから良いサイトとか無い?とのことでした。 どうしたいのか良く分からなかったので、あんまり一貫性は無いんですが、教えたのは画像加工ジェネレーターとかそういうのです。いくつか提案した中で、友人が喜んでたサイトだけまとめてみます。 BeFunky 画像を加工するジェネレーター。レトロっぽくしたり油絵っぽくしたり。エフェクトも豊富です。 BeFunky flauntR これも加工ジェネレーター。エフェクト以外にフレーム
Web制作時、個人的にかなり助かっ ているWebアプリやソフトウェアなど をご紹介。何度お勧めしても足りない 位、助けられています。低スキルな 自分にとっては無いと困る。そんな ツールをシェアしたいと思います。 もっと沢山あるんですが、特に利用しているものを。制作時には毎回利用しているかもしれません。基本的に無料のものを使っています。順不同。 960 grid system グリッドシステムです。ブックマークレットも含め、色々手軽なのが嬉しい。何よりグリッドレイアウトはお客さん受け良い傾向にある気がします。 960 grid system Firebug Web制作といえばFirebugですが、僕はChrome派なのでChromeエクステンションのLite版を使っています。元々、Chromeにはデベロッパーツールがありますし、FxのFirebugも使いこなせてなかったのでこれで十分。 Fi
こんにちは、趣味や業務で大手ポータルサイトのサービスで稼働しているいくつかのクローラの開発とメンテナンスを行っているmalaです。 さて先日、岡崎市立中央図書館Webサイトをクロールしていた人が逮捕、勾留、実名報道されるという事件がありました。 関連URL: http://librahack.jp/ 電話してみた的な話 http://www.nantoka.com/~kei/diary/?20100622S1 http://blog.rocaz.net/2010/06/945.html http://blog.rocaz.net/2010/07/951.html この件につきまして法的なことはともかくとして技術者視点での私見を書きたいと思います。法的なことは差し置いて書きますが、それは法的なことを軽んじているわけではなく、法律の制定やら運用やらは、その法律によって影響が出る全ての人々の常識
OSがWindowsであろうと、ubuntuであろうと、共通のサービスを受けることができるのがウェブアプリケーションです。 ウェブデザイナーの中には、自宅ですでにubuntuを利用している人も多い。また、Mac、Windowsと、各自それぞれの使いやすい物を利用していると思います。 今回はこうしたウェブ開発を仕事としている人が利用しそうなツールをまとめてみたいと思います。 スケジュール管理 Googleカレンダー もはや説明不要のスケジュール管理システム。 ドラッグによる複数日数のスケジュール投稿は、なにかと連日作業になるウェブ製作にぴったり。 また、タスク管理も結合されたため、細かい作業などの記入も可能。なにより複数人での予定の共有もできるのが便利です。 メール Gmail もう使っている人も多数いるかもしれませんが、Googleが提供するGmailはかなり強烈なアプリケーションです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く