タグ

web制作に関するtamazirouのブックマーク (12)

  • 【php】SimpleXMLでRSSを取得する at softelメモ

    問題 phpでいろんなところからRSSを取ってきて! 答え RSS2.0なら $data = array(); $rss = simplexml_load_file('https://www.softel.co.jp/blogs/tech/feed'); foreach ($rss->channel->item as $item) { $x = array(); $x['link'] = (string)$item->link; $x['title'] = (string)$item->title; $x['description'] = (string)$item->description; $x['pubDate'] = (string)$item->pubDate; $data[] = $x; } //確認 var_dump($data); $item->title などは Simp

    【php】SimpleXMLでRSSを取得する at softelメモ
  • CSS3 Flexbox の各プロパティの使い方をヴィジュアルで詳しく解説 | コリス

    CSS Flexboxとは水平または垂直に要素を配置し、柔軟なレイアウトを実現できるCSSのレイアウトモジュールです。複雑なレイアウトでも今までより少ないコードで、よりシンプルなプロセスで実装することができます。 CSS Flexboxの基礎知識、Flexboxの各プロパティがどのように機能するのか、Flexboxでどのようにレイアウトを実装するかを視覚的に解説します。 【アップデート: 2022年6月16日】 IEがサポート終了したことにあわせて、修正しました。 【アップデート: 2021年8月1日】 Flexboxの解説を2021年の現状にあわせて、修正しました。 【アップデート: 2020年8月23日】 Flexboxの解説を2020年の現状にあわせて、修正しました。 【アップデート: 2019年3月27日】 Flexboxの解説を2019年の現状にあわせて、修正しました。 【アップ

    CSS3 Flexbox の各プロパティの使い方をヴィジュアルで詳しく解説 | コリス
  • 今どきの入力フォームはこう書く! HTMLコーダーがおさえるべきinputタグの書き方まとめ - ICS MEDIA

    みなさん、入力フォームを制作する際、どのような施策をおこなっていますか? 入力項目を見直したり、入力ステップを明確にしたりなど、入力フォーム最適化をおこなっていると思います。そのことで、コンバージョン率があがったり、ユーザーがストレスを感じないようになるでしょう。入力フォーム最適化はEFO対策 = Entry Form Optimizationとも呼ばれます。 サイトの設計段階で検討すべきことが多いですが、コーディングでも考慮すべき事が多々あります。今回はHTMLコーダーがエントリーフォームを制作する際に考慮すべき点について紹介します。 ※記事では最近のブラウザに適したHTMLコーディング方法の紹介を目的としています。そのため、デザインとアクシビリティーでのベストプラクティスを紹介したものではありませんのでご了承ください。 自動入力機能に対応しよう Google Chromeデスクトッ

    今どきの入力フォームはこう書く! HTMLコーダーがおさえるべきinputタグの書き方まとめ - ICS MEDIA
  • スマートフォンサイト構築時に気をつけたいポイント集

    作成:2015/10/5 更新:2017/04/16 Web制作 > 開発環境 スマートフォンサイト構築時のコーディングで気を付けたいポイントを次回コーディングの時のためにメモしておきます。 エンジニア速報は Twitter の@commteで配信しています。 全般 viewport デバイスを横向きにした時の処理一例です。 一般(ページ拡大表示)ピンチアウト/ピンチインOK。通常はこれを使うことが多い。 <meta name="viewport" content="width=device-width"> サイズを変更せず、ピンチアウト/ピンチインOK <meta name="viewport" content="width=device-width,initial-scale=1.0"> 2倍に拡大した状態でページ表示 <meta name="viewport" content="wi

    スマートフォンサイト構築時に気をつけたいポイント集
  • 「えーと、画像は全部2倍で作ればOKなんだよね?」を卒業しよう — un-Tech

    お疲れ様です、大塚です。 Appleの新製品発表会が間近に迫ってきましたね。新しいiPhoneの発表はもちろんのこと、今年の「One more thing」も楽しみです。 しかしながら、新しいプロダクトにドキドキ・ワクワクしながらも、心のどこか冷静な部分で、 「また新しい解像度が出てきたわ…」 と、新しい苦悩を抱えてしまうエンジニアやディベロッパーの方も多いのではないでしょうか?高解像度ディスプレイを搭載したマルチデバイスへの対応は、なかなか骨が折れる作業ですからね。 …え、仕組みがよくわからないままコーディングしていたって?? そいつぁーまずい。 なぜ、多くのスマートフォンやタブレット向けのWebサイトでは、画像が2倍で作られているのか? その理由と、ディスプレイや解像度の仕組み、今日ここで覚えていって頂戴。 ディスプレイの仕組み ぼくたちが普段使用している、PCやスマートフォンのディス

    「えーと、画像は全部2倍で作ればOKなんだよね?」を卒業しよう — un-Tech
  • HP作成の初心者でワイヤーフレームの作り方をよく知らない人へ

    気でweb制作仕事にしたいなら 現場で通用する実践的なスキルを身につけましょう。 【独学 vs スクール】メリットとデメリットを比べて、おすすめの学習方法もお伝えします。 続きはこちら 今回は、web制作時によくある悩み「ワイヤーフレームの作り方がわからない」を解決します。 意外に、ワイヤーフレームの作成方法を詳しく教えてもらう機会は少ないですよね。 そのため、以下のような悩みを抱える人が多くいます。 ワイヤーフレームが何かを知っているけど、いまいちうまくまとめられない。 ワイヤーフレームを作るときの手順が合っているかどうか自信がない。 webサイトの制作過程において、ワイヤーフレームの時点で失敗していると次の工程のデザインも絶対うまくまとまりません。 ワイヤーフレームは、家を建てるときの設計図と同じ役割をします。 適当に作った設計図をもとに家を建てたら、当然、住みにくく崩れやすいもの

    HP作成の初心者でワイヤーフレームの作り方をよく知らない人へ
  • スマホサイトのメニューをフッター固定のスライド式に変更しました!

    スマホサイトのメニューを改善しました。フッター固定で、こんな感じに。 『 目次』をタップするとカテゴリ一覧がするりーんとスライドして顔を出します。『 人気記事』の方はいま推しの記事10へリンクします。 なんだか見た目がアプリっぽくていい感じ。嬉しくて自分でもタップタップ♪しちゃいます。前よりも色々な記事を読んでもらいやすくなったかな。 実装方法はそれほど難しくなかったです。流れを振り返りながら、利用した技術も紹介してみたいと思います。WordPressへ実装したので、それを前提にどうぞ。 著者情報:この記事を書いた人 ウェブさえ web業界14年目。フリーランスwebデザイナーとして活動後、法人化。今でも年間100件以上のウェブサイトの企画・制作に関わっています。 ウェブさえにできること【お仕事のご相談>サービスメニュー】 💬 𝕏(twitter)はよくフリーランスの人たちにフォロー

    スマホサイトのメニューをフッター固定のスライド式に変更しました!
  • 知っておくと効率的!コーポレートサイト制作が捗るjQuery プラグインや使い方まとめ

    作成:2014/04/7 更新:2014/11/01 Web制作 > あの企業サイトで使われている効果やテクニックをまた探さないといけない、そもそもどういったキーワードで探したらいいのか分からない。そんなこんなで、今回は奇抜なものではなく、「企業サイトで見たことある!」というような、コーポレートサイトに使えそうな定番のプラグインや作り方をまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ スライドショー 1.カルーセル(横) 2.フェードアウト 3.画像と文字をスライド 4.文字が遅れて移動する効果 5.異なるタイミングを設定できる ナビゲーション・メニュー 6.多階層 ドロップダウンメニュー 7.多階層 効果つき 8.スマホではドロップダウン 9.スマホではセレクトメニューに 10.Amazon風 メガドロップダウンメニュー 11.横スライド 1

    知っておくと効率的!コーポレートサイト制作が捗るjQuery プラグインや使い方まとめ
  • Web制作フローが「完璧」にわかる資料や流れのまとめ | コムテブログ

    TL;DR 受注前、制作フロー、安定収益源の保守方法まで「作って終わりにしない」Web 制作の一連の流れを記載しておきます。社内だけじゃなく、これから独立する人、フリーランスの方も必見です。 オリエンテーション/受注前 1.書類テンプレート一式 オリエンテーションにおけるヒアリングでは、後に作成する提案・見積書に必要となる質問を用意しておきます。自社の説明をする時は、せっかちなクライアントさんもいるので、だらだら話さず、ポイントを抑えてわかりやすく説明します。ヒアリングした後は、議事録にメモし社内共有。必要な書類(ヒアリングシート/企画書/提案書/業務委託書/見積書/契約書)など一式まとめてますので、書類系のテンプレートは以下で。 企画・提案・見積・納品・契約などのテンプレ・知識まとめ23 2.見積もりの目安と計算方法 例えば項目を作るとき1.項目/2.内容/3.設計(人日)/4.製造(人

    Web制作フローが「完璧」にわかる資料や流れのまとめ | コムテブログ
  • hijiriworld Web

    Multisite Edit My Sites ユーザー軸で全サイトの権限を一括設定できるプラグインを公開しました - Posted on: 2019/08/16

  • WordPressオリジナルテーマを作成するための全手順【自作は簡単です】

    WordPress(ワードプレス)を使ってオリジナルブログを作成してみたいけれど、難しそう・・。」そう思っている人は多いことと思います。 WordPressは、HTMLCSSの他に、PHPというプログラミング言語を使っているため、少し敷居が高く感じてしまうことがあります。 しかし、PHPがわからなくても、ある程度のHTMLCSSの知識があれば、初心者でも簡単に既存のテーマをカスタマイズできたり、オリジナルテーマを作成したりできるのが、WordPressが人気の理由のひとつなのです。 今回は、PHPが全くわからないWordPress初心者でも、オリジナルテーマを作成できるようになるための手順を、参考記事やオススメの書籍と共にまとめています。 この記事を読めば、WordPressでオリジナルテーマを作成するための全体的な流れをつかみ、すぐにでもテーマ作成やカスタマイズができるようになるは

    WordPressオリジナルテーマを作成するための全手順【自作は簡単です】
  • 食べれるようになってきたフリーのウェブサイト制作者が、その先進むべき道の選択肢色々を考える

    べれるようになってきたフリーのウェブサイト制作者が、その先進むべき道の選択肢色々を考える 2013.01.15 | 考える。 こんにちは。オリーブです。 だいぶ間が空いて、執筆陣の中での肩身が狭くなってきちゃった(ノω・)テヘ 今日は前回の「保守・運営」について考える | WP-Dに引き続きまして、考えるシリーズです。制作者人生について考えます。 この記事の対象となる人 フリーになって、仕事をもらえるようになり、よいよいべれるようになってきたフリーのWEB制作者がどんなことを考えているのかをご紹介します。 自身の経験を振り返れば、半ば事故のような理由でフリーになることを選び、しかもWEBでいこうと思い、周囲に相談すれば「考えが甘いよ」と言われて、当にべていけるのか不安な中でやってきました。 ですので、次のような方々の参考にしていただければと思います。 今、そういう道にいってみようか

    食べれるようになってきたフリーのウェブサイト制作者が、その先進むべき道の選択肢色々を考える
  • 1