タグ「CSS」の付いている記事

6件の記事が見つかったよ。

うち 1 - 5 件目を表示するよ(1ページ目/全2ページ)。

Firefox 50 で border-radius のバグが修正された件

先日、Webブラウザ「Mozilla Firefox」のバージョン50.0がリリースされた。

俺がメインに使っているブラウザがこのFirefoxで、Web開発にもこれを使っているので、つまりこのブログはFirefoxの影響を受けているわけだ。

まあ、某OSの標準ブラウザと違って、Web標準への準拠とかパフォーマンスに問題があるわけじゃないんだけど。あんまり言うと戦争が起こるので自重。

そのバージョン50のリリースノートを見ていると、ひとつの項目が目に留まった。

» 続きを読む

【WordPress】外部CSSを圧縮してHTML内に出力する

このブログも久しぶりにイノベーションしそうだ。

AMPという技術を恥ずかしながら最近知ったのだが。

AMPとはAccelerated Mobile Pagesの略で、モバイル向けにページを超高速で表示させる技術だ。

Googleを中心に、TwitterやPinterestやWordPressなども参加するプロジェクトで、2016年2月からGoogle検索で実用化が始まった。

どのくらい速くなるのかというと、本当に驚くほど一瞬だ。

で、このブログもぜひその最先端技術に対応したいのだが(新しいもの好き)、ページをAMPに対応させるには条件や制約がかなり多く、苦労しているところだ。

残念ながら、おそらくこのブログはAMPに対応できないと思われるが、勉強のためにも可能な限りで実装しようと取り組んでいる。

今回は、WordPressにおいてスタイルシート(CSS)をAMPに対応させる方法を紹介する。

» 続きを読む

CSSの初歩と、基本的なページレイアウト

前回の記事で、CSSのメディアクエリについて書きながら、「前にも同じようなこと書いたような……」と思って探してみると、やっぱり書いてたからとりあえずリンクしたものの、その以前の記事でも今度書くって言ってたCSSによるレイアウトについてまだ書けてなかったというね。

まあ、こういう記事って誰のために書くの? って話だけど、自分で説明できることは他所のサイトを紹介するんじゃなくて、自分で説明したいよねってこと。

もちろん、俺が編み出したノウハウとかオンリーワンな話のほうが世のため人のためになるってもんだけど、構わず今日もお付き合いください。

» 続きを読む

れーとーびーむの作り方 - HTML・CSS・JavaScriptの基礎編

もうすっかりおなじみとなった「れーとーびーむの作り方」シリーズ! 拍手!!!

え、なってない?

何はともあれ、今回もはっじまっるよー☆

……俺がWEBサイト「れーとーびーむ」(の新サイト)を作り始めてから、だいたい1年になる。

「れーとーびーむの作り方」では、この間の俺の経験と知識と努力の跡をみなさんにお届けしたいと思っている。

今回は初歩中の初歩、WEBページの根幹であるHTMLとゆかいな仲間たちについて説明するよ。

これらがなければWEBページじゃない、というよりWEBページとはこれらによって成り立っているのだ!

HTMLとCSSとJavaScript、なんとなく「WEBの三要素」とでも呼びたくなってくるなあ!

» 続きを読む

れーとーびーむの作り方 - モバイル対応編

このサイトではモバイルへの対応を重視していると、ずっと言っている。

今やWebブラウジングの主役は完全に、スマホやタブレットといったモバイル端末なんだから当然だ。

スマホ向けコンテンツを制作している俺でなくても、すでにWebサイトのモバイル対応は必須となっている。

で、PC向けに作ったサイトがそのままでもスマホから見やすいかというと、そんなことは全くない。

PCのディスプレイとスマホの画面とでは、大きさ(主に幅)も向きも違うからだ。

そこで、それぞれのデバイスに合った表示方法を提供する必要が出てくる。

Googleなどの検索エンジンも、モバイルからのアクセシビリティ(閲覧のしやすさ)を重視する方向性となっている。

これに対応するためには、閲覧者のデバイスそれぞれに合わせて表示を切り替えるということをしなければならない。

そこで今回は、メディアクエリと呼ばれるCSSの機能を使い、閲覧者のブラウザの“幅”に応じて表示を切り替えることでモバイル端末に対応するレスポンシブ・ウェブデザインという方法を紹介する。

また、その他のモバイル対応に役立つテクニックも紹介する。

» 続きを読む