タグ

htmlに関するdiv1のブックマーク (17)

  • HTMLメール作成で調べたことまとめ - Qiita

    文字コードはiso-2022-jpが一般的にメーラーで使われてるもの iso-2022-jpで書き出したものをブラウザで開くと文字化けするので、確認用などでhtmlを書き出すときはcharsetをUTF-8で編集してメール用に忘れないようにiso-2022-jpに戻すといい 各メールクライアントのhtml送信方法(調べたものだけ) お客様にメール送信方法を聞かれた時の参考 AirMail Betaはメール作成画面を開いてhtmlモードで貼り付けるだけ 背景画像や背景色ががなければ書き出したhtmlをブラウザで開き、全て選択してコピーするとbody以下のスタイルを保持してクリップボードにコピーされるのでhtmlモードの状態で貼り付ければ使える 例えばPCのgmail(web)の場合、作成 → 右下の三角 → プレーンテキストモードのチェックを外す → 文に貼り付ける 参考になったもの Th

    HTMLメール作成で調べたことまとめ - Qiita
  • SEO対策として最低限押さえておきたいHTML/HTML5マークアップの大事な6つのポイント

    検索エンジンがページ構造を理解しやすいようにHTMLがマークアップされていることは、安定的に検索結果上位にインデックスされるために重要な要素の1つです。 当然のことながら、前提として検索キーワードを想定した質の高いコンテンツ作成が必要です。せっかく質の高いコンテンツを作成してもマークアップの仕方が論理的に間違っていると台無しです。 今回はSEO対策として押さえておいてほしいHTMLおよびHTML5マークアップの最低限のポイントについてお話しします。 この記事では自力でSEOに最適なマークアップをする方法を紹介していますが、はじめからSEO対策がばっちりなWordPressテーマを使えば、なにもしなくても良いのでとてもラクです。SEO対策が万全のWordPressテーマは下記で紹介しています。 WordPressのおすすめテーマはコレ!SEOもレスポンブも完璧【有料&無料】 headタグ内の

    SEO対策として最低限押さえておきたいHTML/HTML5マークアップの大事な6つのポイント
    div1
    div1 2016/10/08
  • README.ja.md#%E5%8F%AF%E8%83%BD%E3%81%AA%E3%82%89%E3%81%B0for%E5%B1%9E%E6%80%A7%E3%81%AF%E7%9C%81%E7%95%A5%E3%81%99%E3%82%8B

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

    README.ja.md#%E5%8F%AF%E8%83%BD%E3%81%AA%E3%82%89%E3%81%B0for%E5%B1%9E%E6%80%A7%E3%81%AF%E7%9C%81%E7%95%A5%E3%81%99%E3%82%8B
    div1
    div1 2016/09/30
  • シンプルなHTMLとCSSコピペで実装できるタイトル(見出し)のデザインサンプル 50 | NxWorld

    画像は使用せずにCSSだけでスタイリングしたタイトル(見出し)のデザインサンプルで、似たようなものやちょっとCSS追記した程度のものも多いですが全50種類です。 全体的にすごく手間がかかっているようなものはないのですが、似たようなタイトルデザインを使う場合はCSSコピペで実装できると思います。 また、一部複数行に向かないものもありますが、基的には複数行のタイトルでも見栄えが崩れない感じのものになっており、余白やカラーなどを調整することでデザインを変更するのも容易です。 以下で紹介している内容は一部異なるものもありますが、基的に下記のようなシンプルなHTMLを使用しています。 ただ、一部異なるものといってもいずれもspan要素を1つ追記する程度です。

    シンプルなHTMLとCSSコピペで実装できるタイトル(見出し)のデザインサンプル 50 | NxWorld
    div1
    div1 2015/12/22
  • コーディング中のクラス名で迷いたくない!よく見るコンポーネントの名前17選 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 コーディングをしていて、クラス名に迷うことってありませんか? ボタンや見出しといった、比較的単純なコンポーネントなら「.button」「.headline」など、すぐに思いつくかもしれません。 しかし、それが複雑なコンポーネントだったりすると、なかなか思いつかないものです。 そんな悩みを解消したいと思いまして、いろいろなサイトのソースコードを見て、開発者がどんなクラス名をつけているのか調査してみました。 今回は、その中からよく使われていたクラス名と、「これはナイスネーミング!」と思ったクラス名をピックアップしたいと思います。 thumbnail サムネイル画像。 アイキャッチ画像やギャラリーページの画像一覧などで用いられます。 avatar ユーザのアバター画像。 Webサービスのユーザ情報ページや、ブ

    コーディング中のクラス名で迷いたくない!よく見るコンポーネントの名前17選 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
    div1
    div1 2015/12/20
  • 個人的に使ってるtableの日本地図をjQueryで叩く

    CSSはこちら。特に変わったことはしていません。CSS3はtext-shadowとtransitionです。これは必須という訳ではないですね。 #map1 a{ font-size: 14px; color: #666; text-decoration: none; text-shadow: rgba(255,255,255,0.6) -1px 1px 0; } #map1 td{ padding: 6px 3px; text-align: center; } #map1 td.frame{ padding: 0; width: 20px; height: 10px; } #map1 td.land{ background-color: #eef2bf; } #map1 td.sea{ background-color: #f0f9ff; } #map1 td.selected{ back

    個人的に使ってるtableの日本地図をjQueryで叩く
    div1
    div1 2014/03/07
  • KataPad.com is for sale | HugeDomains

    KataPad.com This domain is for sale Fill out the form on the rightbelow. One of our domain experts will email you a price within 24 hours.

    KataPad.com is for sale | HugeDomains
  • Alpha-3 codes arranged alphabetically by English name of Language - Codes for the representation of names of languages (Library of Congress)

    Codes for the Representation of Names of Languages Alpha-3 codes arranged alphabetically by the English name of language Note: ISO 639-2 is the alpha-3 code. Where two codes are provided (21 languages total), the bibliographic code is given first and the terminology code is given second. ISO 639-1 is the alpha-2 code. Multiple codes for the same language are to be considered synonyms. English Name

    div1
    div1 2010/08/16
  • HTMLのテーブルをエクセルに変換するテクニック - railtownの日記

    今日はとっておきの裏技をお教えします。 知ってる人は知ってると思いますが、知らない人も結構多いんじゃないでしょうか。ウェブ関係の仕事をしてる人は覚えておいてソンはないと思います。 内容はいたって簡単。まずは<table>タグを使ってHTMLを作ります。たとえばこんな感じ。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>table test</title> </head> <body> <table border="1"> <tr> <th>名前</th> <th>誕生日</th> </tr> <tr> <td>長島茂雄</td> <td>1936/2/20</td> </tr> <tr> <td>星野仙一</td> <td>1947/1/22</td>

    HTMLのテーブルをエクセルに変換するテクニック - railtownの日記
  • http://www.dxdec.com/wod/formstyle/index.html

  • とっても使えるoverflowプロパティ。その使い方色々。

    光の4戦士を買ったんすが、売り文句通りレトロな感じがしていいですね。 まぁまだ2, 3時間程度しかやってないんで、これからどうなるか分かりませんが時間を見つけてやって行こうかと。 さて、以前からoverflowプロパティは使い勝手が良いというか、使う場面が多いプロパティの一つですが、考えてみると色んな事に使ってるなぁ~と思ったので自分が良く使うのをまとめてみました。 あんまoverflowプロパティを使った事が無い方は、ビックリですよ! これで、ソコの可愛いアナタもoverflowプロパティの虜になる事間違い無し!!(わかんないけど サンプルとかは以下よりどうぞ。 サンプルサイトを見る サンプルをダウンロード 基的に、全てoverflow: hidden; の指定を足す事で解決したり実現出来る感じです。 01 clearfixみたいに使う まずは以前の「clearfixを使わないでやるに

    とっても使えるoverflowプロパティ。その使い方色々。
    div1
    div1 2009/11/02
  • HTML5 を学ぶための情報源まとめ

    ちょっと更新サボりすぎでしたが、最近 HTML5 関連の話もとっても増えてきましたので、ここらで HTML5 に関する情報を集めるときに情報源として有益なサイトをまとめてみたいと思います。やはり、英語での情報が多くなってしまうので、英語能力が残念な私なんかは結構厳しいんですが、いくつか日語での情報源も挙げてみましたので、併せて見ておくといいと思います。 ちょっと更新サボりすぎでしたが、最近 HTML5 関連の話もとっても増えてきましたので、ここらで HTML5 に関する情報を集めるときに情報源として有益なサイトをまとめてみたいと思います。 やはり、英語での情報が多くなってしまうので、英語能力が残念な私なんかは結構厳しいんですが、いくつか日語での情報源も挙げてみましたので、併せて見ておくといいと思います。 ちなみに、XHTML 好きな私としては、XHTML5 で次のサイトリニューアルとか

    HTML5 を学ぶための情報源まとめ
  • 携帯サイト(html)の制作に入る前に確認しておきたいチェック項目 │ これからゆっくり考L +α

    「デザインは素敵なんだけど、携帯でこれはちょっとできないなー」とか、「無理ではないけどできれば避けておいた方がいいよなー」っていうデザインがあがってくることが多い今日この頃。 モバイルコーディングをやり慣れている人じゃないとモバイルでできることできないこと、cssを使わないと実現できないこと、table使わないと実現できないこと、などが分かりにくいと思うので当然だとは思うのですが。 ですが、知っているのと知らないのとでは工数がかなり違ってきます。 一旦デザインして、コーダーにそれを見せて「ココとココとココは実現不可能。やり直してください。」で差し戻され、デザインをやり直してってなると、デザインも2度手間、デザインをチェックして無理な項目を洗い出すコーダーにも余計な手間がかかります。 今回洗いだした項目は、なんせ自分がコーダーなので、コーダーがデザインファイルをもらった時にバーッと見てチェッ

  • 「HTML 5が開くWebアプリケーションの隆盛──前編」 by. 小川 浩 - MdN Design Interactive

    HTML 5が開くWebアプリケーションの隆盛──前編」 2009年10月13日 TEXT:小川 浩 (株式会社モディファイ CEO 兼クリエイティブディレクター) Googleが発表したiPhone用乗換案内のWebアプリの衝撃 2009年10月5日、Googleが発表したiPhoneGoogleマップの乗換案内サービスは、App Store経由でダウンロードするものではなく、Safari上で動く、純然たるWebアプリなのだが、その動きたるやネイティブのクライアントアプリに匹敵する素晴らしいものだった。 マスメディア的にはあまり大きく取り上げられることはなかったこのアプリだが、実はWeb2.0のムーブメントから始まった、すべてのアプリケーションがWeb上に置かれていくという流れがいよいよiPhoneにも達しつつあることを示す、非常にエポックメイキングな事件であったと筆者は考えている。

  • HTML5.JP - 次世代HTML標準 HTML5情報サイト

    HTML5.JP は、HTML5 の国内での普及を目指し、2007 年に個人プロジェクトとして運営が開始されました。2019 年現在、すでに HTML5 は当たり前のように活用され、多くの情報がネットから入手することができるようになりました。 当サイトの役割は終えたことに加え、当サイトの更新もままならず情報も古いままであったことから、当サイトを閉鎖することにいたしました。これまで当サイトをご支援頂きました皆様には心より御礼申し上げます。 2019 年 8 月 15 日 管理人より

  • 30分でできる!Webサイトを高速化する6大原則 (1/4)

    Webサイトを制作するとき、「パフォーマンス」を気にしたことがあるだろうか? もしまったく気にしたことがないなら、気をつけた方がいい。閲覧に時間のかかる“遅いWebサイト”はユーザーにフラストレーションを与え、閲覧をやめさせてしまう恐れがある。 下記のグラフは、「Simple-Talk」という海外のオンラインメディアで発表されたユーザー調査の結果だ。アンケートページの表示にかかる時間を意図的にコントロールし、表示時間によってユーザーが感じるフラストレーションの違いを調べたものだ。 縦軸がフラストレーション(10段階)、横軸が表示までの時間を表している。1~5秒以内にページが表示された人に比べ、ページ表示までに5秒以上かかった人は2倍以上もフラストレーションを感じている。フラストレーションがあまりに高ければ、せっかく何らかの目的を持って訪れてきたユーザーも待ち切れずにブラウザーを閉じてしまう

    30分でできる!Webサイトを高速化する6大原則 (1/4)
    div1
    div1 2009/09/10
    Webサイトの高速化
  • ウノウラボ Unoh Labs: 携帯サイト作成時のXHTMLでの相違点

    GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー!古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠

    ウノウラボ Unoh Labs: 携帯サイト作成時のXHTMLでの相違点
  • 1