The Blog | Welcome to Adobe Blog アドビのブログでは、Creative Cloud、Document Cloud、Experience Cloudの最新情報や役に立つ情報を紹介しています。
前にこの記事で、レスポンシブデザインをコーディングの仕方の基本的なことを説明をしましたが、今回は自分が製作してる時に気をつけていることや、よく使う方法を書いておこうと思います。 案件や作業フローによって全然違う方法がよい場合もあるかもしれませんので、参考程度にどうぞ。 要素のマークアップ順序 会社や作業フローによるかと思いますが、今のところ、PC用とスマートフォン用のデザイン2枚が出来上がってくる事が自分は多いです。 そのデザインを見ながらHTMLを作っていきますが、この時スマートフォンのデザインを見ながらマークアップしたほうが良いと思いました。 文章の意味付け的にデザインで順序変えるのはどうなのよというのはありますが・・・。 positionを使って再現するデザインの場合はPCは簡単に位置を入れ替えることができますが、スマートフォンのデザインは320px~リキッドデザインにすることが多い
Today, a website must not look good only on a desktop screen, but also on tablets and smartphones. A website is responsive if it is able to adapt to the screen of the client. Responsive web design is extremely important nowadays and is in fact one technique you need to master as a web developer or web designer. In this article, I’ll show you how to easily build a responsive site and how to apply r
レスポンシブウェブデザインのワークフローを改善するツール 昨年Adobeが発表したEdge Tools & Servicesの中で唯一リリースされずにいたAdobe Edge Reflowが2月15日に発表された。 先行して公開されているEdge Web Fonts や Edge Inspectなどと連携しながら高速にレスポンシブデザインのモックアップ作成が可能となる。 Adobe Developers ConnectionにEdge Reflowの概要と今後の可能性について書かせていただきましたのでご覧ください。 レスポンシブWebデザイン制作におけるEdge Reflowの可能性 | ADC – Adobe Developer Connection Edge Reflowのメリット Edge Inspecetを活用してPCサイトとモバイルサイトのモックが並行して作成できるのは大きい。又
We've put together this set of super awesome email templates so that you can make your email campaigns responsive! Responsive, you say? Yep. With more and more people pulling out their phones to check their email, we knew there had to be an easier way to ensure campaigns looked good on any device. That's why we recently made all our email campaigns responsive. Which had a lot of folks asking if we
Or The things you think are common knowledge but really they aren’t. I was on the ShopTalk show a few weeks ago, and a few people have asked me what I meant when I said “display: none; naughties.” I foolishly thought that people would understand what I meant, (and I’ll come to that later) so I thought I’d better explain myself. display: none; in responsive web design When we’re changing out layout
ブラウザのviewportを切り替えられるVIEWPORT RESIZERがレスポンシブデザインな開発に超絶便利! レスポンシブデザインのサイトを作ってる際にシュミレーターを使うことが多いと思うんですが、それはそれで大事なんですけど、毎回シュミレーターってのもウキーってなりますよね。 スクロールがウキーッだったり、URLの入力がウキーっだったり。 こんなこと1日やってたら猿になっちゃいます。 そんな猿直前のみなさんに便利なツールを発見したのでご紹介。 ブラウザのviewportを切り替えられるブックマークレット、VIEWPORT RESIZERが超便利 このブックマークレットをインストールすると超簡単に主要なモバイル端末のウインドウサイズをシュミレートできます。 インストール方法はブックマークレットなので超簡単。 以下のサイトで ”CLICK OR BOOKMARK” って書いてある部分を
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く