タグ

ブックマーク / zenn.dev/tak_dcxi (3)

  • 「SEOに強いHTMLの書き方」についての個人的な見解

    SEO に強い HTML の書き方」というツイートがそこそこバズっていて、その内容に対して駆け出しエンジニアの方たちが「参考になった」などと称賛の声を挙げていたのを見かけて思うところがあったのでこの記事を書きました。 元ツイの概要は次の通り。 body > main > article > sectionに h1は 1 ページに 1 つ(要キーワード) 見出しタグは毎度 section で囲む ヘッダーメニューは nav で囲む 画像に適切な alt を設定する title / description を書く 階層を意識して書く div はあまり使わない 画像は p で囲む この記事は元ツイおよび元ツイの投稿者を批判する意図で書いたものではなく、あくまで挙げられている内容に対する個人的見解をまとめたものです。 正しいか正しくないかをそれぞれの項目のはじめに書いていますが、あくまで僕個人の

    「SEOに強いHTMLの書き方」についての個人的な見解
    nicht-sein
    nicht-sein 2021/02/05
    "大切なのは、誰かが発信した情報を思考停止で鵜呑みにするのではなく、自分で理解を深めようとアクションを起こすこと"大事だけどすべての情報についてそれを実践するにはちょっと重いんだよねぇ……
  • iPhone 12系統のレスポンシブ対応のメモ書き

    今朝発表されたiPhone 12系統のレスポンシブ対応についてのメモ書き。取り急ぎ。 12 Pro Max 👉 428px (3x) PlusシリーズやXR,11,11 Maxの414pxよりも14px広い。 12 / 12 Pro 👉 390px (3x) 6〜8、Xや11 Proの375pxよりも15px広い。 12 mini 👉 360px (3x) ただし、miniの場合は375pxで描写してスケーリング表示するらしい? とは言え、Androidのデバイスの多くは360pxなのでiPhone 12 miniの描写サイズが375pxだろうが360pxだろうが関係なかったりします。 横幅360pxでしっかり表示されていることは必須条件です。 追記1:これからも4インチ(320px)を意識する必要はあるのか? 個人的見解ですが、あります。 理由としてはiPadのSlide Over

    iPhone 12系統のレスポンシブ対応のメモ書き
    nicht-sein
    nicht-sein 2020/10/15
    webでピクセルパーフェクトは厳しくない???
  • iOSでも100vhをいい具合に調整して画面の高さいっぱいに要素を表示させる

    TAK(@tak_dcxi)です。今回もCSSに関する投稿です。 以前このようなツイートをしました。 メインビジュアルなど、画面いっぱいに要素を表示するためにheightやmin-heightに100vhを指定する。そして、iOSで表示確認した時に以下のような問題が起こるわけです…。 iOSのSafariでの100vhが気にわない問題 iOSのSafariでは100vhの計算にアドレスバーが考慮されていないため、アドレスバー分押し出されて格好悪く表示されます。ちなみにiOSのGoogle Chromeは中身SafariなのであれもSafariです。 この問題に立ち向かうために、実装者はJavaScriptを利用して高さを指定したり、height: 100%;のバケツリレーを行ってアドレスバーまで考慮した画面いっぱいの表示を実現するために頑張ってきたわけです。 そんな中、先程のツイートから

    iOSでも100vhをいい具合に調整して画面の高さいっぱいに要素を表示させる
    nicht-sein
    nicht-sein 2020/10/04
    というか、これはIE滅びろ案件ではなくvhにアドレスバーを考慮しないSafari修正しろ案件なのでは疑惑。最近はSafariが非対応っていうのが増えてきた気がする。いや、Google先走り過ぎも否定できないけどねw
  • 1