webサイトにルーラー(定規)やガイド線を出すブックマークレット

webサイトのサイズ設計や、解析に役立つブックマークレットをご紹介します。

「Rule」→Allan Jardine | Reflections | Rule

使い方は非常に簡単です。手順は

  1. Allan Jardine | Reflections | RuleにあるRuleアイコンをブックマークバーにドラッグ(またはブックマークに追加)
  2. 任意のwebページを表示
  3. ブックマークバー(またはブックマーク)から、追加した「Rule」を実行

対応ブラウザ

  • Internet Explorer 7
  • Firefox 2+
  • Safari 2.0.4+
  • Opera 9.2

これでブラウザ上にルーラーとガイド線を表示することが出来ます。ガイド線は、PhotohopやFireworksのようにルーラー上からドラッグします。
また、設定によりガイド線を吸着させることが出来ます。この吸着が地味に便利です。

001
Allan Jardine | Reflections | Ruleのサイトで、「Rule」のボタン部分をブックマークバーへ。

002
「Rule」をクリック。

003
「?」をクリックすると、設定画面が現れます。ここでルーラーやガイドの色を変更できるほかSnapの項目をクリックして「Enabled」にすると、ガイドが要素に吸着します。

004
要素名やIDも表示が可能。

Jimdo

オススメ書籍

10日でSEO&アクセスアップ Jimdoデザインブック

かっこいいだけではなく、人が集まるホームページを作る!

「Jimdo」(ジンドゥー)でのホームページの作成方法と運用方法を解説した書籍。解説記事を順番に読み進めて行くことで、Jimdoを使ったホームページの作成・運用・宣伝・集客の基本を、10日間で習得するのが本書のコンセプトです。12章構成の解説の中で、Jimdoの基本操作とホームページの作成、デザインとコンテンツ(内容)のレベルアップ、そしてSEOやリスティング広告を含む宣伝・集客の基本を解説しています。

1 個のコメント

  • おお、これは使い勝手が良いですね!
    情報ありがとうございます。
    さっそく、活用してみます。

  • コメントを残す

    メールアドレスが公開されることはありません。

    CAPTCHA


    ABOUTこの記事をかいた人

    株式会社マジカルリミックス 代表取締役CEO/JimdoExpert 宮城県出身。コンピューター系の専門学校を卒業後、仙台のデザイン会社に入社。 Webサイトのデザイン・コーディングをはじめとし、各種デジタルメディアのデザインに従事。2002年退職後すぐにマジカルリミックスを創業。2007年に法人化で株式会社マジカルリミックスを設立。Webサイト運用に関するコンサルティング、社内向けITトレーニング、セミナー出演、執筆など。2005年から仙台の専門学校で、非常勤講師としてWeb制作講義を担当。 主な著書に『10日で作るかっこいいホームページ Jimdo(ジンドゥー)デザインブック』(エムディエヌコーポレーション)『HTML5+CSS3の新しい教科書 基礎から覚える、深く理解できる。』(共著、同)『基礎から覚える、深く理解できる。Webデザインの新しい教科書』(同)。