デザインをウェブサイトに適用する際にありがちな7つの間違い
7 mistakes developers make [ad#ad-2] 下記は各ポイントを意訳したものです。 はじめに 1. 良いデザインがどのように見えるか 2. カラー選択の理由は好みだからはダメ 3. 真ん中配置の誘惑 4. フォント選びは慎重に 5. 情報の詰め込み過ぎ 6. 質問をもって 7. ディテールは時間の浪費？ はじめに もしあなたがフリーランスのコーダーであるなら、あなたの資産の一つに、ウェブ開発の始めから終わりまで全てのプロセスを把握している、ということがあります。これはデザインも含みます。 プログラマーはコードと素晴らしく構築されたシステムをデザインし、自身がデザイナーであると言えるでしょう。また、個人のプロジェクトなどで、ウェブサイトを作成しなければならないかもしれません。 これはデザインでビジュアルの何かに違和感があっても、あなたがデザインのために良い目を持っ
有料から無料になったCSS3による42種のウェブアプリボタンセット「Zocial」
もともとは24ドル(約1800円)の有料セットだったのですが、今は無料でダウンロード可能なのが「Zocial」です。42種類のCSS3によるフォントフェイス(font-face)と、ベクター形式によって自由なサイズでキレイに描画できるアイコンボタンの組み合わせとなっています。 Zocial ~ CSS3 Buttons, Sass Framework. http://zocialbuttons.com/ Zocial | CSS3 Button Set http://zocial.smcllns.com/ ダウンロードは下記サイトの「ZIP」ボタンをクリックすれば可能です。 samcollins/css-social-buttons - GitHub https://github.com/samcollins/css-social-buttons/ サンプルは以下から閲覧可能。 Zocia
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
簡単なウェブページを無料で公開するならDropboxのPublicフォルダとbitlyで！ - Gadget Girl
Dropboxをバックアップだけに使っているという方、もったいないです！ イベントの告知ページや自己紹介ページなど規模が小さいウェブページを公開したいとき、DropboxのPublicフォルダが便利ですよ。レンタルサーバーなどを使わずに無料で出来るというのも嬉しい♪ 自分の情報をまとめた簡単なウェブページ http://bit.ly/spring_mao を公開したので、その手順をまとめてみます！ 今日のレシピをざっとまとめると以下の通り！ 公開したいページのHTMLファイルを作成する DropboxのPublicフォルダに入れて公開URLを取得する bitlyで短縮URLに変換＆カスタマイズして覚えやすくする 公開したいページのHTMLファイルを作成する テキストエディタでHTMLファイルを作ります。.htmlという拡張子で保存すればOK！下記のページを参考にしてみてください。 参考：W
webサイトの企画書や提案書のサンプルを見たいのですが、提案書や企画書がまとめられているサイト等知っている方がいましたら教えていただけないでしょうか？
webサイトの企画書や提案書のサンプルを見たいのですが、提案書や企画書がまとめられているサイト等知っている方がいましたら教えていただけないでしょうか？
[CSS]さりげなく、美しくて分かりやすいテーブルにするCSS3のチュートリアル
IE6などの非サポートブラウザも配慮した、角丸、ゼブラ柄、ハイライトなど美しくて分かりやすいテーブルを実装するCSS3のチュートリアルを紹介します。 デモページ:Zebra stripes, footer 角丸、セルを交互にカラーリング 実装のポイント CSS3を使って美しく、そして機能するテーブルを実装するポイントです。 画像を使用しないで、角丸を実装。 余分なid, classは使用せず、更新が容易。 ※tableにclassを一つだけ ユーザフレンドリーで、読むことが簡単。 実装 HTML HTMLは非常にシンプルです。 classは、tableタグにのみ使用します。 <table class="bordered"> <thead> <tr> <th>#</th> <th>IMDB Top 10 Movies</th> <th>Year</th> </tr> </thead> <tr
新任SEO担当者に必須のチェックリスト20項目 - SEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
無料で資料をダウンロード SEOサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする ＞＞ 仕事や会社が変わったり、社内の担当が変わったり、とある日突然新しいサイトのSEOの任されることになった、という話はネット業界では良くあるでしょう。もちろん任される限りには多少のSEOの知識は持っている場合が多いでしょうが、実際にこれまで他の誰かがやっていたSEOを引き継いで行うことは意外とチャレンジングだったりもします。今回はサーチエンジンランドが、SEOの仕事を引き継ぎ際に気をつけるべきポイントをチェックリストでまとめてくれました。流石に上手くまとめられたリストとなっており、これで次にSEOの仕事を引き継ぐ時の不安は無し？！ — SEO Japan もしあなたが、ウェブサイトの新任“SEO担当
CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました
Webデザインをしていると、HTML と CSS だけではできない表現ってありますよね。そんな時によく使うのが jQuery。今回は jQuery っていまいちよく分からない ... っていう人が、jQuery に少しでも親しんでもらえたらいいなーと思って、知ってる事をまとめてみました。なので jQuery 初心者さん向けの記事です。 とっても当たり前なんですけど、Web サイトは基本的に HTML で書かれていて、デザインは CSS で装飾されていますよね。最近では CSS3 の登場で、簡単なアニメーションも CSS で作れるようになりました。でもクライアントワークでは、まだまだ CSS3 を使える部分が限られているし、Webデザインに少し動きなどをつけたい時などは、まだまだ jQuery を活用する事も多いです。 私は Javascript が苦手で、jQuery もどちらかというと苦
スマートフォンサイトを作る時に便利なフリックが実装できるjQueryプラグイン7選
スマートフォンを使うときによく使う操作方法としてフリックがあります。このフリックの操作でギャラリーができるjQueryプラグインを集めました。 Androidを持ってないので、全てがAndroidで動くかは未検証ですがだいたい動くと思います。 flickGal 自分が一番つかってるのがこのflickGalです。 PC（IE以外）でも動作します。 flickGal・・・iPhoneでフリックギャラリーを簡単に実装できるjQueryプラグインです – piglovesyouの日記 flickable こちらはPCでフリックができるようにできるプラグインです。そのままスマートフォンでも使えます。 PCでも（IE6でも）よく動きます。 jQuery.flickable: iPhone and Android like flick scrolling plugin flickSimple こちらもP
いますぐ使えるCSS3テクニック集！ コピペ用サンプル付き！
面白法人カヤックがサイトリニューアル！ いきなり手前みそで恐縮ですが、今年の夏、面白法人カヤックがコーポレートサイトを2年ぶりにリニューアルしました。 「世界一更新頻度が高く、カヤックの活動がひと目で分かるコーポレートサイト」をコンセプトに、可読性が高く容量も軽いサイトに仕上げました。 ひと目見るだけで、最近のカヤックの動向が分かるようにニュースでTOPページを構成し、日々リアルタイムにカヤックの最新の情報を発信します。 技術的には、ブラウザのウィンドウサイズによって拡縮する画像はベクターファイルであるSVG（Scalable Vector Graphics）画像で置き換えたり（SVGはベクトル形式の画像のため、拡大してもボケない）、CSS3を用いることで画像の使用を極力控えたりするなど、ページの軽量化を実現しています。 カヤックサイトのCSSテクニックを丸ごと伝授！ 本稿では、サイトリニ
保存版！CSS3セレクタの説明書
CSSセレクタについての基礎知識 このブログで何回も説明していますが、念のために説明します。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの１つです。 セレクタ表の説明には属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。 私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。 あと親子関係や兄弟関係などもあまり聞きなれないかもしれません。下の階層にある要素との関係が親子関係で、同じ階層にある要素同士の関係が兄弟関係です。 あと、CSS3と聞いて「どうせIE8以下はダメだし使えない」と思う方もいるかもしれませんが、セレクタに関しては簡単に対応できます。 IE6～8でもCSS3セレクタが利用できるツールの決定版「Selectivizr」をご参考に。 それ
Web制作の為の無料Webサービス・ツール40*ホームページを作る人のネタ帳
web制作で使えるWebサービスや、Webツールなどをご紹介。 小分けして紹介していた分もあわせてまとめています。定番の物からマニアックなものまでお楽しみください。 グラフィック・創作 10,000s Cool FREE Seamless Patterns-パターンファイルジェネレータ Web制作でもよく背景で利用するパターンファイルを作成する素晴らしいジェネレータ。様々な模様があり、色は決めれますので、組み合わせはほぼ無限です。 Pixlr Photo Editor-オンラインフォトエディタ 世界で最も人気とされるオンラインフォトエディタ。OSを選ばない。 photoshopに近いインターフェイスと、ブラウザさえあれば動くという使用が人気。ユーザー登録しなくても利用できる（したほうが便利）。 Vintage Effect-レトロ、ヴィンテージエフェクト 上のPixlr.comが運営するも
ホーム - ウェブパッケージ
整理され、シンプルで、使い勝手が良い。メトロスタイル（カードスタイル）は、すべてのメインコンテンツが配置されたセクション（カード）を使ってサイト構造を構築するという原則に基づいています。
だからwebもリアルと同じでがんばらないとダメなんだって
精神論とかそういうのあまり好きじゃないので、こういうのもなんなんだけど、結構最近よく見かけたり、時には聞かれたりする。 webって儲かるのとか、iPhoneアプリは儲かるらしいね！とか、ブログって儲かるのとかうんぬんかんぬん。 いやそりゃ儲かるっちゃ儲かるんだけど、儲からないっちゃ儲からないわけで、その謎の儲かる感はどこからくるのかなと不思議でしょうがない。特に個人でも色々と始める事ができるのがネット。個人でやるからこそ忘れてはいけないものがあるんじゃないかなぁと。 ※写真はなぜかiPhoneにさして受話器で通話するというオモシログッツを東京で見かけて思わず撮影したものです。 『楽して儲けるカラクリにはまってはいけない』 突然電話きて、情報商材をかったんだけど書いている内容がちょっといまいちと言う事で相談に乗ってきました。 早速、ハンバーグランチでも食べながら資料を見せてもらいました。 内
いまさら聞けない＞＜； 基礎から学ぶ「HTML5」超入門！
HTML5 旋風、吹き荒れてますね！(^0^)／ さて、ものすごく突然で恐縮ですが、この度「HTMLファイ部」、設立しました！ 株式会社カヤック（本社：神奈川県鎌倉市、 代表取締役CEO：柳澤大輔、http://www.kayac.com以下「カヤック」）は、HTML＋CSSコーディング、JavaScript プログラムを担当する職種が所属する「HTMLファイ部」を発足いたします。 これまでHTMLおよびCSS、JavaScriptの担当者は、プログラマが所属する技術部、デザイナが所属する意匠部ME課（MEはMarkup Engineerの略）に分かれて所属していましたが、昨今のHTML5の進化と普及を受けて、HTML、CSS、JavaScriptの担当者は「HTMLファイ部」にて活動をスタートします。 そんなHTMLファイ部員が今回お送りさせていただくのは、 HTML5 について基礎から
Web制作をちょっとだけ楽にするjQueryプラグイン 「laquu.js」 | webox blog
知り合いが便利そうなものを作っていたのでご紹介します。 Web制作時によく使う機能をひとまとめにしたjQueryプラグインです。 読み込むjsのファイルが増えてきたり、その都度追加していくのが面倒だなと感じてきていたのでこういうのは非常に助かりますね。 Laquu.js 個人的によく使う機能 アコーディオン ドロップダウン ブランク XHTMLで非推奨とされているtarget属性の代替となる機能です。 個人的にはJSで実装するなら非推奨でも入れてしまいますが… ちなみにHTML5ではtarget属性は復活しています。 スクローラー ページ内リンクのスムーススクロールを実装する機能です。 スクロール2ビュー スクロールを検知して指定要素を表示/非表示してくれる機能です。 イメージオーバー そのうちプリロードしてくれるようにするそうです。 ツールチップ コナミコマンド ネタ機
無料・商用利用OK・バックリンク不要・著作権表示も不要で使える写真や日本語フォントなどの素材サイト集 - かちびと.net
少しリソースが溜まってきたのでリンク集に して開放します。バックリンク不要で、商用 の利用可能、著作権表示も不要のWebデザイン 向け素材サイト。商用で使ってもいいけど リンクしてね、といったようなCCのBY的な ライセンスだとどうしても個人的に使いにく いのでバックリンク不要は割りと必須です。 今までのリソースをまとめただけなのでほぼ全部既出だと思います。自分用リンク集なのでいろいろ適当です。 細かいライセンスもあるので利用規約には必ず目を通してください。 9search この記事の題名の条件の素材を紹介しているサイト。小物系探すなら最初にここ見たほうが早いです。 9search ソザィ-Sozay- こちらもこの記事の題名の条件で収集していますが、素材単位ではなく、Webサイト単位で紹介しています。国内多めですかね。 ソザィ-Sozay- 国内のWeb制作に役立ちそうな無料の写真素材や
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
最近のWeb制作で必ず1度はお世話になる便利なジェネレーターまとめ5つ - W3Q
フリーランスのための全国Webサイト制作料金表
ぱくたそ - フリー写真素材・無料ダウンロード
