週刊Webテク通信
2020年10月第1週号 1位は,ハンバーガーメニューのエンゲージメントを高める方法,気になるネタは,アマゾンがEcho Dotを球体に再設計,キッズ版に動物のデザインと読書機能を追加
ネットで見かけたWebテク
1. Secrets to High Engagement on Hamburger Menushttps:// uxmovement. com/ navigation/ secrets-to-high-engagement-on-hamburger-menus/
ハンバーガーメニューのエンゲージメントを高める方法を解説した記事です。
以下に概要をまとめました。
- ハンバーガーメニューに
「メニュー」 とラベルをつけてもそれほど効果はない - ユーザーが求めているものと
「メニュー」 という言葉は一致しないから - メニュー内の項目をカテゴリーにグループ化して,
カテゴリへのリンクをメニューバーに配置する - そのカテゴリへのリンクをクリックするとハンバーガーメニューが開くようにする
- モバイル画面の場合はカテゴリへのリンクをメニューバーの下の段に配置する
2. Successful Design Handoffhttps:// blog. plantapp. io/ post/ successful-design-handoff
デザインのハンドオフ
プロセスごとのヒントと使用ツールについて解説しています。
- モックアップとレイヤー
- コンポーネントとアセット
- プロトタイプとインタラクション
- 文章と文脈
- 空の状態と限界ギリギリの状態
3. 10 useful HTML5 features, you may not be usinghttps:// blog. greenroots. info/ 10-useful-html5-features-you-may-not-be-using-ckdua7ql300l1m3s1ez7teshc
あまり使われていないけど便利なHTML5のタグと,
- details
- contenteditable
- map
- mark
- data-* attribute
- output
- datalist
- range
(slider) - meter
- inputタグで使われる属性
4. BGJar | Free svg background image generator for your websiteshttps:// bgjar. com/
SVGでの背景ジェネレーターです。ベースになるものを選んで,
SVGファイルでダウンロードするか,
5. Web Design Inspiration | Discover the Best Website Designshttps:// www. reallygoodstores. com/
お店のサイトのギャラリーです。カテゴリごとに絞り込むことができます。
Shopify,
そのほか,
- PDFをスマホでも見やすく--アドビ,
AIでレイアウト調整する 「Liquid Mode」 を発表 - CNET Japan
iOSとAndroidのAcrobat Readerアプリに搭載され,今後デスクトップ版とブラウザ版にも追加されるそうです - Twitter,
「リンク先を読んでからRTして」 表示を全ユーザーに拡大へ - ITmedia NEWS
一部の利用者でテストしたところ,この警告を入れることで記事を開くユーザーが増えたそうです - ブログを手で書く
「てがきはてなブログ」 登場 iPadに最適化 - ITmedia NEWS
マウスでも書けますが,iPad + Apple Pencilに最適化しています
先週の気になるWebサービス
SendFileOnline | Share file with 6 digit code for freehttps:// sendfileonline. com/
SendFileOnlineはユーザー登録不要で使えるファイル転送サービスです。6桁のコードで共有できるのが特徴です。
1GBまでのファイルをアップロードできて,
コードは6桁でも,
今週の気になるWebネタ
アマゾンがEcho Dotを球体に再設計, キッズ版に動物のデザインと読書機能を追加 | TechCrunch Japanhttps:// jp. techcrunch. com/ 2020/ 09/ 25/ 2020-09-24-amazon-redesigns-echo-dot-as-a-sphere-adds-animal-designs-and-reading-feature-for-kids-edition/
Amazonがスマートスピーカー
Echo Dot Kids Editionは動物のキャラクターが施されたデザインで,
かわいいデザインのスマートスピーカーといえば,
バックナンバー
週刊Webテク通信
- 2020年10月第5週号 1位は,CSSグリッドの完全版チュートリアル,気になるネタは,AdobeがiPad用IllustratorとiPhone用Frescoをリリース
- 2020年10月第4週号 1位は,UIデザインのためのユーザビリティの経験則10選,気になるネタは,グーグル検索,気になる曲をハミングすると曲名を教えてくれる新機能
- 2020年10月第3週号 1位は,フッターデザインの実例を多数紹介,気になるネタは,ドコモ,「iモード公式サイト」を2021年11月末に終了へ
- 2020年10月第2週号 1位は,UIデザインの危険なトレンド,気になるネタは,Hameeが小学生向け“プレスマホ”を発表 月額1000円で1GB,Google Playにも対応
- 2020年10月第1週号 1位は,ハンバーガーメニューのエンゲージメントを高める方法,気になるネタは,アマゾンがEcho Dotを球体に再設計,キッズ版に動物のデザインと読書機能を追加
関連記事
- 2021年4月第2週号 1位は,コンポーネントをまとめたギャラリーサイト,気になるネタは,DiscordがClubhouseのような音声イベント用チャンネルの提供を開始
- 2021年3月第3週号 1位は,新しいWebデザインのトレンド「オーロラUI」,気になるネタは,Appleが初代HomePodの販売を終了,好評のminiに注力
- 2021年2月第3週号 1位は,ソーシャルメディアでのビジュアル戦略,気になるネタは,マイクロソフト,Pinterest買収を検討か
- 2020年8月第3週号 1位は,ユーザー体験を向上させるCSSアニメーションについて,気になるネタは,「顔が明るく見えるライトや壁紙を購入」――“オンライン映え”気にするのは20代男性? 賢く見えるよう本の購入も
- 2020年7月第1週号 1位は,カード型UIをデザインするためのヒント,気になるネタは,モバイル版「Googleフォト」大幅刷新 検索しやすく,マップ連携表示が可能に