Seite 1 von 1

Eigenes Design, Style-Code Frage

Verfasst: Di 14. Feb 2017, 06:42
von Jaden
Hallo alle miteinander.
Vor einer Weile wurde mal angemerkt, dass an meinen Style-Code etwas nicht ganz stimmen würde, obwohl er funktioniert.
Jetzt hab ich den Style auf einer Testseite eingebaut und hätte gerne eure Meinung, was ich daran verbessern könnte.
So wie er jetzt ist, passt er sich an die Seite an, was ich super finde.
Dies hab ich beim Style in den Header gesetzt:
-----------------------------------------------------------------------------------------------------------------
entfernt
-----------------------------------------------------------------------------------------------------------------
Und dies in den Footer:
-----------------------------------------------------------------------------------------------------------------
entfernt
-----------------------------------------------------------------------------------------------------------------
Hier hab ichs zur Probe eingebaut: http://testdemo.npage.de/willkommen.html
Kann ich den Code so lassen oder kann man daran was verbessern?

Sorry, hab die beiden Codes entfernt, da man diese auch als Gast lesen kann, das wußte ich vorher nicht.

Re: Eigenes Design, Style-Code Frage

Verfasst: Di 14. Feb 2017, 18:11
von goefi-chiangmai
So genau sehe ich das jetzt nicht, da npage ja selber sehr viel automatisch reincodet,

aber etwas Stimmt bestimmt nicht, denn du hast 2 mal ende </body> und ende </html> im Design

P.S.
Background würde ich fixieren

Re: Eigenes Design, Style-Code Frage

Verfasst: Mi 15. Feb 2017, 09:51
von Jaden
Hallo Peter,
ja deswegen hatte ich ja ursprünglich den jeweiligen Code eingestellt, den ich eingefügt hatte,
ihn dann aber wieder entfernt, weil auch jeder Gast hier lesen kann :oops:

Re: Eigenes Design, Style-Code Frage

Verfasst: Mi 15. Feb 2017, 10:08
von moni
Hallo Jaden..

schade das du nicht genau weiß was damals angemerkt würde ,so könnte man besser raus finden was gemeint war !

Habe mir deine demo angeschaut und es handelt sich um einen Tabellen Design .

meine Tipps oder Bemerkungen sind :

1) Design ist nicht responsiv und etwas veraltete Codierung ( ist zwar nicht verboten aber ist nicht zeitgemäß ).

2)mehrere css styles sind vorhanden ( eine ausgelagerte würde reichen )

http://abload.de/img/unbenannt3ok0y.jpg

3)wie der Peter auch schrieb man kann nicht direkt erkennen was auch vom npage ist ..und auch zwei mal body hab ich auch gefunden

Bild

mein Tipp dazu am besten wen du hier das komplete Code lässt da kann man besser was dazu sagen !

Re: Eigenes Design, Style-Code Frage

Verfasst: Do 16. Feb 2017, 06:43
von Jaden
Guten Morgen Moni,
leider kann ich mit diesen ganzen Begriffen nichts anfangen. Diesen Style hab ich bereits seit etlichen Jahren, weiß aber nicht mehr, wie.
Ich hatte mir auch den Microsoft Expression Web installiert, aber das ist für mich ein böhmisches Dorf, ich wüßte nicht mal, wo anfangen.
Deswegen nützt es mir leider wenig, wenn man mir sagt, ich müsse etwas mit rein, bzw. rausbauen, wenn ich nicht genau weiß, wo.
Ok, ich stells mal rein.
Dies hab ich beim Style in den Header gesetzt:
-----------------------------------------------------------------------------------------------------------------

Code: Alles auswählen

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Jaden-Designs</title>
<meta http-equiv="content-language" content="de">
<meta name="description" content=" Templates, Masken und mehr">
<meta name="keywords" content=" Templates, Masken mehr " />  
  <meta name="robots" content="index, follow"> 
  <style>
A:link {color: #402B3C;text-decoration:underline;}
A:visited {color: #190716;text-decoration:none;}
A:hover {color: #190716;text-decoration:none;border-bottom-style:dotted; border-top-style:dotted;border-top-width:1 px;
border-bottom-width:1 px; background:" #DBD2DA";}
</style>
<STYLE type=text/css>BODY {
	SCROLLBAR-FACE-COLOR: #DBD2DA; SCROLLBAR-HIGHLIGHT-COLOR: #190716; SCROLLBAR-SHADOW-COLOR: #190716; SCROLLBAR-ARROW-COLOR: #190716; SCROLLBAR-TRACK-COLOR: #DBD2DA; SCROLLBAR-BASE-COLOR: #190716; scrollbar-3d-light-color: #190716; scrollbar-dark-shadow-color: #190716
}
</STYLE>

</head>

<body background="http://file2.npage.de/014027/16/bilder/hg-1-design.jpg" link="#190716" vlink="#190716" alink="#190716" text="#0D0009" bgcolor="#190716">

<div align="center">
  <center>
  <table borderColor="#190716" cellSpacing="3" cellPadding="0" width="97%" background="http://file2.npage.de/014027/16/bilder/hg-silberdesign.jpg" border="1" >
    <tr>
      <td align="middle" width="100%" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px">
      <div align="center">
        <center>
      <table cellSpacing="15" width="100%" background="http://file2.npage.de/014027/16/bilder/hg-middle-design.jpg" border="0">
        <tr>
          <td width="100%" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px" align="center" valign="top">
          <div align="center">
            <center>
          <table borderColor="#190716" cellSpacing="3" cellPadding="7" width="100%" background="http://file2.npage.de/014027/16/bilder/hg-silberdesign.jpg" border="1">
            <tr>
              <td vAlign="top" width="100%" background="http://file2.npage.de/014027/16/bilder/hg-2-design.jpg" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px" bgcolor="#DBD2DA">
              <p align="center">
                    <img src="http://file2.npage.de/014027/16/bilder/header-design.jpg" width="800" height="400"></p>
              <p align="center">&nbsp;</p>
</body>
</html>
-----------------------------------------------------------------------------------------------------------------
Und dies in den Footer:
-----------------------------------------------------------------------------------------------------------------
</body>
<p align="center">&nbsp;</p>
            <p align="center"><b>Style & Design ©Jaden</b></td>
          </tr>
        </table>
        </center>
      </div>
      </td>
    </tr>
  </table>
  </center>
</div>
</html>
-----------------------------------------------------------------------------------------------------------------

Re: Eigenes Design, Style-Code Frage

Verfasst: Do 16. Feb 2017, 09:10
von moni
Guten morgen Jaden ...
Habe das Code in code modus eingefügt das etwas überschaubar hier aussieht ,wen es um dei Begriffe geht da ist halb so wild das ganze ,werde versuchen dir das zu erklären :)

1)responsiv ist nichts anders als das Design in allem Browser und Auflösungen gut aussieht ,sich anpasst und vor allem auch auf mobilen Geräten ..hier ist ein Link zum testen
http://quirktools.com/screenfly/
oder auch andere Methode sieht so aus ...naja hier geht vor allem um Auflösung

http://abload.de/img/cats3mu0t.jpg
------------------------------------------------------------------------
2)Style auslagern ist wen man CSS Codierung als externe Datei in den head Bereich einfügt ..hier ein Screenshot Bild dazu das man sich besser vorstellen kann :
http://abload.de/img/catsdyjkx.jpg

man macht das so das sämtliche CSS angaben was anzwieschen <style> und </style > hatte raus nehmt und als neue CSS Datei unten Namen style abspeichert ,dann hoch laden an die Seite und wie in Screenshot 1 in den linke einfügen ..man kann natürlich benenn wie man möchte

http://abload.de/img/catsaysbu.jpg
----------------------------------------------------------------------------------
3) Microsoft Expression Web ist ein sehr guten HTML editor , ich selbst nutzte den selten .. aus meine Erfahrung zum lernen und gut überschaubar kann dir den webcoton scriptle empfehlen

http://www.webocton.de/ oder bei chip
http://www.chip.de/downloads/Webocton-S ... 20694.html
-------------------------------------------------------------------------------------------------
4) habe deine Code ein wenig sortiert und die Angaben zum body in style gemacht und nicht in HTML Bereich ..hier alles ohne auslagern

Code: Alles auswählen

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Jaden-Designs</title>
<meta http-equiv="content-language" content="de">
<meta name="description" content=" Templates, Masken und mehr">
<meta name="keywords" content=" Templates, Masken mehr " />
<meta name="robots" content="index, follow">
<style>
body { background-color: #190716;
      background-image: url(http://file2.npage.de/014027/16/bilder/hg-1-design.jpg);
      background-repeat: repeat;
      color: #0D0009;
      scrollbar-face-color:#dbd2da;
      scrollbar-highlight-color:#190716;
      scrollbar-shadow-color:#190716;
      scrollbar-arrow-color: #190716;
      scrollbar-track-color: #dbd2da;
      scrollbar-base-color: #190716;
      scrollbar-3d-light-color: #190716;
      scrollbar-dark-shadow-color: #190716 ;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 18px;
     }
A:link {color: #402B3C;
      text-decoration:underline;
      }
A:visited {
      color: #190716;
      text-decoration:none;
      }
A:hover {
      color: #190716;
      text-decoration:none;
      border-top:1px dotted;
      border-bottom:1px dotted;
      background:#DBD2DA;
      }
</style>

</head>

<body >

<div align="center">
<center>
<table borderColor="#190716" cellSpacing="3" cellPadding="0" width="97%" background="http://file2.npage.de/014027/16/bilder/hg-silberdesign.jpg" border="1" >
<tr>
<td align="middle" width="100%" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px">
<div align="center">
<center>
<table cellSpacing="15" width="100%" background="http://file2.npage.de/014027/16/bilder/hg-middle-design.jpg" border="0">
<tr>
<td width="100%" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px" align="center" valign="top">
<div align="center">
<center>
<table borderColor="#190716" cellSpacing="3" cellPadding="7" width="100%" background="http://file2.npage.de/014027/16/bilder/hg-silberdesign.jpg" border="1">
<tr>
<td vAlign="top" width="100%" background="http://file2.npage.de/014027/16/bilder/hg-2-design.jpg" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px" bgcolor="#DBD2DA">
<p align="center">
<img src="http://file2.npage.de/014027/16/bilder/header-design.jpg" width="800" height="400"></p>
<p align="center">&nbsp;</p>

-----------------------------------------------------------------------------------------------------------------
Und dies in den Footer:
-----------------------------------------------------------------------------------------------------------------

<p align="center">&nbsp;</p>
<p align="center"><b>Style & Design ©Jaden</b></td>
</tr>
</table>
</center>
</div>
</td>
</tr>
</table>
</center>
</div>
</html>
--------------------------------------------------------------------------------------------------------------
5) habe alles wie oben geschreiben ausgelagert und hier als demo ist zu sehen

http://demo.homepagehelfer.net/jaden/index.html
kannst das auch runterladen
http://demo.homepagehelfer.net/jaden/jaden.zip
---------------------------------------------------------------------------------------------------
6) bei Interesse kann man dir auch responisve Design Entwicklern ,natürlich mit deinen Grafiken !

ich hoffe das ich dir weiter helfen könnte und nicht zu kompliziert alles geschreiben habe :)

Re: Eigenes Design, Style-Code Frage

Verfasst: Do 16. Feb 2017, 14:55
von Jaden
Hallo liebe Mona,
ich danke dir vielmals für deine Mühe und deine Hilfe, das ist sehr lieb von dir.
Hab deinen Code eingebaut und funktioniert.
Vielen lieben Dank.
Komisch dass mein alter Code als Style genauso aussieht, obwohl er fehlerhaft ist.
Deine Tipps werd ich mir in einer ruhigen Minute genauer durchgehen.
Herzlichen Dank dafür, für alles, auch für deine Screens :16

Re: Eigenes Design, Style-Code Frage

Verfasst: Do 16. Feb 2017, 21:27
von moni
Hallo Jaden ..

Hab gern gemacht !
Komisch dass mein alter Code als Style genauso aussieht, obwohl er fehlerhaft ist.
Dein alten Code war nicht so stark fehlerhaft da der nicht funktionieren würde , habe nur unnötigen Codes entfernt und auch alles etwas oredlich und auch zeitgemäß gestaltet ( Codeirrung ), aber keine Verdrängungen gemacht was das aussehen von dein Design Beeinflussen könnte .

Solltest welchen fragen haben zum den anderen Sachen da melde dich einfach !

Re: Eigenes Design, Style-Code Frage

Verfasst: Fr 17. Feb 2017, 06:13
von Jaden
Hallo Moni,
ja das mach ich gerne, nochmals vielen Dank dafür :u29