保存版！プロが教えるホームページのデザインを劇的に変える7つの方法
ホームページ作成の初心者さんの多くが「ホームページのデザイン」に悩む、苦戦すると言われます。デザイン性の優れたテンプレートを購入しても、最終的な仕上がりが素人っぽくなってしまうからですね。そこで、こちらの記事では「ホームページのデザインにお悩みの方向け」に、ホームページのデザインを劇的に変化させる方法を紹介します。 ヘッダーのデザインを変更する！ インターネットを活用しているユーザーが、自分のホームページにたどり着いた瞬間に最も目にする場所は「ホームページを開いた瞬間にパソコンのモニターの中に収まっている部分」になります。つまり、ヘッダーのデザインをカスタマイズしてあげるだけで「ユーザーに与えるインパクト」を高められます。 ポイントは「他のホームページと被らない様にすること」だと思いますので、同ジャンル（僕ならアフィリエイト系）のホームページをチェックして、他の人がやっていないデザインを意
【画像あり】webディレクターだけど、初心者に役立つサイト教える : 暇人＼(^o^)／速報
【画像あり】webディレクターだけど、初心者に役立つサイト教える Tweet 1: 以下、＼(^o^)／でVIPがお送りします 2015/02/06(金) 17:41:24.70 ID:flJZIImcH.net 最近クソみたいなデザインとグッチャグチャのソースコード書いてる ミーハー丸出しアフィサイトが増えてきて鬱陶しいから、 これからサイト作る初心者用にサイトを紹介していく これ以上俺のウェブサーフィンライフを邪魔すんじゃねえぞ 2: 以下、＼(^o^)／でVIPがお送りします 2015/02/06(金) 17:42:31.08 ID:flJZIImcH.net まずはドットインストール http://dotinstall.com/ 開発環境の構築方法からプログラミング言語の基礎の基礎を教えてくれる 一回の動画の時間が短く区切られているので使いやすい。 プロからはあまり評判が良くないが
画像のファイルサイズを最大70％減らせて複数ファイルも一括処理も可能なフリーソフト「PNGoo」
PNG画像を最大70％圧縮できたり、透過処理したPNG画像も透過処理を残したまま圧縮できたり、複数PNG画像を一括で処理したりもできるファイル圧縮ツールが「PNGoo」です。無料でブラウザ上からファイルサイズを圧縮できる「TinyPNG」や「Kraken.io」でも使われている「pngquant」というコマンドラインツールを使用したフリーソフトで、ブラウザ上で処理を行うわけではないのでインターネットに接続していなくてもいつでもPC上で画像を圧縮できてしまいます。 pngquant — lossy PNG compressor http://pngquant.org/ ◆PNGooを使ってみた 「PNGoo」をインストールするには、上記リンクからpngquantの公式ページへ飛び、「PNGoo」と書かれたリンクをクリック。 すると「PNGoo.0.1.1.zip」というファイルがダウンロード
Web制作者は要ブックマーク！制作時にいろいろと役立つ便利サイトのまとめ
Web制作時に、あれ？なんだっけな？って時に役立つ便利サイトを紹介します。 HTML5やCSS3の各ブラウザのバージョンごとのサポート状況、スクリーンサイズやデバイスごとのMedia Queriesの書き方、Bootstrap, Foundationなど各フレームワークの対応ブラウザやライセンス、ブラウザの各バージョンごとのCSS Hackなど、いざという時に役立つサイトばかりです。 Can I Use...Support tables for HTML5, CSS3 Can I Useは先月くらいにUIを刷新し、より使いやすくなりました。デスクトップ・モバイル用の各ブラウザでのバージョンごとのHTML5, CSS3のサポート状況がそれぞれ詳しく分かります。
Google Analyticsも真っ青？！アクセス解析サービス「Pt engine」はサイトを視覚的に分析し、運営を大幅にサポート！
サイト運営にアクセス解析は必須だ。 自サイトに訪れるユーザーがどのような経路でどのページに辿り着き、何分間滞在して何ページ遷移してから、最終的に離脱するのか。見て欲しいページを見てもらえているのか。新しいサイトデザインは効果が出ているのか否か。ユーザー行動を分析し、それをもとにトライアル・アンド・エラーを繰り返すのがサイト運営だ。 ただ、正直なところアクセス解析の必要性は感じつつも気乗りしないと言う人も多いだろう。多くの人はGoogle Analyticsを使用していると思うが、使い方がよく分からない、と嘆く人も多い。 今回紹介する「Pt engine」はGoogle Analyticsに対して苦手意識を持つ人こそが試してみるべきアクセス解析サービスだ。サイトの分析を視覚的に行う事ができる上に、使いやすいフィルタリングでセグメント分けも可能。各デバイスごとのヒートマップ解析機能も利用できる
Wordpressプラグインのダウンロードランキング・トップ200！！実質1位は日本発のあのプラグイン - 着ぐるみ追い剥ぎペンギン
WordPressプラグインのダウンロードランキング・トップ200！！実質1位は日本発のあのプラグイン 2014 8/12 WordPressというオープンソースのソフトウェアがあります。 ネット関連の仕事をしてる人や、ブログをやっている人なら聞いたことがある方も多いと思いますが、世界中のウェブサイト構築に使われている大人気のソフトウェアです。 僕はWordPressが大好き・得意でして、仕事でも凄く使っています。 勿論、このブログもWordPressで出来ていますし、以前に「誰かが記事をコピーしたら教えてくれるプラグインCCC(Check Copy Contents)を作ってみた」でも書いたようにプラグインも時々作ったりもしてます。 WordPressを使ったサイト構築のお話があれば是非どうぞ（宣伝） WordPressプラグインのダウンロードランキング さて、WordPressの人気の
私が最近どうやってブログを書いているのか、手順と使用ツールを公開してみる
Markdownを覚えて以来、ちょっとした心境の変化と、Sublime Textでブログを書き始めたら結構これが快適だったので、MarsEditを使うのを試験的にやめてみました。 そんなわけで本日は、最近私がどうやってブログを書いているのかと、使っているアプリ・ツールを晒してみたいと思います。（環境はOS X 10.9です） ブログ執筆の順序 まずはブログをどうやって書いているのか、その手順から。 アプリのダウンロード用html用意（アプリ紹介の場合） 画像用意→加工（リネームまで） 画像をまとめてアップロード Sublime Textで執筆 WordPress管理画面にてアップロード アプリのhtmlコード取得 アプリのコードはAppStoreHelperを使って取得しています。テンプレートを自分好みに簡単にカスタマイズできるのが嬉しいポイント。
SNSとリスティングの違い/jQueryの読み込み方/いまどきLP10選
国内外のWebメディア、ブログから、マーケティングやWeb制作に役立つ注目記事をピックアップ。先週は、LINEの乗っ取り対策など考えさせられる話題がありました（ピックアップ期間＝2014/6/30〜7/6）。 マーケティング（ソーシャル／SEO／SEM／アクセス解析など） Facebook広告、Twitter広告、Adwordsの実績を比較してみた。（gamba流(ル)） http://gamba.blog.jp/archives/1005266751.html ソーシャルメディア広告とリスティング広告の実績比較。商材やターゲットにもよると思いますが、ここまで差が出るんですね。 GoogleウェブマスターツールとGoogleアナリティクスを連携しないと利用できない2つのこと（真摯のブログ） http://cinci.jp/blog/20140707-cooperation-of-googl
HTMLテンプレートの基本ファイル一式、Webページを実装するための必要最小限をまとめたHTML
HTMLで、Webページやアプリを作成する時に役立つ、フロントエンド用に必要最小限をまとめたシンプルなHTMLの基本テンプレートのファイル一式を紹介します。 v.8.0.0がリリースされ、現在の環境に合わせた設計にアップデートされました。 IE11を含む、すべてのモダンブラウザをサポートしています。 HTML5 Boilerplate -GitHub HTML5 Boilerplateの特徴 HTMLの基本テンプレート HTML5 Boilerplateの使い方 HTML5 Boilerplateの特徴 HTML5 Boilerplateは、Webサイトやアプリを実装するためのプロフェッショナルなフロントエンド用のHTMLの基本テンプレートです。 実践的な基本のテンプレート 200人を超える貢献者による分析・研究・実験をもとにしています。 ブラウザの見え方を最適化 プログレッシブエンハンス
登録不要で無料のWebサイト分析ツールとサービス8選！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、株式会社LIG 執行役員の寺倉と申します。 自社サイトの分析、競合他社、類似サイトの発掘と分析は、KPI設定や改修、WEB戦略を立てる上で非常に重要です。 今回は登録不要、かつ無料で使えるサイト分析ツールとサービスを8つほどまとめてみました。これが誰かのお役に立てば幸いです。 株式会社LIGとは 2007年設立、東京都台東区発のWeb制作会社。年間150サイトリリース、毎年複数のWebデザインアワードを受賞。Web制作だけでなく、月間200万PVのWebメディア「LIGブログ」で培ったマーケティングのノウハウを生かした企画力、複数の海外拠点を生かしたシステム開発力も強み。 👉Web制作実績 お問い合わせはこちら マジで使える無料のWebサイト分析ツール&サービス8選 類似サイト検索：Google（コマンド検索） https://www.google.co.jp/ 類似サイトを
CSSで要素を横並びにする方法まとめ | HALAWATA.NET
CSSで要素を横並びにする方法をまとめてみました。 それぞれの違いがわかるように基本となるコードを用意します。 div要素3つとそれを囲むdiv要素1つです。3つのボックスには高さと横幅を80px、マージン、パディングともに10pxを指定します。 <div class="boxContainer"> <div class="box">BOX1</div> <div class="box">BOX2</div> <div class="box">BOX3</div> </div> float – 方法1 .box { float: left; } .boxContainer { overflow: hidden; } /* clearfix */ .boxContainer:before, .boxContainer:after { content: ""; display: table;
説得力がグンと上がる！UIデザインの心理学
オライリーから出ている「ユーザーインターフェースデザインの心理学」から使えそうなものを実例を踏まえピックアップ！これでUIデザイン説明の説得力をあげよう！ 情報は一度にすべて見せるのではなく、そのとき必要なものを段階的に開示させた方がよい。 デザイナーが犯しがちな失敗は一度に大量の情報をユーザーに与えてしまうことです。 情報は一度に大量に与えるのではなく、その時点で必要としている情報だけを与えるほうが様々なニーズに対応することができます。 ユーザーの中には大まかな説明でよい人もいれば、詳細を知りたがっている人もいます。 つまりどういう事？ 情報は一度に見せるのではなく段階的に見せる 重要なのはクリック回数ではない。クリックのたびに必要な情報が手に入るのであればユーザーは喜んでクリックする 誰がいつ何を必要としているかを理解する。各段階で何を必要としているか的確に把握していないと、この手法は
Bootstrapベースの管理画面向けHTML5テンプレート・「Cascade」
CascadeはBootstrapベースの管理画面を構築する為のテンプレートです。派手な装飾もなく、全体的に管理画面デザインとしてとても良さそうな印象を受けました。デモもあるので興味のある方は触ってみては。 Cascade
他人の知識から学びとれ！Webディレクターに役立つ厳選スライド資料まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
勉強欲が強いディレクターの鮫島です。 普段みなさんは知識を得るためにどのような勉強をしていますか？？ 本を読んだり、セミナーに行ったり、Facebookのタイムラインに流れてくる技術系の記事を見たりすることが多いかと思います。 私も大体そうなのですが、最近それ以外にも勉強する方法を模索しています。 その中の1つとして、ちょこちょこ目に付くオンラインの「スライド資料」がとても分かりやすくて、ちょっとした合間に勉強できます。そこで、私が最近見た中でも、見やすくて勉強になったスライドをいくつかご紹介します。 ちなみに、オンラインのスライド資料サービスについては、過去にディレクターの勢古口が「より美しいプレゼン資料を共有しよう。オンラインプレゼンツール7選」でまとめていますので、ご興味あればこちらもご一読ください。 ディレクター向けのスライド資料まとめ IAシンキングによるモバイル再設計 内容 I
[Z]ZAPAブロ〜グ2.0
Yhomie製の完全ワイヤレスステレオ（True Wireless Stereo）イヤフォン F9 をレビュー用に提供していただきました。 完全ワイヤレス イヤホン 低音重視 Yhomie bluetooth イヤホン 電池残量表示 AAC対応 携帯充電可 片耳&両耳とも対応 Bluetooth 5.0 自動ペアリング 自動電源ON/OFF 左右分離型 音量調節可能 2200mAh充電ケース付きIPX6防水 Siri対応 マイク付き iPhone Android 日本語説明書 Amazonから届いたパッケージはこれです。TWS+。 メーカー名や製品名はパッケージに書かれていません。 オープン！ 内箱の黒い箱を開けると、黒いケースが見えてきました。 内容はこうなっていました。充電ケース、イヤホン、USB-Cケーブル、イヤーピース。 充電ケースを開けたときに驚きました。カッコイイ！と。 充電ケ
![[Z]ZAPAブロ〜グ2.0](https://cdn-ak-scissors.b.st-hatena.com/image/square/6711357ccd06bc65fda86ce3e8da6195e62250f5/height=288;version=1;width=512/https%3A%2F%2Fzapanet.info%2Fzapanet_fav.png)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
サクサク引ける Rubyリファレンスマニュアル
gihyo.jp
WebShot - Website screenshot and webpage screenshot thumbnail generator utility
CSS3アニメーションをブラウザ上で簡単に作成・編集できる『bounce.js』 | 100SHIKI
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
