タグ

web制作に関するp130のブックマーク (40)

  • ベンダー拡張プリフィックスヲ削減セヨ

    Translation of: Cutting down on vendor prefixes とあるブラウザーで特定の機能を有効化する場合、現在、多くのウェブ開発者たちはCSSでベンダー拡張プリフィックスを使っていることでしょう。そのこと自体は良いのですが、サンプル・コードやプリフィックスを追加するツールで、時々サポートし過ぎでやたらめったら全てのプリフィックス(今まで実装されたことがないようなものまで)を追加しようとしているのを見かけます。最早ベンダー拡張プリフィックスが不要なCSSプロパティーは数多くあると思いますし、そうでないとしてもその数は減らすことができるでしょう。 以下の例ではどのプレフィックスを、使用しているのなら、使用しているかの注釈をつけておきました。だいたいが削除でき1行で済ませられるにも関わらず、様々なベンダー拡張プリフィックスと共に使われてしまっていることが多いC

  • [JS]納品前の確認に最適、使用されていないCSSのセレクタを見つけ出すスクリプト -Helium

    ウェブサイトの多数のページ全体に渡り、スタイルシートで定義されたセレクタが使用されているかどうかチェックし、使われていないセレクタのレポートを生成するスクリプトを紹介します。 納品する際に、不要なセレクタを除去するのに役立ちますよ。 Helium -GitHub Heliumの準備 Heliumの使用方法 Heliumの準備 HeliumはjQueryなど他のスクリプトを必要せず動作し、URLのリストから全てのページをロードし、解析して、スタイルシートで見つけたセレクタが全ページで使用されているかどうかチェックし、レポートを作成します。 スクリプトは、開発環境で実行してください。 公開中のサイトで実行すると、ユーザーにもHeliumの動作が見えてしまいます。 Step 1: 外部ファイル テストするページの全てに、当スクリプトを外部ファイルとして記述します。 場所は、head内でも</bo

  • WEB制作のスキルに薬事法と医師法の知識は必要ではないかという提案

    品関係のショッピングサイトには細心の注意が必要となる。 ホームページ作成をする上で、最も注意しなければならないのが、法律的トラブルの回避です。 その為に契約書と規約というものを必ず設ける必要があります。 例えば、大学生の人が、アルバイトで何も考えずにホームページを受注し、相手から出された資料を元に作成したとします。 渡された資料が、既に薬事法に違反していたとします(かなり多い)。 こうした違反したページを作った場合、作成した会社と、WEB制作者に罰則が言い渡される事があります。 これを回避する為、かならずホームページ上での文章等の責任は、全て依頼元に委託する規約が絶対に求められます。 こうしたトラブル回避は、ある程度薬事法と医師法の知識さえあれば先に打開策を練る事が出来ますが、一般的WEB制作者の中には、言葉すら知らない人も居るでしょう。 今回は、こうしたWEB上での最もトラブルになりや

    WEB制作のスキルに薬事法と医師法の知識は必要ではないかという提案
  • 各ブラウザに対応するCSSハックやJavaScriptによるハックをまとめているWebサイト・Browserhacks - かちびと.net

    各ブラウザのバージョンごとのCSSハックやJavaScriptによるハック方法をまとめているWebサイト・Browserhacksをご紹介します。CSSハックという言葉自体ちょっと懐かしい気がします・・・ CSSハックやJavaScriptによるハック方法をまとめたサイトです。IEはともかく、OperaやSafariのハックはちょっと助かるかも。 ブラウザ名で検索も出来る様になっています。IE、Firefox、Chrome、Safari、OperaなどのCSSハックやJavaScriptによるハック方法が掲載されています。 試してないけどMedia QueriesでIEのCSSハックという方法は思いつかなかったです。 デモページもあるのでハックが効いてるか確認する事も可能です。 Browserhacksにも書いてありますが、ハックは最適な解決法とは言えないので、個人のサイトなら別にいいと思

    各ブラウザに対応するCSSハックやJavaScriptによるハックをまとめているWebサイト・Browserhacks - かちびと.net
  • 3日間で検索順位が200位上昇したSEO対策10項目

    今回ご紹介するのは、検索順位が200位以上も大幅に改善された事例です。 そのサイトは12月末にSEO対策の見直しも含めてリニューアルを行いました。SEO対策の見直しと言っても、外部対策は一切行わず、内部対策の見直しだけ行いました。その結果、リニューアルの3日後には検索順位が200位以上上昇しました。1ヵ月半経った現在も順位は安定しています。 「検索順位が上がらない」「検索順位が極端に低い」という方のご参考になればと思い共有させて頂きます。 リニューアル前のサイトの状況 リニューアル前のサイトの状況は以下の通りです。 企業サイト(サイト内に社員ブログあり) スモールキーワードで1年以上240位前後に位置する ページランクは1(被リンクは殆どなし) ペナルティに該当するSEO対策はやってきてない 今回行ったSEOの方針 上記の通り、このサイトはペナルティに該当するようなSEO対策は行っていない

    3日間で検索順位が200位上昇したSEO対策10項目
  • 15 Useful Code Snippets for Smartphone Website

    2014年8月22日 Webサイト制作, スマートフォン スマートフォンが普及してきて、Webサイトを作る時、スマートフォンサイトも一緒に制作している方も多くなってきていると思います。私もスマホサイトを制作する機会が増え、だんだんEvernoteに保存していたスマートフォンサイトを作る時の小技がたまってきたので、iPhoneで使える小技を中心にまとめて記事にしてみます。いくつかサンプルも作っているので、スマートフォンからあわせてご覧下さい! ↑私が10年以上利用している会計ソフト! スマートフォンサイト用小技集 目次 いくつかサンプルも作ったのでスマートフォンから、もしくはブラウザーからユーザーエージェントをiPhoneなどに切り替えてご覧ください! 横幅をデバイスの幅にあわせる 文字サイズの自動調整をオフ リストのクリック(タップ)範囲を広げる 画面の幅にあわせてCSSを変える リンクテ

    15 Useful Code Snippets for Smartphone Website
  • [JS]jQueryのプラグイン100選 -2011年総集編

    2011年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年はCSS3の影響もあってかアニメーションのエフェクトが目立ちました。また、Resposive Web Design用の可変ものや動画・テキストを扱ったものも多かったですね。 [ad#ad-2] 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 タブ関連 ナビゲーション関連 レイアウト関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連

  • 長ーいテーブルも瞬時にページング処理してしまうjQueryプラグイン「Table Pagination」:phpspot開発日誌

    NeoAlchemy Table Pagination 長ーいテーブルも瞬時にページング処理してしまうjQueryプラグイン「Table Pagination」 縦に長かったりするとテーブルは読みにくかったりしますが、このプラグインで初期化してしまえば一瞬でページ分けが完了します ページングするコードは次のように書けばOKです テーブル自体はそのままHTMLを書いておけばいいので楽チンですね。 関連エントリ Twitter OAuth認証をポップアップで行うjQueryプラグイン リッチなドロップダウンメニュー実装ができるjQueryプラグイン「Mega Drop Down Menu」 中身が画像のselectボックスを作るjQueryプラグイン

  • How To Enable HTML5 In Chrome | Robots.net

    Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp

    How To Enable HTML5 In Chrome | Robots.net
  • so-network.biz

  • CSS/HTMLのテクニックをクロスブラウザ対応(特にIE)にする方法のまとめ

    17 CSS/HTML Effects with Cross-Browsing Alternatives サポートしないブラウザへの対応方法はJavaScriptを利用するなどいろいろありますが、その中の一つとして紹介します。 [ad#ad-2] 下記は各ポイントを意訳したものです。 幅の最小値・最大値 (IE included) RGBa (IE included) 不透明度 (IE included) 画像の回転・拡大縮小 (IE included) 背景をブラウザいっぱいに表示 (IE included) 画像無しのビュレット テキストのシャドウ (IE included) 複数のボーダー (IE included) ボックスシャドウ (IE included) 角丸 スクリーンリーダー用のコンテンツ ネガティブ値で指定したtext-indent Clearfix (IE inclu

  • 激安で日本的な写真素材、レンポジサイト一覧 | Maka-veli.com

    写真素材、レンポジ(リースフォト、レンタルポジ、レンタルフォト、レンポジ、アリポジ、写真素材のことです)は、安かろう悪かろう。 無料もありますが、当にクオリティが変わってきます。 良いものに越したことは無いんですが高い。 そして無料のは当にクオリティが低い。 下記サイトは日の素材が揃っていて、かつ安いのでよく使ってます。 自分でも整理したいので一覧化。 PIXSTA http://pixta.jp/ Fotolia http://jp.fotolia.com/ ビジンソザイ http://bijinsozai.com/ YOURSTOCK http://yourstock.jp/ PhotoLibrary http://www.photolibrary.jp/ modelpiece(無料) http://www.modelpiece.com/ 足成(無料) h

  • 【公式】ハイローオーストラリア|新機能:ジャックポット・キャッシュバックプログラム¦HighLow.com

    ジャックポットについて特別なキャッシュバック取引約定後に、幸運なプレイヤーは最大100,000円のキャッシュバックが当たります。また、Highlowロイヤルティ・ステータスが高いほど当選確率・金額が上昇します。

  • simplelib with jQuery

    1.simplelibとは simplelibとはjQueryを利用した様々なプラグインを動的にロードして、ウェブサイトを構築する上でよく使う機能を一元管理するためのツールです。 各プラグインを別ファイルにし、必要なファイルだけをロードします。ダウンロードはこのページの一番下にあります。 2.プラグイン一覧 現在以下のようなプラグインがあり、HTMLに1行追加するだけでこれら全ての機能を追加できます。 accordion

  • スマートフォンサイトをデザインする上で知っておくべき10のTIPS

    スマートフォンサイトをデザインする上で知っておくべき10のTIPS iPhoneAndroidのスマートフォンの仕様を知らないけどデザインしなくちゃいけなくなったというデザイナーさんに知っておいてもらいたい10(+1)のTIPSです。 1.実機で確認する 当たり前のことですが作成したデザインを実機で確認して下さい。スマートフォンとPCでは目からの距離やDPIが違いますので、PCでは十分に見れたからといって実機で確認すると文字が小さすぎることなどがよくあります。書きだしたJPGをFTPでアップして確認してもいいですし、メールでスマートフォンに送って確認してもいいです。個人的にはDropboxで転送するのが手軽でおすすめです。 2.横幅は320pxもしくは640pxでデザインする スマートフォンでは基横幅が320pxで表示されるのでデザインする際も320pxでデザインしましょう。ただ、Re

    スマートフォンサイトをデザインする上で知っておくべき10のTIPS
  • 「スマホ対応サイト制作 初心者向け」みたいな感じで書いてみた  -1.メニュー編-(※iPhone寄り) - Kaleidoscope

    【目次】 1.メニュー編 2.HTMLCSSで画像を操る編(前編) 2.HTMLCSSで画像を操る編(後編) 今持ってるPCサイトをスマホ対応したいなぁ…と思ってるものの、 「どこから手を付けていいのやら、わからん!!」って方も多いのではないでしょうか? ということで、記事でも書いてみっかぁ!と、なぜかやる気になったので、連載形式で書いてみることにしました。 ただ、途中で飽きたり、やる気が無くなったら、予告無く終了する可能性大です( ̄▽ ̄;) 僕自身、人に教えられるほどのスマホサイト制作の熟練者というわけでは無いので、もっと良い手段や方法があるかもしれません。 「ここはこうしたらいい」など、ご意見ありましたら、逆に教えてください(^-^; 【まずはじめに】 スマホサイトと言っちゃったものの、とりあえずはiPhone向けのサイトを基準とします。 Androidの「ブラウザ」も、iPhon

    「スマホ対応サイト制作 初心者向け」みたいな感じで書いてみた  -1.メニュー編-(※iPhone寄り) - Kaleidoscope
  • Webデザインやプログラミングなどの勉強に良さそうな国内のブログ記事やWebサイトいろいろ - かちびと.net

    いよいよ2011年がスタートしました。 今年も去年同様、勉強することが 沢山あります。まだモチベーションが そこそこあるうちに勉強になりそうな 国内の記事をリンク集にしました。 迷ったときに見てみようかなと思い ます。 より最適な方法というのはあると思いますが、まずは扉を叩かない事には何が悪いかも分かりません。ということで、内容に拘らず、否の意見をスルーしてここに色々まとめさせて頂きました。 勉強したい気持ちはあるけど出来ない理由は「何を始めればいいのか分からない」という方も、何が出来るのか、どういった勉強法で出来るようになるかが分かればやる気が起きるかも知れません。 5分で分るシリーズ 以前も流行ったんですね。Web関連以外も含めてここにまとめられています。 5分で分かる PHP を知らない人が PHP の便利さを学べる記事を書いたよ 5分でわかる Ruby を知らない人が Ruby

    Webデザインやプログラミングなどの勉強に良さそうな国内のブログ記事やWebサイトいろいろ - かちびと.net
  • 今年はWebサービスを作りたいと思っている人にお勧めのエントリーまとめ | ロプログ

    明けましておめでとうございます! 近年、個人でWebサービスを開発するのが流行っていますね。「今年こそは俺もWebサービスを作ってモテモテになるぜ!」と思っている人も多いのではないでしょうか。 そんな人のために、Webサービスを開発・運営するにあたっての心構えやノウハウ、体験談などの書かれたエントリーを集めてみました。 ▼誠 Biz.ID:田口元の「ひとりで作るネットサービス」探訪 個人でWebサービスを開発している人たちのインタビュー集。ヒットしたサービスを手がけた個人開発者達のバックグランドや考え方を垣間見ることができ、モチベーションアップにもなります。恥ずかしながら、私のインタビューも載っています。 ▼Web2.0ナビ: 個人サービスを作るコツ 個人がWebサービスを作るための、実践的な8つのコツが書かれています。 ▼個人でネットサービスを運営するための5つのコツ(momose版):

    今年はWebサービスを作りたいと思っている人にお勧めのエントリーまとめ | ロプログ
  • 2010年にWeb担当者が読んでおくべき良記事40本 | 初代編集長ブログ―安田英久

    2010年の要チェック人気記事を発表! あなたはあの良記事を見逃していませんか? 解説記事、ニュース記事、ユーザー投稿などの種類ごとに、人気記事を紹介します。 解説記事トップ20 | ニュース記事トップ10 | ユーザー投稿記事トップ10 解説記事の2010年人気記事トップ20殿堂入り:Webマーケッター瞳 ―― マンガ記事として、各回人気を集めました。第1話からどうぞ 滅べばいいのにと思うSEOの10の迷信(都市伝説)(SEOmoz) SEO業界にはびこる間違った情報、それも正しいSEOの妨げとなる情報について見ていこう。 あなたの著作物をパクったサイトをGoogle八分に追いやる正しい手順(編集部ブログ) そもそも盗用されたコンテンツは、検索エンジンで探せない状態にしてしまえばいい 客はバカでちょうどいい。販促サービスにおける鉄則(企業ホームページ運営の心得) 販促サービスを成功させる

    2010年にWeb担当者が読んでおくべき良記事40本 | 初代編集長ブログ―安田英久
  • 前から気になってたHTML5について色々調べてみました - もとまか日記

    先日、ドコモのAndroid端末である「GALAXY S」を予約したわけですが、そうなると気になるのが、ずーっと前から気になってたHTML5について。これからスマートフォンが普及するにつれて、無視出来ない技術であるのは誰の目にも明らかなのではないでしょうか。 てことで、HTML5について調べてみたメモです。 HTML5の概要まずは難しいことは抜きにして、概要を読んでみると分かりやすいです。 HTML5, きちんと。この記事だけで十分です。長くもなく、文字も少ないので非常に入りやすいです。 HTML5仕様関連一応ですが、仕様について。 HTML5.JP - 次世代HTML標準 HTML5情報サイトHTML 5 ― HTML 4 からの変更点 (http://www.w3.org/TR/html5-diff/ 日語訳) 必要に応じてみればいいので、細かくは見てません。 基礎知識概要が理解出来