Nex - Api Documentation オシャレなフルスクリーンスライダーが作れるjQueryプラグイン「Nex」 フルスクリーンにすることで大きく迫力があるスライダーが作れます。画像切り替え用のアニメーションも複数ある模様。 デモページ 関連エントリ パララックスなスライダーを実装できるjQueryプラグイン「FractionSlider」 ハッシュフラグメントでブックマークに対応できるスライダー「Hashslider v2」
Nex - Api Documentation オシャレなフルスクリーンスライダーが作れるjQueryプラグイン「Nex」 フルスクリーンにすることで大きく迫力があるスライダーが作れます。画像切り替え用のアニメーションも複数ある模様。 デモページ 関連エントリ パララックスなスライダーを実装できるjQueryプラグイン「FractionSlider」 ハッシュフラグメントでブックマークに対応できるスライダー「Hashslider v2」
Pooleリーダーの鮫島です。 競合、丸裸にしてますか?(ライバル視しているサイトの、アクセス数やどこからトラフィックがあるのか、どういったキーワードを選定しどのくらいの検索数があるのかなど、SEO周りの対策を分析していますか?) 私は、主に提案資料を作成するときや、サイト設計をするときなどにします。 そういうときは、競合分析ツールを使うと効率的に情報を取得することができます。 というわけで、今回は私が普段使用している競合分析ツールを厳選して7ツールご紹介します。 無料で使える! 競合サイトを分析できる7つのツール 1. Dockpit(ドックピット) https://www.valuesccg.com/dockpit/ 最近、認知度が高まりつつある競合分析ツールです。 機能の一部が無料で使えるのがかなり助かりますね。 無料登録で取得できる指標はざっと下記の通り。 自社サイトと競合サイトの
制作時に欠かせないリセット用のCSS、ページのグリッドやレイアウト・コンポーネントが用意されたフレームワーク、クリック・タップやホバーやスクロールを楽しませるアニメーション、モバイルにもフレンドリーなCSSでつくられたアイコンなど、ゼロから用意するのはかなり大変なCSSの便利なフレームワークを紹介します。 リセット用のCSSはこの3種類 レスポンシブ対応の定番フレームワーク Material Designに対応したフレームワーク さまざまなアニメーションが簡単に実装できるCSS かわいいアニメーションを使ったローダー 使いやすいアイコンフォント・Pure CSSのアイコン リセット用のCSSはこの3種類 HTMLの各要素のブラウザごとに異なる差異をなくし、意図した通りに実装できるようスタイルをリセットするスタイルシート。 Reset CSS 2.0 HTMLの各要素のmarginやpadd
第1回 IT管理者も知っておきたいGoogleアナリティクスの概要:Googleアナリティクス入門(1/2 ページ) 今やWebページも企業の「顔」の一つとなっている。その「顔」が十分に活用されているのか、確認するにはアクセス分析が効果的だ。しかし、具体的にはどうすればよいのか。本連載では、分析ツールとして広く利用されているGoogleアナリティクスの概要と、代表的なアクセス分析の方法について解説していく。 連載目次 ビジネスにおけるWebの重要性とデータ分析 今やほとんどの企業が企業情報などをWebサイトで提供しており、多くの人がその企業について調べる際に参考にしている。つまり、Webサイトが企業の一つの「顔」となっているわけだ。オンラインショッピングサイト(ECサイト)やWebコンテンツサイトでは以前からアクセスログを解析することで、Webサイトの使い勝手を向上させて、業績を伸ばす努力
4月21日、Googleがモバイルフレンドリーアップデートを行いました。これは、モバイル版の検索結果において、スマートフォンで見やすく使いやすいページの掲載順位を上げるというもの。 つまり、「PCだけに対応したページだと、モバイル版の検索結果で掲載順位が大きく下がる可能性がある」という恐ろしいものなんです。 これだけ大きなアップデートですから、サイト運営者にとっては疑問点も多いはず。そんな人のために、Googleがよくある質問に回答してくれているんです。 そこで今回は、Q&Aページから特に重要と思ったものを紹介します。モバイル端末での上位表示を狙うためにも必ず見ておきましょう。 1 タブレットやパソコンからの検索には影響しないまずは、モバイル端末以外からのアクセスの掲載順位は影響を受けるか?という質問に対しての回答。 いいえ。今回のアップデートは、タブレットやパソコンからの検索には影響しま
こんにちは、内藤です。 モバイルフレンドリー対応の連載、第2回目です。今回は、GoogleとAppleの推奨するフォントについて調べたので、それをお伝えしたいと思います! とはいえ、ウェブ制作をされている方ならご存知の方は多いと思いますので、今回はさらっとおさらいしていただければと思います。 <SINAP モバイルフレンドリー対応 連載> 第1回:「スマホで読まれる文章とは?」 第2回:「GoogleとAppleの推奨フォントは?」 第3回:「スマホサイトで指定すべき最適なフォントサイズとは?」 第4回:「スマホサイトの「続きを読む」は必要か?」 第5回:「スマホで読まれる文字数は?」 第6回:「記事をページ分割するメリット・デメリット」 それでは第2回、いってみましょう。 フォントの設計にある程度の正解は存在する ウェブは誰のものでもないので、良くも悪くも「このルールに従って作りなさい」
黒背景でハイライト表示!デベロッパーツール用のテーマが拡張機能として利用可能!うぉぉ!こんな拡張機能があったなんて、もっと早く知りたかった!と思う人が続出しそう(?)ですが、Google Chromeのデベロッパーツールを物凄く見やすい配色に変更するテーマファイルのChrome拡張機能を試してみました! 今回試してみた拡張機能は「DevTools Theme: Zero Dark Matrix - Chrome ウェブストア」という拡張機能。同様のデベロッパーツールのテーマを変更する拡張機能は他にもありますが、配色の違いなので好みで選択するのが良さそうです。 下記の画像が通常のデベロッパーツールを開いた画面。コードはハイライトされていますが、白背景だと見づらいです。 そこで「DevTools Theme: Zero Dark Matrix - Chrome ウェブストア」を利用すると以下の
クラウド利用が拡大しているが、なにか誤解がないだろうか? クラウドサービスの利用が拡大している。企業の間でも、クラウドを前提にシステムを設計、運用する考え方は当たり前になりつつある。そんななか、レンタルサーバやVPSといったサービスの存在が"クラウド"というキーワードによって、埋もれがちになっている。しかし誤解しないでほしい。これらのサービスは決してニーズが減少したわけではなく、今でもしっかりとユーザーがいるし、新サービスもローンチされ続けている。 なかには、今までのレンタルサーバでは実現できなかったことが可能になるような進化を遂げているものもある。さくらインターネットが2月から提供を開始した「SNI SSL」もその1つだ。 さくらがSNI SSLに対応したことで、レンタルサーバの使い勝手とSSLの適用範囲は大きく広がった。SSLに関しての利便性はクラウドに匹敵すると言っても過言ではないだ
CSS Flexboxとは水平または垂直に要素を配置し、柔軟なレイアウトを実現できるCSSのレイアウトモジュールです。複雑なレイアウトでも今までより少ないコードで、よりシンプルなプロセスで実装することができます。 CSS Flexboxの基礎知識、Flexboxの各プロパティがどのように機能するのか、Flexboxでどのようにレイアウトを実装するかを視覚的に解説します。 【アップデート: 2022年6月16日】 IEがサポート終了したことにあわせて、修正しました。 【アップデート: 2021年8月1日】 Flexboxの解説を2021年の現状にあわせて、修正しました。 【アップデート: 2020年8月23日】 Flexboxの解説を2020年の現状にあわせて、修正しました。 【アップデート: 2019年3月27日】 Flexboxの解説を2019年の現状にあわせて、修正しました。 【アップ
2017年9月22日 Webサイト制作, 便利ツール Webサイトの制作時に、特に初心者さんが設置を忘れがちなファビコン。Webサイトをブックマークした際や、タブ表示した際にサイト名の横にちょこんと表示されている小さなアイコンのことです(Favourite + Icon = Favicon)。デバイスが増え、これまでとは設置方法が少し変わってきているのと、機能のついたファビコンも増えてきているので、その辺もあわせて紹介します! ↑私が10年以上利用している会計ソフト! ファビコンをデザインする ファビコンは16×16ピクセルとかなり小さいながらも、その存在は偉大です。複数のタブを開いている時や、ブックマークリストの中から、ひと目見てどのサイトか区別できるからです。 多くの場合、そのWebサイトのロゴマークを縮めたり、簡略化したものがファビコンデザインとして採用されています。CHANEL、A
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く