タグ

Web制作に関するrafbmのブックマーク (717)

  • 「PhotoshopによるWebデザインカンプ制作はFireworksに比べて効率が悪い」という都市伝説について

    2013/5/7に、Adobe Fireworks の事実上の開発終了が発表されました。 ただし、「バグ修正やセキュリティ関連のアップデートは継続する」とのことですが、いつまでも使い続けられることを保証するものではないので、Fireworks ユーザーの方はそう遠くないうちに別のアプリケーションに乗り換える必要があると思います。 Adobe、Web画像ツール「Fireworks」終了へ – ITmedia ニュース 移行先アプリケーションの候補の1つである Photoshop について、Twitterを見ていると「Photoshop でのWebデザインは制作効率が悪い」という方が多いようですが、私はそんなことはないと思っています。 なぜそう言えるのかについて、簡単にまとめてみました。 目次 FireworksとPhotoshop、それぞれのメリットとデメリット なぜ「Photoshopは効

    「PhotoshopによるWebデザインカンプ制作はFireworksに比べて効率が悪い」という都市伝説について
  • 昨今のwebディレクターは「データ分析」「A/Bテスト」病にかかってしまい、考え方のスケールが小さくなっているのではないか。 - webディレクターのネタ帳

    追記: 捕捉となるエントリーを書いてみました! blog.egachan.net A/Bテストについて 最近のwebサービス事情として、大手資の会社などもガンガン参入しているため、 「サイト立ち上げ」→「適切なプロモーション」→「継続したサイト改善・運用」 という風な3つの流れはマストな時代になってきたと思います。少し前までは、「素晴らしいサイトを作れることだけで人が集まる」「素晴らしいサイトと上手なプロモーションだけでサービスは活性化する」という時代だったのですが、最近は、そこまでは当然として、さらに「継続したサイト改善・運用」がマストな時代になってきたと感じています。(この三位一体を適切に行っても、流行るか分わからないのが、webサービスの世界で、そこが難しいのですが。) ただし、サイト運営を継続的に行なっており、一定の機能が回りだし「改善・運用」フェーズに入ったサイトの施策を考え、

    昨今のwebディレクターは「データ分析」「A/Bテスト」病にかかってしまい、考え方のスケールが小さくなっているのではないか。 - webディレクターのネタ帳
  • 「競合サイトの真似だけでは、競合サイトを追い越せない!!」じゃぁ、どのように差別化を図るの? - 永上裕之のネタ帳

    昨日書いた記事、 blog.egachan.net の中で、私は、 「A/Bテストや分析を行い、最適化をしていくよりも、まずは、競合サイトでやっていて自社サイトでやっていない機能やサービスを実施していくべき、それらの施策をやりきったら、その後、A/Bテストや分析などの最適化に着手していくべき」 ということを書かせて頂きました。すると、コメントで、 ・「競合サイトの真似だけでは、競合サイトを追い越せない」 ・「競合他社サイトの分析だけでは不十分」 という意見をいただきました。 私としては、 1:競合他社の調査 → 2:競合他社でやっている機能やサービスで、自社サイトで必要なものは実施 → 3:その中でA/Bテストや分析を駆使しチューニングをしていく というステップがいいと思っているのですが、「競合他社から参考にするだけは不十分!オリジナル性のあるアイディアや機能を入れていくべき!」という意見

    「競合サイトの真似だけでは、競合サイトを追い越せない!!」じゃぁ、どのように差別化を図るの? - 永上裕之のネタ帳
  • ウェブデザイナーのための便利すぎるツール&リソース20選【最新版】 - SEO Japan|アイオイクスのSEO・CV改善・Webサイト集客情報ブログ

    無料で資料をダウンロード SEOサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする >> ウェブデザイナーに便利なデザインリソースやツールをまとめた最新版の記事をThe Next Webから。きっとあなたの知らない、日ではまだメジャーじゃない注目リソースやツールがあるはず? — SEO Japan Webデザインにおいて、使用するツールはあなたの結果に重要な役割を果たす。もちろん、紙に鉛筆で描くことのような、基を忘れないことが大事だが、時には新しいアプリやリソースを見つけることが、あなたのクリエイティブなジュースをもっと流れるようにするのに役立つかもしれない。 今回は、デザイナーとデベロッパーのための20個の便利なツールをリソースリストとしてまとめた記事を紹介する。あなたのお気に

    ウェブデザイナーのための便利すぎるツール&リソース20選【最新版】 - SEO Japan|アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
  • 北米WEB屋として生きた5年間で思いつく限りのWEB屋必読ブログの数々一挙ご紹介! | バンクーバーのうぇぶ屋

    この前「英語圏のWEB屋な人たちが読んでそうなブログ教えて」って具合の、まぁいつも通り取り留め無く唐突な質問がありまして、コレまた僕にとってはいつも通り『北米WEB屋なら誰でも知ってるんじゃないかって思うサイトをまとめてみた』って記事を共有しようとしたんですが、コレもう2年前の物じゃーないですかってことに気付いたわけです。 結構僕はこういう質問に返答するノリで書いた記事のリンク送るってコトが凄く多いので、じゃぁこの記事も古いし、リバイスするかって軽い気持ちで書きだしたんですが、コレが意外とめちゃめた大変。大変って言うか、量が半端ないことになっておりまして… 正直、去年くらいからだいぶ暇な時間が出来てしまい、購読するブログの数もだいぶ増えていて、うーんって感じなんですが、まぁ良い機会なので僕が『これは読んどいていんじゃね?』ってオススメするブログやら記事やらを色々共有させて頂こうかなと思いま

    北米WEB屋として生きた5年間で思いつく限りのWEB屋必読ブログの数々一挙ご紹介! | バンクーバーのうぇぶ屋
  • WEB制作時に役立つ!ダミーテキストに使える定型文まとめ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    先日、弊社プログラマーの段田さんのブログで、ボーナスアップの道具として利用された野田です。 あれは、久しぶりに傷ついた。 そして、プライベートでもいろんな人にいじられた。 ネットって怖いですね。 さて、今回は、WEB制作に役立つ定型文のご紹介を致します。 僕自身、デザインする際に構成からガッツリ考えるのが大好きっていうか仕事なので、 それにあわせてダミーテキストを考えることが多いです。 デザインを提出する際には、「テキストテキストテキスト」や「ダミーダミーダミー」で提出することは絶対にしません。 お客様の意図を読み取ってこちらからご提案させていただくということも、Webデザイナーには必要なスキルの一つだと思うからです。 あたりまえなことですが、こういう部分に気づかない方も案外いらっしゃいます。 正直、僕もデザインを始めてすぐの頃にはそんな感じでした。 「仮」という言葉に甘えてしまう事は良く

    WEB制作時に役立つ!ダミーテキストに使える定型文まとめ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • 自社サイトをメディア化し、1年で100万PVにして分かった失敗と成功のまとめ。 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは。LIGの代表、岩上です。 僕達は2012年1月からブログを格的に書き始めて、自社サイトをメディア化するという事に力を注いできました。おかげさまで1年ちょっと運営して月間140万PVくらいの規模のサイトになってきたので、そろそろこれまで僕達がやってきた事の狙い、施策、効果などをまとめたいと思い、記事を書いてみました。 結論から言うと、「自社メディアを持つ」という事はマーケティングやブランディングの観点からとても効果的なのですが、大変な面も多々ありますので、我々の実体験を元にした記事をお読みいただき、何かの参考になればいいなと思っています。 それではどうぞ。 ※読了目安、10分くらいです。 目次 LIGブログの規模と現状 メディア化とは 自社サイトをメディア化するメリット 運用コストについて 費用対効果について 記事を書く際に意識している事 失敗した事、大変だった事 今後の展開

    自社サイトをメディア化し、1年で100万PVにして分かった失敗と成功のまとめ。 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • クライアントに振り回されるWebデザイナーに共通した、たった一つの特徴 - studio room134

    どうしたらクライアントの納得するデザインにたどり着けるのだろう。と考えたことはありませんか?デザインのフィードバック地獄で苦労したWebデザイナー、ディレクターの方は多いと思いますが、振り回されがちなWebデザイナーの特徴とその対処法について、ケーススタディでまとめてみました。 ■クライアントに振り回されるWebデザイナー/WEBディレクターの特徴 「フィードバック指示を額面通りに受け取ってしまう」 これに尽きます。クライアントはデザインをした事が無い人がほとんどなので、修正指示もデザイン的には正しくない事がかなりの割合であります。 これは映画を観て良かった悪かったは誰にでも評価できるが、その映画をどのように修正したらよりよくなるかは経験を積んだ者にしかわからない、というのと同じことです。 にもかかわらず、「ここのボタンを赤くしてください」、「背景をグレーにしてください」という指示を額面通

    クライアントに振り回されるWebデザイナーに共通した、たった一つの特徴 - studio room134
  • SEOだけで100万PVを集めるECサイトを作るために必須のWEB集客の基礎

    ユーザーに届ける価値を徹底的に追求する マーケティングを提供します © Copyright 2022 バズ部. All rights reserved. サイトを作り込み、バッチリSEOも施したのに思ったようにアクセスが集まらない。 または、あらゆる対策を施して、やっとアクセスは集まるようになったけど、そこから売上がほとんど出ない。 もしくは、ECサイトへの集客の大半を、PPCで大金を費やして集めていて、売上数字は出ているけど、実情は赤字・・・。 あなたは、こういう悩みを抱えてはいないだろうか? もし、そうだとしても、今からSEOやキーワードリサーチの基礎、そしてWEBコンテンツ作りの基礎を抑えて、一つずつ改善していくことで、驚くほどサイトのパフォーマンスを向上させることができる。 例えば、主にPPC広告に頼っていたアクセスを、SEOだけで無料で集めることができるし(しかも100万単位で!

    SEOだけで100万PVを集めるECサイトを作るために必須のWEB集客の基礎
  • [JS]最近よく見かける1ページ垂直スクロールコンテンツで、スクロール位置を自動補正するスクリプト -windows.js

    スクロールしすぎも補正 windows.jsの使い方 実装は簡単で、既存のコンテンツにclassを加えるだけで適用できます。 Step 1: HTML HTMLは各コンテンツを配置しているdivやsectionにclassを加えるだけです。 classは変更可です。 <section class="window"></section> <section class="window"></section> <section class="window"></section> <section class="window"></section> <section class="window"></section> Step 2: 外部ファイル 「jquery.js」と当スクリプトをhead内に記述します。 <script src="http://cdnjs.cloudflare.com/aja

  • ヘッダは上部固定で、フッタは最下部にするスタイルシート、レスポンシブにも対応! | コリス

    ナビゲーションを配置したヘッダはスクロールしても常に上部に固定されており、フッタはコンテンツの量が少なくても最下部に配置されるページを実装するスタイルシートを紹介します。 Sticky footer with fixed navbar コンテンツが少なくてもフッタは最下部に、レスポンシブ対応で! デモ Bootstrapに素晴らしいデモがあったので、そこからデモを紹介します。 デモでは、ナビゲーションがあるヘッダはスクロールしても常に上部に固定されています。 デモのコンテンツ量が少ないため、狭い表示エリアで。 デモページ:幅780pxで表示 実装 実装はデモを必要最小限にしたもので、紹介します。 HTML 上からナビゲーションのあるヘッダ、コンテンツ、フッタの順で、ヘッダとコンテンツはdivで内包し、終わりにコンテンツ量が少ない時用にpushのdivを配置します。 <body> <div

  • いまさらだけど、2012年にお世話になった神ツールたち(Mac向け) - Flash Black

    こんなエントリーは去年末か年明けに書いておけ!って思いますが、blogを書く練習としてまとめます。 これから列挙するツールを使う事により、去年は手を動かす事の楽しさを再確認。 いままでダルかった作業が楽になるだけではなく、HTMLをキレイに書けたり構造を考えるようになったりと一石二鳥。 SASS and Compass 全俺が感動し、咽び泣くほど無くてはならない存在となったHtmlコーディングの革命児。 なぜすぐに導入しなかったのかと過去の自分に言いたいぐらい! いまさら解説はいらないと思いますので、お世話になったサイトをご紹介いたします。 CSS書くならCompass使った方がいいよ。SASS使ってる人なら特に。 Sprite画像でもう悩まない?!SassとCompassで速攻Sprite画像を作る方法に感動! | バンクーバーのうぇぶ屋 CompassでCSSスプライト[to-R] C

    いまさらだけど、2012年にお世話になった神ツールたち(Mac向け) - Flash Black
  • Websites for Text and Fonts That You’d Better Add to Bookmarks

    2015年1月16日 フォント, 便利ツール 久しぶりにブックマークしているサイトを整理しました。という事でお掃除後の恒例行事?私がブックマークしているフォント・Webフォント・テキスト関連のWebサイトを、中の人へ感謝の気持ちも込めてシェアします!何年もお世話になっているサイトばかりですが、ここ最近はWebフォント関連のサイトが増えてきましたね。いいな!と思えるサイトがあれば嬉しいです。 ↑私が10年以上利用している会計ソフト! フォント関連 フォントhack.jp フォントhack.jp 日語の無料フォントの表示確認ができるサイト。複数のフォントを表示して比較することもできます。 dafont dafont 英字の無料フォントを大量に集めたサイト。大量すぎて眺めてたらいつも物凄く時間がたってますw ライセンスは各自要確認。 フォントガレージ フォントガレージ 日フォントの販売サイ

    Websites for Text and Fonts That You’d Better Add to Bookmarks
  • スマートフォン対応でよく使うhtml、css、javascriptのまとめ

    スマートフォン(ios、android)向けのウェブサイト・ウェブアプリを作る際に個人的によく使うhtmlcssjavascriptの備忘録。 html関連 headタグ内での設定<!-- //デバイスサイズにあわせて表示領域を変更する --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- //電話番号のリンクを無効化 --> <meta name="format-detection" content="telephone=no"> <!-- //ホーム画面用アイコン --> <link rel="apple-touch-icon" href="icon.png"> <!-- //ホーム画面用アイコンの光沢を無効化する --> <link rel="apple-touch-icon

  • 10代のユーザビリティ: ティーン向けWebサイトのデザイン

    ティーンは、自分のウェブを扱う能力に(過剰に)自信を持っているが、彼らのパフォーマンスは大人に劣る。読解レベルの低さや、忍耐力のなさ、発展途上の情報収集スキルにより、ティーンのタスク成功率は低くなる。そのため、サイトはシンプルで共感しやすいものにする必要がある。 Teenage Usability: Designing Teen-Targeted Websites by Jakob Nielsen on February 4, 2013 日語版2013年2月18日公開 ティーンはインターネットにつながっている。テクノロジーがティーンエイジャーの生活に深く溶け込んでいるため、彼らに役立つ、ユーザブルなウェブサイトを作り出すことがこれまで以上に重要になってきている。次善のものがクリックするだけで手に入り、SMSメッセージによる割り込みが例外ではなく普通のことである世界で成功するには、ウェブサ

    10代のユーザビリティ: ティーン向けWebサイトのデザイン
  • Web屋なら絶対参考にしたい!Web制作で役立つサイトとtwiterアカウント | らふらく ^^

    Web業界にいると、常に新しい情報や技術が生まれるため、 必要な知識の移り変わりが速いです。 そこで、最新技術に乗り遅れず、知識を吸収するためにも フォローしておくと便利なtwitterアカウントとWebサイトを紹介したいと思います。 ①Webクリエイターボックス Webクリエイターボックス Web制作のテクニックやコード集を記事にしてくれています。 分量もちょうど良く、さくさく読み進める事が出来ます。 twiterアカウントはこちら。 @webcreatorbox ②Webデザインレシピ Webデザインレシピ 美人デザイナー「のりさん」が運営するサイト。 CSSやらデザイン系のTipsを中心にWebデザインのテクニックをわかりやすく解説してくれてます。 個人的に非常に助かったのはこちらの記事。 CSSは分かるけど jQuery は苦手 … という人が jQuery

  • wordpressで小規模企業サイトを作るときの手順を公開するぜ2013 NEW YEAR

    小規模企業サイトを制作する際に、wordpressを選択することは多いと思います。今回は、実際に僕が制作したときの作業手順などを備忘録的に記載します。それぞれの細かいやり方は自分で調べてね。 事前準備 サイト全体の構成を把握して、どれを固定ページにするか、カスタム投稿タイプやカスタム分類は必要か、URLをどうするか、どのプラグインが必要かなどを考えておきます。 インストール MySQLデータベースを作成 最新版のwordpress体をwordpress語サイトから入手 wp-config.phpを編集 ファイル一式をサーバへアップロード ブラウザからインストール画面を出す 初期ユーザを作成して管理画面へ とりあえずWP Multibyte Patchを有効化 Ultimate Maintenance Modeを入れてサイトを非公開にする wp-config.phpのパーミッションを4

    wordpressで小規模企業サイトを作るときの手順を公開するぜ2013 NEW YEAR
  • 身につけておきたいWebサイト高速化テクニック #2|検証ツールとそもそもHTTPって何だ編 | DevelopersIO

    第1回のアジェンダ編では、高速化に関わる要因と解決策の全体像を紹介しました。 アジェンダ編にもかかわらず多くのブックマーク、シェアをいただきありがとうございます! 余談ですが、記事にブックマーク、シェアをしていただくと、このブログでは執筆者に経験値がたまるような仕組みになっています。 たくさん経験値を貯めると四半期ごとに良いことがあるかもしれないので、気が向いたらこの他の執筆者の記事もシェアしていただけるとうれしいです。 言葉にせずとも、わかっていただけると思いますが、この記事も・・・ね? 右上にあるボタンをちょちょっと。 題 余談はさておき、題に入りましょう。 今回は「無駄なリクエストとレスポンスの削減」に視点を置き、解決策について調査、計測して紹介してみたいと思います。 と思ったのですが、長くなりすぎたため、まずは「検証ツールとHTTPについて」紹介することにしました。 この記事の

    身につけておきたいWebサイト高速化テクニック #2|検証ツールとそもそもHTTPって何だ編 | DevelopersIO
  • 起業してWEBサービスで10万ユーザー獲得までの半年で行った7つの事

    ユーザーに届ける価値を徹底的に追求する マーケティングを提供します © Copyright 2022 バズ部. All rights reserved. 今年は、ソーシャルメディアと連携したWEBサービスが日でも多数生まれた。 そして、その中には、多くのユーザーを獲得し収益化に成功したものもあれば、日の目を見られなかったものもあるだろう。 そんな中、弊社は当バズ部で多くのクライアントを獲得し、Facebook同級生というサービスは半年で10万ユーザーを超えることができた。 どちらも、改善点をあげるとキリがないぐらい未熟なサービスでお恥ずかしい話ではあるが、これらのWEBサービスを作り育てて来たこの半年で行ったことをシェアさせて頂こうと思う。 これから、WEBサービスを作りヒットさせたいと考えている方にとって、何らかの気づきとして頂ければ幸いだ。 また、私たちバズ部は12年で400社以上の

    起業してWEBサービスで10万ユーザー獲得までの半年で行った7つの事
  • 泣けるほど簡単!おしゃれなサイトができるWEBサービス10選

    作成:2012/12/25 更新:2014/11/01 Webサービス > ちょこちょこっと触っただけで、プロっぽいサイトが無料で作れる 今回はブログじゃないサイトをドラッグ&ドロップで簡単に作成出来る2012年までに話題となったサービスを用途ごとにまとめました。 使い方をどこよりも詳しく解説してあるサイトのURLもつけてます。 エンジニア速報は Twitter の@commteで配信しています。 もくじ 1.まとめサイトを作る 2.ネットショップを作る 3.ホームページを作る 4.ポートフォリオサイトを作る 5.おしゃれなECサイトを作る 6.全部入り企業サイトを作る 7.コーポレートサイトを作る 8.レスポンシブ対応サイトを作る 9.HTML5サイトを作る 10.ビジネス用無料WordPressテーマ - レスポンシブ対応 11.デザイナー向けポートフォリオページ 12.ブートストラッ

    泣けるほど簡単!おしゃれなサイトができるWEBサービス10選