タグ

ウェブに関するoukastudioのブックマーク (16)

  • 検索エンジン最適化(SEO)スターター ガイド

    フィードバックを送信 コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 検索エンジン最適化(SEO)スターター ガイド ウェブサイトの構築時には、ユーザーを念頭に置き、見つけやすく閲覧しやすいサイトになるよう工夫するのが普通です。検索エンジンもユーザーの一種ですが、コンテンツを見つけるためにユーザーの手助けをします。SEO(検索エンジン最適化)では、検索エンジンにコンテンツを理解させることで、ユーザーが検索エンジンからサイトを見つけてアクセスすべきかどうかを判断できるようにします。 検索の基事項では、ウェブサイトが Google 検索の表示対象となるために特に重要となる事項を説明しています。Google のインデックスに確実に登録される方法はありませんが、検索の基事項に沿って作成したサイトは Google の検索結果に表示されやすくなります。SEO とは

    検索エンジン最適化(SEO)スターター ガイド
    oukastudio
    oukastudio 2019/12/07
    画像のファイル名と alt テキストを最適化すると、Google 画像検索のような画像検索プロジェクトが画像を適切に理解しやすくなります
  • .htaccess の使い方や書き方・設置方法

    .htaccess とは? .htaccess ファイル(分散設定ファイル)は、サーバの挙動を決定する設定ファイルのひとつで、ウェブサーバとして「Apache」が使用されていて、サーバ管理者が「.htaccess」ファイルの設置を許可していれば使用可能です。 通常 Apache は、httpd.conf というテキストファイルにディレクティブ(命令、コマンドのこと)と呼ばれる専用の命令を記述することで設定しますが、httpd.conf はサーバ管理者しか編集できません。それに対して、.htaccess ファイルは各ユーザが、各ディレクトリ単位で設定することができます。 .htaccess ファイルを設置すると、アクセス制限やユーザー認証、リダイレクト(自動転送)、404エラーページのカスタマイズなどを設定することができます。 .htaccess ファイルは単なるテキストファイルですが、以下

    oukastudio
    oukastudio 2019/11/13
    Expires ヘッダーと Cache-Control: max-age ヘッダー ウェブ サーバーから新しいバージョンが提供されているかどうか確認せずにブラウザでキャッシュ済みのリソースを使用できる期間を指定
  • UserAgentからOS/ブラウザなどの調べかたのまとめ - Qiita

    WEBサイトにアクセスしてくる利用者の情報をUserAgentから調べることが出来るが、どんな情報がわかるか調べてみた。より詳しい情報は参考に使ったサイトを参照で。 はじめに GoogleChromeにおいてユーザーエージェント文字列を段階的に廃止することを発表しています。 段階的にUserAgentが削除版UA文字列に置き換わっていきChrome 113で完全に削減版の UA 文字列となってしまいます。 削除版のUA文字列は以下の通りです。 User-Agent Reduction # Desktop (user on Windows 8.1, for example) # 旧 UA文字列 Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.1234.56

    UserAgentからOS/ブラウザなどの調べかたのまとめ - Qiita
    oukastudio
    oukastudio 2019/11/03
    UserAgentの書き方は厳格に定義されているようではないようだ 知らなかった
  • (ちょっとメモ)Prism の使い方(SyntaxHighlighterから乗り換えた)

    (ちょっとメモ)Prism の使い方(SyntaxHighlighterから乗り換えた) 最終更新日:2017年11月28日 (初回投稿日:2017年11月17日) サイトの シンタックスハイライターを Prism(プリズム)に乗り換えました。 これまで SyntaxHighlighter 3.0.83 を使っていましたが、順次差し替える予定です。 Prism は こんなかんじ。 <!--HTMLの場合--> <pre class="line-numbers"> <code class="language-markup">some HTML code</code></pre> <!--CSSの場合--> <pre class="line-numbers"> <code class="language-css">some CSS code</code></pre> Prism は 設置も簡

    (ちょっとメモ)Prism の使い方(SyntaxHighlighterから乗り換えた)
    oukastudio
    oukastudio 2019/10/15
    Prism の特徴(メリット・デメリット) 一番のメリットは、ソースコードの記述が W3C が推奨するカタチなこと。 W3Cの仕様では、ソースコードを表記するときは、要素だけでなく 要素も一緒に使い、要素に class属性で「languag
  • ウィジェットの設定をWordPressサイト間で楽々移動可能にするWidget Importer & Exporterプラグイン – ワードプレステーマTCD

    WordPressでよくウェブサイトを作成する人にとって、同じようにウィジェットを設定する行為は単調で手間のかかる作業となってしまいます。そんな時は、他に運営しているWordPressサイトのウィジェットの設定データをそのまま移行することができるプラグイン「Widget Importer & Exporter」を利用すると便利です。Widget Importer & Exporter はウィジェットの設定をインポート&エクスポートする事が出来るプラグインです。 最近のTCDテーマにはテーマオプション管理機能があってTCDテーマオプションのバックアップ、インポート&エクスポートが可能ですがそのウィジェット版と思っていただけたら良いと思います。このプラグインを使用する事で、WordPressのお引越しの際に活躍してくれる事は勿論の事、複数のサイトを構築する際にも、面倒だった個別の設定作業をする

    ウィジェットの設定をWordPressサイト間で楽々移動可能にするWidget Importer & Exporterプラグイン – ワードプレステーマTCD
  • html5.2ではstyle要素をbody内に書けるようになりました

    <div style="width: 300px; max-width: 100%; background-color: white; border: 3px solid black; color: rgb(51,51,51); padding: 20px; text-align: center;">最新映画紹介</div> これがstyle属性ですね。htmlのstyleという 属性 の 値 としてCSSを直接書きます。 で、すげー見づれぇ (=`ェ´=;) となるわけよ。 見辛い・編集困難という問題もあるのですが。 じゃあサンプルの「最新映画紹介」をこうしたい場合どうする ↓ 上記は 疑似要素 と呼ばれるCSSを利用しています。 そして 疑似要素はstyle属性内に書くことができません。 疑似要素というのは来「htmlに存在しないもの」を作り出しますので、「htmlに存在する」要素に

    html5.2ではstyle要素をbody内に書けるようになりました
  • oukasei.com - oukasei リソースおよび情報

    oukastudio
    oukastudio 2019/08/19
    新規記事を投稿
  • oukasei.com - oukasei リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

    oukasei.com - oukasei リソースおよび情報
  • TRPGのBGMに!「Tabletop Audio」 - 急がば走れ

    こんにちは! 最近仲間内でTRPGをやる機会が増えてきました。 私は主にPLなのですが、いつかは自作のシナリオを作って公開したいなーなんて思っています。 その際にBGMとか流して雰囲気出したいなと探していたところよさ気なサイトを見つけたので使ってみました。 BGMの再生・プレイリスト追加・ダウンロード プレイリストの操作と削除 プレイリストをURLで共有 組み合わせは無限大!SoundPad プリセットからカスタマイズする方法 BGMの変更をリアルタイムに配信 最初から自分で作り上げていく方法 まとめ tabletopaudio.com BGMの再生・プレイリスト追加・ダウンロード サイトにアクセスするとこのようにサムネイルがタイル状に並んでいるので、 マウスを載せて出てくるメニューの一番右、Play を押すことで再生できます。 他に Add でプレイリストへの追加、Save でmp3での

    TRPGのBGMに!「Tabletop Audio」 - 急がば走れ
    oukastudio
    oukastudio 2018/03/07
    ウェブ上で複数曲のミックスができるらしい
  • oukasei.com

  • webrtc-ips - WebブラウザでLANのIPアドレスを知る方法

    インターネット上にあるサーバが取得できるIPアドレスはグローバルなIPアドレスです。そしてルータやプロキシをかませば複数人で同一のIPアドレスが使えるようになっています。何をそんな当たり前なことを、と思うでしょう。 しかし外部のサーバがLANのIPアドレスを取得できるというのは知っていましたか。それを実証してくれるのがwebrtc-ipsです。 webrtc-ipsの使い方 実際にデモにアクセスすると分かるはずです。 これがLAN内であれば、普通にLANのIPアドレスが出ます。これはWebRTCの仕様で、最適な接続を自動選択するために使われているようです。 確かIEなどはグローバルとLAN内部とでセキュリティ制限を変えたりできるので、内部IPアドレスが分かるのはなかなか怖いと思いつつ…WebRTCにはこんな使い方もあったのかと驚かされますね。 webrtc-ipsはHTML5/JavaSc

    webrtc-ips - WebブラウザでLANのIPアドレスを知る方法
  • jQuery UIを利用するには?

    jQuery UIの基機能を目的別リファレンスの形式でまとめる連載スタート。jQuery UIで提供されているコンポーネントと、基的な利用法を説明する。 連載 INDEX 次回 → このシリーズでは、何回かにわたって、jQuery UIの基機能を目的別リファレンスの形式でまとめていきます。 jQuery UIは、jQueryを拡張するライブラリ(プラグイン)の一種で、名前のとおり、ユーザー・インターフェイス(UI)に関わる機能を提供します。プラグインとはいえ、開発チームにはjQuery家のメンバーも参加しているオフィシャルな存在であり、jQueryベースでリッチなUIを持ったWebアプリを開発するならば、まずjQuery UIの利用を検討することをお勧めします。 jQuery UIのコンポーネントは、大きくInteractions(インタラクション: マウスによる汎用的な対話処理)

    jQuery UIを利用するには?
    oukastudio
    oukastudio 2013/12/12
    CDNに障害があってファイルを取得できなかった場合に備えて(フォールバック)、以下のようなコードを記述すると、より安全です。 コードを右端で折り返す(全記事共通) HTML window.jQuery || document.write(''); window.jQuery.ui ||
  • oukasei.com

    oukasei.com 2023 著作権. 不許複製 プライバシーポリシー

    oukasei.com
    oukastudio
    oukastudio 2013/04/18
    inline-block インライン要素と同じで、対象タグの前後にある空白文字は省略されない。ただし、内部のテキスト・要素の前後にある空白文字は、ブロック要素と同じで省略される。
  • text-emphasis (CSS3 Text decoration);圏点のスタイル

    noneとすれば圏点をなくすことができる。また、上記の表にはない任意の一文字を圏点として指定することもできる。 仕様書には、以下のことも定められている。 filledとopenのいずれも指定されない場合、filledとして扱われる。 filledもしくはopenのみ指定した場合、横書きではcircle、縦書きではsesameとして扱う。 圏点の文字サイズは,圏点を付ける対象となる要素の文字のサイズを50%とする。 圏点は縦書きモードでは要素の右側に来なければならず、文字を回転させてはならない。 フォントが圏点に使用する字体を持ってないか、字体があっても不適当な大きさを使用することが考えられる。ユーザーエージェント(ブラウザ)は圏点に適切なフォントを用いることができ[MAY]、ユーザエージェントによって合成してもよい[MAY]。 例 filledを指定 ぼくもできなかった。Linux がぼく

    text-emphasis (CSS3 Text decoration);圏点のスタイル
    oukastudio
    oukastudio 2013/03/20
    -webkit-text-emphasis-style: open dot ;
  • Chromeがゲーム機になる!WebRTCを使ったダンスゲーム「BeHero Tap Dance」 - Chrome Life

    先日のChromeのアップデートでバージョンが21になり、「getUserMedia API」がデフォルトで使えるようになりました。 今までは、試験機能だったためオプションの設定で有効にしなければいけなかったのですが、それが不要になっています。 これでブラウザらWebRTCの機能を使うことができるようになるので、ウェブカメラを利用したインタラクティブなアプリも増えてくるでしょう。 前回の記事では、顔認識で機体を操作するゲームを紹介したのですが、今回はもっとKinectにありそうなダンス系ゲーム「BeHero Tap Dance」を紹介したいと思います。 「BeHero Tap Dance」は、カラダ全体を使ってリズムに合わせながら、コーナーのマーカーに触ることでスコアが加算されるゲームです。 最新のChromeブラウザであれば、サイトにアクセスしてカメラアクセスの許可ボタンを押すだけで遊べ

  • [tech]HTTP GETメソッドのURIの長さ制限を調べてみた - Kazumi007の日記

    Webの開発者をやっていると良くいわれていることですが、HTTP GETメソッドを使うなという話を聞きます。セキュリティの点もありますが、HTTP GETメソッドですべてのパラメータをサーバに送れないからというのがその理由のようです。 実際どこからでているのか、現在もそうなのか?という疑問を感じたので、HTTP GETの制限を調べてみました。 RFCではどうなっているの? まずHTTP1.1のRFC2616を調べました。 とりあえず、日語訳がありましたので、引用いたします。http://www.studyinghttp.net/cgi-bin/rfc.cgi?2616より HTTP プロトコルでは、URI の長さにどんな制限も設けていない。 サーバは、自身が持つどんなリソースのURI も扱えなければならないし、もしそのような URI を生成する GET ベースのフォームを用意するなら、無

    [tech]HTTP GETメソッドのURIの長さ制限を調べてみた - Kazumi007の日記
  • 1