zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Winzige Web-Visitenkarte - so alles richtig?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 28.07.2010, 15:14
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.05.2008
Beiträge: 94
Empy befindet sich auf einem aufstrebenden Ast
Frage Winzige Web-Visitenkarte - so alles richtig?

Hallo,

mich interessiert, ob der nachfolgende Quelltext koscher ist oder ob ich eine Todsünde begangen habe.

Die Grafik als Link musste ich verwenden, da ich nicht so einfach über Suchmaschinen gefunden werden möchte. Um sie zu positionieren, habe ich sie 500x1000 Pixel groß gemacht - mit margin und padding zu arbeiten, funktioniert hier IMHO wegen position:absolute; nicht - dieses brauche ich jedoch für z-index.
max-width:100%; verwende ich, damit diese Grafik skalierbar bleibt und bei extrem schmalen Ansichten kein weißer Bereich entsteht, so wie hier passiert:


Den Link würde ich, falls gewünscht, per PN herausrücken.

Vielen Dank im Voraus

XHTML:
HTML-Code:
<body>
<img src="footage/bg.png" alt="background" style="width:100%; height:400px; z-index:1;"/>
<a href="footage/Portfolio.pdf"><img src="footage/logo.png" alt="logo" style="z-index:2; max-width:100%;"/></a>
</body>
CSS:
HTML-Code:
*
{
	margin:0px;
	padding:0px;
}
	
body
 {
	 background:#FFF;
 }
 
img
{
	position:absolute;
	border:none;
}
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 28.07.2010, 17:34
Form follows function
neuer user
 
Registriert seit: 08.03.2009
Ort: Berlin
Beiträge: 92
S!mon befindet sich auf einem aufstrebenden Ast
Standard

Hallo,

für Visitenkarten im Web gibt es ein eigenständiges (Micro)Format, hCard angelehnt an vCards (Die z.B. Outlook, Thunderbird, Skype etc. lesen kann).
Nimmst du hCard sieht das ganze gleich mal professionell aus und nicht so "stümperharf" (Ich hoffe ich drehte dir nicht zu nah).

Um das ganze nun für Suchmaschinen zu sperren benutze doch die robots.txt mit "Disallow: /".
Mail-addr lassen sich ziemlich einfach (gegen Mail-Crawler) mit sowas wie z.B.:
HTML-Code:
<a class="url" onclick="this.href=this.href.replace(/(.*)\/at\/(.*)\/dot\/(.*)/i,'$1\@$2\.$3');" href="mailto:me/at/example/dot/org" title="E-Mail-Adresse">me<em>@</em>example<em>.</em>org</a>
verschleiern.

Howtos und Bsp. für schöne hCards gibts "x" im Netz, z.B: Introduction to hCard - Opera Developer Community oder http://gedit.net/Artikel;Free_HTML-C...tica#helvetica

Mit besten Wünschen,
Simon
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 28.07.2010, 18:22
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.05.2008
Beiträge: 94
Empy befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von S!mon Beitrag anzeigen
für Visitenkarten im Web gibt es ein eigenständiges (Micro)Format, hCard angelehnt an vCards (Die z.B. Outlook, Thunderbird, Skype etc. lesen kann).
Nimmst du hCard sieht das ganze gleich mal professionell aus und nicht so "stümperharf" (Ich hoffe ich drehte dir nicht zu nah).
Dass ist nicht das, was ich möchte: Die Grafik beinhaltet nämlich lediglich mein Logo und meinen Titel. Das Ganze sieht optisch ähnlich aus wie diese Seite (mit der ich nichts zu tun habe).

Was ist den an meinem Code so schlimm, wo sind die bösen Schnitzer?
Mit Zitat antworten
  #4 (permalink)  
Alt 28.07.2010, 18:30
Form follows function
neuer user
 
Registriert seit: 08.03.2009
Ort: Berlin
Beiträge: 92
S!mon befindet sich auf einem aufstrebenden Ast
Standard

Hallo,

bis auf die Style-Anweisungen in den Elementen, die ich in den <head> mit nehmen würde (ggf. ID zuweisen) und das ich einen wrapper um alles machen würde, der das Background-Image als background-image: url() bekommt (dann brauch man auch kein z-index etc., sehe ich nichts bis auf das man noch einen title in a zuweisen könnte.

Grüße Simon


PS: Ich würde dir dennoch das hCard-Format empfehlen.
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
DOCUMENT_LIST_ITEM wird beim Ausruck über BEx Web nicht richtig übernommen dominiki112 Serveradministration und serverseitige Scripte 0 20.10.2010 11:10
hover (Visitenkarte) soll bleibt Apotheosi CSS 4 23.10.2009 13:37
All You Need For Accessibility - Tutorials, Tools, Books, Validators, etc Webnauts Barrierefreiheit 1 26.08.2006 00:07
IE zeigt falsch, FF richtig - change - FF zeigts falsch, IE richtig nick CSS 6 19.08.2006 03:02
All You Need for Accessibility Webnauts Barrierefreiheit 0 29.03.2006 19:07


Alle Zeitangaben in WEZ +2. Es ist jetzt 07:29 Uhr.