「ニュース」コンテンツについて

  • このエントリーをはてなブックマークに追加

こんにちは、石上です。
木曜日の雪の予報がなくなりましたね、安心しました。

さて、今回は多くの企業サイトなど多くのサイトにある「お知らせ」や「セミナー情報」「イベント情報」などの発信系コンテンツについて書きたいと思います。

そもそも「お知らせ」「ニュース」「新着情報」「トピックス」など名称が違うだけで、書いていることが同じ…何が違うんだろうか?私なりの違いを下記に書いてみたいと思います。

・ニュース=新しい情報(もともと報道向けの内容で文字通りのニュース)
・お知らせ=ニュースと同じ。
・新着情報=文字通り「新しい情報」なので、これもニュースと同じ。
・トピックス=話題の情報。ニュースの中でも特に注目して欲しい情報。

※トピックスだけが別で他は同じだと考えています。

以降本記事では、「お知らせ」「ニュース」「新着情報」「トピックス」をまとめて『ニュース』として話を進めていきたいと思います。

記事の素材あれこれ

ニュース以外やセミナー情報、イベント情報など掲載する内容も様々でも、記事を作る時に必要な要素はほぼ同じです。

【TOPページ・ニュース一覧ページの主な構成要素】
・掲載日
・記事タイトル
・Newアイコン
・リンク先URL(サイト内もしくは外部サイトのURL)

【詳細ページの主な構成要素】
・掲載日
・記事タイトル
・本文
・画像(写真)
・リンク先URL(サイト内もしくは外部サイトのURL)
・PDF

最近では動画を掲載するところも増えてきていますね。またセミナーやイベント情報の場合、開催後に掲載する文章を過去形に変更したり、当日の現場写真を掲載することがあります。
実際のセミナーやイベントの写真を掲載することにより、雰囲気を感じとってもらい、次回以降のイベントやセミナーに興味を持ってもらう狙いがあります。

色々な表示ルール

要素は前述しましたが、サイトごとに掲載にあたってのルールがあります。

例えば、掲載日付
2014年2月19日 ●●●●のお知らせ

普通の内容ですが、ここにもルールがあります。

1.日付の掲載ルール
「2014年2月19日」と表記していますが、サイトによっては「2014/2/19」(/で区切る)だったり「2014.02.19」(.で区切り、更に数字の桁数は4-2-2で表示)の場合があります。
2.リンクの遷移の方法
「●●●●のお知らせ」をクリックした時の遷移方法もリンク先によって、同一画面での遷移、別画面での遷移を変えていたります。
例えば、自サイトならば同一画面、PDF・外部サイトは別画面などです。
更には、PDFの場合にはPDFであることと、ファイル容量記載するというルールもサイトによってはあります。
3.NEWアイコンの表示期間
これもサイトによってだと思いますが、NEWアイコンをいつまで表示するのかというルールです。
例えば、「掲載から1週間あるいは1ヶ月」、「新しい記事が投稿されるまで」、「好きなタイミングで」などです。
手動で管理するとなると、どれも手がかかりますし、消し忘れの心配があります。

詳細ページにあたっても同じです。
更に詳細ページは、担当者が複数いて各々が自由に書いていた場合には文体もレイアウトもバラバラになってしまいサイトとしての統一感が損なわれるので注意が必要です。
「今までのページに合わせて作ればいいんだよね?」ではなく、事前に基本となるルールを社内で共有しておくことをお勧めします。

弊社のCMS「proG(プログ)」を使えば、前述のルールについても全てとはいかないですが、日付掲載とレイアウト、NEWアイコンの表示期間、リンクの画面遷移方法についてルールを自動的に管理することができます。
proGは、ニュースやイベント、セミナー情報はもちろんのこと、様々なページに導入し、スムーズで安定した更新を行なうことができます。
詳しくは、専用サイトをご覧ください。

CMS「proG(プログ)」

執筆者:8bit

関連記事

マークアップ

背景に画像や動画を置いてパララックス効果で見せる

サイトを作っているとスクロールした時に背景画像などを固定させておきたい、パララックス効果を使いたいという時があると思います。 簡単なものであれば簡単なcssで実現できます。 目次1 背景画像をパララックス効果で見せる1.1 DEMO1.2 HTML1.3 CSS 背景画像をパララックス効果で見せる DEMO See the Pen Untitled by kkdd (@kk8kk) on CodePen. なんとなくよく見る感じの表示になっていると思います。 HTMLとcss […]

スマホアプリ

Android Studioでベクター画像を登録しよう

Androidアプリを作成しているとアプリ内のアイコン画像を追加したい、ということありますよね。 そんな時は画像の解像度を気にせず使用できる、ベクター画像を使用すると便利です。 Android Studioでは、ちょっとした手順を踏めばベクター画像をdrawableリソースの中にxmlファイルとして生成してしてくれます。 簡単なので、早速進めてみましょう。 目次1 Android Studioを開こう2 ベクター画像の登録画面を開こう3 クリップ・アートで登録してみよう4 ロ […]

マークアップ

属性セレクターを使ってファイルごとにアイコンをつけよう!

例えばpdfのアイコンをつけたいときに『pdfIcon』をというclassをつけて表示させる、という方法があります。 ただ動的に表現したい場合などにちょっと不便だなと思うこともあるかと思います。 そんな時は属性セレクターを使ってファイルごとにアイコンをつけることができます。 早速属性セレクターを使ってみよう 属性セレクターはを使えば指定された値が存在していたら指定されたcssを適用する、という感じの動作をしてくれます。 書き方としては「属性$=”値”」 […]

株式会社8bit (エイトビット)

東京都目黒区でWebサイト制作、Webシステム開発などを行っております。
コーポレートサイトやWebサービスの企画・提案を得意としており、自社での経験を元にアイデアをカタチにするお手伝いをさせていただいております。

Web制作に関するご相談はお気軽にどうぞ

弊社に制作をご依頼いただく際の費用感をご確認いただける、
見積りシミュレーションをご用意いたしました。