HTML・CSS
なんと、マークアップがメインのイベントが開催されました。 フロントエンドに恐れる我々としては非常にありがたい内容でした。 その時のメモです。 markup-meetup.connpass.com Reset CSS 2019 大塚さんのセッション。 Reset CSSの最新情報について。 自作…
イベントからずいぶん日が立ってしまいました。 アクセシビリティの祭典 2019に参加した感想です。 アクセシビリティはたくさんの人に恩恵がある アクセシビリティを知る機会がないのかもしれない アクセシビリティをどうやって社内に広めるか まずはできる…
picture要素を使うことで、ウィンドウ幅ごとに読み込む画像を変更することができます。 しかし、どの幅でも同じ画像が表示されてしまい困りました。 ソース 以下、分岐が動作しないソース。 以下、修正したソース。 aタグをpicture要素の外に出してやるとち…
株式会社インフォアクシアさんが開催している「Webアクセシビリティの学校 in 京都」に行ってきました。 「Webアクセシビリティの学校 in 京都」にご参加いただいた皆さん、昨日はありがとうございました!アンケートのURLをご案内するフォローアップメール…
・ヤフーの現場で使っているCSS設計方法とは? - linotice* | Yahoo! JAPAN RECRUITMENT 上記の記事がきっかけで、「現場のプロが本気で教える HTML / CSSデザイン講義」を読んでみました。大手ヤフーで、どんなコーディングをしているのか気になりますよね…
CSS3からblend-modeというプロパティが使えるようになりました。 Photoshopでいう描画モードがCSSで使えるわけですね。 他社さんからデザインをもらった時、PSDのレイヤーが乗算で乗っていることがありますが、実際に再現してみようとCSSを書いてみると自分…
WordPressで投稿ページをデフォルトのもの以外にも追加することがあると思います。その時に専用の記事の一覧ページも作る必要があります。 しかし一覧ページに投稿したコンテツが表示されなくて困りました。
タイトルを書いてみてすごく伝わりにくいんですが、メイン画像がコンテンツよりはみ出ているデザインがよくやってきます。最近続いたのでメモ。
依頼案件で見つけたのでメモ。 家のPCではなぜかずれる現象が再現できなかったのですが、同じ症状が起きた時は試してみてください。
WordPressで制作したサイトを別サーバーへ移行する作業が必要になり、方法をしらべるとduplicatorというプラグインで楽々に出来ることがわかりました。 サーバー移行で一通りやった流れを参考サイトを元にまとめておきます。細かい手順は参考記事が参考にな…
WordPressの多言語化の方法は何種類かありますが、一番とっつきやすそうな「qtranslateX」を使ってみることにしました。
ロゴ、ウサギです。
この間WordPressを使ったサイトの修正依頼があったのですが、普段自社CMSしか使わないのでほとんどWordPressって触ったことがありません。 編集したいページがサーバー上のどこにあるの?とか、そのくらいのレベルでWordPressがわからなかったのですが、この…
会社の制作テンプレートを一新することになったのでSVGデータを使ってみることにしました。
いまごろIE9ですって!?という方も多いかもしれません。 CSSでテキストを飛ばして画像を表示させる方法がありますが、IE9でテキストが飛ばしきれていなかったようです。 こんな感じに「EWS」と飛ばしたかったテキストが画像の上に表示されてしまっています。
重い、UIがごちゃごちゃしてる、デザインビューが微妙(CS4~のライブビューで改善されたらしい)、などなどあまり良い評判を聞かないDreamweaver。 近年、SublimeTextなど軽量で優秀なエディタが増えてきたこともあってますます出番はなくなってきているし、A…
あるサイトにハートマークをクリックしてカウントする機能をつけることになって「♥」とテキストでソースに書いたのですが、Android端末(nexus5)のchromeでチェックしてみるとCSSで指定した色とは別の色で表示されているよう。
今年SublimeText3に乗り換えてからメニューまわりがうまく表示できなかったので再インストールしました。windowsの場合です。 SublimeTextのアンインストール SublimeText 本体をインストール Package Controlをインストール 日本語化 追加した設定・パッケ…
会社にもWindows8 PCがやってきたので游ゴシックの表示をチェックしてみました。 Windowsのchrome、Firefoxでは文字が細く、今にも消えそうな表示。。 Macは持ってないのでsafariやMac版のchromeでの表示がどうなのかはわかりません。想像ではキレイに出てる…
SEOの本では有名なんじゃないでしょうか。「いちばんやさしい」とのことで、SEOの知識がふんわりしてる自分にはちょうどよいと思い読んでみました。
まよ犬さんの記事に触発されて僕もGWになんかせないかんと思いたち、メニューを付けてみました。 はてなブログのカスタマイズ! 特にモバイルページには手を加えておこう! - いつもマイナーチェンジ!mayoi-inu.hatenablog.jp
GWに向けて勉強する本を3つピックアップ。
メンテナンスしやすいようにCSSの記述方法を変えてみました。 なにも難しいことはしません。
CSSでfont-familyに小塚ゴシックを使うときに文字の上下位置やアンチエイリアスがブラウザによってまばらになってしまうことがあります。font-familyに小塚ゴシック指定する場合に注意することや確認しておきたいことをまとめました。
ちょっと前、こんな記事が炎上して、ブコメでIEの話題が出ました。 ・早稲田大学のサイトリニューアルがなぜこんなにひどいのか。 - 隣り合わせの灰と青春 IEってたくさんのバージョンがありますが、2014年の現時点でどこまで対応したらいいの?ということで…
Apple - iPhone 6 クライアントの予算に余裕のある時にはセットで依頼があるスマートフォンサイト制作。その作り方も様々です。
HTML・CSSコーディングを会社内で一から教える機会がありまして、教材用に良いサイトが無いか探してみました。 しかし、変に間違った情報を載せていたり、技術が古くなって今は使えないものだったり、そういった情報サイトは数多く存在します。 一応仕事でHT…
大阪でCSSのイベントがあるときいて、しかも気になっていた「Web制作者のためのCSS設計の教科書」の出版記念イベントだということで行ってきました。その内容と感想を。
スクロールボックスを手軽につくりたい時や、JSと併用して使うことが多いCSSのoverflow。 overflowを縦だけに使いたい、もしくは横だけに使いたい時って結構あるんですが、「overflow 縦」で検索するとこのページが上位に出てきます。
ショートカットキーっていいですね。なかでもボタンひとつで便利な機能を使えるFキー。 よく使うFキーを紹介します。(windowsです)