  |
はてなキーワード: Faviconとは
パソコン画面右上のアイコンで選ぶ表示スタイルを一番右の「ヘッドライン」表示にしといてな
/* ヘッドライン表示を切り詰める */ /* #container 指定でCSS優先度を上げる必要がある */ body[data-entrylist-layout="headline"] #container .entrylist-main{ padding-right: 0 !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents{ padding-left: 0 !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents-users{ position: static !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents-users{ top: 14px !important; } /* ヘッドライン表示にサムネイルを追加 */ body[data-entrylist-layout="headline"] #container .entrylist-contents-main{ display: grid; grid-template: "users body title" 28px "bookmark body domain" 20px / 60px 120px 1fr; } body[data-entrylist-layout="headline"] #container .entrylist-contents-users{ grid-area: users; } body[data-entrylist-layout="headline"] #container .entrylist-contents-users a span{ margin-right: 0; } body[data-entrylist-layout="headline"] #container .following-bookmarks-container{ grid-area: bookmark; position: absolute; left: 20px; bottom: 2.5px; } body[data-entrylist-layout="headline"] #container .entrylist-contents-body{ grid-area: body; } body[data-entrylist-layout="headline"] #container .entrylist-contents-title{ grid-area: title; z-index: 99; } body[data-entrylist-layout="headline"] #container .entrylist-contents-title > a{ margin-left: -120px; padding-left: 120px; margin-bottom: -28px; padding-bottom: 28px; width: 890px; white-space: nowrap; display: block; } body[data-entrylist-layout="headline"] #container .entrylist-contents-body{ display: block !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents-thumb{ position: static; } body[data-entrylist-layout="headline"] #container .entrylist-contents-thumb span{ width: 100px; height: 50px; } body[data-entrylist-layout="headline"] #container .entrylist-contents-thumb{ background: #f0f0f0; width: 100px; height: 50px; background-position: 50%; background-size: cover; border-radius: 4px; } /* 2行目に、総合ではドメイン(domain), サイト内一覧ではカテゴリと時刻(meta), マウスホバー時はいずれも概要文(description) */ body[data-entrylist-layout="headline"] #container .entrylist-contents-domain, body[data-entrylist-layout="headline"] #container .entrylist-contents-meta, body[data-entrylist-layout="headline"] #container .entrylist-contents-description{ grid-area: domain; display: block; opacity: 0; padding: 0 !important; } body[data-entrylist-layout="headline"] #container .entrylist-contents-meta > li{ vertical-align: top; } html[data-stable-request-url^="https://b.hatena.ne.jp/entrylist/"] body[data-entrylist-layout="headline"] #container .entrylist-contents-domain, html[data-stable-request-url^="https://b.hatena.ne.jp/site/"] body[data-entrylist-layout="headline"] #container .entrylist-contents-meta{ opacity: 1; } body[data-entrylist-layout="headline"] #container .entrylist-contents:hover .entrylist-contents-domain img.favicon + span, body[data-entrylist-layout="headline"] #container .entrylist-contents:hover .entrylist-contents-meta{ opacity: 0; } body[data-entrylist-layout="headline"] #container .entrylist-contents-description{ opacity: 0; position: absolute; top: calc(40px - 3px); left: calc(180px + 16px + .5em); height: 20px; line-height: 20px; color: #999; min-height: auto !important; padding-right: 0 !important; width: 890px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } html[data-stable-request-url^="https://b.hatena.ne.jp/site/"] body[data-entrylist-layout="headline"] #container .entrylist-contents:hover .entrylist-contents-domain, body[data-entrylist-layout="headline"] #container .entrylist-contents:hover .entrylist-contents-description{ opacity: 1; } /* 増田調整 */ body[data-entrylist-layout="headline"] #container a[href^="/entry/s/anond.hatelabo.jp/"] .entrylist-contents-thumb{ background-image: url('https://cdn-ak-scissors.b.st-hatena.com/image/square/b1638cdb5807a4788e4ba3c1109a984166e095fc/height=288;version=1;width=512/https%3A%2F%2Fanond.hatelabo.jp%2Fimages%2Fog-image-1500.gif'); } /* マウスホバー時にサムネも反応させる見た目調整 */ .entrylist-contents-title:hover ~ .entrylist-contents-body .entrylist-contents-thumb{ opacity: .90; }
「かゆうま」みたいなノリで匿名日記を書くサイト作って1年が経った
去年の投稿で「今では日500人切れば緊急事態宣言解除してもいい流れになってたり」と書いていたが、今や日3000人超えてても行動制限なしでゴールデンウィークは各地が賑わうと、すっかり世界が変わってしまった。
日本ではまだマスク着用が多いが、マスク着用義務を廃止した国も出てきているし、来年の今頃はマスク着けないがスタンダードになっているかもしれない。
まあワクチン打ってる人も増えてるし、オミクロン株は弱毒化してるということで、ウィズコロナ時代になったのだろう。
このまま終息してアフターコロナになることを願いたい。
サイト的にはこの1年は穏やかだった。
大きなバズはないが、投稿数が減ることもなく、むしろちょっとずつ増えてる感もある。
長く投稿してくれてる人、新たに書き込んでくれる人などなど大変ありがたい。
今年の2月にはfaviconを作ってくれた人もいた。ちょうど見かけたのでサイトに設定した。嬉しい。
自分ごとでいうと、去年の6月に適応障害になってしまい半年ほど倒れていた。
ある日の午後、15分ほどの軽いオンラインミーティング後に「さて、作業するかー！…あれ何するんだっけ……」と頭が真っ白になった。
とりあえずその日は午後休をもらい休んだが、翌日になっても翌々日になっても思考がボヤボヤしたままだった。
「これはヤバいやつな気がする…」と思い心療内科に行ったところ診断が出て休職になった。
休み中はとにかく眠くて、日中も5時間以上昼寝して、夜も8時間以上寝るでとにかく寝ていた。
短期記憶が死んでいて、麦茶を沸かそうとしても湯を沸かしっぱなしにしたり、火は止めたけどティーバッグを入れ忘れたり、ティーバッグを入れたまま翌日まで放置したりと散々だった。
本や漫画を読もうにも前のページのことを忘れるし、プログラミングしようにも1行書くと次の行に何書こうか忘れる状態。
それまでの趣味も全然できず、麦茶を忘れないようにしたり、料理で食材や調味料を入れ忘れないので精一杯だった。
4ヶ月くらいして徐々に眠気も緩和し、思考・記憶も回復してきた。
少しやる気も出てきたので、リハビリを兼ねて前々から読みたいと思っていたビジネス書を読もうとしたり、忙しくてなかなか時間が取れてなかった資格勉強を再開しようとしてみた。
元々時間が出来たら読みたい本リストややりたいことリストを作っていたのだか、どれもいまいちピンとこなかった。
そんな中ある日、本屋に行ったときに手にとったのが「ゼロからのOS自作入門」だった。
時間がかかり、それでいて仕事への費用対効果はほぼ無い。あくまで自分のコンプレックスから興味があると思っているだけ。それだったら仕事に効きそうなことを優先しようと封印していた。
ポインタに触れるのが久しぶりすぎて15年以上ぶりにC言語ポインタ完全制覇を引っ張り出してきて復習したり、図書館でオペレーティングシステムの本を借りてきて読んだり、学生時代に戻ったみたいだった。（たぶん学生時代はこんなにポインタとかOSの本を読んでなかったと思う）
理解は追いつかなかったが、UEFIとEDK IIの存在を知ったこと、CPUにリングプロテクションや専用レジスタがあることを初めて知ったりなどなど、どんどん新しいことを知れてとても楽しかった。
仕事への効果はいまのところ感じられないし、おそらく今後も効果を発揮する場面はなさそうだ。
倒れている間はなかなかしんどかったけど、仕事やキャリアの面から「やりたいと思い込んでいたこと」と、仕事に全然効かないけど「人生の満足度が上がるやりたいこと」がクリアになったのはいい機会だった。
いまは休みの日に合間を見て「コンピュータシステムの理論と実装」をやってる。これも楽しい。ゆるゆる進めていきたいと思う。
サイトの方も引き続きゆるゆる続けていきたいと思う。
COVID-19流行下の日々を集団で記録する日誌 https://enigmatic-brushlands-82725.herokuapp.com/
遡ってみたら 2021 年の 9 月頃からで、その頃には増田の変更が無いようなのではてブ側の障害だと思っていたっぽい。
favicon の meta データに問題は無さそうだし、 .ico (image/vnd) の対応を止めたかなー。でも .ico 使っているサイトはいくらでもあるだろうしなー。
ドッグフーディングしていなさそうなの、やだなー。ただでさえ過去の遺産でネームバリュー出しているのに。というか技術的には優れていなかったのに、技術的な話をさも凄そうに記述できる人が少なかった時代だったから築かれた印象なのに、未だに技術の会社だと公認も自認もされていそうなの気持ち悪い
1. はてな https://www.hatena.ne.jp/favicon.ico
2. はてブ https://b.hatena.ne.jp/favicon.ico
3. アンテナ https://a.hatena.ne.jp/favicon.ico
4. 増田 https://anond.hatelabo.jp/images/favicon.ico
5. はてラボ https://hatelabo.jp/images/favicon.ico
6. コーポレートロゴ https://www.hatena.ne.jp/images/portal/logo-portal-top2.png
7. 旧・コーポレートロゴ https://image.itmedia.co.jp/news/articles/0509/28/yu_hatena_01.jpg
「3」のはてなアンテナが古いタイプのfaviconで（フォトライフも同じタイプ）
この頃はどのサービスも「真四角のザブトンにサービスの頭文字が入っている」デザインに統一されていた。
そのロゴマークを斜めに傾けて四角のなかに収めたような「1」のfaviconが出てきた。
ロゴマークが現在の「6」に変わっても、それが引き続き使われている。
「2」のはてブはブクマボタンをモチーフにしたfaviconで完全に独自デザイン。
増田のfaviconは昨日まで「6」のロゴマークをそのまま使った「5」のfaviconだったけど
それが増田のTwitterカードとかに使われてるデザインを縮小したような「4」のfaviconに変わった。
どうしてこんなに統一性がないのか、と思うんですよ。
同じデザインのなかで細かいバリエーションが多いというならわかりますけど、
これは古いデザインと新しいデザインと独自のデザインが混在しているだけですよね。
どこかで古いデザインのままのページが取り残されていくんですよ。
昨晩の深夜あたりから、faviconが赤丸に白Rから白角に赤Rへ変わったりして、サーバーとかもいろいろいじっているのかなって雰囲気なんだけど、楽天のトップページを初め、メインの楽天市場のショップページ、商品ページをおいてあるサーバーがどうもおかしいみたいで、どのページも応答に10秒くらいかかってる
お買い物マラソンだのやってる場合じゃなくね？一つのページを開くのに10秒って、こんなレベルでAmazonと戦えると思ってるみたいだから笑える
楽天には、メール送信を誘導する技術、ページを長くする技術だけを磨いたIT担当しか居ないから、こういうサーバーの問題への対応は期待できないよなあ。外部からヘルプ呼んで対処だと2週間位はこの状況が続くかな
こんにちは。2年前に『はてブ1000users超え記事アンテナ(´・ω・)』というWEBサービスを作って記事を書いたものです。
当時はWEB業界で働くことを目標にしていましたが、いろいろあって今はまったく関係ない業界の会社でお世話になっています。
※カーちゃんには温泉じゃないけど一応孝行出来ました。
2年前に応援してくださった方々、ありがとうございました！
・サイト：『はてブ1000users超え記事アンテナ(´・ω・)』
http://hatebu-1000users-over.com/
おかげさまで少し時間が空くようになったので久々になにかWEBサービス作ってみたいなあと思って今回新しくWEBサービスを作ることにしました。
以前今回ははてなユーザーに絞って作ったサービスでしたので、今回は反対に万人受けするものを目指して作ってみましたので、ひっそりとご報告したく思います。
といっても相変わらずif文を書くのがやっとのPHP初心者なので大したことは出来ないですが。。。
『@漢字の読み方（β）』
・このサイトについて
タイトルのまんまです。難読・人名・地名・熟語などの読み方を提供するサービスになります。情報の取得元については、後述しますがYahoo!さんから頂いております。また、それとは別に下記二つのページへの直リンクを貼らせて頂いております。
今回のサイトでは、descriptionタグで自動的に該当の漢字の読み方を表示する仕様にしてあるため、例えばGoogleで『鬱』と検索した場合、ページタイトルの下に『鬱の読み方：うつ/utu』まで表示されるようになっています。要するに別に当サイトのページをクリックしなくても読み方自体は調べ終わるようになっています。ですのでクリックしてくださった方への付加価値の意味を込めてこれらのメニューを用意しています。
ニコニコ大百科（β） / weblio(類語辞典) / 人名漢字辞典 / Wikipedia / NAVEまとめ / OKWave / はてなキーワード / goo辞書 / Twitter検索 / GoogleMAP /
この部分に関しては今後の評判を見て取捨選択していければと思います。
例えば当サイトで『破面』と検索しても『アランカル』とは表示されませんが、ニコニコ大百科さんやwikipediaさんならユーザーが満足のいく反応を返してくれるだろう、といったように、当サイトではどうしてもカバーしきれない単語の補完をしたいという目的があります。
GoogleMAPについては、例えば『竜胆（りんどう）』『小鳥遊（たかなし）』といった珍しい地名を検索する機会があった場合、せっかくだからどこにある地名なのかもすぐに見てもらえればと思って貼らせて頂いてます。
友『アニメやマンガの流行りで海外の人も漢字の読み方や意味に興味を持ってる人が多いと思う。もちろん翻訳ソフトを使って確認とかもしてるとは思うけど、簡単に調べられるに越したことではない』
・『読み方は？』
『読み方』サイトの先輩サイト様方。今回の製作物では大きな違いは文字を大きめにしたことや、先述のとおりdescriptionタグに漢字の読み方を組み込んでネタバレ式にしたことなどが大きな違いになります。
先述とは別の友人からは『読み方系のサイトなんていくらでもあるから今更参入しても意味ないよwww』と笑われましたが、それでもまずとにかく作ってみる、やってみるというのが大事だと思います。
公開URL：http://developer.yahoo.co.jp/webapi/jlp/furigana/v1/furigana.html
・解説：
「漢字かな交じり文に、ひらがなとローマ字のふりがな（ルビ）を付けます。」（該当ページより引用）
「そもそも漢字の読み方サイトなんてどうやって作るんだよ?」という問題を解決してくれるのがこのAPI。これがないと始まりません。知らない人に説明すると、APIというのは、
APIとは、アプリケーションプログラムインターフェイスの略語で、プログラミングの際に使用できる命令や規約、関数等の集合の事を指す。 ソフトウェア開発の際、いちから全てを作ることは困難だが、APIを利用すればもともとあるプログラムをもとにして、自分でプログラミングすることなくその機能を利用したソフトウェアを作成することができる。
というもので、これで他所からサービスやデータの一部を借りることで新しいサービスの製作の助けになってくれます。いろんな所から出ているのでぜひ探してみてください。
・参考サイト様
『Yahoo!デベロッパーネットワーク』 ： http://developer.yahoo.co.jp/sitemap/
・解説：前回も使用したもの。Twitter社が提供するCSSフレームワーク。サイトデザイン（外見）に使用。
自動でレスポンシブ、適当に組んでもそれなりの今風サイトになるので便利。
・参考サイト様
『Twitter Bootstrap』 : http://twitter.github.com/bootstrap/
『Bootstrap 3.0入門 (全18回)』: http://dotinstall.com/lessons/basic_twitter_bootstrap_v4
③忍者ツールズ
・解説：前回も使用させて頂いています。ソーシャル要素はやはり外せないので今回も採用しました。
・参考サイト様
・解説：前回も使用させて（ryお気に入りとかの横に出る画像のあれですね。
・参考サイト様
『Favicon Japan!!』：http://www.favicon.jp/favicon_auto_create/ :
⑥その他
・使用サーバー
もし良かったら一度使ってみてくださると嬉しいです。ご意見ご感想頂ければなお幸いです。
読み方を複数表示したいのにどうしても1パターンしか出せませんでした。今後改善していければと思います。
自分はPHPはif文がギリギリ書ける程度の力量しかないので今回もヒーヒー言いながら作ってました。もし『WEBサービス作ってみたいけど敷居高そう』って人がいたらとにもかくにも作り始めてみてください！まずはじめるのが大切だと思います！
それではありがとうございました！
文系出身だけど前々からWebサービスつくってみたくて勉強がてら一人でWebサービス作ってみました。
作りたいって思うなら実際に作ってみるのが一番いいってじっちゃんがいってた。
やってみて感じたこととか先輩エンジニアの人たちに教えて欲しいこととかを書いていきたいと思います。
じっちゃん、僕にもできたよ！
EDM JACK
簡単に説明するとクラブミュージックを淡々と紹介していくサイト
・26歳
・フリーター(ほぼニート)→知人の会社で営業職→今年の4月にWeb業界へ転職。
・営業職だったころにあいた時間にドットインストールとかでHTML/CSSの勉強をしてた。
大学を中退してからフリーターになって、その頃から自分でWebサービスとかつくって運営してる人ってかっこいいな〜とか思ってた。
Facebookの映画とか見たときは完全に感化されっぱなしだった。
でもいつか作れたらいいな〜って思ってただけでなにもしてなかった。
最近いろいろ環境が変わって少し休みをもらえたので奮起して勉強がてら作ってみることにしたのです。
漠然と「Webサービス作りたい」って思ってたからまずどんなWebサービスを作るか考えました。
やっぱり好きなことじゃないと続かないと思ったので
自分が好きなクラブミュージックをまとめるサイトを作ることにしました。
ジャンルはDJ KAO●Iとかミーハーな感じの曲じゃなくてEDMってやつ。
EDMといえば今月日本でもUltra Music Festivalが開催されるね！やったね！Hardwellに会えるね！
まずはプログラミングとやらを勉強することにしました。ドットインストールは偉大です。お世話になりました。
ここでHTML/CSSとPHPを勉強しました。でもPHPでゼロからコードを書いて作ろうとすると重大な問題があることに気が付きました。
時間がかかりすぎる。
今回はとりあえず自分でなにかWebサービスを作ってみるということを経験したかったのでWordPressを使うことにしました。
でもさすがにレンタルサーバーを借りてWordPress入れましたっていうんじゃ先輩エンジニアの人たちに怒られちゃうと思ったので、
WordPressを入れるサーバーの環境構築は自分で頑張ってやってみることにしました。
なのでWeb業界ではアイドル的存在のAWSっていうやつで頑張ることにしました。
ここでもドットインストールにお世話になりました。ほんとなんでもチュートリアルがあってすごい。
最初はWebサーバーにApacheを入れていたんですが、なんか重たい感じがしていろいろ調べているとNginxがナウい感じだったので
Nginxでインスタンスを立て直すことしました。環境的にはこんな感じ。
Nginx 1.4.7
MySQL 5.6.13
ドットインストールでUnixコマンドとかを勉強したとはいってもNginxの設定周りをいじるのは結構大変でした。
でもNginx使うからにはチューニングしてから使わないとApache先生に怒られちゃうので、
チューニングテストをしたらTransfer Rateが17[Kbytes/sec] くらいから15000 [Kbytes/sec]くらいになった。
無事にサーバーが立てられたのでWordPressを突っ込んでテーマとかいろいろいじりました。
シェアボタンをつけたりFacebookのLikeBoxを入れたりでちょっとテーマいじった程度。
あ、カテゴリとタグにpickupってつけたら自動で投稿が目立つようにした。これは自分でテーマファイルいじって書いた。
入れたプラグインはこんな感じ。Jetpackはモバイルテーマのみを有効化してる。
アイキャッチ画像が多いからPhotonも有効化してもいいかなって悩んでる。
Akismet
All In One SEO Pack
Batch Category Import
Favicon Rotator
Font Awesome Icons
Mobile Theme Featured images for Jetpack
NextScripts: Social Networks Auto-Poster
Remote Images Grabber
Video Thumbnails
Wordpress Popular Posts
WordPress Related Posts
WordPressなのであとはたらたらと僕がオススメする曲を更新していくだけ。
EC2のt2.microだけど、Nginxのおかげなのか特に問題はなし。
今はYoutubeかSoundcloudのURLをそのまま投稿に入れて、アーティスト名とかDJ名でカテゴリ分けしてる。
せっかくだからドメイン代とかAWS代だけでも回収できればいいなってことでAdSenseも入れてみたｗ
実際に作り始めてから1週間程度でここまでつくることが出来ました。
ドットインストールがなかったらここまで速くつくれなかった。ありがとうございます田口さん。
元々非エンジニアでもやる気になればそれっぽいのが作れて感動しました。
でもなんかOGPの設定がうまくできず、Facebookとかでシェアしようとするとたまに全然関係ない画像が表示されてしまう。
テーマファイルに直接書いてもプラグインでOGP設定してもよくわからなかった。
Facebookのデバッガーつかってキャッシュクリアしてもできたりできなかったり。
将来的にはSoundcloudとMixcloudを足して2で割ったサイトになればいいな。
キュレーター制度とかも入れてみて、僕だけじゃなくていろんなEDM好きやDJがおすすめの曲を投稿できるようにしていきたい。
WordPressで構築しちゃったけどできるだけプラグインに頼らずに自分でPHP書いて実装できるように頑張らなきゃ。
本とかは一冊も読まずにここまで作れたけどPHPエンジニアならこれは読んどけよ若造ってのがあったら教えてください。
EDMは素晴らしいよ！クラブ好きな人もそうでない人もきっと好きになる曲が沢山あるから聞いてみてね！
EDM JACK
