決定版Adobe museにおけるアンカー正しい配置
からすweb工房と化している僕のところに muse のアンカーがうまく動かないということで相談がきたのでAdobe museのアンカーの設定に関して書いておきます。
ちなみにアンカーの使い方に関してはいろいろなホームページ（笑う）に紹介されていますがかなりの確率で内容が間違っていておもしろいことになっています。
このブログでは最も適切なアンカーの使い方を紹介します。
どんな動きをするの？
アンカーという言葉だけで動きがわかる人はたぶんウェッブデザインに慣れている人やコーダーでしょう。
Adobeのソフトを使うデザイナー系の人には動きがわからないと思うので説明しておきます。
アンカーは同じページの中のどこかの位置に移動したい時によく使われるもので、こんな感じです。
このブログは動きついていませんがmuseだと滑らかに自動上下スクロールしてくれるようです。
ちなみにほかのページの特定の行に移動したい場合にも使えます。
最近は特に1ページ構成のサイトで有効なようです。
トップに戻るとかページ上部に戻るとかそういうので使えます。
で、今回の相談ではアンカーへのリンクを押すと真っすぐ下がらずズレてしまうというものでした。
どうやってやるの？
ここからが本題です。
museでアンカー設置する方法はAdobeにも書かれているのですが細かい部分が説明されていません。
他のホームページ（笑う）にもある程度書かれていますが間違っています。
１.アンカーボタンを押してアンカーを設置する
この画面の場合は左にある⚓（錨のマーク）を押すとアンカーが設置できます。
で、いろんなサイトにある通りに設置するとこうなると思います。
今回の質問でもアンカーは真ん中に設置されていました。先ほどの解説ホームページでもアンカーの位置には言及していません。
で、こんなことされると動きはこうなります。
なんか失敗していますね。
こうなっちゃう理由は単純でアンカーを中央に設置しているからです。
なぜこんな勘違いが生まれてしまうかというとなぜかどのホームページでもアンカーの設置位置の説明が無いからです。
他にもフォーラムのここで嘘が説明されています。というか主にこいつらのせいです。
museのバグみたいな意見やアンカー中央が正しいといった頓珍漢な意見が余計に混乱を招いているようです。
正しい動き
アンカーに関しては設置している場所の左上が画面の左上と重なるように移動します。
サイトの中央にアンカーを置いたら画面の左端にサイト中央が来るように移動していきます。
特にスマホ画面や拡大表示時に変な動きになります。
つまり、正しくはこう
アンカーは左端に設置しなければなりません。
するとこう動きます。
殆どの人が想像する好ましい動きはこれではないでしょうか。
ページ内スクロールが中央からずれて右に動いたり左に動いたりする人はこれを参考にアンカー左端に設置してください。
このmuse、webの知識とadobeの知識があれば簡単みたいですがどちらかが欠けていると情報が少なく大変な部分があるようです。
大変ですね。