みなさん、こんにちは お元気ですか？僕は元気です。 さて 最近よく、「いいね！」ボタンや「ミクシィチェック」ボタンによって、ウェブページを紹介し合う文化が少しずつ定着してきたなーと思います。 そんな中で、今後重要になってくるんじゃないかと思われる OGP （Open Graph Protocol）と言われる仕様があります。今日はそのことについて書いてみたいと思います。 OGP? おーじーぴー？？とはなんでしょうか。 OGP とは 簡単に言うと「このウェブページは何のことを書いているか」という情報を、プログラムから読める形で HTML に付加する記述方法のことです。 まあ、普通のウェブページは人間が読めばだいたい何のことが書いてあるか分かりますよね。 ですが、プログラムは人間ほど頭が良くないので、そのウェブページ内の文章だけではそのページが何のことについて書かれているページなのか正確に識別す
2017年7月25日 Webサイト制作, 便利ツール 今より少しでもコーディングを早くできれば、細かいデザインや機能にも時間をかけて取り組めそう…という事で今回はコーディングのスピードを上げるためにできる事を紹介します。便利なツールを使ったり、ちょっとやり方を変えるだけでより早くコーディングができるようになると思います！ ↑私が10年以上利用している会計ソフト！ 1. コーディング手順を簡略化する これは自分のコーディング能力を高めて手順を省く、便利なツールを使って手間を省くという事です。例えば私は昔このような手順でコーディングを進めていました。 CSSのレイアウトをノートに書き出す レイアウト部分（ヘッダー・メイン・サイド・フッター）のHTMLマークアップ CSSでレイアウト部分のスタイリング 表示確認 うまく表示できない箇所の修正 ヘッダー内のHTMLマークアップ CSSでヘッダー内の
マークアップエンジニア（以下、ME）のtacamyです！(`・ω・´) カヤックでは、デザイナーもHTMLコーディングをしてくれています。 （いつもありがとうございます！） そんなワケで、本格的にHTMLコーディングはしないけど、 ちょこっとしたページなら組みますっていうデザイナー向けの、 「コレだけ読めばすぐできる」シリーズを始めました。 第一回は「携帯コーディング」についてです。 携帯はPCとは全くの別物なので、なんとなく敬遠しがちですが、 最低限の内容であれば覚えることも少ないですし、 一度覚えてしまえばスタンダードがしばらく変わらないので、覚えておいて損はないですよ！ 携帯コーディングの基本 基礎の基礎 文字コードはShift-JIS CSSはインラインで指定（タグに直接style属性を追加する） 画像を含むページ容量100KB以内（HTML自体の容量は9KB以内） 画像はgifか
CSS HappyLife ZERO が移転したのでお手数ですが、消えちゃう前にブックマーク等変更してもらえるととても嬉しいです。 制作会社でコーディングする場合、社内のガイドライン的なのが有ったりデザイナーもある程度固定されてると思うので、毎回似たような事を確認したりとか、このデザインはどういう意図なんだろう？ってのも、何度か同じ人とやってれば見えてくる訳ですが、フリーランスの場合だとデザイナーは毎回違っていたり、当然ディレクションをする人も違うので最初に確認しておきたい事が有ったりします。 って事で、その辺りをまとめてみたり、デザインを渡されたときにこのデザインの意図は？って思う事とかもばーっと書いてみます。はい。 なので、デザイナーさんもコーダーにデザインを渡すときに気をつけて欲しい点とかもわかってしまうすばらしい内容（だと良いな）！ じゃあまずは最初に確認しておきたい基本的なことか
Web制作を少しでも効率化しよう と思って（今更）いろいろ便利そう な情報を探しました。既に使って いる情報の方が多かったのです が、折角調べたのでシェアしたい と思ってエントリーです。 コーディングをもっと円滑に、という旨の情報です。順不同。あんまり多いと逆効果なので量は絞りました。一応これでも絞りました。絞ったつもり。 zen-coding 話題になったzen-coding。だいぶ慣れて来た方もいらっしゃるのでは。 zen-coding（本家） HTMLコーディングが3倍速くなる？「Zen-Coding」 秀丸Zen- Codingマクロ コーディングの効率化を図るZen codingをDreamweaver cs4に入れる方法 WP Zen-Codingが凄く便利 初期設定とかTipsとか 制作前に知っておくと便利なコードとかTipsいろいろ。 css書く前にチェック。 もう、cla
Not your computer? Use a private browsing window to sign in. Learn more
❤ฺ特殊記号タグ コピペ用リスト❤ฺ HTMLでハート「♥ฺ」や「✌ฺ」などの絵文字を表示させるためのタグリストです。 「℀ฺ」などと書かれた部分をHTMLソースなどにコピーして貼り付け、ブラウザで開くと、リストの左側に表示されている絵文字が表示されます。 絵文字を直接コピーすると、テキストエディタでは「??」のように表示されると思いますが、これをHTMLソースに貼り付けないように注意してください。その絵文字以降が全て文字化けすることがあります。必ず「&#〜」と書かれた部分を貼り付けてください。 また、場合によっては正常に表示されないかもしれません。何があっても自己責任でお願いします。 文字種記号・数字の形 矢印・数学記号 その他の技術用記号・囲み英数字・罫線素片 ブロック要素・幾何学模様・その他の記号・装飾記号 囲みカタカナ・ひらがな・単位など 戻る
検索エンジン3社、正しいサイトURLを認識させるcanonical属性を導入（URLの正規化） Google、Yahoo!、Microsoft3社が rel="canonical" （正規化、canonicalization ）をサポート。クローラが適切な（canonical）サイトを見つける手がかりに。rel="canonical" はページの head の中に記述すること。 公開日時：2009年02月13日 15:37 Google、Yahoo!、Microsoftの3社は2009年2月12日、共同で新しいタグ「 rel="canonical"」のサポートを開始した。rel="canonical"（属性）は、検索エンジンに正しいサイトのURLを認識(正規化、canonicalization）させるために使用される。 同じサイト（ドメイン）でも、たとえば www.sem-r.com、se
このページは普段ホームページを作っていて ブラウザのバグや独特？の仕様、 各ブラウザでの実装の違いなど気が付いたことをまとめたものです。 すぐ試せるように できるだけ症状が出るサンプルを載せ、 その回避方法についても触れるようにしました。 勘違いしているところ、或いは バグ回避のうまい方法があったらお知らせください :-)。 問題点だけ列挙しても とっつきにくいと思うので 「バグや互換性問題を避けるコーディング作法」 のページを作りたいと思っています。
「htmlのことはなんとなくはだいたい知ってるよ」というエンジニアが、初めて業務でhtmlコーディングをするときにわりとハマりやすい点。ぐぐってもあまり出てこないような細かいノウハウをまとめてみました。 ウインドウ余白を消したい ブラウザによっては、ウインドウ枠のまわりに余白スペースが挿入されてしまって、ウインドウの端まで画像等を配置したいのに実現できない、なんてことがあります。これはbodyタグがデフォルトで余白を持っているのが原因です。 <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> と記述するか、あるいはcssで <body style="margin:0;padding:0;"> として、余計なマージンを消してしまいましょう。 formタグをいれると空行があいてしまう。 <form>タグを入れ
この広告は60日以上更新がないブログに表示されております。 新しい記事を書くことで広告を消すことができます。 （2007年6月25日発表ネットレイティングス株式会社調べ） 日本のトラフィックの大部分をしめるサイトにおいて驚くほど「Web標準」は無視されている。 いくら「Web標準」をうったえても変わらないだろう。大手企業が自社運用しているサイト（とくにヤフー、楽天、グーグル、Amazonなど）をやり玉にあげて糾弾でもしていかないと変わらないと思うなー。（PL法やPSEやプライバシー保護のように消費者から企業に変化を迫る） でも、しかし、そもそも「Web標準」って意味あるの？ そういう問いを突き付けてますよ。このランキング結果は。 よくいわれる「SEO」についても、Googlebotがマークアップを参考にしていないという専門家の意見もあるし、当のGoogleがWeb標準な
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
