タグ head
人気順 5 users 10 users 100 users 500 users 1000 users2023年最新版: HTMLのheadの書き方、head内に記述する要素の総まとめ
2023/01/25
460 users
elements
head内
HTML
要素
総まとめ
HTMLページのhead内に記述する最小限の構成、そしてmeta要素やlink要素、ソーシャルサービス用の要素、デスクトップ・スマホのブラウザ用の要素などがまとめられた「HEAD」を紹介します。 HEAD: A simple guide to HTML <head> elements 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にラ... 続きを読む
Slackはハイライト部分をU+E000とU+E001で囲って表していそう - hogashi.*
2022/10/06
164 users
hogashi
Description
Glitch
Slack は、メッセージのどこからどこまでハイライトするかを、 Unicode の私用領域 *1の U+E000 と U+E001 を使って表しているらしく、こういう HTML を glitch とかで書いて、 <html> <head> <meta property="og:title" content="Slackでタイトルをハイライトする" /> <meta property="og:description"... 続きを読む
head内でパフォーマンスの問題がある箇所、Webページのレンダリングを妨げる要因を明らかにするCSS
2021/10/01
218 users
レンダリング
CSS
head内
要因
箇所
Webページのレンダリングを妨げる要因、<head>タグ内でレンダリングをブロックしているCSSやJavaScript、サードパーティーのリソースなどを表示して、どこを修正すればよいか教えてくれるCSSのスニペットを紹介します。 ちなみに下記のグリーンは問題なし、レッドはエラーで対応が必要、オレンジは特定のシナリオで問題... 続きを読む
ネイティブコンパイルEmacsの登場 | 日々、とんは語る。
2021/04/28
178 users
ネイティブコンパイルEmacs
emacs
feature
日本時間の2021年4月26日午前3時6分、Emacsのmasterブランチにfeature/native-compブランチがマージされました（コミット：Merge branch ‘feature/native-comp’ into into trunk）。これにより、HEADのEmacsをビルドすると、Native compilation機能を兼ね備えたネイティブコンパイルEmacs、通称Gcc Emacsが使えるように... 続きを読む
自作JSの読み込みはbodyの最後に書いたほうがいいのに、なんで外部ライブラリはheadにあるんでしょうか？ - Qiita
2019/05/11
116 users
jQuery
Qiita
Body
初歩
きっかけ
自作JSの読み込みはbodyの最後に書いたほうがいいのに、なんで外部ライブラリはheadにあるんでしょうか？ 調べるキッカケ 最近フロントエンドを触り出して、JQueryの勉強（初歩中の初歩）をしていたのですが、 「JSの読み込みはbodyの最後に」という決め事があるようで、ちょっと気持ち悪いので調べていました。 すこし... 続きを読む
[JS]実装が簡単！要素にclassを加えるだけでCSS3アニメーションを自在に使えるスクリプト -CSS3 Animate It | コリス
2019/01/28
149 users
コリス
class
stylesheet
スクリプト
Libs
アニメーションの一覧 CSS3 Animate Itの使い方 Step 1: 外部ファイル 当スタイルシートとスクリプトとjquery.jsを外部ファイルとして記述します。 <head> ... <link rel="stylesheet" href="css/animations.css" type="text/css"> </head> <body> ... <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jque... 続きを読む
朝日新聞 英語訳慰安婦報道訂正ページの検索避けをこっそり外す/朝日は他の謝罪訂正ページにnoindexを入れているのか調べてみました | 以下略ちゃんの逆襲 ツイッターGOGO
2018/08/23
311 users
noindex
robots
nofollow
Meta
朝日
朝日新聞が”noindex, nofollow, noarchive”のmetaタグを外す 朝日新聞が吉田清治の慰安婦報道訂正の英語訳記事htmlページの<head>～</head>内に、 <meta name=”robots” content=”noindex, nofollow, noarchive”></meta> を入れて、「検索避け」をしていた問題で、新たな動きがありました。 朝日新聞が慰安婦訂正記事だけ... 続きを読む
ジョージ・クルーニー、友達14人に1億円ずつプレゼント - シネマトゥデイ
2017/12/14
263 users
シネマトゥデイ
米MSNBC
ジョージ・クルーニー
ジョージ
ジョージ・クルーニーの友達になりたい - Anthony Harvey / Getty Images ジョージ・クルーニー が2013年、親しい友人14人に一人100万ドル（約1億1,000万円）ずつプレゼントしていたことが明らかになった。（1ドル110円計算） 【画像】美人妻とラブラブなジョージ・クルーニー これはジョージの長年の友人である事業家のランド・ガーバーが、米MSNBCの番組「Head... 続きを読む
HTMLページのhead内に記述する要素の総まとめ | コリス
2017/09/26
950 users
コリス
CheatSheet
meta要素
link要素
去年
HTMLページのhead内に記述する最小限の構成、そしてmeta要素やlink要素、ソーシャルサービス用の要素、デスクトップ・スマホのブラウザ用の要素などがまとめられた「<head> cheatsheet」を紹介します。 <head> cheatsheet 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 去年紹介した 以前の版 からいろ... 続きを読む
head内に記述する要素の総まとめ -meta要素、link要素、ソーシャルサービス用の要素、ブラウザやスマホアプリ用の要素など | コリス
2016/06/01
547 users
コリス
GitHub
link
meta要素
link要素
HTMLドキュメントのhead内に記述するmeta要素やlink要素、ソーシャルサービス用の要素、ブラウザ用の要素、スマホアプリ用の要素などをまとめた「HEAD」を紹介します。 HEAD -GitHub 翻訳するにあたりいくつか尋ねたところ、著者様はとてもいい人でした。 公開当初から内容がアップデートされ、ライセンスもCC0に変更されています。 オススメの最小限の構成 要素 meta要素 link... 続きを読む
HTML の <head>〜</head> 内に書くタグの順番にも気を遣いましょう。 - ONZE
2016/01/20
645 users
オンズ
HTML
順番
タグ
直感
ONZE - オンズ 茨城県つくば市を拠点に、ホームページ制作・デザイン制作を行っています。直感で「…！！」や「…？？」と感じたら、今すぐオンズにご相談ください。 今アナタがご覧になっている、このオンズのウェブサイトでは、読み込み速度のスピードアップや各種マークアップのクオリティ維持のために随時徹底した改善作業を行っています。 これまでも本ブログにて様々なテクニックを紹介してきましたが、今日は <... 続きを読む
[JS]レスポンシブ対応の使いやすいスライダーを探している人にオススメのスクリプト -wallop | コリス
2015/09/01
72 users
コリス
スライダー
stylesheet
rotate
アニメーションは他にも、slide, fade, rotateなどが利用できます。 wallopの使い方 Step 1: 外部ファイル 当スタイルシートとスクリプトを外部ファイルとして記述します。 <head> <link rel="stylesheet" href="path/to/wallop.css"> </head> <body> ... コンテンツ ... <script src="pa... 続きを読む
[CSS]レスポンシブ対応の賢いアイデア、自在に伸び縮みするカード型レイアウトを実装するスタイルシート -chewing grid | コリス
2015/08/25
93 users
コリス
チューイングガム
CSS
レスポンシブ対応
Step
テキストや画像や動画などをタイル状に配置する、レスポンシブ対応のカード型リストを実装できるCSSのグリッドを紹介します。 「chewing」の名の通り、表示サイズに合わせてチューイングガムのようにカードとグリッドが伸び縮みします。 デモはサイズの可変可能 chewing-grid.cssの使い方 Step 1: 外部ファイル 当スタイルシートを外部ファイルとして記述します。 <head> ... ... 続きを読む
git reset がわからない - Qiita
2015/07/24
68 users
Qiita
index
コミット
git reset
ステージ
git reset がわからないので図をかいた 以前のコミットへ戻るとき 現在の HEAD へ戻るとき メモ ステージ と index は同じもの unstage はステージから削除されるということ HEAD^ は HEAD の一つ前のコミット ローカルファイルをステージに上げて、ステージに上げたものをコミットする 続きを読む
[JS]縦長ページに実用性とデザイン性を兼ね備えたスクロールメニューを設置するスクリプト -ScrollMenu | コリス
2015/05/29
77 users
コリス
stylesheet
スクリプト
スクロールバー
デフォルトのスクロールバーも表示 ブラウザのデフォルトのスクロールバーを併用することも可能です。 ScrollMenuの使い方 Step 1: 外部ファイル 当スタイルシート・スクリプト、jquery.jsを外部ファイルとして記述します。 <head> ... <link rel="stylesheet" type="text/css" href="scrollmenu.css"> </head>... 続きを読む
実装は超簡単！デザインがかわいく、アニメーションもかわいいCSSで実装された軽量スピナー | コリス
2015/05/19
143 users
スピナー
コリス
Step
link rel
ローディング時
ページのローディング時によく使われる、デザインがかわいく、アニメーションもかわいいCSSで実装されたスピナーを紹介します。 divひとつのミニマルなHTMLで、簡単に実装できます。 スピナーの実装 実装は、簡単です。 「弾むボール」を例に、説明します。 Step 1: 外部ファイル 各スピナーに用意されているCSSファイルを外部ファイルとして記述します。 <head> ... <link rel=... 続きを読む
[JS]これは便利！YouTubeの動画をはじめ、VineやTEDやCodePenやツイートやPDFやGoogleマップまで簡単にページに埋め込めるスクリプト -Embed.js | コリス
2015/04/14
220 users
YouTube
CodePen
コリス
vine
TED
デモ：Googleマップ Googleマップもサポート。 Embed.jsの使い方 Step 1: 外部ファイル 当スクリプト・スタイルシートとjquery.jsを外部ファイルとして記述します。 <head> ... <link rel="stylesheet" href="path/to/jquery.embed.css"/> <script src="path/to/jquery.min.js... 続きを読む
[JS]スマホでもデスクトップでも快適！水平スクロールコンテンツを簡単に実装できるスクリプト -horizonScroll.js | コリス
2015/03/16
140 users
コリス
jQuery
jquery.js
Step
スクリプト
マークアップは非常にシンプル、スクリプトの設置も簡単、スマホでもタブレットでもデスクトップでもすいすい快適に操作できる水平スクロールコンテンツを実装できるjQueryのプラグインを紹介します。 デモのアニメーション horizonScroll.jsの使い方 Step 1: 外部ファイル 当スクリプトとjquery.jsを外部ファイルとして記述します。 <head> ... <script type... 続きを読む
Bootstrapをカスタマイズ！ページをスマホで表示した際に横からナビゲーションをスライドさせる -Bootstrap Offcanvas | コリス
2015/03/06
187 users
コリス
Bootstrap
Step
CSS
スクリプト
Bootstrapで実装したページをスマホなどの幅が狭いスクリーンで表示した際に、横からオフキャンバスのナビゲーションをアニメーションでスライド表示させるJSとCSSのパックを紹介します。 Off Canvas -Bootstrap Bootstrap Offcanvasの使い方 Step 1: 外部ファイル 当スタイルシートとスクリプトを外部ファイルとして記述します。 <head> ... <l... 続きを読む
[JS]簡単で楽ちん！さまざまなタブコンテンツをシンプルなHTMLで実装できる軽量スクリプト -PWS Tabs | コリス
2015/01/26
64 users
コリス
jquery.js
code.jquery.com
デモページ: Tabs Position: Vertical Left タブを配置する場所もオプションで簡単に変更できます。 PWS Tabsの使い方 Step 1: 外部ファイル 当スクリプト・スタイルシートとjquery.jsを外部ファイルとして記述します。 <head> ... <script src="//code.jquery.com/jquery-1.11.2.min.js"></sc... 続きを読む
[JS]縦長ページでデスクトップでもスマホでもデザインの邪魔をしないナビゲーションを実装するスクリプト -MenuItems | コリス
2014/12/09
70 users
コリス
stylesheet
スクリプト
ナビゲーション
邪魔
タップするとナビゲーションがスライド。 MenuItemsの使い方 Step 1: 外部ファイル 当スクリプトとスタイルシート、jquery.jsを外部ファイルとして記述します。 <head> ... <link rel="stylesheet" href="menuitems/menuitems.min.css" /> </head> <body> ... コンテンツ ... <script s... 続きを読む
[JS]フォームのさまざまなエレメントを異なるブラウザ・スクリーンで同じように美しく表示させるスクリプト -Formplate | コリス
2014/11/26
54 users
Modernizr
コリス
jquery.js
エレメント
デモ：Safari/OS Xで表示 フォームの見た目はどのブラウザでも美しく表示されていました。スクリーンサイズを変更しても同様に美しく表示されます。 Formplateの使い方 Step 1: 外部ファイル 当スクリプト・スタイルシートとjquery.jsとModernizrを外部ファイルとして記述します。 <head> // Required javascript <script src="j... 続きを読む
[JS]日本語もOK、行単位でスタイルを適用できるようにするスクリプト -Lining.js | コリス
2014/11/25
108 users
コリス
rolling
スクリプ
スクリプト
script
demo 5 一行ごとにさまざまなアニメーションで表示します。 「rolling」のエフェクトかっこいいです。 Lining.jsの使い方 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 <head> ... <script src="build/lining.min.js"></script> </head> デモにあるエフェクトを使用する時は、エフェクト用のスクリプ... 続きを読む
[JS]簡単な実装でパネルを天地左右からアニメーションで表示するスクリプト -notifyMe | コリス
2014/10/31
50 users
jQuery
コリス
ポパー
jquery.js
link
表示ページの天地左右からアニメーションでスライド表示するパネルを実装するjQueryのプラグインを紹介します。 デモページ デモではボタンのクリックがトリガーになっていますが、画像やテキスト、ホバーなどに変更することも可能です。 notifyMeの使い方 Step 1: 外部ファイル 当スクリプト・スタイルシートとjquery.jsを外部ファイルとして記述します。 <head> ... <link... 続きを読む
[JS]エレメントやスライドにさまざまなアニメーションを適用できるスクリプト -Pogo Slider | コリス
2014/09/17
53 users
コリス
jQuery
div
エレメント
jquery.js
divなどで実装したパネル、複数の画像やエレメントを配置したスライダーなどにさまざまなアニメーションを適用できるjQueryのプラグインを紹介します。 ↓は、エレメントのデモです。 demo: エレメントのエフェクト Pogo Sliderの使い方 Step 1: 外部ファイル 当スクリプトとスタイルシート、jquery.jsを外部ファイルとして記述します。 <head> ... <link re... 続きを読む